/* PacketUP HUB — дизайн-токены.
   Палитра «Марсала на тёплом антраците». Тёмная тема по умолчанию,
   светлая включается атрибутом <html data-theme="light">. */

:root,
:root[data-theme="dark"] {
  color-scheme: dark;

  /* Поверхности: от фона к приподнятым слоям */
  --bg: #141112;
  --surface: #1C1818;
  --surface-2: #252020;
  --surface-3: #2F2828;
  --overlay: rgba(10, 7, 8, .66);

  /* Границы */
  --border: #332C2C;
  --border-strong: #473E3E;

  /* Текст */
  --text: #F4EEEC;
  --text-muted: #ADA19E;
  --text-faint: #756A67;
  --text-on-accent: #FFFFFF;

  /* Бренд — марсала */
  --accent: #7D2336;
  --accent-hover: #953046;
  --accent-press: #661B2B;
  --accent-text: #E8919F;          /* акцент для текста и иконок на тёмном фоне */
  --accent-soft: rgba(125, 35, 54, .24);
  --accent-glow: rgba(149, 48, 70, .45);

  /* Семантика */
  --success: #3FB27F; --success-soft: rgba(63, 178, 127, .14);
  --warning: #E0A43A; --warning-soft: rgba(224, 164, 58, .14);
  --danger:  #F0605D; --danger-soft:  rgba(240, 96, 93, .14);
  --info:    #5B9BF0; --info-soft:    rgba(91, 155, 240, .14);

  --shadow-sm: 0 1px 0 rgba(255, 255, 255, .03) inset, 0 2px 6px rgba(0, 0, 0, .25);
  --shadow-md: 0 1px 0 rgba(255, 255, 255, .03) inset, 0 8px 24px rgba(0, 0, 0, .35);
  --shadow-lg: 0 24px 64px rgba(0, 0, 0, .55);
}

:root[data-theme="light"] {
  color-scheme: light;

  --bg: #F7F3F1;
  --surface: #FFFFFF;
  --surface-2: #F2ECE9;
  --surface-3: #E9E0DC;
  --overlay: rgba(30, 20, 20, .38);

  --border: #E6DDD9;
  --border-strong: #D2C6C1;

  --text: #1E1717;
  --text-muted: #655856;
  --text-faint: #9C8E8B;
  --text-on-accent: #FFFFFF;

  --accent: #7D2336;
  --accent-hover: #953046;
  --accent-press: #661B2B;
  --accent-text: #7D2336;
  --accent-soft: rgba(125, 35, 54, .09);
  --accent-glow: rgba(125, 35, 54, .25);

  --success: #16855A; --success-soft: rgba(22, 133, 90, .10);
  --warning: #A86A00; --warning-soft: rgba(168, 106, 0, .10);
  --danger:  #C8322F; --danger-soft:  rgba(200, 50, 47, .09);
  --info:    #2563C9; --info-soft:    rgba(37, 99, 201, .09);

  --shadow-sm: 0 1px 2px rgba(30, 15, 15, .06);
  --shadow-md: 0 1px 2px rgba(30, 15, 15, .06), 0 6px 18px rgba(30, 15, 15, .06);
  --shadow-lg: 0 24px 64px rgba(30, 15, 15, .18);
}

:root {
  /* Шрифты: у всех трёх есть кириллица.
     --font-num — суммы, коды, ID, хэши (табличные цифры, класс .nums).
     --font-code — только логи запросов и JSON в админке, системный моноширинный. */
  --font-ui: "Inter", system-ui, -apple-system, "Segoe UI", sans-serif;
  --font-display: "Unbounded", "Inter", sans-serif;
  --font-num: "Manrope", "Inter", sans-serif;
  --font-code: ui-monospace, "Cascadia Mono", Consolas, monospace;

  /* Фирменный мотив — срезанный правый верхний угол (ярлык посылки) */
  --cut-sm: 5px;
  --cut: 7px;
  --cut-lg: 14px;

  /* Шкала размеров: 12 / 13 / 14 / 16 / 20 / 24 / 32 */
  --fs-xs: 12px;
  --fs-sm: 13px;
  --fs-md: 14px;   /* базовый */
  --fs-lg: 16px;
  --fs-xl: 20px;
  --fs-2xl: 24px;
  --fs-3xl: 32px;

  /* Отступы: шаг 4px */
  --sp-1: 4px;  --sp-2: 8px;  --sp-3: 12px; --sp-4: 16px;
  --sp-5: 20px; --sp-6: 24px; --sp-8: 32px; --sp-10: 40px; --sp-12: 48px;

  /* Скругления */
  --r-sm: 6px; --r-md: 10px; --r-lg: 14px; --r-xl: 20px; --r-full: 999px;

  /* Размеры каркаса */
  --topbar-h: 60px;
  --sidebar-w: 236px;
  --sidebar-w-admin: 232px;
  --drawer-w: 480px;
  --control-h: 38px;
  --control-h-sm: 30px;
  --control-h-lg: 46px;

  /* Движение: всё появляется снизу вверх с мягким замедлением, пружина — только для мелких «щелчков» */
  --ease: cubic-bezier(.2, .7, .2, 1);
  --ease-out: cubic-bezier(.16, 1, .3, 1);
  --ease-in: cubic-bezier(.4, 0, 1, 1);
  --ease-spring: cubic-bezier(.34, 1.56, .64, 1);
  --dur-fast: 120ms;
  --dur: 200ms;
  --dur-slow: 480ms;
  --stagger: 45ms;

  /* Слои */
  --z-topbar: 20; --z-drawer: 40; --z-modal: 50; --z-toast: 60;
}

@media (prefers-reduced-motion: reduce) {
  :root { --dur-fast: 0ms; --dur: 0ms; }
}
