/* ============================================================
   LK3 CURSOS — DESIGN TOKENS
   Fonte da verdade de cores, tipografia, espaçamento e raios.
   Baseado no Manual da Marca LK3 Cursos.
   Para trocar a paleta ativa do site inteiro, veja:
   assets/js/theme-config.js  (ou use o Painel de Temas: admin-temas.html)
   ============================================================ */

:root{
  /* ---- Cores oficiais da marca (não alterar) ---- */
  --lk3-azul:          #1D1F3F; /* Azul LK3 */
  --lk3-dourado:       #B49858; /* Dourado LK3 */
  --lk3-branco:        #FFFFFF;
  --lk3-cinza-claro:   #C3C0C0;
  --lk3-dourado-claro: #B29758;
  --lk3-azul-fosco:    #5C5F7C;
  --lk3-azul-petroleo: #404472;
  --lk3-azul-escuro:   #191C40;
  --lk3-indigo:        #4626CF;
  /* cor tática usada só no tema Black Friday (fora do manual, uso sazonal) */
  --bf-vermelho:       #B3271E;
  --bf-vermelho-claro: #D6402F;
  --bf-preto:          #0B0B0C;
  --bf-preto-suave:    #17171A;

  /* ---- Tipografia ---- */
  --font-heading: 'Montserrat', 'Aptos Display', Arial, sans-serif;
  --font-body: Arial, 'Aptos', Helvetica, sans-serif;

  --fs-xs:   0.8125rem;
  --fs-sm:   0.9375rem;
  --fs-base: 1rem;
  --fs-md:   1.125rem;
  --fs-lg:   1.375rem;
  --fs-xl:   1.75rem;
  --fs-2xl:  clamp(2rem, 1.6rem + 1.6vw, 2.75rem);
  --fs-3xl:  clamp(2.5rem, 1.9rem + 2.6vw, 3.75rem);

  --lh-tight: 1.15;
  --lh-normal: 1.55;

  /* ---- Espaçamento (escala 4px) ---- */
  --sp-2xs: 0.25rem;  /* 4px */
  --sp-xs:  0.5rem;   /* 8px */
  --sp-sm:  0.75rem;  /* 12px */
  --sp-md:  1rem;     /* 16px */
  --sp-lg:  1.5rem;   /* 24px */
  --sp-xl:  2rem;     /* 32px */
  --sp-2xl: 3rem;     /* 48px */
  --sp-3xl: 4rem;     /* 64px */
  --sp-4xl: 6rem;     /* 96px */

  /* ---- Raios ---- */
  --radius-sm: 6px;
  --radius-md: 12px;
  --radius-lg: 20px;
  --radius-full: 999px;

  /* ---- Sombras ---- */
  --shadow-sm: 0 2px 8px -2px rgba(16,18,40,.08);
  --shadow-md: 0 12px 32px -12px rgba(16,18,40,.18);
  --shadow-lg: 0 24px 60px -20px rgba(16,18,40,.28);

  /* ---- Layout ---- */
  --sidebar-w: 272px;
  --sidebar-w-collapsed: 88px;
  --container-max: 1180px;
  --transition: 200ms ease;
  --transition-slow: 420ms cubic-bezier(.16,.8,.24,1);
}

/* ==================================================================
   TEMA 1 — PRINCIPAL (padrão do manual da marca)
   Fundo branco / menu Azul LK3 / destaques Dourado LK3
   ================================================================== */
:root,
[data-theme="principal"]{
  --bg:            var(--lk3-branco);
  --bg-alt:        #FAFAF8;
  --surface:       #FFFFFF;
  --surface-alt:   #F4F2EE;
  --border:        #E8E6E1;

  --text:          #1B1B1F;
  --text-muted:    #62636F;
  --text-on-accent:#FFFFFF;

  --accent:        var(--lk3-dourado);
  --accent-hover:  var(--lk3-dourado-claro);
  --accent-strong: var(--lk3-azul);

  --sidebar-bg:      var(--lk3-azul);
  --sidebar-bg-alt:  #171834;
  --sidebar-text:    #FFFFFF;
  --sidebar-text-muted: #B7B8CC;
  --sidebar-active-bg: var(--lk3-dourado);
  --sidebar-active-text: var(--lk3-azul);
  --sidebar-border:  rgba(255,255,255,.10);

  --logo-sidebar: url('../img/logo-white.png');
  --hero-grad: linear-gradient(135deg, var(--lk3-azul) 0%, #262A55 60%, var(--lk3-azul) 100%);
}

/* ==================================================================
   TEMA 2 — MODO ESCURO ELEGANTE
   Fundo Azul Escuro / cards Azul Petróleo / destaques Dourado LK3
   ================================================================== */
[data-theme="escuro"]{
  --bg:            var(--lk3-azul-escuro);
  --bg-alt:        #14172F;
  --surface:       var(--lk3-azul-petroleo);
  --surface-alt:   #363A63;
  --border:        rgba(255,255,255,.10);

  --text:          #F4F4F8;
  --text-muted:    var(--lk3-cinza-claro);
  --text-on-accent:#1B1B1F;

  --accent:        var(--lk3-dourado);
  --accent-hover:  var(--lk3-dourado-claro);
  --accent-strong: #E7D3AA;

  --sidebar-bg:      #14172F;
  --sidebar-bg-alt:  #0E1024;
  --sidebar-text:    #FFFFFF;
  --sidebar-text-muted: #9498B8;
  --sidebar-active-bg: var(--lk3-dourado);
  --sidebar-active-text: var(--lk3-azul-escuro);
  --sidebar-border:  rgba(255,255,255,.08);

  --logo-sidebar: url('../img/logo-white.png');
  --hero-grad: linear-gradient(135deg, #14172F 0%, var(--lk3-azul-petroleo) 100%);
}

/* ==================================================================
   TEMA 3 — BLACK FRIDAY
   Preto + Dourado LK3, com vermelho tático em selos/urgência
   ================================================================== */
[data-theme="blackfriday"]{
  --bg:            var(--bf-preto);
  --bg-alt:        var(--bf-preto-suave);
  --surface:       var(--bf-preto-suave);
  --surface-alt:   #201F22;
  --border:        rgba(255,255,255,.10);

  --text:          #F5F1E8;
  --text-muted:    #B3AFA6;
  --text-on-accent:#0B0B0C;

  --accent:        var(--lk3-dourado);
  --accent-hover:  #C9AD6C;
  --accent-strong: var(--bf-vermelho);

  --sidebar-bg:      #000000;
  --sidebar-bg-alt:  #000000;
  --sidebar-text:    #F5F1E8;
  --sidebar-text-muted: #8C8880;
  --sidebar-active-bg: var(--lk3-dourado);
  --sidebar-active-text: #0B0B0C;
  --sidebar-border:  rgba(180,152,88,.25);

  --logo-sidebar: url('../img/logo-gold.png');
  --hero-grad: linear-gradient(135deg, #000000 0%, #221B0E 100%);
}