/* ==================================================================
   Aparências premium (sobre o modo escuro): Aurora e Ouro Real.
   Só aparecem e só funcionam para assinantes ativos e equipe (ThemeService). Cada uma tem uma voz
   própria na tipografia, não só outra cor: o Aurora abre os títulos na largura expandida da Archivo;
   o Ouro Real troca os títulos pela Bodoni Moda, com filetes dourados finos.
   ================================================================== */

/* ------------------------------ AURORA ------------------------------ */
/* Céu polar: azul-noite profundo, verde-água como luz principal, violeta só no reflexo. */
:root[data-theme="dark"][data-skin="aurora"] {
  --bg: #07131C;
  --bg-2: #0A1924;
  --surface: #0D1D29;
  --surface-2: #122735;
  --surface-3: #183242;
  --text: #DFEDEE;
  --text-soft: #B6CDD1;
  --muted: #8AA7AE;
  --border: rgba(140, 220, 225, .075);
  --border-strong: rgba(140, 220, 225, .15);
  --hover: rgba(140, 220, 225, .055);
  --accent: #5BE3C8;
  --accent-hover: #86EDD9;
  --accent-ink: #032019;
  --accent-text: #8AEFDB;
  --accent-soft: rgba(91, 227, 200, .13);
  --accent-2: #9D8CFF;
  --focus-ring: #8AEFDB;
  --bulb: #86EDD9;
  --bulb-off: rgba(91, 227, 200, .16);
  --scrim: linear-gradient(90deg, rgba(7, 19, 28, .96) 0%, rgba(7, 19, 28, .76) 42%, rgba(7, 19, 28, 0) 80%);
  --scrim-bottom: linear-gradient(0deg, var(--bg) 0%, rgba(7, 19, 28, 0) 100%);
  --ui-input-bg: rgba(140, 220, 225, .045);
  --ui-overlay: rgba(2, 8, 14, .76);
  --ui-shadow-lg: 0 28px 70px -24px rgba(0, 6, 12, .9), 0 0 0 1px rgba(140, 220, 225, .12);
  --font-display: "Archivo Expanded", "Archivo", system-ui, sans-serif;
  --display-weight: 650;
  --display-track: -.02em;
}
/* A faixa de aurora: uma cortina de luz só no alto da página, que some ao rolar */
:root[data-skin="aurora"] body { isolation: isolate; }
:root[data-skin="aurora"] body::before {
  content: "";
  position: absolute;
  inset: 0 0 auto 0;
  height: 520px;
  z-index: -1;
  pointer-events: none;
  background:
    linear-gradient(180deg, transparent 0%, var(--bg) 100%),
    linear-gradient(100deg, rgba(91, 227, 200, .22) 0%, rgba(91, 227, 200, .05) 38%, rgba(157, 140, 255, .18) 70%, rgba(157, 140, 255, 0) 100%);
}
:root[data-skin="aurora"] body.has-hero::before { display: none; }
:root[data-skin="aurora"] .cine-hero .cine-title { font-size: clamp(2.5rem, 5.6vw, 4.75rem); line-height: .98; max-width: 14ch; }
:root[data-skin="aurora"] .title-name { font-size: clamp(2.25rem, 4.8vw, 4rem); line-height: 1; }
:root[data-skin="aurora"] .row-title { font-size: clamp(1.25rem, 2vw, 1.5rem); }
:root[data-skin="aurora"] .brand-name { font-family: "Archivo Expanded", "Archivo", sans-serif; font-weight: 700; font-size: 1.375rem; letter-spacing: -.02em; }
:root[data-skin="aurora"] .main-nav a[aria-current="page"]::after,
:root[data-skin="aurora"] .tab.is-active::after,
:root[data-skin="aurora"] .tab[aria-current="page"]::after { background: linear-gradient(90deg, var(--accent), var(--accent-2)); }
:root[data-skin="aurora"] .card:hover .card-poster { outline-color: var(--accent); }
:root[data-skin="aurora"] .chip.is-active, :root[data-skin="aurora"] .chip[aria-current="page"] { background: var(--accent-soft); color: var(--accent-text); box-shadow: inset 0 0 0 1px rgba(91, 227, 200, .35); }
:root[data-skin="aurora"] .cm-plan.is-featured, :root[data-skin="aurora"] .cm-plan.is-popular { border-color: var(--accent); box-shadow: inset 0 3px 0 var(--accent); }
:root[data-skin="aurora"] .input:focus, :root[data-skin="aurora"] .select:focus, :root[data-skin="aurora"] .textarea:focus { border-color: rgba(91, 227, 200, .6); box-shadow: 0 0 0 3px var(--accent-soft); }
:root[data-skin="aurora"] ::selection { background: rgba(91, 227, 200, .3); }

