/* ═══════════════════════════════════════════════════════════════════
   TENANT · cockpit-v3 — servida em /t/cockpit-v3/theme.css
   Paleta do Cockpit v3 (V3-DS-01). Redefine só VALORES (I2/I3/I5/I6).

   Fonte dos valores: protótipos v3 do cvb-cockpit-design
   (`prototypes/v3/control-center.dc.html`, `computing.dc.html`,
   `vcode.dc.html`, `cockpit-v3.js` paleta 'std' e 'lr') e
   `docs/cockpit-v3/modules/shell.md` §2.8 (modo alternativo) e §2.13
   (cor do módulo).

   Mapeamento v3 → DS:
     --bg → background · --chrome → chrome · --surface → card/popover
     --surface-2/-3/-4 → surface-1/-2/-3 · --line → border
     --line-strong → input · --text/-2/-3 → foreground/-secondary/muted
     --accent-ink → primary/link/ring · --accent-soft → primary-wash
     --accent/-hover/--on-accent → action/-hover/-foreground
     --on-ink → primary-foreground · --danger → destructive
     --warn → warning · --blue → info · --violet → transition
     --brand → brand · shadow-1/2/3 → shadow-subtle/raised/overlay

   Modos, todos no <html>, escritos pelo servidor ou pela casca:
     data-theme="dark|light"   tema
     data-mode="alt"           modo alternativo (shell.md §2.8)
     data-module="<id>"        cor do módulo corrente em --module

   ORDEM DOS BLOCOS É CONTRATO. `:root[data-mode="alt"]` e
   `:root[data-theme="light"]` têm a mesma especificidade; o bloco light
   vem DEPOIS do alt escuro para vencer no claro+alt, e o claro+alt
   (especificidade maior) fecha. Todo token do alt escuro está também no
   bloco light — senão o valor do alt escuro vazaria para o claro+alt.
   `bun run audit:tema` mede os quatro: dark, light, alt/dark, alt/light.

   Ajustes contra o protótipo (só WCAG AA / gates do DS) estão anotados
   no próprio token com "AJUSTE".
   ═══════════════════════════════════════════════════════════════════ */

