/* Sandclaw CRM — design tokens (colors, spacing, type, shadows)
   Extracted from the Sandclaw.io artifact prototype. Light + dark theme
   variables, respects prefers-color-scheme, overridable via [data-theme]. */

:root{
  --bg-app:#F6F4EF; --bg-sidebar:#FAF8F4; --bg-surface:#FFFFFF; --bg-surface-raised:#FBFAF7; --bg-surface-hover:#F6F4EF;
  --border-subtle:rgba(26,24,21,.055); --border-strong:rgba(26,24,21,.10);
  --field-bg:#F6F4EF; --focus-ring:0 0 0 3px rgba(59,130,246,.28); --shadow-overlay:0 24px 64px rgba(26,24,21,.18);
  --text-primary:#1A1815; --text-secondary:#585249; --text-muted:#756F64;
  --accent:#3B82F6; --accent-hover:color-mix(in srgb, var(--accent) 82%, black); --accent-bg:color-mix(in srgb, var(--accent) 16%, transparent); --accent-t:color-mix(in srgb, var(--accent) 60%, black); --accent-fg:#FFFFFF;
  --success:#3D7A4F; --warning:#8A5D0B; --danger:#BE4338; --info:#2A5FB4;
  --success-bg:rgba(61,122,79,.10); --warning-bg:rgba(138,93,11,.10); --danger-bg:rgba(190,67,56,.10); --info-bg:rgba(42,95,180,.10);
  --logo-ink:#0F1729;
  --blk-fg:#FFFFFF;
}
@media (prefers-color-scheme: dark){
  :root:not([data-theme="light"]){
    --bg-app:#121110; --bg-sidebar:#171512; --bg-surface:#1A1816; --bg-surface-raised:#211E1A; --bg-surface-hover:#262320;
    --border-subtle:rgba(255,255,255,.11); --border-strong:rgba(255,255,255,.16);
    --field-bg:#171512; --focus-ring:0 0 0 3px rgba(59,130,246,.30); --shadow-overlay:0 24px 64px rgba(0,0,0,.65);
    --text-primary:#EDEAE3; --text-secondary:#A9A49A; --text-muted:#908A80;
    --accent:#3B82F6; --accent-hover:color-mix(in srgb, var(--accent) 78%, white); --accent-bg:color-mix(in srgb, var(--accent) 16%, transparent); --accent-t:color-mix(in srgb, var(--accent) 55%, white); --accent-fg:#FFFFFF;
    --success:#4BD48A; --warning:#F2B441; --danger:#FF7A6B; --info:#7FB2FF;
    --success-bg:rgba(75,212,138,.12); --warning-bg:rgba(242,180,65,.12); --danger-bg:rgba(255,122,107,.12); --info-bg:rgba(127,178,255,.12);
    --logo-ink:#F2F3F5;
    --blk-fg:#14151B;
  }
}
:root[data-theme="dark"]{
  --bg-app:#121110; --bg-sidebar:#171512; --bg-surface:#1A1816; --bg-surface-raised:#211E1A; --bg-surface-hover:#262320;
  --border-subtle:rgba(255,255,255,.11); --border-strong:rgba(255,255,255,.16);
  --field-bg:#171512; --focus-ring:0 0 0 3px rgba(59,130,246,.30); --shadow-overlay:0 24px 64px rgba(0,0,0,.65);
  --text-primary:#EDEAE3; --text-secondary:#A9A49A; --text-muted:#908A80;
  --accent:#3B82F6; --accent-hover:color-mix(in srgb, var(--accent) 78%, white); --accent-bg:color-mix(in srgb, var(--accent) 16%, transparent); --accent-t:color-mix(in srgb, var(--accent) 55%, white); --accent-fg:#FFFFFF;
  --success:#4BD48A; --warning:#F2B441; --danger:#FF7A6B; --info:#7FB2FF;
  --success-bg:rgba(75,212,138,.12); --warning-bg:rgba(242,180,65,.12); --danger-bg:rgba(255,122,107,.12); --info-bg:rgba(127,178,255,.12);
  --logo-ink:#F2F3F5;
  --blk-fg:#14151B;
}
:root[data-theme="light"]{
  --bg-app:#F6F4EF; --bg-sidebar:#FAF8F4; --bg-surface:#FFFFFF; --bg-surface-raised:#FBFAF7; --bg-surface-hover:#F6F4EF;
  --border-subtle:rgba(26,24,21,.055); --border-strong:rgba(26,24,21,.10);
  --field-bg:#F6F4EF; --focus-ring:0 0 0 3px rgba(59,130,246,.28); --shadow-overlay:0 24px 64px rgba(26,24,21,.18);
  --text-primary:#1A1815; --text-secondary:#585249; --text-muted:#756F64;
  --accent:#3B82F6; --accent-hover:color-mix(in srgb, var(--accent) 82%, black); --accent-bg:color-mix(in srgb, var(--accent) 16%, transparent); --accent-t:color-mix(in srgb, var(--accent) 60%, black); --accent-fg:#FFFFFF;
  --success:#3D7A4F; --warning:#8A5D0B; --danger:#BE4338; --info:#2A5FB4;
  --success-bg:rgba(61,122,79,.10); --warning-bg:rgba(138,93,11,.10); --danger-bg:rgba(190,67,56,.10); --info-bg:rgba(42,95,180,.10);
  --logo-ink:#0F1729;
  --blk-fg:#FFFFFF;
}
:root{
  --r-xs:10px; --r-s:12px; --r-lg:16px; --r-xl:22px; --r-full:999px;
  --sp-1:4px; --sp-2:8px; --sp-3:12px; --sp-4:16px; --sp-5:20px; --sp-6:24px; --sp-7:32px; --sp-8:40px;
  --fw-regular:400; --fw-medium:500; --fw-semibold:600; --fw-bold:700; --fw-heavy:800;
  --font:'Inter',system-ui,-apple-system,'Segoe UI',sans-serif;
  --font-display:'Sora',var(--font);
  --mono:'IBM Plex Mono','Consolas',monospace;
  --ease-out:cubic-bezier(.22,1,.36,1);
  --ease-spring:cubic-bezier(.34,1.56,.64,1);
  --shadow-pill:0 1px 4px rgba(0,0,0,.10);
  --shadow-card:0 12px 28px rgba(0,0,0,.10);
  --shadow-tip:0 14px 32px rgba(0,0,0,.28);
  --shadow-popover:0 20px 48px rgba(0,0,0,.24);
  --shadow-modal:0 30px 70px rgba(0,0,0,.4);
  --shadow-modal-lg:0 40px 90px rgba(0,0,0,.45);
}