/* ============================================================================
   Tema Copa do Mundo 🇧🇷 — apenas estético, 100% não interativo.
   Todos os elementos usam pointer-events:none, então NUNCA bloqueiam cliques.
   Para desativar: em /conn/config.php troque  define('TEMA_COPA', true)  por false.
   ============================================================================ */

/* ---- Bandeirinhas (varalzinho clássico de Copa) penduradas no topo ----
   Desenhadas como SVG que se repete: o cordão arqueia (cai no meio de cada
   vão, entre os "pregos") e as bandeirolas penduram acompanhando a curva.
   Assim fica com cara de varal de verdade, e alinha em qualquer largura. */
.copa-bandeirinhas {
    position: fixed;
    top: 0; left: 0; right: 0;
    height: 28px;
    z-index: 99999;
    pointer-events: none;
    /* background-image (o varal em SVG) é injetado inline por tema-copa.php */
    background-repeat: repeat-x;
    background-position: left top;
    background-size: 260px 28px;
}

/* ---- Confete caindo (verde e amarelo, sutil) ----
   z-index abaixo do backdrop do modal: aparece nas telas de navegação e
   some quando um modal/formulário abre. */
.copa-confete {
    position: fixed;
    inset: 0;
    z-index: 1035;
    pointer-events: none;
    overflow: hidden;
}
.copa-confete i {
    position: absolute;
    top: -12vh;
    display: block;
    border-radius: 1px;
    opacity: .75;
    animation: copa-cai linear infinite;
}
@keyframes copa-cai {
    0%   { transform: translateY(-12vh) rotate(0deg);   }
    100% { transform: translateY(112vh) rotate(540deg); }
}

/* Acessibilidade: respeita quem prefere menos movimento. */
@media (prefers-reduced-motion: reduce) {
    .copa-confete i {
        animation: none !important;
    }
    .copa-confete { display: none; }
}