/* =========================================================================
   temas.css — os 6 padrões estéticos
   -------------------------------------------------------------------------
   CONTRATO: nenhum componente conhece cor. Todo componente lê apenas os
   tokens semânticos abaixo. Um tema é só um bloco [data-tema] que
   reatribui os MESMOS tokens. Zero duplicação de regra de componente.

   Tokens do contrato:
     --fundo --superficie --superficie-2 --borda --borda-forte
     --tinta --tinta-fraca --tinta-inversa
     --acento --acento-tinta --acento-2
     --topo-fundo --topo-tinta --sombra-topo
     --ok --atencao --perigo --critico --foco
     --sombra --bisel --grad-topo --grad-titulo --textura
     --raio (estrutural, mas alguns temas o sobrescrevem)
   ========================================================================= */

/* ---------- 1. VALE — VERDE INSTITUCIONAL (padrão) ----------
   Cor-mãe: Verde-Vale #007E7A · RGB 0,126,122 · CMYK 100,10,55,10
   Toda a escala é derivada dessa cor: escurecimentos para topo e contorno,
   dessaturações claras para fundo e superfície secundária.
   Amarelo/âmbar aparece só como semáforo de atenção — nunca como identidade. */
:root,
[data-tema="vale-verde"],
[data-tema="vale-safety"] {          /* alias: preferências antigas seguem válidas */
  --fundo:          #F2F7F6;   /* verde-vale a 4% sobre branco */
  --superficie:     #FFFFFF;
  --superficie-2:   #E3EFEE;   /* verde-vale a 12% */
  --borda:          #BCD6D4;
  --borda-forte:    #005C59;

  --tinta:          #103331;   /* quase-preto esverdeado, não preto puro */
  --tinta-fraca:    #55807D;
  --tinta-inversa:  #FFFFFF;

  --acento:         #007E7A;   /* Verde-Vale */
  --acento-tinta:   #FFFFFF;   /* contraste 5.3:1 — AA para texto normal */
  --acento-2:       #00A9A2;

  --topo-fundo:     #005C59;   /* Verde-Vale escurecido p/ a barra superior */
  --topo-tinta:     #FFFFFF;
  --sombra-topo:    0 2px 0 rgba(0,68,65,.30);

  --ok:             #0E8A5F;
  --atencao:        #C98A00;
  --perigo:         #D2601A;
  --critico:        #B3261E;
  --foco:           #00A9A2;

  --sombra:         0 1px 2px rgba(0,68,65,.10), 0 4px 12px rgba(0,68,65,.07);
  --bisel:          none;
  --grad-topo:      linear-gradient(180deg,#00706C 0%,#005C59 100%);
  --grad-titulo:    none;
  --textura:        none;
}

/* ---------- 2. WINDOWS XP · Luna ---------- */
[data-tema="windows-xp"] {
  --fundo:          #ECE9D8;
  --superficie:     #FFFFFF;
  --superficie-2:   #ECE9D8;
  --borda:          #ACA899;
  --borda-forte:    #003C74;
  --tinta:          #000000;
  --tinta-fraca:    #4A4A45;
  --tinta-inversa:  #FFFFFF;

  --acento:         #245EDC;
  --acento-tinta:   #FFFFFF;
  --acento-2:       #3C9A1E;

  --topo-fundo:     #0A5AC8;
  --topo-tinta:     #FFFFFF;
  --sombra-topo:    inset 0 -2px 0 rgba(255,255,255,.35);

  --ok:             #3C9A1E;
  --atencao:        #E8A200;
  --perigo:         #D24726;
  --critico:        #A8140F;
  --foco:           #FFB700;

  --sombra:         1px 1px 0 rgba(0,0,0,.20);
  /* bisel clássico: luz em cima/esquerda, sombra embaixo/direita */
  --bisel:          inset 1px 1px 0 rgba(255,255,255,.85),
                    inset -1px -1px 0 rgba(0,0,0,.28);
  --grad-topo:      linear-gradient(180deg,#3F92E8 0%,#1C64D6 8%,#0A57C6 40%,#0A55C2 88%,#2C7BE0 100%);
  --grad-titulo:    linear-gradient(180deg,#3F92E8 0%,#1554C8 55%,#0A47AE 100%);
  --textura:        none;

  --raio: 3px;
  --raio-p: 2px;
  --fonte-ui: Tahoma, "Segoe UI", Verdana, sans-serif;
}

/* ---------- 3. AMAZON TECH ---------- */
[data-tema="amazon-tech"] {
  --fundo:          #071A14;
  --superficie:     #0E2A21;
  --superficie-2:   #123328;
  --borda:          #1F5140;
  --borda-forte:    #34E0C0;
  --tinta:          #E4F5EE;
  --tinta-fraca:    #8FBCAC;
  --tinta-inversa:  #05130E;

  --acento:         #00E5C0;
  --acento-tinta:   #052018;
  --acento-2:       #4CE08A;

  --topo-fundo:     #05130E;
  --topo-tinta:     #DFF7EE;
  --sombra-topo:    0 0 24px rgba(0,229,192,.16);

  --ok:             #4CE08A;
  --atencao:        #F5C542;
  --perigo:         #FF8A3D;
  --critico:        #FF5470;
  --foco:           #00E5C0;

  --sombra:         0 0 0 1px rgba(0,229,192,.10), 0 8px 24px rgba(0,0,0,.55);
  --bisel:          none;
  --grad-topo:      linear-gradient(120deg,#05130E 0%,#0B2A20 100%);
  --grad-titulo:    linear-gradient(90deg,#0E2A21,#123328);
  --textura:        radial-gradient(circle at 18% 0%, rgba(0,229,192,.07), transparent 55%);
}

/* ---------- 4. IRON ORE ---------- */
[data-tema="iron-ore"] {
  --fundo:          #EDE9E4;
  --superficie:     #FBF8F5;
  --superficie-2:   #DED6CD;
  --borda:          #B3A395;
  --borda-forte:    #6E3B1F;
  --tinta:          #2B211A;
  --tinta-fraca:    #6E6157;
  --tinta-inversa:  #FBF8F5;

  --acento:         #A8431A;
  --acento-tinta:   #FFF4EC;
  --acento-2:       #8A9199;

  --topo-fundo:     #3A2A20;
  --topo-tinta:     #F4E6DA;
  --sombra-topo:    0 2px 0 rgba(110,59,31,.45);

  --ok:             #55703B;
  --atencao:        #C4831C;
  --perigo:         #A8431A;
  --critico:        #7B1D12;
  --foco:           #C4831C;

  --sombra:         0 1px 3px rgba(74,45,28,.22);
  --bisel:          inset 0 1px 0 rgba(255,255,255,.5);
  --grad-topo:      linear-gradient(180deg,#4A362A,#2E211A);
  --grad-titulo:    linear-gradient(180deg,#B8501F,#8E3712);
  --textura:        repeating-linear-gradient(135deg, rgba(168,67,26,.035) 0 2px, transparent 2px 7px);
}

/* ---------- 5. MINIMAL BLUEPRINT ---------- */
[data-tema="blueprint"] {
  --fundo:          #F7F9FB;
  --superficie:     #FFFFFF;
  --superficie-2:   #EDF3F8;
  --borda:          #B9CDDE;
  --borda-forte:    #0B4F86;
  --tinta:          #10344F;
  --tinta-fraca:    #5C7B92;
  --tinta-inversa:  #FFFFFF;

  --acento:         #0B6FB8;
  --acento-tinta:   #FFFFFF;
  --acento-2:       #00A3B4;

  --topo-fundo:     #0B4F86;
  --topo-tinta:     #FFFFFF;
  --sombra-topo:    none;

  --ok:             #128C6B;
  --atencao:        #C98A00;
  --perigo:         #D2601A;
  --critico:        #B3261E;
  --foco:           #00A3B4;

  --sombra:         none;
  --bisel:          none;
  --grad-topo:      none;
  --grad-titulo:    none;
  /* malha milimetrada de prancheta técnica */
  --textura:        linear-gradient(rgba(11,111,184,.055) 1px, transparent 1px) 0 0 / 100% 22px,
                    linear-gradient(90deg, rgba(11,111,184,.055) 1px, transparent 1px) 0 0 / 22px 100%;
  --raio: 2px;
  --raio-p: 0px;
}

/* ---------- 6. CAMPO NOTURNO (turno C / alta luminância) ----------
   Alto contraste sobre preto, mantendo a família verde-ciano da marca
   em vez do par preto/amarelo. */
[data-tema="campo-noturno"] {
  --fundo:          #000000;
  --superficie:     #0E1514;
  --superficie-2:   #16211F;
  --borda:          #35514E;
  --borda-forte:    #00E0D6;
  --tinta:          #FFFFFF;
  --tinta-fraca:    #A9C4C1;
  --tinta-inversa:  #00201E;

  --acento:         #00E0D6;
  --acento-tinta:   #00201E;
  --acento-2:       #5BE8B0;

  --topo-fundo:     #000000;
  --topo-tinta:     #00E0D6;
  --sombra-topo:    none;

  --ok:             #5BE86B;
  --atencao:        #FFC24D;
  --perigo:         #FF9F1C;
  --critico:        #FF5C5C;
  --foco:           #00E0D6;

  --sombra:         none;
  --bisel:          none;
  --grad-topo:      none;
  --grad-titulo:    none;
  --textura:        none;
}