/* ==========================================================================
   Temas de datas comemorativas — AgendaVitta
   Handoff de design "Temas de datas comemorativas" (alta fidelidade).

   Carregar SEMPRE depois de styles.css: este arquivo substitui os blocos
   [data-season] antigos (acento unico calibrado so para fundo claro) por um par
   claro/escuro, adiciona as 4 datas novas e os tokens derivados.

   Convencao de tema:
     - claro  = padrao (qualquer body sem data-theme="agendavitta")
     - escuro = body[data-theme="agendavitta"]

   Intensidade (atributo data-season-nivel no body, definido pelo painel adm):
     1 = sutil · 2 = ambiente · 3 = imersivo
   ========================================================================== */

/* --------------------------------------------------------------------------
   0. Aposenta a decoracao antiga do styles.css
   As 10 ilustracoes de linha (assets/themes/*.svg) e os glifos --season-symbol
   foram reprovados no handoff por competirem com a logo do studio. Aqui elas
   sao desligadas; os brilhos difusos da secao 5 entram no lugar.
   -------------------------------------------------------------------------- */
.booking-page[data-season]::before,
.dashboard-body[data-season]::before,
.booking-page[data-season]::after,
.dashboard-body[data-season]::after,
.booking-page[data-season] .page-heading::after,
.dashboard-body[data-season] .page-header::after,
.booking-page[data-season] .page-heading::before,
.dashboard-body[data-season] .page-header::before,
.preview-card[data-season]:not([data-season=""])::after {
  content: none !important;
  background: none !important;
}
.booking-page[data-season] .page-heading h1,
.dashboard-body[data-season] .page-header h1 { text-decoration: none; }
.booking-page[data-season] .page-heading { min-height: 0; padding: 34px 28px; }

/* --------------------------------------------------------------------------
   1. Tokens por data — tema CLARO
   Os acentos das 10 datas originais sao os valores que ja estavam no styles.css.
   -------------------------------------------------------------------------- */