/* dark */
:root {
  --font-sans: -apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", "Helvetica Neue", Helvetica, sans-serif;
  --font-mono: ui-monospace, "SF Mono", SFMono-Regular, Menlo, "IBM Plex Mono", Consolas, monospace;

  --color-background:           #121212;
  --color-chrome:               #0C0C0C;
  --color-card:                 #1B1B1B;
  --color-popover:              #1B1B1B;
  --color-surface-1:            #171717;
  --color-surface-2:            #252525;
  --color-surface-3:            #2F2F2F;
  --color-foreground:           #F5F5F5;
  --color-foreground-secondary: #E6E6E6;
  --color-muted-foreground:     #D0D0D0;
  --color-foreground-subtle:    #D0D0D0;
  --color-placeholder:          #D0D0D0;

  /* accent-ink verde: interação e ênfase, nunca texto de leitura. */
  --color-primary:              #86D17A;
  --color-primary-foreground:   #121212;
  --color-primary-hover:        #A3DD99;
  /* AJUSTE (apertado.test): #2A2A2A media ΔE 1,58 contra surface-2 —
     apertar a peça não mudava nada. 8 % de accent-ink no mesmo L*. */
  --color-primary-wash:         #242824;
  --color-link:                 #86D17A;
  --color-ring:                 #86D17A;
  --color-chart-accent:         #86D17A;

  /* AJUSTE (apertado.test): #3A3A3A/#464646 medem ΔE 3,97 — o mesmo
     conserto que o DS já fez na paleta grafite (#3E3E3E/#4D4D4D). */
  --color-action:               #3E3E3E;
  --color-action-foreground:    #F5F5F5;
  --color-action-hover:         #4D4D4D;

  --color-destructive:          #FF8A80;
  --color-destructive-foreground: #121212;
  --color-destructive-wash:     #3A1F1D;
  --color-success:              #5ED39A;
  --color-warning:              #EBC24F;
  --color-warning-wash:         #332B14;
  --color-info:                 #7AA7FF;
  --color-transition:           #B596FF;

  --color-border:               #262626;
  --color-border-strong:        #333333;
  --color-input:                #767676;
  --color-input-background:     #1B1B1B;

  /* teal: marca do Cockpit (ícone do hub, Control Center, Billing). */
  --color-brand:                #3FD1B9;

  /* Cor de módulo = cor do ícone no hub (shell.md §2.13). As que
     coincidem com uma intenção do DS apontam para ela, e um tenant que
     muda a intenção muda o módulo junto. */
  --color-module-control-center:  var(--color-brand);
  --color-module-facilities:      var(--color-warning);
  --color-module-computing:       var(--color-info);
  --color-module-docker:          var(--color-info);
  --color-module-aicards:         var(--color-info);
  --color-module-security:        #F29BC4;
  --color-module-storage:         var(--color-success);
  --color-module-backup:          var(--color-success);
  --color-module-networking:      #8FD3FF;
  --color-module-brain:           #6FD0E8;
  --color-module-vcode:           var(--color-transition);
  --color-module-iam:             var(--color-destructive);
  --color-module-appsplace:       #F2A065;
  --color-module-billing:         var(--color-brand);
  --color-module-vbox-builder:    #55FCFF;
  --color-module-package-manager: #F2A065;

  /* Locais do Cockpit: terminal, bolha do chat, gravação. */
  --color-term-bg:              #050805;
  --color-term-bg-2:            #0B120C;
  --color-term-fg:              #33FF66;
  --color-term-cmd:             #D8FFE0;
  --color-term-dim:             #4FA866;
  --color-term-line:            #2E8A47;
  --color-bubble:               #2B2B2B;
  --color-on-bubble:            #F1F1F1;
  --color-rec:                  #FF6B5E;

  --shadow-subtle:  0 1px 2px rgba(0,0,0,.4);
  --shadow-raised:  0 12px 30px -10px rgba(0,0,0,.6), 0 2px 6px rgba(0,0,0,.3);
  --shadow-overlay: 0 30px 80px -20px rgba(0,0,0,.75), 0 4px 14px rgba(0,0,0,.35);

  /* Raios do protótipo: 8 controles, 12–14 tiles, 16–18 cards, 22 chat. */
  --radius-sm: 0.375rem;
  --radius-md: 0.5rem;
  --radius-lg: 0.875rem;
  --radius-xl: 1.125rem;

  --module: var(--color-module-control-center);
}

/* Cor do módulo corrente. A casca escreve data-module no <html>. */
:root[data-module="control-center"]  { --module: var(--color-module-control-center); }
:root[data-module="facilities"]      { --module: var(--color-module-facilities); }
:root[data-module="computing"]       { --module: var(--color-module-computing); }
:root[data-module="docker"]          { --module: var(--color-module-docker); }
:root[data-module="aicards"]         { --module: var(--color-module-aicards); }
:root[data-module="security"]        { --module: var(--color-module-security); }
:root[data-module="storage"]         { --module: var(--color-module-storage); }
:root[data-module="backup"]          { --module: var(--color-module-backup); }
:root[data-module="networking"]      { --module: var(--color-module-networking); }
:root[data-module="brain"]           { --module: var(--color-module-brain); }
:root[data-module="vcode"]           { --module: var(--color-module-vcode); }
:root[data-module="iam"]             { --module: var(--color-module-iam); }
:root[data-module="appsplace"]       { --module: var(--color-module-appsplace); }
:root[data-module="billing"]         { --module: var(--color-module-billing); }
:root[data-module="vbox-builder"]    { --module: var(--color-module-vbox-builder); }
:root[data-module="package-manager"] { --module: var(--color-module-package-manager); }

/* dark · modo alternativo (paleta 'lr'): passos maiores, linhas fortes,
   contorno de 1 px no lugar da sombra suave. */
