/*
 * Seizoensaccenten (eigenaar 2026-10-26: "kleine thema dingen per seizoen"): alleen geladen als er een seizoen actief is
 * (App\Support\SeasonalTheme, body.seasonal.seasonal--<seizoen>). Drie kleine dingen, geen herinrichting:
 *   1. ornament rechtsboven het logo (.logo__full::after),
 *   2. dun slingertje onderaan de witte kop (.header::after),
 *   3. regel boven de homepagekop (.seasonal-tag, partials/seasonal-tag) met hetzelfde icoon.
 * Alles absoluut gepositioneerd of al in de HTML (geen verspringen, CLS 0); iconen zijn inline SVG (geen extra verzoeken).
 * Ornament, slinger en icoon zijn decoratie (pseudo-elementen, niet voorgelezen). Contrast (AA): de tekst van .seasonal-tag
 * is wit op wit 10% over de donkere kop: OHS 14,6:1 (11,9:1 op de lichtere gloed), winkelwijzer 12,9:1, voordeelzoeker
 * 9,2:1; de randkleur is alleen decoratie.
 * Beweging alleen met html.motion (site-core: niet bij "minder beweging"). Kleuren per seizoen in de variabelen hieronder.
 */
.seasonal .header .logo__full { position: relative; display: inline-block; vertical-align: top; } /* top: geen baseline-ruimte, kop even hoog als zonder seizoen */
.seasonal .header .logo__full::after {
    content: ""; position: absolute; top: -8px; right: -26px; width: 26px; height: 26px; pointer-events: none;
    background: var(--seasonal-icon) center / contain no-repeat; transform: rotate(10deg); transform-origin: 50% 10%;
}
.seasonal .header::after {
    content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; pointer-events: none; z-index: 1;
    background: var(--seasonal-garland);
}
.seasonal-tag {
    display: inline-flex; align-items: center; gap: 8px; max-width: 100%; margin: 0 0 var(--space-3, 12px); padding: 4px 14px 4px 6px;
    border: 1px solid var(--seasonal-edge, rgba(255, 255, 255, .4)); border-radius: 999px; background: rgba(255, 255, 255, .1);
    color: #fff; font-size: 14px; font-weight: 600; line-height: 1.35;
}
.seasonal-tag::before { content: ""; flex: none; width: 22px; height: 22px; background: var(--seasonal-icon) center / contain no-repeat; }
@media (max-width: 767px) {
    .seasonal .header .logo__full::after { top: -1px; right: -22px; width: 20px; height: 20px; }
    .seasonal-tag { font-size: 13px; }
}
@media (prefers-reduced-motion: no-preference) {
    html.motion .seasonal .header .logo__full::after { animation: seasonal-sway 5s ease-in-out infinite; }
}
@keyframes seasonal-sway { 0%, 100% { transform: rotate(10deg); } 50% { transform: rotate(-4deg); } }

