:root {
  --base-color1: #000000; /* Black */
  --base-color2: #ffffff; /* White */
  --color1: #24272a; /* Dark Charcoal */
  --color2: #ffc216; /* Brand Yellow */
  --color3: #eeeeee; /* Light Grey (merged group) */
  --color4: #a71f23; /* Main Red */
  --color5: #003a4f; /* Deep Blue-Green */
  --color6: #58595b; /* Dark Grey */
  --color7: #97999b; /* Medium Neutral Grey */
  --color8: #808080; /* Standard Grey */
  --color9: #772583; /* Accent Purple */
  --color10: #05c3de; /* Sky Blue */
  --color11: #004a87; /* Dark Blue */
  --color12: #009a44; /* Green Accent */
  --color13: #f5f5f5; /* Off White */
  --color14: #dddddd; /* Light Silver */
  --color15: #fffbf0; /* Pale Yellow */
  --color16: #878787; /* Medium Grey */

  --movies-list: 0px 2px 4px 0px #6464647f;
  --movie-banner: rgba(var(--base-color1), 0.2);
  --button-blue-back: linear-gradient(90deg, var(--color10) 0%, var(--color11) 100%);
  --button-pink-back: linear-gradient(90deg, #dd014e 0%, #9f176e 100%);
  --header-multi-back: linear-gradient(270deg, #e0004d 6.66%, var(--color9) 34.69%, var(--color11) 63.68%, #0280ae 78.89%, var(--color10) 90.79%);
  --date-pink-back: linear-gradient(90deg, #e0004d 0%, var(--color9) 100%);
  --button-shadow: 0px 4px 4px 0px #00000040;
  --button-shadow1: 0px 2px 4px 0px #6464647f;
  --modal-shadow: 2px 2px 2px 3px #0000004e;
  --buttonshadow: linear-gradient(var(--base-color2), var(--base-color2)) padding-box, linear-gradient(90deg, var(--color10) 0%, var(--color11) 100%);
  --triangle-arrow: linear-gradient(90deg, #e0004d 0%, var(--color9) 100%);
  --line-blue: linear-gradient(0deg, var(--color10) 0%, var(--color3) 92.21%);
}