:root[data-mode="alt"] {
  --color-background:           #161616;
  --color-chrome:               #090909;
  --color-card:                 #232323;
  --color-popover:              #232323;
  --color-input-background:     #232323;
  --color-surface-1:            #1C1C1C;
  --color-surface-2:            #303030;
  --color-surface-3:            #3D3D3D;
  --color-border:               #3A3A3A;
  --color-input:                #8C8C8C;
  --color-primary:              #9BDC8F;
  --color-primary-hover:        #B5E6AC;
  --color-link:                 #9BDC8F;
  --color-ring:                 #9BDC8F;
  --color-chart-accent:         #9BDC8F;
  /* AJUSTE (G10): #333333 media ΔE 0,96 contra surface-2 #303030. */
  --color-primary-wash:         #333733;
  /* AJUSTE (apertado.test): no alt a surface-3 sobe para #3D3D3D e
     encostava no botão (#3E3E3E, ΔE 0,98). Um passo acima. */
  --color-action:               #4D4D4D;
  --color-action-hover:         #5C5C5C;
  /* Não existe no protótipo; o padrão compunha #373737, ΔE 2,13 contra
     surface-2 (G10). */
  --color-skeleton:             #3E3E3E;
  --color-bubble:               #333333;
  --color-on-bubble:            #F5F5F5;
  --shadow-subtle:  0 0 0 1px rgba(255,255,255,.07);
  --shadow-raised:  0 0 0 1px rgba(255,255,255,.09), 0 10px 24px -8px rgba(0,0,0,.7);
  --shadow-overlay: 0 0 0 1px rgba(255,255,255,.1), 0 24px 60px -16px rgba(0,0,0,.8);
}

/* light */
:root[data-theme="light"] {
  --color-background:           #EBEBEB;
  --color-chrome:               #DCDCDC;
  --color-card:                 #FFFFFF;
  --color-popover:              #FFFFFF;
  --color-surface-1:            #F5F5F5;
  --color-surface-2:            #E4E4E4;
  --color-surface-3:            #D4D4D4;
  --color-foreground:           #111111;
  --color-foreground-secondary: #1E1E1E;
  --color-muted-foreground:     #333333;
  --color-foreground-subtle:    #333333;
  --color-placeholder:          #333333;

  /* AJUSTE (contraste.spec, axe no navegador): o DS desenha `primary`
     como TEXTO em chip, badge e aba — sobre o próprio wash e sobre o
     chrome. #2B7A3E media 4,45:1 sobre o wash e 3,97:1 (link) sobre o
     chrome #DCDCDC. #276E38 passa nos dois. */
  --color-primary:              #276E38;
  --color-primary-foreground:   #FFFFFF;
  --color-primary-hover:        #1E5A2D;
  /* AJUSTE (G10 e apertado.test): #E2E2E2 media ΔE 0,44 contra
     surface-2 — o chip aplicado sumia sobre o gatilho. Nenhum cinza fica
     a ΔE 4 de todas as superfícies; #E6EDE8 é o cinza do protótipo com
     um toque do accent-ink, e o link ainda mede 4,5:1 sobre ele. */
  --color-primary-wash:         #E6EDE8;
  --color-link:                 #276E38;
  --color-ring:                 #276E38;
  --color-chart-accent:         #276E38;

  --color-action:               #2E2E2E;
  --color-action-foreground:    #FFFFFF;
  --color-action-hover:         #3B3B3B;

  --color-destructive:          #B42318;
  --color-destructive-foreground: #FFFFFF;
  --color-destructive-wash:     #FDECEA;
  --color-success:              #11734A;
  /* AJUSTE (G1): #8A6400 media 4,23:1 sobre surface-2 — o mesmo
     conserto que o DS já fez na paleta grafite. */
  --color-warning:              #855F00;
  --color-warning-wash:         #FBF3DC;
  --color-info:                 #2F5BD3;
  --color-transition:           #6B3FC9;

  --color-border:               #D2D2D2;
  --color-border-strong:        #D0D0D0;
  --color-input:                #6E6E6E;
  --color-input-background:     #FFFFFF;
  /* Não existe no protótipo; #DADADA media ΔE 2,24 contra surface-2 (G10). */
  --color-skeleton:             #D2D2D2;

  /* AJUSTE (G12): no claro a cor do módulo é TEXTO — o nome no cabeçalho
     (16 px/600) e o selo BETA (10 px/700 sobre 16 % da própria cor),
     sobre chrome #DCDCDC (#D9D9D9 no alt). Os tons do protótipo mediam
     3,5–4,8:1 ali e 2,8–3,8:1 no selo. Cada um foi escurecido no próprio
     matiz até o selo passar 4,5:1 no chrome do alt, o pior dos dois;
     um valor só serve aos dois modos. As intenções (warning, info, …)
     ficam como estão: elas não são desenhadas sobre o chrome.
     Protótipo → aqui: brand #0E6E66 → #0B5A54 · warn #8A6400 → #694B00 ·
     blue #2F5BD3 → #2649AA · pink #B03A7A → #882D5F · success #11734A →
     #0E5C3B · sky #1A73B8 → #135385 · cyan #0C6F8C → #09576E · violet
     #6B3FC9 → #5D36AE · danger #B42318 → #981E14 · orange #B25A12 →
     #7C3F0D · builder #006B6B → #005A5A. */
  --color-brand:                #0B5A54;

  --color-module-facilities:      #694B00;
  --color-module-computing:       #2649AA;
  --color-module-docker:          #2649AA;
  --color-module-aicards:         #2649AA;
  --color-module-security:        #882D5F;
  --color-module-storage:         #0E5C3B;
  --color-module-backup:          #0E5C3B;
  --color-module-networking:      #135385;
  --color-module-brain:           #09576E;
  --color-module-vcode:           #5D36AE;
  --color-module-iam:             #981E14;
  --color-module-appsplace:       #7C3F0D;
  --color-module-vbox-builder:    #005A5A;
  --color-module-package-manager: #7C3F0D;

  --color-term-bg:              #FFFFFF;
  --color-term-bg-2:            #F3F3F3;
  --color-term-fg:              #141414;
  --color-term-cmd:             #000000;
  --color-term-dim:             #595959;
  --color-term-line:            #8A8A8A;
  --color-bubble:               #DEDEDE;
  --color-on-bubble:            #1C1C1C;
  --color-rec:                  #C4271C;

  --shadow-subtle:  0 0 0 1px rgba(0,0,0,.06), 0 1px 2px rgba(0,0,0,.08);
  --shadow-raised:  0 10px 28px -10px rgba(0,0,0,.2), 0 2px 6px rgba(0,0,0,.06);
  --shadow-overlay: 0 28px 70px -18px rgba(0,0,0,.3), 0 4px 14px rgba(0,0,0,.08);
}

