/* tokens.css — biến gốc (05-DESIGN-SYSTEM §7). Giá trị CHỐT, không tự đổi. */
:root{
  /* màu - light */
  --oq-bg:#f6f7f9;
  --oq-surface:#ffffff;
  --oq-surface-2:#f0f2f5;
  --oq-border:#e3e6ea;
  --oq-border-strong:#cfd4da;
  --oq-text-1:#1b1f24;
  --oq-text-2:#4b5563;
  --oq-text-3:#8a93a0;
  --oq-accent:#2563eb;
  --oq-accent-hover:#1d4ed8;
  --oq-accent-ink:#ffffff;
  --oq-ok:#16a34a;      --oq-ok-bg:#e7f6ec;
  --oq-warn:#d97706;    --oq-warn-bg:#fdf1e0;
  --oq-danger:#dc2626;  --oq-danger-bg:#fde8e8;
  --oq-info:#0891b2;    --oq-info-bg:#e2f4f8;

  /* chữ */
  --oq-font:'Inter',system-ui,-apple-system,'Segoe UI',Roboto,'Helvetica Neue',Arial,'Noto Sans',sans-serif;
  --oq-font-mono:ui-monospace,'SFMono-Regular',Menlo,Consolas,monospace;
  --oq-fs-12:12px; --oq-fs-14:14px; --oq-fs-16:16px;
  --oq-fs-18:18px; --oq-fs-20:20px; --oq-fs-24:24px;
  --oq-lh-body:1.55; --oq-lh-head:1.3;

  /* spacing */
  --oq-sp-1:4px;  --oq-sp-2:8px;  --oq-sp-3:12px; --oq-sp-4:16px;
  --oq-sp-5:20px; --oq-sp-6:24px; --oq-sp-8:32px; --oq-sp-10:40px;

  /* radius */
  --oq-radius-sm:6px; --oq-radius:8px; --oq-radius-lg:12px; --oq-radius-pill:999px;

  /* shadow */
  --oq-shadow-sm:0 1px 2px rgba(16,24,40,.06);
  --oq-shadow:0 1px 3px rgba(16,24,40,.08),0 1px 2px rgba(16,24,40,.06);
  --oq-shadow-lg:0 10px 24px rgba(16,24,40,.12);

  /* z-index */
  --oq-z-base:0; --oq-z-sticky:100; --oq-z-drawer:200;
  --oq-z-modal:300; --oq-z-toast:400;

  /* layout */
  --oq-sidebar-w:240px; --oq-header-h:56px; --oq-container:1200px;
}

:root[data-theme="dark"]{
  --oq-bg:#0f1115;
  --oq-surface:#171a21;
  --oq-surface-2:#1e222b;
  --oq-border:#2a2f3a;
  --oq-border-strong:#3a4150;
  --oq-text-1:#e8eaed;
  --oq-text-2:#aab1bd;
  --oq-text-3:#727a87;
  --oq-accent:#3b82f6;
  --oq-accent-hover:#60a5fa;
}