[data-season="mulher"] {
  --season-accent: #c2417a; --season-secondary: #7650a8;
  --season-particulas: #ff7fb0, #ffb3ca, #b78dff;
  --season-icon: url("themes/icons/flower.svg");
  --season-icon-2: url("themes/icons/sparkle.svg");
}
[data-season="carnaval"] {
  --season-accent: #7e3aa8; --season-secondary: #d98324;
  --season-particulas: #ff5c66, #ffc247, #63c98a, #5cb0e8, #ff8a4c;
  --season-icon: url("themes/icons/confetti.svg");
  --season-icon-2: none;
}
[data-season="pascoa"] {
  --season-accent: #4f8a5b; --season-secondary: #2f7f9e;
  --season-particulas: #7fd39a, #7cc4e8, #f0c979;
  --season-icon: url("themes/icons/egg.svg");
  --season-icon-2: url("themes/icons/flower-tulip.svg");
}
[data-season="maes"] {
  --season-accent: #a34e82; --season-secondary: #6b815d;
  --season-particulas: #ee8ec2, #ffc2de, #9fc08a;
  --season-icon: url("themes/icons/hand-heart.svg");
  --season-icon-2: url("themes/icons/baby.svg");
}
[data-season="namorados"] {
  --season-accent: #c2273f; --season-secondary: #d9557f;
  --season-particulas: #ff6b7e, #ff9ab4, #ffd9e5;
  --season-icon: url("themes/icons/heart.svg");
  --season-icon-2: url("themes/icons/flower-tulip.svg");
}
[data-season="festa_junina"] {
  --season-accent: #c9531f; --season-secondary: #2f7d4f;
  --season-particulas: #ff8a4c, #ffc247, #63c98a, #e04b3a;
  --season-icon: url("themes/icons/balloon.svg");
  --season-icon-2: url("themes/icons/cowboy-hat.svg");
}
[data-season="pais"] {
  --season-accent: #2f6b93; --season-secondary: #8b6847;
  --season-particulas: #6fb8de, #9fd2f5, #c79a6c;
  --season-icon: url("themes/icons/tie.svg");
  --season-icon-2: url("themes/icons/coat-hanger.svg");
}
[data-season="dia_do_cliente"] {
  --season-accent: #1f6f5c; --season-secondary: #d9ad72;
  --season-particulas: #57d3b0, #f4d29e;
  --season-icon: url("themes/icons/gift.svg");
  --season-icon-2: url("themes/icons/sparkle.svg");
}
[data-season="criancas"] {
  --season-accent: #e0562c; --season-secondary: #2f7f9e;
  --season-particulas: #ff8a4c, #68b8dd, #ffc247, #63c98a, #ee8ec2;
  --season-icon: url("themes/icons/kite.svg");
  --season-icon-2: url("themes/icons/soccer-ball.svg");
}
[data-season="outubro_rosa"] {
  --season-accent: #c04d78; --season-secondary: #de8baa;
  --season-particulas: #ff7aa8, #ffb3ca, #ffd9e5;
  --season-icon: url("themes/icons/ribbon-health.svg");
  --season-icon-2: url("themes/icons/flower.svg");
}
[data-season="novembro_azul"] {
  --season-accent: #3475a6; --season-secondary: #72a8cf;
  --season-particulas: #5cb0e8, #9fd2f5;
  --season-icon: url("themes/icons/ribbon-health.svg");
  --season-icon-2: url("themes/icons/heart.svg");
}
[data-season="black_friday"] {
  --season-accent: #1a1a1d; --season-secondary: #8b9098;
  --season-particulas: #e6e9ee, #9aa0a8;
  --season-icon: url("themes/icons/tag.svg");
  --season-icon-2: url("themes/icons/sparkle.svg");
}
[data-season="natal"] {
  --season-accent: #b32631; --season-secondary: #257447;
  --season-particulas: #ffffff, #ffe2e2, #4fd18a;
  --season-icon: url("themes/icons/santa.svg");
  --season-icon-2: url("themes/icons/tree-evergreen.svg");
}
[data-season="ano_novo"] {
  --season-accent: #a77a1b; --season-secondary: #8a9099;
  --season-particulas: #f0c979, #ffffff, #dfe3e8;
  --season-icon: url("themes/icons/champagne.svg");
  --season-icon-2: url("themes/icons/sparkle.svg");
}

/* --------------------------------------------------------------------------
   2. Tokens por data — tema ESCURO (o acento brilha mais, nao fica mais sobrio)
   -------------------------------------------------------------------------- */