/* ------------------------------ OURO REAL ------------------------------ */
/* Foyer de teatro antigo: preto quente, ouro champanhe (não amarelo), títulos em Bodoni e filetes de 1px. */
:root[data-theme="dark"][data-skin="ouro"] {
  --bg: #100D09;
  --bg-2: #15110C;
  --surface: #19150F;
  --surface-2: #221C14;
  --surface-3: #2D251A;
  --text: #EBE1CF;
  --text-soft: #CFC1A8;
  --muted: #A8987B;
  --border: rgba(217, 178, 106, .1);
  --border-strong: rgba(217, 178, 106, .2);
  --hover: rgba(217, 178, 106, .055);
  --accent: #D9B26A;
  --accent-hover: #E8C786;
  --accent-ink: #1E1407;
  --accent-text: #E6C27F;
  --accent-soft: rgba(217, 178, 106, .14);
  --focus-ring: #E8C786;
  --bulb: #E8C786;
  --bulb-off: rgba(217, 178, 106, .16);
  --scrim: linear-gradient(90deg, rgba(16, 13, 9, .96) 0%, rgba(16, 13, 9, .78) 42%, rgba(16, 13, 9, 0) 80%);
  --scrim-bottom: linear-gradient(0deg, var(--bg) 0%, rgba(16, 13, 9, 0) 100%);
  --ui-input-bg: rgba(217, 178, 106, .04);
  --ui-overlay: rgba(8, 6, 3, .78);
  --ui-shadow-lg: 0 28px 70px -24px rgba(0, 0, 0, .9), 0 0 0 1px rgba(217, 178, 106, .2);
  --font-display: "Bodoni Moda", "Didot", "Bodoni 72", Georgia, serif;
  --display-weight: 600;
  --display-track: -.01em;
  --display-leading: 1;
}
:root[data-skin="ouro"] h1, :root[data-skin="ouro"] h2,
:root[data-skin="ouro"] .page-title, :root[data-skin="ouro"] .row-title, :root[data-skin="ouro"] .section-title,
:root[data-skin="ouro"] .cine-title, :root[data-skin="ouro"] .title-name, :root[data-skin="ouro"] .brand-name, :root[data-skin="ouro"] .footer-brand {
  font-family: var(--font-display);
  font-weight: 600;
  letter-spacing: -.01em;
}
:root[data-skin="ouro"] .cine-hero .cine-title { font-size: clamp(2.75rem, 6.4vw, 5.5rem); line-height: .98; font-weight: 600; max-width: 13ch; }
:root[data-skin="ouro"] .title-name { line-height: 1; font-weight: 600; }
:root[data-skin="ouro"] .row-title { font-size: clamp(1.5rem, 2.4vw, 1.875rem); font-weight: 600; }
:root[data-skin="ouro"] .brand-name { font-size: 1.5rem; color: var(--accent-text); }
:root[data-skin="ouro"] .site-header.is-scrolled, :root[data-skin="ouro"] .site-header.is-solid { border-bottom-color: rgba(217, 178, 106, .22); }
:root[data-skin="ouro"] .btn--ghost, :root[data-skin="ouro"] .btn--outline { border-color: rgba(217, 178, 106, .3); }
:root[data-skin="ouro"] .btn--ghost:hover { border-color: var(--accent); background: var(--hover); }
:root[data-skin="ouro"] .panel, :root[data-skin="ouro"] .acc-section, :root[data-skin="ouro"] .cm-card, :root[data-skin="ouro"] .auth-card { border-color: rgba(217, 178, 106, .13); }
:root[data-skin="ouro"] .card:hover .card-poster { outline: 1px solid var(--accent); outline-offset: 3px; }
:root[data-skin="ouro"] .chip.is-active, :root[data-skin="ouro"] .chip[aria-current="page"] { background: var(--accent-soft); color: var(--accent-text); box-shadow: inset 0 0 0 1px rgba(217, 178, 106, .4); }
:root[data-skin="ouro"] .main-nav a[aria-current="page"]::after { height: 1px; bottom: 6px; }
:root[data-skin="ouro"] .tab.is-active::after { height: 1px; }
:root[data-skin="ouro"] .cm-plan.is-featured, :root[data-skin="ouro"] .cm-plan.is-popular { border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); }
:root[data-skin="ouro"] .site-footer { border-top-color: rgba(217, 178, 106, .2); }
:root[data-skin="ouro"] hr, :root[data-skin="ouro"] .panel-head { border-color: rgba(217, 178, 106, .12); }
:root[data-skin="ouro"] .input:focus, :root[data-skin="ouro"] .select:focus, :root[data-skin="ouro"] .textarea:focus { border-color: rgba(217, 178, 106, .6); box-shadow: 0 0 0 3px var(--accent-soft); }
:root[data-skin="ouro"] ::selection { background: rgba(217, 178, 106, .3); }
@media (max-width: 700px) {
  :root[data-skin="aurora"] .brand-name { font-size: 1.125rem; }
  :root[data-skin="ouro"] .brand-name { font-size: 1.3rem; }
}
