/* ============================================================
   Portal de Cliente — Sistema de Temas
   5 aparências × 2 variantes = 10 conjuntos de variáveis CSS
   Especificidade: html.theme-* (0,1,1) > :root (0,1,0)
   ============================================================ */

/* ----------------------------------------------------------
   PADRÃO — Claro
   Clean e neutro. Interface branca, tipografia escura.
   ---------------------------------------------------------- */
html.theme-padrao-claro {
  --primary:       #3b82f6;
  --primary-dark:  #2563eb;
  --primary-light: #93c5fd;
  --bg:            #f8fafc;
  --surface:       #ffffff;
  --border:        #e2e8f0;
  --text:          #1e293b;
  --text-muted:    #64748b;
  --success:       #22c55e;
  --warning:       #f59e0b;
  --danger:        #ef4444;
  --radius:        8px;
  --shadow:        0 1px 3px rgba(0,0,0,.08), 0 1px 2px rgba(0,0,0,.04);
  --shadow-md:     0 4px 6px rgba(0,0,0,.07), 0 2px 4px rgba(0,0,0,.04);
}

/* ----------------------------------------------------------
   PADRÃO — Escuro
   Versão escura do Padrão. Fundo cinza escuro, textos claros.
   ---------------------------------------------------------- */
html.theme-padrao-escuro {
  --primary:       #60a5fa;
  --primary-dark:  #3b82f6;
  --primary-light: #bfdbfe;
  --bg:            #0f172a;
  --surface:       #1e293b;
  --border:        #334155;
  --text:          #f1f5f9;
  --text-muted:    #94a3b8;
  --success:       #4ade80;
  --warning:       #fbbf24;
  --danger:        #f87171;
  --radius:        8px;
  --shadow:        0 1px 3px rgba(0,0,0,.3),  0 1px 2px rgba(0,0,0,.2);
  --shadow-md:     0 4px 6px rgba(0,0,0,.4),  0 2px 4px rgba(0,0,0,.3);
}

/* ----------------------------------------------------------
   CORPORATIVO — Claro
   Azul profissional, cinzas frios, tipografia séria.
   ---------------------------------------------------------- */
html.theme-corporativo-claro {
  --primary:       #1d4ed8;
  --primary-dark:  #1e3a8a;
  --primary-light: #bfdbfe;
  --bg:            #f0f4f8;
  --surface:       #ffffff;
  --border:        #c7d4e4;
  --text:          #0f172a;
  --text-muted:    #4b6280;
  --success:       #16a34a;
  --warning:       #d97706;
  --danger:        #dc2626;
  --radius:        6px;
  --shadow:        0 1px 3px rgba(0,0,0,.10), 0 1px 2px rgba(0,0,0,.06);
  --shadow-md:     0 4px 6px rgba(0,0,0,.08), 0 2px 4px rgba(0,0,0,.05);
}

/* ----------------------------------------------------------
   CORPORATIVO — Escuro
   Navy blue profundo, detalhes em azul claro.
   ---------------------------------------------------------- */
html.theme-corporativo-escuro {
  --primary:       #3b82f6;
  --primary-dark:  #2563eb;
  --primary-light: #93c5fd;
  --bg:            #0a1628;
  --surface:       #0f2040;
  --border:        #1e3a5f;
  --text:          #e2e8f0;
  --text-muted:    #8fa3b8;
  --success:       #4ade80;
  --warning:       #fbbf24;
  --danger:        #f87171;
  --radius:        6px;
  --shadow:        0 1px 3px rgba(0,0,0,.4),  0 1px 2px rgba(0,0,0,.3);
  --shadow-md:     0 4px 6px rgba(0,0,0,.5),  0 2px 4px rgba(0,0,0,.4);
}

/* ----------------------------------------------------------
   SUAVE — Claro
   Tons pastel (lilás, rosa, bege), cantos arredondados.
   ---------------------------------------------------------- */
html.theme-suave-claro {
  --primary:       #a78bfa;
  --primary-dark:  #7c3aed;
  --primary-light: #ede9fe;
  --bg:            #faf5ff;
  --surface:       #ffffff;
  --border:        #e9d5ff;
  --text:          #1e1b4b;
  --text-muted:    #7b6f9a;
  --success:       #34d399;
  --warning:       #fbbf24;
  --danger:        #f87171;
  --radius:        14px;
  --shadow:        0 1px 4px rgba(167,139,250,.18), 0 1px 2px rgba(0,0,0,.04);
  --shadow-md:     0 4px 14px rgba(167,139,250,.22), 0 2px 4px rgba(0,0,0,.04);
}

