/* =========================================================
   ERP.RMCDS.RU — кабинет заказчика · дизайн-токены
   Портированы из дизайн-системы сайта rmcds.ru (site-styles.css):
   корпоративный B2B, светлая тема по умолчанию, тёмная — по data-theme.
   CSP на проде строгий (font-src 'self'), поэтому шрифты — системные
   с именами дизайн-системы в начале стека на случай self-hosting.
   ========================================================= */

:root {
  color-scheme: light;

  /* Чернила / текст */
  --ink: #0B1220;
  --ink-2: #1F2A3B;
  --muted: #5A6478;
  --muted-2: #656C7A;

  /* Линии и поверхности */
  --line: #E4E7ED;
  --line-2: #F0F2F5;
  --line-strong: #868E9E;
  --bg: #FFFFFF;
  --bg-soft: #F7F8FA;
  --bg-tint: #EEF2F8;

  /* Тёмная поверхность (сайдбар, топбар, герой-полосы) */
  --deep: #0B1220;
  --deep-line: rgba(255, 255, 255, 0.12);
  --deep-fill: rgba(255, 255, 255, 0.08);
  --on-deep: #FFFFFF;
  --on-deep-2: rgba(255, 255, 255, 0.85);
  --on-deep-3: rgba(255, 255, 255, 0.70);
  --on-deep-4: rgba(255, 255, 255, 0.50);
  --on-deep-5: rgba(255, 255, 255, 0.55);
  --on-deep-border: rgba(255, 255, 255, 0.24);
  --on-deep-hover: #E9EDF4;

  /* Брендовый акцент */
  --brand: #0B3D91;
  --brand-2: #1E5BC6;
  --brand-fill: #0B3D91;
  --brand-fill-2: #1E5BC6;
  --on-brand: #FFFFFF;
  --on-brand-2: rgba(255, 255, 255, 0.85);
  --brand-wash: rgba(11, 61, 145, 0.09);
  --focus-ring: rgba(11, 61, 145, 0.10);
  --chip-veil: rgba(255, 255, 255, 0.72);

  /* Сигнальный красный (рекламации, ошибки) */
  --signal: #C8102E;
  --signal-ink: #C8102E;
  --signal-bg: #FEF6F6;
  --signal-glow: rgba(200, 16, 46, 0.18);
  --danger-line: #FECDCA;
  --danger-ink: #B42318;

  /* Зелёный (готово, синхронизировано, успех) */
  --ok: #16A34A;
  --ok-text: #0E7A3C;
  --ok-bg: #ECFDF5;
  --ok-line: #10B981;
  --ok-ink: #065F46;
  --ok-glow: rgba(22, 163, 74, 0.45);

  /* Янтарный (ход за заказчиком, доработка) */
  --amber-ink: #92531B;
  --amber-strong: #B7791F;
  --amber-bg: #FEF7EC;
  --amber-line: #F5D9A8;

  /* Синий-информ (образец, «в пути») */
  --info-ink: #175CD3;
  --info-bg: #EFF6FF;
  --info-line: #B2CCF4;

  /* Подсветка совпадений поиска */
  --mark-bg: #FFF1B8;
  --mark-ink: #0B1220;

  /* Затемнители */
  --scrim: rgba(11, 18, 32, 0.42);
  --scrim-strong: rgba(11, 18, 32, 0.72);

  /* Аватар-плитка */
  --avatar-bg: #EEF2F8;
  --avatar-ink: #0B3D91;

  /* Стрелка нативного select */
  --sel-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' fill='none' stroke='%235A6478' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");

  /* Типографика — системный стек с именами дизайн-системы впереди */
  --font-sans: "Inter", "Manrope", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, system-ui, "Helvetica Neue", Arial, sans-serif;
  --font-display: "Inter Tight", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, sans-serif;
  --font-mono: "JetBrains Mono", "IBM Plex Mono", ui-monospace, "SFMono-Regular", "Cascadia Code", Menlo, Consolas, monospace;

  /* Раскладка */
  --sidebar-w: 260px;
  --topbar-h: 60px;
  --container: 1160px;
  --gutter: 24px;
  --radius: 4px;
  --radius-lg: 8px;

  /* Тени */
  --shadow-1: 0 1px 2px rgba(11, 18, 32, 0.04);
  --shadow-2: 0 4px 16px rgba(11, 18, 32, 0.06);
  --shadow-3: 0 8px 28px rgba(11, 18, 32, 0.12);
  --shadow-4: 0 24px 60px rgba(11, 18, 32, 0.16);

  /* Тайминги анимаций */
  --dur-fast: 140ms;
  --dur: 220ms;
  --ease: cubic-bezier(0.16, 1, 0.3, 1);
}