/* light · modo alternativo: a tinta de destaque vira neutra (#2A2A2A). */
:root[data-theme="light"][data-mode="alt"] {
  --color-background:           #ECECEC;
  --color-chrome:               #D9D9D9;
  --color-card:                 #FFFFFF;
  --color-popover:              #FFFFFF;
  --color-input-background:     #FFFFFF;
  --color-surface-1:            #F4F4F4;
  --color-surface-2:            #E2E2E2;
  --color-surface-3:            #CFCFCF;
  --color-border:               #C9C9C9;
  --color-input:                #6A6A6A;
  --color-primary:              #2A2A2A;
  --color-primary-hover:        #000000;
  --color-link:                 #2A2A2A;
  --color-ring:                 #2A2A2A;
  --color-chart-accent:         #2A2A2A;
  /* AJUSTE (G10): #E0E0E0 media ΔE 0,44 contra surface-2. */
  --color-primary-wash:         #D6DCD8;
  --color-skeleton:             #D0D0D0;
  /* AJUSTE (G1): o claro já usa #855F00, que mede 4,46:1 sobre #E2E2E2. */
  --color-warning:              #845E00;
  --color-action:               #2A2A2A;
  --color-action-hover:         #3A3A3A;
  --color-bubble:               #DADADA;
  --color-on-bubble:            #111111;
  --shadow-subtle:  0 0 0 1px rgba(0,0,0,.08);
  --shadow-raised:  0 0 0 1px rgba(0,0,0,.1), 0 8px 20px -8px rgba(0,0,0,.2);
  --shadow-overlay: 0 0 0 1px rgba(0,0,0,.12), 0 20px 50px -14px rgba(0,0,0,.25);
}
