/* order-theme.css — общая тема для сервиса "Заказы / логистика" (order.group-asia.kz).
 *
 * Источник истины для переменных темы и общих элементов (branded header,
 * табы навигации, кнопка переключения темы) — все 5 страниц сервиса
 * (index.html, orders.html, drafts.html, import.html, action-log.html)
 * подключают этот файл через <link rel="stylesheet" href="/logistics/order-theme.css">
 * и НЕ дублируют эти правила у себя.
 *
 * По умолчанию (без [data-theme]) — светлая тема, единая для всей экосистемы
 * ASIA PARTS (тот же паспортный/зелёно-золотой стиль, что у acts/contracts/
 * warehouse/farms/portal). [data-theme="dark"] — прежний тёмный вид сервиса,
 * теперь доступен по переключателю в шапке, а не как единственный вариант.
 * Значения внутри [data-theme="dark"] специально совпадают с тем, что было
 * тут захардкожено раньше — переключение в тёмный режим не должно ничего
 * менять по сравнению с тем, что видели раньше.
 */

:root {
  --bg-page: #faf8f3;
  --text-main: #23281f;
  --bg-nav: #ffffff;
  --border-nav: #e1dbc9;
  --text-muted: #6b6a5f;
  --bg-header: #ffffff;
  --border-header: #e1dbc9;
  --bg-input: #faf8f3;
  --border-input: #e1dbc9;
  --bg-hover: #f1ede2;
  --border-dashed: #c9bfa0;
  --text-empty: #9b9a8c;
  --text-child: #8a8973;
  --bg-modal: #ffffff;
  --border-modal: #e1dbc9;
  --bg-th: #f1ede2;

  --accent-primary: #c98a3b;
  --accent-primary-deep: #a8722c;
  --accent-danger: #a8402f;
  --accent-success: #328143;

  /* Статусные бейджи/акценты (принят/бэкордер/готов к отгрузке/в пути/
     оприходован) — в тёмной теме это лёгкий полупрозрачный фон + светлый
     пастельный текст (хорошо читается на чёрном). На белой странице тот же
     пастельный текст почти не виден, поэтому в светлой теме — наоборот:
     плотный тёмный текст на лёгкой цветной подложке. */
  --status-success-bg: #e3f0e6;
  --status-success-text: #235c2f;
  --status-warning-bg: #faf1de;
  --status-warning-text: #a8722c;
  --status-purple-bg: #efe8fb;
  --status-purple-text: #6d28d9;
  --status-info-bg: #dde8fb;
  --status-info-text: #1d4ed8;
  --status-neutral-bg: #eeece3;
  --status-neutral-text: #6b6a5f;
  --status-danger-bg: #f7e3df;
  --status-danger-text: #a8402f;
  --status-success-border: #c9e0cc;
  --status-info-border: #c7d6f5;

  --green-deep: #1f3a2e;
  --green-bright: #328143;
  --green-bright-deep: #235c2f;
  --amber: #c98a3b;
  --amber-deep: #a8722c;
  --amber-light: #f2d9b0;
  --shadow-md: 0 6px 16px rgba(30,35,25,.10), 0 2px 6px rgba(30,35,25,.06);
}

[data-theme="dark"] {
  --bg-page: #0f0f0f;
  --text-main: #e0e0e0;
  --bg-nav: #111;
  --border-nav: #222;
  --text-muted: #888;
  --bg-header: #1a1a1a;
  --border-header: #2a2a2a;
  --bg-input: #2a2a2a;
  --border-input: #3a3a3a;
  --bg-hover: #1c1c1c;
  --border-dashed: #444;
  --text-empty: #555;
  --text-child: #666;
  --bg-modal: #1e1e1e;
  --border-modal: #2a2a2a;
  --bg-th: #1a1a1a;

  --accent-primary: #2563eb;
  --accent-primary-deep: #2563eb;
  --accent-danger: #dc2626;

  --status-success-bg: #16a34a22;
  --status-success-text: #5DCAA5;
  --status-warning-bg: #d9770622;
  --status-warning-text: #fbbf24;
  --status-purple-bg: #7c3aed22;
  --status-purple-text: #c4b5fd;
  --status-info-bg: #2563eb22;
  --status-info-text: #60a5fa;
  --status-neutral-bg: #88888822;
  --status-neutral-text: #aaa;
  --status-danger-bg: #dc262622;
  --status-danger-text: #f87171;
  --status-success-border: #2a3a2a;
  --status-info-border: #2a2a3a;
  --accent-success: #16a34a;
}

