/**
 * CSS Custom Properties (Design Tokens)
 * Progonki.ru - Racing Statistics Platform
 *
 * Использование: var(--имя-переменной, значение-по-умолчанию)
 */

:root {
  /* ========== Z-INDEX SCALE ========== */
  /* Bootstrap стандарты для консистентности */
  --z-dropdown: 1000;
  --z-sticky: 1020;
  --z-fixed: 1030;
  --z-offcanvas-backdrop: 1040;
  --z-offcanvas: 1045;
  --z-modal-backdrop: 1050;
  --z-modal: 1055;
  --z-popover: 1070;
  --z-tooltip: 1080;
  --z-toast: 1090;

  /* Component-specific aliases */
  --z-navbar: var(--z-fixed);
  --z-mobile-menu: var(--z-offcanvas);
  --z-overlay: var(--z-offcanvas-backdrop);

  /* ========== HEIGHTS ========== */
  --navbar-height: 56px;
  --navbar-height-desktop: 64px;
  --menu-width: 260px;

  /* ========== SPACING ========== */
  --content-padding-y: 1rem;
  --content-padding-x: 1.5rem;
  --card-padding: 1rem;

  /* ========== TRANSITIONS ========== */
  --transition-fast: 0.15s ease-in-out;
  --transition-base: 0.3s ease;
  --transition-slow: 0.5s ease;

  /* ========== COLORS (Primary Brand) ========== */
  --color-primary: #EB3D63;
  --color-primary-rgb: 235, 61, 99;
  --color-accent: #4dabf7;
  --color-accent-rgb: 77, 171, 247;

  /* ========== SHADOWS ========== */
  --shadow-card: 0 2px 6px 0 rgba(67, 89, 113, 0.12);
  --shadow-card-hover: 0 5px 15px rgba(0, 0, 0, 0.2);
  --shadow-navbar: 0 2px 10px rgba(0, 0, 0, 0.1);

  /* ========== BREAKPOINTS (reference only, use @media) ========== */
  /* xs: < 576px */
  /* sm: >= 576px */
  /* md: >= 768px */
  /* lg: >= 992px */
  /* xl: >= 1200px */
  /* xxl: >= 1400px */
}

/* Desktop navbar height */
@media (min-width: 1200px) {
  :root {
    --navbar-height: var(--navbar-height-desktop);
  }
}