/* =============================================================
   EIXO4 Theme · variables
   Tokens 1:1 do prototipo Claude Design.
   - Brand / Chrome / Surface / Ink / Status
   - Radius e Density via attributes
   - Sombras
   - Portal dark mode opcional
============================================================= */

:root {
  /* === BRAND === */
  --brand-navy:        #0B1B3D;
  --brand-navy-2:      #142a5c;
  --brand-orange:      #F59E0B;
  --brand-amber:       #FCB814;
  --brand-orange-deep: #E07B00;
  --brand-gradient: linear-gradient(135deg, #FCB814 0%, #F59E0B 50%, #E07B00 100%);

  /* === CHROME (sidebar dark) === */
  --chrome-900: #0F1115;
  --chrome-800: #161922;
  --chrome-700: #1F2330;
  --chrome-600: #2A2F3D;
  --chrome-500: #3A4052;
  --chrome-400: #5A6275;
  --chrome-300: #8A93A8;
  --chrome-200: #B5BCCF;

  /* === SURFACES (light app, default) === */
  --bg:            #F4F6FB;
  --bg-2:          #EAEDF3;
  --surface:       #FFFFFF;
  --surface-2:    #FAFBFD;
  --border:        #E2E6EE;
  --border-strong: #C9D0DC;
  --hairline:      #EEF1F7;

  /* === INK (text) === */
  --ink-900: #0B1220;
  --ink-700: #1F2A3D;
  --ink-500: #4B5670;
  --ink-400: #6B7691;
  --ink-300: #94A0B8;
  --ink-200: #B9C2D4;

  /* === STATUS === */
  --success:    #0E9A6F;  --success-bg: #E6F6F0;
  --danger:     #DC2626;  --danger-bg:  #FDECEC;
  --warning:    #D97706;  --warning-bg: #FEF4E5;
  --info:       #1D6FE0;  --info-bg:    #E8F1FE;
  --gold:       #C8A24A;  --gold-bg:    #F8F1DD;

  /* === RADIUS (default = medium) === */
  --r-xs: 4px;
  --r-sm: 6px;
  --r:    10px;
  --r-lg: 14px;
  --r-xl: 18px;

  /* === DENSITY (default = balanced) === */
  --row-h:    38px;
  --pad-card: 18px;
  --pad-cell: 12px 14px;
  --gap:      14px;
  --fs-base:  13.5px;
  --fs-sm:    12.5px;
  --fs-xs:    11.5px;

  /* === SHADOWS === */
  --sh-1:   0 1px 2px rgba(11,18,32,0.04), 0 1px 1px rgba(11,18,32,0.03);
  --sh-2:   0 2px 8px rgba(11,18,32,0.06), 0 1px 2px rgba(11,18,32,0.04);
  --sh-3:   0 8px 24px rgba(11,18,32,0.08), 0 2px 6px rgba(11,18,32,0.04);
  --sh-pop: 0 18px 48px rgba(11,18,32,0.18), 0 4px 12px rgba(11,18,32,0.08);

  /* === Tipografia === */
  --eixo4-font-sans: 'Manrope', system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --eixo4-font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
}

/* === RADIUS variants (toggle via [data-radius]) === */
[data-radius="subtle"]     { --r-xs: 2px; --r-sm: 3px; --r:  5px; --r-lg:  7px; --r-xl: 10px; }
[data-radius="medium"]     { --r-xs: 4px; --r-sm: 6px; --r: 10px; --r-lg: 14px; --r-xl: 18px; }
[data-radius="pronounced"] { --r-xs: 6px; --r-sm:10px; --r: 14px; --r-lg: 20px; --r-xl: 28px; }

/* === DENSITY variants (toggle via body.eixo4-density-*) === */
body.eixo4-density-comfortable {
  --row-h: 44px; --pad-card: 22px; --pad-cell: 14px 16px;
  --gap: 16px; --fs-base: 14px; --fs-sm: 13px; --fs-xs: 12px;
}
body.eixo4-density-balanced {
  --row-h: 38px; --pad-card: 18px; --pad-cell: 12px 14px;
  --gap: 14px; --fs-base: 13.5px; --fs-sm: 12.5px; --fs-xs: 11.5px;
}
body.eixo4-density-dense {
  --row-h: 32px; --pad-card: 14px; --pad-cell: 8px 10px;
  --gap: 10px; --fs-base: 12.5px; --fs-sm: 11.5px; --fs-xs: 10.5px;
}

/* === PORTAL DARK MODE (apenas portal cliente) === */
[data-portal-theme="dark"] {
  --bg:             #0A0E1A;
  --bg-2:           #0F1422;
  --surface:        #141B2D;
  --surface-2:     #1B2238;
  --border:         #2A3354;
  --border-strong:  #3A4566;
  --hairline:       #1F2742;
  --ink-900: #F4F6FB;
  --ink-700: #D6DCEA;
  --ink-500: #9BA5BD;
  --ink-400: #7A8398;
  --ink-300: #5C6580;
  --ink-200: #3F4865;
}