/* ----------------------------------------------------------
   SUAVE — Escuro
   Tons escuros de lilás e cinza rosado.
   ---------------------------------------------------------- */
html.theme-suave-escuro {
  --primary:       #c4b5fd;
  --primary-dark:  #a78bfa;
  --primary-light: #6d28d9;
  --bg:            #1a0f2e;
  --surface:       #2d1b4e;
  --border:        #4a2d7a;
  --text:          #f5f3ff;
  --text-muted:    #a78bfa;
  --success:       #34d399;
  --warning:       #fbbf24;
  --danger:        #f87171;
  --radius:        14px;
  --shadow:        0 1px 4px rgba(0,0,0,.5), 0 1px 2px rgba(167,139,250,.1);
  --shadow-md:     0 4px 14px rgba(0,0,0,.6), 0 2px 4px rgba(167,139,250,.15);
}

/* ----------------------------------------------------------
   FUTURISTA — Claro
   Fundo branco frio, detalhes em ciano e violeta.
   ---------------------------------------------------------- */
html.theme-futurista-claro {
  --primary:       #06b6d4;
  --primary-dark:  #0891b2;
  --primary-light: #67e8f9;
  --bg:            #f0fdfe;
  --surface:       #ffffff;
  --border:        #a5f3fc;
  --text:          #083344;
  --text-muted:    #0e7490;
  --success:       #10b981;
  --warning:       #f59e0b;
  --danger:        #ef4444;
  --radius:        4px;
  --shadow:        0 1px 3px rgba(6,182,212,.18), 0 1px 2px rgba(0,0,0,.04);
  --shadow-md:     0 4px 10px rgba(6,182,212,.22), 0 2px 4px rgba(0,0,0,.06);
}

/* ----------------------------------------------------------
   FUTURISTA — Escuro
   Fundo quase preto, detalhes neon vibrantes com glow.
   ---------------------------------------------------------- */
html.theme-futurista-escuro {
  --primary:       #22d3ee;
  --primary-dark:  #06b6d4;
  --primary-light: #a5f3fc;
  --bg:            #020817;
  --surface:       #0d1117;
  --border:        #1e3a3a;
  --text:          #e2f8fb;
  --text-muted:    #4dd8e8;
  --success:       #34d399;
  --warning:       #fbbf24;
  --danger:        #f87171;
  --radius:        4px;
  --shadow:        0 0 8px rgba(34,211,238,.2),  0 1px 3px rgba(0,0,0,.5);
  --shadow-md:     0 0 18px rgba(34,211,238,.28), 0 4px 6px rgba(0,0,0,.6);
}

/* ----------------------------------------------------------
   NATUREZA — Claro
   Verde musgo, bege, terracota. Orgânico e sereno.
   ---------------------------------------------------------- */
html.theme-natureza-claro {
  --primary:       #4d7c0f;
  --primary-dark:  #3f6212;
  --primary-light: #a3e635;
  --bg:            #f7f8f2;
  --surface:       #fafbf5;
  --border:        #c8d8a0;
  --text:          #1c2b0a;
  --text-muted:    #6b7a5a;
  --success:       #22c55e;
  --warning:       #f59e0b;
  --danger:        #ef4444;
  --radius:        10px;
  --shadow:        0 1px 3px rgba(77,124,15,.14), 0 1px 2px rgba(0,0,0,.04);
  --shadow-md:     0 4px 6px rgba(77,124,15,.12), 0 2px 4px rgba(0,0,0,.04);
}

/* ----------------------------------------------------------
   NATUREZA — Escuro
   Verde escuro profundo, detalhes em verde sage.
   ---------------------------------------------------------- */
html.theme-natureza-escuro {
  --primary:       #84cc16;
  --primary-dark:  #65a30d;
  --primary-light: #bef264;
  --bg:            #0d1a0d;
  --surface:       #162616;
  --border:        #1e3b1e;
  --text:          #e8f5e2;
  --text-muted:    #8ea67a;
  --success:       #4ade80;
  --warning:       #fbbf24;
  --danger:        #f87171;
  --radius:        10px;
  --shadow:        0 1px 3px rgba(0,0,0,.4),  0 1px 2px rgba(0,0,0,.3);
  --shadow-md:     0 4px 6px rgba(0,0,0,.5),  0 2px 4px rgba(0,0,0,.4);
}