/*
 * Smart Printer — Decoração de Natal (OP-13.2, proposta v1.3)
 * Natal Tecnológico (C) com apontamentos de Inverno (B).
 *
 * Regras de isolamento:
 *  - tudo sob body.sp-natal (nunca reutiliza a classe antiga "natal");
 *  - NÃO altera fundos, sombras ou cores de blocos, hero, banners, carrosséis, FAQ,
 *    grelhas de produtos, cabeçalho ou rodapé;
 *  - NÃO altera nenhuma cor de fundo do site (rev. B): só acrescenta a camada decorativa da neve;
 *  - sem seletores genéricos (nada de [class*="wp-block-"]).
 *
 * Paleta: #032E61 (azul principal) · #0B4A8F (azul secundário)
 *         #FFFFFF · #D6EAF8 · #A9CDE8 · #74A9D3 (flocos) · #F59E0B (âmbar, só no selo opcional)
 */

body.sp-natal {
  --sp-natal-azul: #032E61;
  --sp-natal-azul2: #0B4A8F;
  --sp-natal-gelo: #9FC3E8;
  --sp-natal-prata: #B8C2CC;
  --sp-natal-ambar: #F59E0B;
}

/* Camada da neve: decorativa e inerte (pointer-events: none).
   OP-13.1: z-index 12, acima do cabeçalho (11), para os flocos se verem também sobre a barra azul;
   continua abaixo da barra de administração, do banner de cookies, das janelas modais e da gaveta móvel. */
body.sp-natal .sp-natal__neve {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  overflow: hidden;
  pointer-events: none;
  z-index: 12;
  contain: layout paint;
}

/* Flocos: o carácter original "❄" como texto (mesmo desenho do gerador original).
   Mantém do original: tamanho em fonte, text-shadow branco suave, opacidade e rotação de 360°.
   Cor via "color" (branco / azul-gelo / azul suave). Sem fundo, sem border-radius. */
body.sp-natal .sp-natal__floco {
  position: absolute;
  top: -10px;
  left: var(--x, 50%);
  color: #FFFFFF;
  font-size: var(--s, 14px);
  line-height: 1;
  opacity: var(--o, 0.8);
  text-shadow: 0 0 4px rgba(255, 255, 255, 0.8);
  pointer-events: none;
  user-select: none;
  animation: sp-natal-cair var(--d, 16s) linear var(--atraso, 0s) infinite;
  will-change: transform;
}

body.sp-natal .sp-natal__neve.sp-natal--pausa .sp-natal__floco {
  animation-play-state: paused;
}

/* Queda como no original (translateY até ao fundo + rotate 360°), com oscilação lateral suave. Só transform. */
@keyframes sp-natal-cair {
  0%   { transform: translate3d(0, 0, 0) rotate(0deg); }
  25%  { transform: translate3d(calc(var(--dx, 20px) * var(--sent, 1)), 25vh, 0) rotate(90deg); }
  50%  { transform: translate3d(calc(var(--dx, 20px) * var(--sent, 1) * -0.7), 50vh, 0) rotate(180deg); }
  75%  { transform: translate3d(calc(var(--dx, 20px) * var(--sent, 1) * 0.8), 75vh, 0) rotate(270deg); }
  100% { transform: translate3d(0, calc(100vh + 40px), 0) rotate(360deg); }
}

/* Acessibilidade: sem movimento se o utilizador o pediu. */
@media (prefers-reduced-motion: reduce) {
  body.sp-natal .sp-natal__neve {
    display: none !important;
  }
}

/* Páginas transacionais (carrinho, finalizar compra, conta): sem neve nem animação. */
body.sp-natal.sp-natal--tx .sp-natal__neve {
  display: none !important;
}

/* Selo opcional (ex.: bloco HTML "Boas Festas"): âmbar apenas num pequeno detalhe. */
.sp-natal-selo {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 4px 12px;
  border-radius: 999px;
  background: #FFFFFF;
  border: 1px solid #B8C2CC;
  color: #032E61;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.4;
}
.sp-natal-selo::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: #F59E0B;
}

/* Botões sazonais existentes (migrados do CSS adicional; mesmos valores, seletor próprio). */
body.sp-natal .botao-google-natal-2 {
  color: #f6dd5d !important;
  background-color: #1A202C !important;
  border-color: #1A202C !important;
}
body.sp-natal .botao-google-natal-2:hover {
  color: #f6dd5d !important;
  background-color: #000000 !important;
  border-color: #000000 !important;
}
body.sp-natal .botao-google-natal {
  color: #ffffff !important;
  background-color: #1D5BD8 !important;
  border-color: #1D5BD8 !important;
}
body.sp-natal .botao-google-natal:hover {
  color: #F7FAFC !important;
  background-color: #4185F4 !important;
  border-color: #4185F4 !important;
}