/* ---- branded header, тот же паттерн, что в acts/contracts/warehouse ---- */
header.order-header {
  background: linear-gradient(135deg, var(--green-bright), var(--green-bright-deep));
  color: #fff;
  padding: 16px 22px; display: flex; justify-content: space-between; align-items: center;
  flex-wrap: wrap; row-gap: 8px;
  box-shadow: 0 1px 2px rgba(0,0,0,.08), 0 4px 16px rgba(20,50,25,.22);
  flex-shrink: 0;
}
[data-theme="dark"] header.order-header {
  background: linear-gradient(135deg, #1a1a1a, #111);
  box-shadow: 0 1px 2px rgba(0,0,0,.3);
}
header.order-header .title { display: flex; align-items: center; gap: 10px; }
header.order-header .mark {
  width: 30px; height: 30px; border-radius: 9px;
  background: linear-gradient(135deg, var(--amber), var(--amber-deep));
  display: flex; align-items: center; justify-content: center;
  box-shadow: 0 2px 6px rgba(0,0,0,.25); flex-shrink: 0;
}
header.order-header .mark svg { width: 15px; height: 15px; stroke: #fff; fill: none; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
header.order-header h1 { font-size: 17px; margin: 0; font-weight: 650; letter-spacing: 0.2px; }
header.order-header .actions { display: flex; align-items: center; gap: 6px; }
header.order-header .pill-btn {
  background: rgba(255,255,255,.12); border: none; color: #fff; cursor: pointer;
  font-size: 13.5px; font-weight: 600; padding: 8px 14px; border-radius: 999px;
  display: flex; align-items: center; gap: 5px; transition: background .2s;
}
header.order-header .pill-btn:hover { background: rgba(255,255,255,.22); }
header.order-header #themeToggle { font-size: 15px; padding: 8px 10px; }

/* ---- вкладки-навигация под шапкой ---- */
nav.order-nav {
  flex-shrink: 0; background: var(--bg-nav); border-bottom: 1px solid var(--border-nav);
  padding: 0 24px; display: flex; gap: 4px; align-items: center;
  overflow-x: auto; -webkit-overflow-scrolling: touch;
}
nav.order-nav .nav-link {
  display: inline-block; padding: 10px 16px; font-size: 13px; color: var(--text-muted);
  text-decoration: none; border-bottom: 2px solid transparent; transition: all .15s;
  flex-shrink: 0; white-space: nowrap;
}
nav.order-nav .nav-link:hover { color: var(--text-main); }
nav.order-nav .nav-link.active { color: var(--text-main); border-bottom-color: var(--accent-primary); }
nav.order-nav #rateBar, nav.order-nav #notifyToggle { flex-shrink: 0; }
nav.order-nav #draftsNavBadge {
  display: inline-block; min-width: 16px; height: 16px; padding: 0 4px; margin-left: 5px;
  background: #f87171; color: #fff; font-size: 10px; font-weight: 700; line-height: 16px;
  text-align: center; border-radius: 99px; vertical-align: 2px; flex-shrink: 0;
}
nav.order-nav #draftsNavBadge:empty { display: none; }
nav.order-nav .nav-logout {
  background: none; border: none; color: var(--text-muted); font-size: 13px; cursor: pointer;
  padding: 10px 16px; white-space: nowrap; flex-shrink: 0;
}
nav.order-nav .nav-logout:hover { color: var(--text-main); }