/* halloween: pompoen; oranje + paars */
.seasonal--halloween {
    --seasonal-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12.2 6.5c-.6-2.2.4-3.8 2.4-4.6' fill='none' stroke='%233F7D2C' stroke-width='2' stroke-linecap='round'/%3E%3Cellipse cx='7.6' cy='14.2' rx='5.4' ry='7' fill='%23D9570B'/%3E%3Cellipse cx='16.4' cy='14.2' rx='5.4' ry='7' fill='%23D9570B'/%3E%3Cellipse cx='12' cy='14.2' rx='5' ry='7.6' fill='%23FF8A1F'/%3E%3Cpath d='M7.6 12.6l1.9-2.3 1.6 2.3zM12.9 12.6l1.9-2.3 1.6 2.3z' fill='%233A1400'/%3E%3Cpath d='M7.8 15.8c1.4 1.8 7 1.8 8.4 0l-1.3.5-1-.8-1.1.9-1-.9-1.1.9-1-.8z' fill='%233A1400'/%3E%3C/svg%3E");
    --seasonal-garland: repeating-linear-gradient(90deg, #FF7A1A 0 18px, #6B3FA0 18px 36px);
    --seasonal-edge: #FF8A1F;
}

/* sinterklaas: mijter; rood + goud */
.seasonal--sinterklaas {
    --seasonal-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 21.5V10.5C5 6.3 8.2 3.2 12 1.5c3.8 1.7 7 4.8 7 9v11z' fill='%23C8102E'/%3E%3Cpath d='M5 18h14v3.5H5z' fill='%23F2C14E'/%3E%3Cpath d='M12 5.5v10M8.6 9.2h6.8' stroke='%23F2C14E' stroke-width='2.2' stroke-linecap='round'/%3E%3C/svg%3E");
    --seasonal-garland: repeating-linear-gradient(90deg, #C8102E 0 18px, #F2C14E 18px 36px);
    --seasonal-edge: #F2C14E;
}

/* kerst: kerstboom met piek; lichtjesslinger */
.seasonal--kerst {
    --seasonal-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 3.2l5 6h-2.6l4.2 5.2h-3.1l4.6 5.6H3.9l4.6-5.6H5.4l4.2-5.2H7z' fill='%231F8A4C'/%3E%3Crect x='10.6' y='20' width='2.8' height='3' rx='.5' fill='%237A4A21'/%3E%3Ccircle cx='10' cy='12.2' r='1.15' fill='%23E23B3B'/%3E%3Ccircle cx='14.4' cy='15.8' r='1.15' fill='%23F2C14E'/%3E%3Ccircle cx='8.9' cy='17.6' r='1.15' fill='%23E23B3B'/%3E%3Ccircle cx='15.3' cy='18.6' r='1.15' fill='%23E23B3B'/%3E%3Cpath d='M12 .4l.9 1.9 2 .3-1.5 1.4.4 2-1.8-1-1.8 1 .4-2-1.5-1.4 2-.3z' fill='%23F2B705'/%3E%3C/svg%3E");
    --seasonal-garland: radial-gradient(circle at 50% 50%, #E23B3B 0 2.5px, transparent 3px) 0 0 / 36px 6px repeat-x, radial-gradient(circle at 50% 50%, #F2B705 0 2.5px, transparent 3px) 12px 0 / 36px 6px repeat-x, radial-gradient(circle at 50% 50%, #1F8A4C 0 2.5px, transparent 3px) 24px 0 / 36px 6px repeat-x;
    --seasonal-edge: #E23B3B;
}
.seasonal--kerst .header::after { height: 6px; bottom: -3px; }

/* oud-nieuw: vuurwerk; goud + roze */
.seasonal--oud-nieuw {
    --seasonal-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cg fill='none' stroke-linecap='round' stroke-width='2.2'%3E%3Cpath d='M12 1.5v5M12 17.5v5M1.5 12h5M17.5 12h5' stroke='%23E0A400'/%3E%3Cpath d='M4.6 4.6l3.2 3.2M16.2 16.2l3.2 3.2M4.6 19.4l3.2-3.2M16.2 7.8l3.2-3.2' stroke='%23D63A7A'/%3E%3C/g%3E%3Ccircle cx='12' cy='12' r='2.4' fill='%23E0A400'/%3E%3C/svg%3E");
    --seasonal-garland: radial-gradient(circle at 50% 50%, #E0A400 0 2px, transparent 2.5px) 0 0 / 24px 6px repeat-x, radial-gradient(circle at 50% 50%, #D63A7A 0 2px, transparent 2.5px) 12px 0 / 24px 6px repeat-x;
    --seasonal-edge: #E0A400;
}
.seasonal--oud-nieuw .header::after { height: 6px; bottom: -3px; }

/* valentijn: hartje; rood + roze */
.seasonal--valentijn {
    --seasonal-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 21.3s-8.3-5.1-9.8-10.4C1.1 7.2 3.5 3.8 7 3.8c2.1 0 3.8 1.2 5 3 1.2-1.8 2.9-3 5-3 3.5 0 5.9 3.4 4.8 7.1C20.3 16.2 12 21.3 12 21.3z' fill='%23E0245E'/%3E%3Cpath d='M6.6 7.3c-1.3.1-2.3 1.1-2.4 2.5' fill='none' stroke='%23fff' stroke-width='1.5' stroke-linecap='round' opacity='.75'/%3E%3C/svg%3E");
    --seasonal-garland: repeating-linear-gradient(90deg, #E0245E 0 18px, #FF9BBD 18px 36px);
    --seasonal-edge: #FF6F9C;
}

/* pasen: paasei; pastel geel/lila/groen */
.seasonal--pasen {
    --seasonal-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cdefs%3E%3CclipPath id='e'%3E%3Cpath d='M12 1.8C7.7 1.8 4.6 9 4.6 14.2a7.4 7.4 0 0014.8 0C19.4 9 16.3 1.8 12 1.8z'/%3E%3C/clipPath%3E%3C/defs%3E%3Cpath d='M12 1.8C7.7 1.8 4.6 9 4.6 14.2a7.4 7.4 0 0014.8 0C19.4 9 16.3 1.8 12 1.8z' fill='%23F6D55C'/%3E%3Cg clip-path='url(%23e)' fill='none' stroke-width='2.2'%3E%3Cpath d='M3 11.2l3 -2 3 2 3-2 3 2 3-2 3 2' stroke='%239B7BE0'/%3E%3Cpath d='M3 16.2l3-2 3 2 3-2 3 2 3-2 3 2' stroke='%234FA84B'/%3E%3C/g%3E%3C/svg%3E");
    --seasonal-garland: repeating-linear-gradient(90deg, #F6D55C 0 16px, #B79CED 16px 32px, #8FD18B 32px 48px);
    --seasonal-edge: #F6D55C;
}

/* koningsdag: kroon; oranje + rood-wit-blauw */
.seasonal--koningsdag {
    --seasonal-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M2.8 8.2l4.6 4.2L12 5.2l4.6 7.2 4.6-4.2-2 11H4.8z' fill='%23FF7A00'/%3E%3Cpath d='M4.8 17.2h14.4v2.6H4.8z' fill='%23C25400'/%3E%3Ccircle cx='2.8' cy='7.6' r='1.7' fill='%23FF7A00'/%3E%3Ccircle cx='12' cy='4.4' r='1.7' fill='%23FF7A00'/%3E%3Ccircle cx='21.2' cy='7.6' r='1.7' fill='%23FF7A00'/%3E%3C/svg%3E");
    --seasonal-garland: repeating-linear-gradient(90deg, #FF7A00 0 24px, #AE1C28 24px 32px, #fff 32px 40px, #21468B 40px 48px);
    --seasonal-edge: #FF7A00;
}

/* moederdag: tulp; roze + groen */
.seasonal--moederdag {
    --seasonal-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 12.5v10' stroke='%233E8E4E' stroke-width='2' stroke-linecap='round'/%3E%3Cpath d='M12 20c-3.2-.3-5.3-2.6-5.8-5.3 2.7.2 4.9 1.7 5.8 5.3zM12 20c3.2-.3 5.3-2.6 5.8-5.3-2.7.2-4.9 1.7-5.8 5.3z' fill='%235FB35A'/%3E%3Cpath d='M6.3 3.8 9 6.6l3-4.3 3 4.3 2.7-2.8v5a5.7 5.7 0 01-11.4 0z' fill='%23F06A9B'/%3E%3C/svg%3E");
    --seasonal-garland: repeating-linear-gradient(90deg, #F06A9B 0 18px, #7CC08A 18px 36px);
    --seasonal-edge: #F06A9B;
}