/**
 * DÉCORATION — halloween : braises, toiles d'araignée, citrouilles et chauves-souris flottantes
 * (les citrouilles/chauves-souris sont ajoutées par public/js/themes/halloween.js).
 * Chargée seulement si l'option « Décorations » est cochée dans l'admin.
 * Purement visuelle : ne bloque aucun clic (pointer-events: none), s'arrête si l'utilisateur
 * a demandé moins d'animations, et reste sous les fenêtres modales.
 */
:root,
[data-theme="light"] { --kt-decor: rgba(234, 88, 12, 0.55); --kt-web: rgba(60, 40, 30, 0.55); }
html[data-theme="dark"],
body[data-theme="dark"],
[data-theme="dark"] { --kt-decor: rgba(249, 115, 22, 0.8); --kt-web: rgba(235, 225, 255, 0.55); }

/* --- Braises qui montent --- */
html::before,
html::after {
    content: "";
    position: fixed;
    top: 0; right: 0; bottom: 0; left: 0;
    pointer-events: none;
    z-index: 9000;
}
html::before {
    background-image:
        radial-gradient(2px 2px at 20px 30px, var(--kt-decor), transparent),
        radial-gradient(2px 2px at 90px 80px, var(--kt-decor), transparent),
        radial-gradient(1.5px 1.5px at 150px 20px, var(--kt-decor), transparent),
        radial-gradient(2.5px 2.5px at 40px 140px, var(--kt-decor), transparent),
        radial-gradient(1.5px 1.5px at 120px 160px, var(--kt-decor), transparent),
        radial-gradient(2px 2px at 180px 110px, var(--kt-decor), transparent);
    background-size: 200px 200px;
    animation: kt-decor-slow 24s linear infinite;
}
html::after {
    background-image:
        radial-gradient(2px 2px at 60px 50px, var(--kt-decor), transparent),
        radial-gradient(2px 2px at 250px 90px, var(--kt-decor), transparent),
        radial-gradient(1.5px 1.5px at 130px 200px, var(--kt-decor), transparent),
        radial-gradient(2.5px 2.5px at 290px 250px, var(--kt-decor), transparent),
        radial-gradient(1.5px 1.5px at 30px 280px, var(--kt-decor), transparent),
        radial-gradient(2px 2px at 200px 20px, var(--kt-decor), transparent);
    background-size: 320px 320px;
    opacity: 0.65;
    animation: kt-decor-fast 36s linear infinite;
}
@keyframes kt-decor-slow { to { background-position: 0 -220px; } }
@keyframes kt-decor-fast { to { background-position: 0 -360px; } }

/* --- Toiles d'araignée dans les coins du haut --- */
body::before,
body::after {
    content: "";
    position: fixed;
    top: 0;
    width: 120px; height: 120px;
    pointer-events: none;
    z-index: 9000;
    opacity: 0.6;
    background: no-repeat center / contain url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 100 100' fill='none' stroke='%23999' stroke-width='0.9' stroke-linecap='round'%3E%3Cpath d='M0 0 L100 0 M0 0 L92 38 M0 0 L70 70 M0 0 L38 92 M0 0 L0 100'/%3E%3Cpath d='M22 0 Q18 18 0 22 M45 0 Q36 36 0 45 M70 0 Q56 56 0 70 M96 0 Q76 76 0 96'/%3E%3C/svg%3E");
}
body::before { left: 0; }
body::after  { right: 0; transform: scaleX(-1); }
[data-theme="dark"] body::before, [data-theme="dark"] body::after,
html[data-theme="dark"] body::before, html[data-theme="dark"] body::after { filter: brightness(1.7); }

/* --- Citrouilles / chauves-souris / fantômes flottants (créés par halloween.js) --- */
.kt-hw-float {
    position: fixed;
    top: 0; left: 0;
    pointer-events: none;
    z-index: 9000;
    user-select: none;
    will-change: transform;
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.35));
}
@keyframes kt-hw-rise {
    from { transform: translate3d(0, 0, 0) rotate(-10deg); }
    50%  { transform: translate3d(var(--dx, 40px), calc(var(--dy, -60vh) * 0.5), 0) rotate(10deg); }
    to   { transform: translate3d(calc(var(--dx, 40px) * -0.4), var(--dy, -120vh), 0) rotate(-10deg); }
}
.kt-hw-float { animation: kt-hw-rise linear infinite; }

@media (max-width: 600px) {
    body::before, body::after { width: 80px; height: 80px; }
}
@media (prefers-reduced-motion: reduce) {
    html::before, html::after { animation: none; }
    .kt-hw-float { animation: none; }
}
@media print {
    html::before, html::after, body::before, body::after, .kt-hw-float { display: none; }
}
