/* Colors */
:root {
  /* Background Colors */
  --color-bg-primary: #121212;
  --color-bg-card: #212121;
  --color-bg-footer: rgba(33, 33, 33, 0.85);
  --bg: rgba(245, 247, 250, 1);
  --header-text: rgba(33, 33, 33, 1);
  --subheader-text: rgba(102, 102, 102, 1);
  --primary: rgba(40, 81, 227, 1);
  --dropdown-menu-border: rgba(33, 33, 33, 0.4);

  /* Text Colors */
  --color-text-primary: #FFFFFF;
  --color-text-secondary: rgba(255, 255, 255, 0.7);
  --color-text-accent: #ED713C;

  /* Icon Colors */
  --color-icon-primary: #FFFFFF;
  --color-icon-secondary: #E3E3E3;

  /* Typography */
  --font-family-primary: 'Montserrat', sans-serif;
  --font-family-heading: 'Unbounded', sans-serif;

  --font-weight-regular: 400;
  --font-weight-bold: 700;

  /* Font Sizes */
  --font-size-time: 100px;
  --font-size-date-header: 40px;
  --font-size-name: 44px;
  --font-size-date-range: 28px;
  --font-size-unit-small: 20px;
  --font-size-unit-medium: 24px;

  /* Line Heights */
  --line-height-time: 1.219;
  --line-height-date-header: 1.219;
  --line-height-name: 1.2;
  --line-height-name-alt: 1.2;
  --line-height-date-range: 1.1;
  --line-height-unit: 1.1;

  /* Spacing */
  --spacing-xs: 8px;
  --spacing-sm: 12px;
  --spacing-md: 40px;
  --spacing-lg: 60px;
  --spacing-xl: 80px;
  --spacing-xxl: 160px;

  /* Card Spacing */
  --card-padding: 80px;
  --card-gap: 60px;
  --card-content-gap: 40px;

  /* Layout */
  --container-width: 1880px;
  --container-padding: 140px;
  --card-width: 910px;
  --card-height: 500px;
  --header-gap: 648px;

  /* Border Radius */
  --radius-card: 35px;
  --radius-card-inner: 30px;
  --radius-time-frame: 35px;

  /* Shadows */
  --shadow-main:
    0px 16px 48px 0px rgba(17, 17, 26, 0.1),
    0px 8px 24px 0px rgba(17, 17, 26, 0.1),
    0px 1px 0px 0px rgba(17, 17, 26, 0.1);

  --shadow-footer:
    0px 16px 48px 0px rgba(17, 17, 26, 0.1),
    0px 8px 24px 0px rgba(17, 17, 26, 0.1),
    0px 1px 0px 0px rgba(17, 17, 26, 0.1);

  /* Effects */
  --backdrop-blur: blur(10px);

  /* Opacity */
  --opacity-text-secondary: 0.7;
  --opacity-texture: 0.8;

  /* Accessibility style */
  --accent-color-accessibility: rgb(255, 215, 0) !important;
  --other-color-accessibility: rgb(80, 208, 160) !important;
}