body[data-theme="agendavitta"][data-season="mulher"]        { --season-accent: #ff7fb0; --season-secondary: #b78dff; }
body[data-theme="agendavitta"][data-season="carnaval"]      { --season-accent: #c07bff; --season-secondary: #ffc247; }
body[data-theme="agendavitta"][data-season="pascoa"]        { --season-accent: #7fd39a; --season-secondary: #7cc4e8; }
body[data-theme="agendavitta"][data-season="maes"]          { --season-accent: #ee8ec2; --season-secondary: #9fc08a; }
body[data-theme="agendavitta"][data-season="namorados"]     { --season-accent: #ff6b7e; --season-secondary: #ff9ab4; }
body[data-theme="agendavitta"][data-season="festa_junina"]  { --season-accent: #ff8a4c; --season-secondary: #63c98a; }
body[data-theme="agendavitta"][data-season="pais"]          { --season-accent: #6fb8de; --season-secondary: #c79a6c; }
body[data-theme="agendavitta"][data-season="dia_do_cliente"]{ --season-accent: #57d3b0; --season-secondary: #f4d29e; }
body[data-theme="agendavitta"][data-season="criancas"]      { --season-accent: #ff8a4c; --season-secondary: #68b8dd; }
body[data-theme="agendavitta"][data-season="outubro_rosa"]  { --season-accent: #ff7aa8; --season-secondary: #ffb3ca; }
body[data-theme="agendavitta"][data-season="novembro_azul"] { --season-accent: #5cb0e8; --season-secondary: #9fd2f5; }
body[data-theme="agendavitta"][data-season="black_friday"]  { --season-accent: #c9ced6; --season-secondary: #e6e9ee; }
body[data-theme="agendavitta"][data-season="natal"]         { --season-accent: #ff5c66; --season-secondary: #4fd18a; }
body[data-theme="agendavitta"][data-season="ano_novo"]      { --season-accent: #f0c979; --season-secondary: #dfe3e8; }

/* --------------------------------------------------------------------------
   3. Tokens derivados (por tema, nao por data)
   --season-mix e o token de texto: eyebrow, preco/total, progresso, hora
   tabular, links de apoio e accent-color. O botao de acao continua vindo de
   --acao; so o halo muda de cor no nivel 3.
   -------------------------------------------------------------------------- */
[data-season] {
  --season-mix: color-mix(in oklab, var(--season-accent) 70%, var(--brand, #d9ad72));
  --season-accent-soft: color-mix(in srgb, var(--season-accent) 10%, var(--surface, #fff));
  --season-accent-line: color-mix(in srgb, var(--season-accent) 24%, var(--linha, var(--line, #dfe6e3)));
  --season-acao-halo: color-mix(in srgb, var(--season-accent) 20%, transparent);
  /* Substitui o --season-soft fixo (#fff3f3 etc.) por mistura translucida. */
  --season-soft: color-mix(in srgb, var(--season-accent) 12%, transparent);
  --season-glow: var(--season-accent);
}
body[data-theme="agendavitta"][data-season] {
  --season-accent-soft: color-mix(in srgb, var(--season-accent) 16%, var(--surface, #19181d));
  --season-accent-line: color-mix(in srgb, var(--season-accent) 40%, var(--linha, var(--line, rgba(255,255,255,.1))));
  /* Rede de seguranca para navegador sem sintaxe de cor relativa: acento
     dominante, para o texto sobreviver a uma marca escura. */
  --season-mix: color-mix(in oklab, var(--season-accent) 85%, var(--brand, #d9ad72));
}

/* O handoff define --season-mix como 70% acento + 30% marca, assumindo que a
   marca e o dourado #d9ad72. Neste projeto --brand e a cor primaria escolhida
   por cada studio e pode ser bem escura (ha studio com #000000): a 70% o preco
   e o total ficavam ilegiveis sobre o fundo escuro.
   Em vez de mexer na proporcao, damos um piso de luminosidade a marca. Studio
   com marca clara passa reto e fica identico ao prototipo; studio com marca
   escura tem a marca clareada só o suficiente para o texto sobreviver. */
@supports (color: oklch(from red l c h)) {
  body[data-theme="agendavitta"][data-season] {
    --season-brand: oklch(from var(--brand, #d9ad72) max(l, 0.55) c h);
    --season-mix: color-mix(in oklab, var(--season-accent) 70%, var(--season-brand));
  }
}
[data-season][data-season-nivel="3"] {
  --season-acao-halo: color-mix(in srgb, var(--season-accent) 34%, transparent);
}
/* Excecao Black Friday no claro: o acento e quase preto e o brilho viraria
   mancha cinza — o brilho usa a secundaria. */
body:not([data-theme="agendavitta"])[data-season="black_friday"] { --season-glow: #8b9098; }

/* --------------------------------------------------------------------------
   4. Fundo por nivel de intensidade
   Sem background-attachment: fixed — o iOS repinta o gradiente a cada quadro.
   -------------------------------------------------------------------------- */
body[data-season][data-season-nivel] { background-attachment: initial; }

/* Nivel 1 — sutil: o fundo fica intocado, a data aparece so no acento.
   Precisa ser reafirmado porque a regra base do styles.css e
   body[data-theme="agendavitta"]:not([data-season]) — com a data no ar ela deixa
   de valer e o fundo cairia para --surface-soft, perdendo os halos da marca. */
body[data-theme="agendavitta"][data-season][data-season-nivel="1"] {
  background:
    radial-gradient(circle at 88% 8%, rgba(217, 173, 114, .11), transparent 28rem),
    radial-gradient(circle at 8% 88%, rgba(119, 78, 44, .08), transparent 30rem),
    #09090b;
}

/* Nivel 2 — ambiente */
body[data-season][data-season-nivel="2"] {
  background:
    radial-gradient(circle at 94% 4%, color-mix(in srgb, var(--season-accent) 8%, transparent), transparent 34rem),
    radial-gradient(circle at 2% 92%, color-mix(in srgb, var(--season-secondary) 6%, transparent), transparent 34rem),
    color-mix(in srgb, var(--season-accent) 2%, var(--bg, #faf9f7));
}
body[data-theme="agendavitta"][data-season][data-season-nivel="2"] {
  background:
    radial-gradient(circle at 94% 4%, color-mix(in srgb, var(--season-accent) 12%, transparent), transparent 34rem),
    radial-gradient(circle at 2% 92%, color-mix(in srgb, var(--season-secondary) 9%, transparent), transparent 34rem),
    color-mix(in srgb, var(--season-accent) 3%, var(--bg, #09090b));
}

/* Nivel 3 — imersivo */
body[data-season][data-season-nivel="3"] {
  background:
    radial-gradient(circle at 94% 4%, color-mix(in srgb, var(--season-accent) 15%, transparent), transparent 34rem),
    radial-gradient(circle at 2% 92%, color-mix(in srgb, var(--season-secondary) 11%, transparent), transparent 34rem),
    color-mix(in srgb, var(--season-accent) 4%, var(--bg, #faf9f7));
}
body[data-theme="agendavitta"][data-season][data-season-nivel="3"] {
  background:
    radial-gradient(circle at 94% 4%, color-mix(in srgb, var(--season-accent) 26%, transparent), transparent 34rem),
    radial-gradient(circle at 2% 92%, color-mix(in srgb, var(--season-secondary) 18%, transparent), transparent 34rem),
    color-mix(in srgb, var(--season-accent) 7%, var(--bg, #09090b));
}

/* Cabecalho tingido — so no nivel 3 */
body[data-season][data-season-nivel="3"] .booking-header {
  background: linear-gradient(180deg,
    color-mix(in srgb, var(--season-accent) 9%, var(--bg, #fff)),
    color-mix(in srgb, var(--season-accent) 3%, var(--bg, #fff)));
  border-bottom-color: color-mix(in srgb, var(--season-accent) 30%, var(--linha, var(--line, #dfe6e3)));
}
body[data-theme="agendavitta"][data-season][data-season-nivel="3"] .booking-header {
  background: linear-gradient(180deg,
    color-mix(in srgb, var(--season-accent) 16%, var(--bg, #09090b)),
    color-mix(in srgb, var(--season-accent) 6%, var(--bg, #09090b)));
}

/* --------------------------------------------------------------------------
   5. Brilhos difusos (substituem a ilustracao de canto antiga)
   -------------------------------------------------------------------------- */
body[data-season][data-season-nivel="2"]::before,
body[data-season][data-season-nivel="3"]::before,
body[data-season][data-season-nivel="3"]::after {
  content: "";
  position: fixed;
  border-radius: 50%;
  filter: blur(30px);
  pointer-events: none;
  z-index: 1;
  background: radial-gradient(circle, var(--season-glow) 0%, transparent 68%);
}
/* Topo direito */
body[data-season][data-season-nivel="2"]::before,
body[data-season][data-season-nivel="3"]::before {
  width: 480px; height: 480px; top: -110px; right: -80px;
}
body[data-season][data-season-nivel="2"]::before { opacity: .16; }
body[data-season][data-season-nivel="3"]::before { opacity: .28; }
body[data-theme="agendavitta"][data-season][data-season-nivel="2"]::before { opacity: .3; }
body[data-theme="agendavitta"][data-season][data-season-nivel="3"]::before { opacity: .5; }
/* Base esquerda — so nivel 3 e so no web */
body[data-season][data-season-nivel="3"]::after {
  width: 440px; height: 440px; bottom: -140px; left: -110px;
  background: radial-gradient(circle, var(--season-secondary) 0%, transparent 68%);
  opacity: .16;
}
body[data-theme="agendavitta"][data-season][data-season-nivel="3"]::after { opacity: .32; }

/* Conteudo sempre acima dos brilhos */
body[data-season] .booking-header,
body[data-season] .booking-shell,
body[data-season] .app-shell,
body[data-season] main { position: relative; z-index: 2; }

/* --------------------------------------------------------------------------
   6. Faixa da data (.season-banner) — redesenhada
   -------------------------------------------------------------------------- */
.season-banner {
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  gap: 14px;
  min-height: 76px;
  padding: 14px clamp(24px, 6vw, 60px) 14px 16px;
  border: 0;
  border-left: 4px solid var(--season-accent);
  border-radius: 16px;
  background: linear-gradient(105deg,
    color-mix(in srgb, var(--season-accent) 10%, var(--surface, #fff)) 0 58%,
    color-mix(in srgb, var(--season-secondary) 9%, var(--surface, #fff)) 100%);
  box-shadow: 0 12px 28px color-mix(in srgb, var(--season-accent) 16%, transparent);
}
body[data-theme="agendavitta"] .season-banner {
  background: linear-gradient(105deg,
    color-mix(in srgb, var(--season-accent) 16%, var(--surface, #19181d)) 0 58%,
    color-mix(in srgb, var(--season-secondary) 14%, var(--surface, #19181d)) 100%);
}
/* Brilho radial interno da faixa */
.season-banner::before {
  content: "";
  position: absolute;
  top: 50%; right: 8%;
  width: 210px; height: 210px;
  transform: translateY(-50%);
  border-radius: 50%;
  background: radial-gradient(circle, var(--season-glow) 0%, transparent 70%);
  filter: blur(20px);
  opacity: .2;
  pointer-events: none;
}
body[data-theme="agendavitta"] .season-banner::before { opacity: .38; }
body:not([data-theme="agendavitta"])[data-season="black_friday"] .season-banner::before { opacity: .12; }
/* A ilustracao antiga de canto sai de uso. */
.season-banner::after { content: none; }

.season-banner__icon {
  position: relative;
  z-index: 1;
  flex: 0 0 auto;
  display: block;
  width: 44px; height: 44px;
  border-radius: 14px;
  background: linear-gradient(150deg, var(--season-accent), var(--season-secondary));
  box-shadow: 0 6px 18px color-mix(in srgb, var(--season-accent) 30%, transparent);
  /* O glifo entra como mascara sobre o quadrado colorido. */
  font-size: 0;
}
.season-banner__icon::after {
  content: "";
  display: block;
  width: 100%; height: 100%;
  background: #ffffff;
  -webkit-mask: var(--season-icon) center / 24px 24px no-repeat;
  mask: var(--season-icon) center / 24px 24px no-repeat;
}
body[data-theme="agendavitta"] .season-banner__icon::after { background: #141414; }

.season-banner__texto { position: relative; z-index: 1; min-width: 0; }
.season-banner strong { display: block; font-size: 15px; font-weight: 700; color: var(--ink, var(--text, #14231d)); }
.season-banner p { margin: 3px 0 0; font-size: 13.5px; color: var(--muted, #607069); }
/* O styles.css fixa #17171b na faixa do tema escuro — servia para o fundo claro
   da faixa antiga. Com o fundo translucido novo o texto ficaria ilegivel. */
body[data-theme="agendavitta"] .season-banner,
body[data-theme="agendavitta"] .season-banner strong { color: var(--ink, #f8f5ef); }
body[data-theme="agendavitta"] .season-banner p { color: var(--muted, #aaa6ae); }
.season-banner[hidden] { display: none; }

/* --------------------------------------------------------------------------
   7. Uso do acento nos componentes
   -------------------------------------------------------------------------- */
body[data-season] .step-number {
  color: var(--season-accent);
  background: var(--season-accent-soft);
  border: 1px solid var(--season-accent-line);
}
body[data-season] .booking-progress__seg--feito { background: var(--season-mix); }
body[data-season] .price,
body[data-season] .summary-total { color: var(--season-mix); }
body[data-season] .eyebrow { color: var(--season-mix); }
body[data-season] input[type="checkbox"],
body[data-season] input[type="radio"] { accent-color: var(--season-mix); }
body[data-season][data-season-nivel="3"] { --acao-halo: var(--season-acao-halo); }

/* --------------------------------------------------------------------------
   8. Extras por data
   -------------------------------------------------------------------------- */
/* Festa Junina — faixa xadrez abaixo do cabecalho */
.season-xadrez {
  height: 14px;
  background: repeating-conic-gradient(var(--season-accent) 0% 25%, var(--season-secondary) 0% 50%);
  background-size: 28px 28px;
}
body:not([data-season="festa_junina"]) .season-xadrez { display: none; }

/* Black Friday — faixa de campanha, prata sobre preto nos dois temas */
.season-faixa {
  padding: 9px 0;
  font-size: 10.5px;
  font-weight: 700;
  letter-spacing: .34em;
  text-transform: uppercase;
  text-align: center;
  white-space: nowrap;
  overflow: hidden;
  color: #e6e9ee;
  background: #111114;
  border-bottom: 1px solid color-mix(in srgb, #e6e9ee 42%, transparent);
}
body[data-theme="agendavitta"] .season-faixa { background: #07070a; }
body:not([data-season="black_friday"]) .season-faixa { display: none; }

/* Carnaval nao tem icone: so o confete caindo. */
[data-season="carnaval"] .season-banner__icon { display: none; }

/* --------------------------------------------------------------------------
   9. Particulas
   -------------------------------------------------------------------------- */
.season-particulas {
  position: absolute;
  inset: 0;
  z-index: 3;
  pointer-events: none;
}

/* Icones grandes flutuando */
.season-flutua {
  position: absolute;
  z-index: 2;
  width: 190px; height: 190px;
  background: var(--season-accent);
  opacity: .1;
  pointer-events: none;
  -webkit-mask: var(--season-icon) center / contain no-repeat;
  mask: var(--season-icon) center / contain no-repeat;
  animation: sk-float 11s ease-in-out infinite;
}
.season-flutua--2 {
  -webkit-mask-image: var(--season-icon-2);
  mask-image: var(--season-icon-2);
  animation-duration: 13s;
  animation-delay: -4s;
}
@keyframes sk-float {
  0%, 100% { translate: 0 0; }
  50% { translate: 0 -7px; }
}

/* --------------------------------------------------------------------------
   10. Acessibilidade e mobile / PWA
   -------------------------------------------------------------------------- */
@media (prefers-reduced-motion: reduce) {
  .season-particulas { display: none; }
  .season-flutua { animation: none; }
}

@media (max-width: 640px) {
  .season-banner { padding: 13px 16px; min-height: 0; }
  .season-banner::before { width: 150px; height: 150px; }
  .season-xadrez { height: 10px; background-size: 20px 20px; }
  .season-faixa { padding: 7px 0; letter-spacing: .22em; }
  .season-flutua { width: 110px; height: 110px; }
  .season-flutua--2 { display: none; }
  body[data-season][data-season-nivel="2"]::before,
  body[data-season][data-season-nivel="3"]::before { width: 300px; height: 300px; }
  body[data-season][data-season-nivel="3"]::after { display: none; }
}