/* Тёмная тема: явный выбор пользователя */
:root[data-theme="dark"] {
  color-scheme: dark;

  --ink: #E8ECF3;
  --ink-2: #C3CBD9;
  --muted: #98A3B5;
  --muted-2: #939DB0;
  --line: #2C3849;
  --line-2: #222C3B;
  --line-strong: #6A7890;
  --bg: #121926;
  --bg-soft: #1A2331;
  --bg-tint: #1C2E4D;

  --deep: #0F1622;
  --deep-line: rgba(255, 255, 255, 0.16);
  --deep-fill: rgba(255, 255, 255, 0.10);
  --on-deep-4: rgba(255, 255, 255, 0.62);
  --on-deep-5: rgba(255, 255, 255, 0.58);
  --on-deep-border: rgba(255, 255, 255, 0.40);

  --brand: #7FAAF5;
  --brand-2: #A6C6FF;
  --brand-fill: #2263CC;
  --brand-fill-2: #2A6EDB;
  --brand-wash: rgba(127, 170, 245, 0.14);
  --focus-ring: rgba(127, 170, 245, 0.22);
  --chip-veil: rgba(26, 35, 49, 0.72);

  --signal: #EC5464;
  --signal-ink: #F3717D;
  --signal-bg: #2F1D23;
  --signal-glow: rgba(236, 84, 100, 0.22);
  --danger-line: #5A2A30;
  --danger-ink: #F3717D;

  --ok: #35C46B;
  --ok-text: #4ADE80;
  --ok-bg: #12301F;
  --ok-line: #35C46B;
  --ok-ink: #8FE3B2;
  --ok-glow: rgba(53, 196, 107, 0.40);

  --amber-ink: #F0C173;
  --amber-strong: #F5D9A8;
  --amber-bg: #2C2312;
  --amber-line: #4A3A18;

  --info-ink: #8FB6FF;
  --info-bg: #16233B;
  --info-line: #2E4B7A;

  --mark-bg: #4A3A0F;
  --mark-ink: #FFE9A3;

  --scrim: rgba(0, 0, 0, 0.66);
  --scrim-strong: rgba(0, 0, 0, 0.80);

  --avatar-bg: #1C2E4D;
  --avatar-ink: #A6C6FF;

  --sel-arrow: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5L6 6.5L11 1.5' fill='none' stroke='%2398A3B5' stroke-width='1.5' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");

  --shadow-1: 0 1px 2px rgba(0, 0, 0, 0.5), 0 0 0 1px rgba(255, 255, 255, 0.04);
  --shadow-2: 0 10px 30px rgba(0, 0, 0, 0.55), 0 0 0 1px rgba(255, 255, 255, 0.06);
  --shadow-3: 0 10px 30px rgba(0, 0, 0, 0.60), 0 0 0 1px rgba(255, 255, 255, 0.08);
  --shadow-4: 0 24px 60px rgba(0, 0, 0, 0.70), 0 0 0 1px rgba(255, 255, 255, 0.08);
}

/* Плавный переход при переключении темы (класс держится доли секунды) */
:root.theme-anim,
:root.theme-anim body,
:root.theme-anim *::before,
:root.theme-anim *::after,
:root.theme-anim * {
  transition: background-color .22s linear, border-color .22s linear,
              color .22s linear, fill .22s linear, stroke .22s linear !important;
}
@media (prefers-reduced-motion: reduce) {
  :root.theme-anim,
  :root.theme-anim * { transition: none !important; }
}
