/**
 * ==============================================================================
 * PHM TECH — DESIGN TOKENS OFICIAIS (PALETA & VARIÁVEIS GLOBAIS)
 * Padrão Arquitetural de Engenharia de Software: Separação de Design Tokens
 * 
 * Este arquivo define EXCLUSIVAMENTE variáveis CSS (:root) e tokens de design.
 * Não contém seletores de layout, garantindo 0% de acoplamento e 0% de risco
 * de conflito ao ser compartilhado por todos os sistemas do ecossistema.
 * ==============================================================================
 */

@import url('https://fonts.googleapis.com/css2?family=JetBrains+Mono:ital,wght@0,400;0,500;0,600;0,700;1,400&family=Newsreader:ital,opsz,wght@0,6..72,400;0,6..72,500;0,6..72,600;0,6..72,700;1,6..72,400&family=Plus+Jakarta+Sans:ital,wght@0,400;0,500;0,600;0,700;0,800;1,400&display=swap');

/* ==========================================================================
   1. MODO CLARO (PADRÃO / LIGHT THEME)
   ========================================================================== */
:root, [data-theme="light"] {
  /* Paleta Institucional */
  --navy:              #0b1e3d;
  --navy-deep:         #081426;
  --blue:              #123b72;
  --blue-light:        #1a529a;
  --teal:              #0d9488;
  --teal-light:        #2dd4bf;
  --teal-soft:         #f0fdfa;
  --gold:              #d4a853;
  --gold-light:        #e6bc6a;
  
  /* Superfícies e Fundos */
  --bg:                #f8fafc;
  --surface:           #ffffff;
  --surface-soft:      #f1f5f9;
  --surface-muted:     #e2e8f0;
  
  /* Textos e Contraste */
  --text:              #1e293b;
  --text-soft:         #334155;
  --text-muted:        #64748b;
  --text-light:        #94a3b8;
  --text-inverse:      #ffffff;

  /* Bordas e Linhas */
  --line:              #e2e8f0;
  --line-strong:       #cbd5e1;
  --line-focus:        #0d9488;

  /* Tipografia Canônica ("Nossa Patente") */
  --font-serif:        'Newsreader', Georgia, serif;
  --font-sans:         'Plus Jakarta Sans', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  --font-heading:      var(--font-serif);
  --font-body:         var(--font-sans);
  --font-mono:         'JetBrains Mono', 'Fira Code', monospace;

  /* Geometria Rigorosa (4px / 6px / 2px - Zero Pills, Zero Circles) */
  --container-max:     1360px;
  --radius-micro:      2px;
  --radius-sm:         4px;
  --radius-md:         4px;
  --radius-lg:         6px;
  --radius-control:    4px;
  --radius-card:       6px;
  --radius-pill:       4px;

  /* Sombras */
  --shadow-xs:         0 1px 3px rgba(11, 30, 61, 0.05);
  --shadow-sm:         0 2px 8px rgba(11, 30, 61, 0.06);
  --shadow-md:         0 6px 18px rgba(11, 30, 61, 0.08);
  --shadow-lg:         0 12px 32px rgba(11, 30, 61, 0.10);
  
  /* Transições Suaves */
  --transition:        all 0.2s ease-in-out;

  /* Aliases Prefixados (Padrão Design System Robusto) */
  --phm-navy:          var(--navy);
  --phm-blue:          var(--blue);
  --phm-teal:          var(--teal);
  --phm-gold:          var(--gold);
  --phm-bg:            var(--bg);
  --phm-surface:       var(--surface);
  --phm-text:          var(--text);
  --phm-line:          var(--line);
}

/* ==========================================================================
   2. MODO SÉPIA (LEITURA CONFORTÁVEL / PAPEL & ÂMBAR)
   ========================================================================== */
[data-theme="sepia"] {
  --navy:              #3c2817;
  --navy-deep:         #2b1b0d;
  --blue:              #78401a;
  --blue-light:        #9a5223;
  --teal:              #b45309;
  --teal-light:        #d97706;
  --teal-soft:         #fcf5e5;
  --gold:              #c28422;
  --gold-light:        #dfa23a;
  
  --bg:                #f5eee1;
  --surface:           #fbf7ee;
  --surface-soft:      #eae1cf;
  --surface-muted:     #ded2bd;
  
  --text:              #2e2116;
  --text-soft:         #463425;
  --text-muted:        #75604e;
  --text-light:        #9e8773;
  --text-inverse:      #ffffff;

  --line:              #dfd4bf;
  --line-strong:       #cfc0a6;
  --line-focus:        #b45309;

  --shadow-xs:         0 1px 3px rgba(60, 40, 23, 0.05);
  --shadow-sm:         0 2px 8px rgba(60, 40, 23, 0.06);
  --shadow-md:         0 6px 18px rgba(60, 40, 23, 0.08);
  --shadow-lg:         0 12px 32px rgba(60, 40, 23, 0.10);
}

/* ==========================================================================
   3. MODO ESCURO (NOTURNO / DEEP NAVY INSTITUCIONAL)
   ========================================================================== */
[data-theme="dark"] {
  --navy:              #f8fafc;
  --navy-deep:         #ffffff;
  --blue:              #38bdf8;
  --blue-light:        #7dd3fc;
  --teal:              #2dd4bf;
  --teal-light:        #5eead4;
  --teal-soft:         #111c3a;
  --gold:              #fbbf24;
  --gold-light:        #fde68a;
  
  --bg:                #060b17;
  --surface:           #0b1329;
  --surface-soft:      #111c3a;
  --surface-muted:     #1a2a54;
  
  --text:              #f8fafc;
  --text-soft:         #cbd5e1;
  --text-muted:        #94a3b8;
  --text-light:        #64748b;
  --text-inverse:      #060b17;

  --line:              #1e2e5c;
  --line-strong:       #2a3e75;
  --line-focus:        #38bdf8;

  --shadow-xs:         0 1px 3px rgba(0, 0, 0, 0.35);
  --shadow-sm:         0 2px 8px rgba(0, 0, 0, 0.45);
  --shadow-md:         0 6px 18px rgba(0, 0, 0, 0.55);
  --shadow-lg:         0 12px 32px rgba(0, 0, 0, 0.65);
}

/* ==========================================================================
   4. ACESSIBILIDADE DE TIPOGRAFIA (ESCALA DE TAMANHO DE FONTE)
   ========================================================================== */
html[data-font-size="sm"] {
  font-size: 14.5px !important;
}

html[data-font-size="normal"],
html:not([data-font-size]) {
  font-size: 16px;
}

html[data-font-size="lg"] {
  font-size: 17.5px !important;
}

html[data-font-size="xl"] {
  font-size: 19px !important;
}