/**
 * Winterevenementen.nu — thema (ijsblauw + kerstgoud, géén Kermis-paars/oranje).
 * Laadt ná base.min.css zodat overrides winnen.
 */

:root{
  --bg:#061820;
  --brand:#1a8fb8;
  --brand-2:#7dd3ea;
  --brand-rgb:26,143,184;
  --accent:#d4a84b;
  --accent-rgb:212,168,75;
  --accent-700:#b8923f;
  --we-holly:#2d8a6a;
  --we-holly-rgb:45,138,106;
  --kv2-line:rgba(125,211,234,.22);
}

/* ---- Titels / underlines (paars→oranje weg) ---- */
#pi-title::after,
.pi-title::after,
.h-underline::after,
body.page--home #pi-count-line::after{
  background:linear-gradient(90deg, var(--brand-2), var(--accent)) !important;
}
:is(
  h1.h-underline,
  h1.h-page-title,
  #pi-title,
  .kermis-hero__title,
  .news-hero__title
){
  text-shadow:
    0 0 24px rgba(var(--brand-rgb), .35),
    0 2px 18px rgba(0, 0, 0, .45) !important;
}
body.page--home #pi-desc .home-intro-highlight,
body.page--home #pi-desc a.home-intro-highlight{
  color:var(--accent) !important;
}

/* Header-balk (paars → ijs) */
.site-header__top::before{
  background:rgba(14, 74, 92, .88) !important;
}
.site-header__top.is-scrolled::before{
  background:rgba(10, 55, 70, .94) !important;
}
.nav-link:hover,
.nav-link:focus-visible,
.nav-item.has-sub:hover > .nav-trigger .nav-link,
.nav-item.has-sub:focus-within > .nav-trigger .nav-link,
.nav-item.has-sub.is-open > .nav-trigger .nav-link{
  border-color:rgba(var(--brand-rgb), .55) !important;
  background:rgba(var(--brand-rgb), .16) !important;
}
.search .adv-btn:hover{
  background:rgba(var(--brand-rgb), .4) !important;
  border-color:rgba(var(--brand-rgb), .55) !important;
}
.homeplace-actions__agenda{
  background:linear-gradient(90deg, rgba(var(--brand-rgb),.95), rgba(var(--we-holly-rgb),.82)) !important;
}
.social-tile{
  background:rgba(6, 24, 32, 0.62) !important;
}
.dropdown a:hover{
  background:rgba(var(--brand-rgb), .16) !important;
}
.dropdown--meer-grouped .meer-ico,
.dropdown--meer-grouped li.dd-head > strong{
  color:var(--brand-2) !important;
}

/* ---- Stats-bar ---- */
.stats-bar,
.stats-bar--winter{
  background:linear-gradient(90deg, rgba(6,40,55,.94), rgba(14,74,92,.96) 45%, rgba(10,55,48,.92));
  border-top:1px solid rgba(125,211,234,.18);
  border-bottom:1px solid rgba(212,168,75,.22);
  box-shadow:inset 0 -1px 0 rgba(255,255,255,.06), 0 8px 24px rgba(0,0,0,.28);
}
.stats-pill--main{
  background:linear-gradient(90deg, rgba(26,143,184,.95), rgba(45,138,106,.82));
  color:#f5fbff;
  border-color:rgba(125,211,234,.35);
}
.stats-pill--main .label{ color:rgba(245,251,255,.92); }
.stats-pill--stats{ display:none !important; }

/* ---- Event list items (tekstoverzicht) ---- */
body.page--home .eventTextItem.futureEvent .daysleftfield,
body.page--overview .eventTextItem.futureEvent .daysleftfield,
body.page--kermis .eventTextItem.futureEvent .daysleftfield,
.eventTextItem.futureEvent .daysleftfield{
  background:linear-gradient(160deg, #5ec8e0 0%, #1a8fb8 100%) !important;
}
body.page--home .eventTextItem.currentEvent .daysleftfield,
body.page--overview .eventTextItem.currentEvent .daysleftfield,
body.page--kermis .eventTextItem.currentEvent .daysleftfield,
.eventTextItem.currentEvent .daysleftfield{
  background:linear-gradient(160deg, #4ecf8a 0%, #2d8a6a 100%) !important;
}
body.page--home .eventTextItem.pastEvent .daysleftfield,
body.page--overview .eventTextItem.pastEvent .daysleftfield,
body.page--kermis .eventTextItem.pastEvent .daysleftfield,
.eventTextItem.pastEvent .daysleftfield{
  background:linear-gradient(160deg, #9aa8b0 0%, #5c6b73 100%) !important;
}
.eventTextItem.futureEvent .iconfield{
  border-left-color:var(--brand) !important;
}
.eventTextItem.currentEvent .iconfield{
  border-left-color:var(--we-holly) !important;
}
.search .adv-btn,
.search.search--compact .adv-btn{
  background:rgba(var(--brand-rgb), .25) !important;
  border-color:rgba(255,255,255,.25) !important;
}
.search .adv-btn:hover,
.search.search--compact .adv-btn:hover{
  background:rgba(var(--brand-rgb), .4) !important;
  border-color:rgba(var(--brand-rgb), .55) !important;
}
.nav-caret:hover,
.nav-trigger--org:hover,
.nav-item.has-sub > .nav-trigger--agenda:hover,
.nav-item.has-sub > .nav-trigger--agenda:focus-within{
  border-color:rgba(var(--brand-rgb), .55) !important;
  background:rgba(var(--brand-rgb), .14) !important;
}
#tekst-overzicht.kv2-list-view--cards .eventTextItem__media,
html.kv2-list-pref-cards #tekst-overzicht .eventTextItem__media{
  background-color:#0c2430 !important;
  background-image:
    linear-gradient(180deg, rgba(6,24,32,.18) 0%, rgba(6,24,32,.48) 100%),
    var(--list-photo, var(--promo-bg, linear-gradient(135deg, rgba(26,143,184,.4), rgba(45,138,106,.28)))) !important;
}
#tekst-overzicht.kv2-list-view--cards .eventTextItem.is-promoted .eventTextItem__body,
html.kv2-list-pref-cards #tekst-overzicht .eventTextItem.is-promoted .eventTextItem__body{
  background:#0f2a36 !important;
}
.kv2-list-photo-filter input{
  accent-color:var(--brand-2) !important;
}
.kv2-list-view-toggle__btn.is-active,
.kv2-list-view-toggle__btn[aria-pressed="true"]{
  background:rgba(var(--brand-rgb), .35) !important;
  color:#fff !important;
}

/* ---- Chips / buttons / secties ---- */
.chip,
a.chip{
  border-color:rgba(var(--brand-rgb),.35);
}
.chip:hover,
a.chip:hover{
  border-color:rgba(var(--brand-rgb),.55);
  background:rgba(var(--brand-rgb),.14);
}
.chip.chip--ghost:hover{
  border-color:var(--brand-2) !important;
  color:var(--brand-2) !important;
}
.btn,
button.btn,
.btn-primary{
  background:var(--brand) !important;
  color:#fff !important;
  border-color:transparent;
}
.btn:hover,
button.btn:hover{
  background:#157a9c !important;
}
.btn.btn--ghost:hover{
  border-color:var(--brand-2) !important;
  color:var(--brand-2) !important;
}
.btn-ghost,
.adv-btn{
  border-color:rgba(var(--brand-rgb),.4) !important;
  color:#e8f7fc !important;
}
.section-title--orange .section-title__label{
  background:linear-gradient(90deg, rgba(var(--brand-rgb),.22), rgba(var(--brand-rgb),.1)) !important;
  border-color:rgba(var(--brand-rgb),.45) !important;
  box-shadow:0 0 0 1px rgba(var(--brand-rgb),.18) inset, 0 6px 20px rgba(var(--brand-rgb),.1) !important;
}
.section-title--orange .section-title__rule{
  background:linear-gradient(90deg, var(--brand), rgba(var(--brand-rgb),0)) !important;
}

/* Spotlight / promo band leftovers */
.we-home-promoted,
.home-promoted,
[class*="promoted-band"] a:hover{
  color:var(--brand-2);
}

/* Header: sneeuw over de hero (niet overflow:hidden op hele header — dat knipt submenu’s af) */
.site-header{
  position:relative;
  overflow:visible;
}
.site-header__media{
  overflow:hidden;
}
/* Header-sneeuw: BÓVEN foto + donkere overlay (.site-header::after = z-index 1) */
.site-header > .we-snow--header{
  position:absolute;
  inset:0;
  pointer-events:none;
  z-index:2;
  overflow:hidden;
  background-image:
    radial-gradient(4px 4px at 8% 12%, rgba(255,255,255,.98), transparent 70%),
    radial-gradient(3px 3px at 22% 38%, rgba(255,255,255,.92), transparent 70%),
    radial-gradient(5px 5px at 36% 8%, rgba(255,255,255,.95), transparent 70%),
    radial-gradient(2.5px 2.5px at 48% 55%, rgba(255,255,255,.85), transparent 70%),
    radial-gradient(4.5px 4.5px at 62% 22%, rgba(255,255,255,.96), transparent 70%),
    radial-gradient(3px 3px at 74% 68%, rgba(255,255,255,.88), transparent 70%),
    radial-gradient(5.5px 5.5px at 86% 18%, rgba(255,255,255,.97), transparent 70%),
    radial-gradient(2.8px 2.8px at 94% 48%, rgba(255,255,255,.82), transparent 70%),
    radial-gradient(3.5px 3.5px at 14% 72%, rgba(255,255,255,.9), transparent 70%),
    radial-gradient(4px 4px at 58% 82%, rgba(255,255,255,.93), transparent 70%);
  background-size:320px 220px;
  animation:we-header-snow-drift 12s linear infinite;
  opacity:.9;
  will-change:background-position, transform;
  filter:drop-shadow(0 0 1.5px rgba(255,255,255,.55));
}
.site-header > .we-snow--header::before,
.site-header > .we-snow--header::after{
  content:"";
  position:absolute;
  inset:-25% 0 0 0;
  pointer-events:none;
  background-image:
    radial-gradient(3.5px 3.5px at 12% 16%, rgba(255,255,255,.95), transparent 70%),
    radial-gradient(5px 5px at 28% 44%, rgba(255,255,255,.9), transparent 70%),
    radial-gradient(2.5px 2.5px at 44% 10%, rgba(255,255,255,.88), transparent 70%),
    radial-gradient(4px 4px at 60% 58%, rgba(255,255,255,.92), transparent 70%),
    radial-gradient(6px 6px at 76% 26%, rgba(255,255,255,.96), transparent 70%),
    radial-gradient(3px 3px at 90% 70%, rgba(255,255,255,.85), transparent 70%),
    radial-gradient(4.5px 4.5px at 18% 78%, rgba(255,255,255,.9), transparent 70%),
    radial-gradient(2.8px 2.8px at 52% 90%, rgba(255,255,255,.8), transparent 70%);
  background-size:380px 260px;
  animation:we-header-snow-drift-alt 18s linear infinite;
  opacity:.75;
  will-change:background-position, transform;
}
.site-header > .we-snow--header::after{
  animation-name:we-header-snow-drift-soft;
  animation-duration:26s;
  opacity:.6;
  background-size:280px 200px;
  background-image:
    radial-gradient(6px 6px at 10% 20%, rgba(255,255,255,.98), transparent 70%),
    radial-gradient(3px 3px at 30% 50%, rgba(255,255,255,.9), transparent 70%),
    radial-gradient(5px 5px at 50% 15%, rgba(255,255,255,.95), transparent 70%),
    radial-gradient(4px 4px at 70% 65%, rgba(255,255,255,.88), transparent 70%),
    radial-gradient(7px 7px at 88% 30%, rgba(255,255,255,.97), transparent 70%),
    radial-gradient(3.5px 3.5px at 20% 85%, rgba(255,255,255,.85), transparent 70%);
}
@keyframes we-header-snow-drift{
  from{ background-position:0 -220px; transform:translateX(0); }
  to{ background-position:120px 220px; transform:translateX(18px); }
}
@keyframes we-header-snow-drift-alt{
  from{ background-position:70px -260px; transform:translateX(0); }
  to{ background-position:-60px 260px; transform:translateX(-26px); }
}
@keyframes we-header-snow-drift-soft{
  from{ background-position:-40px -200px; transform:translateX(10px); }
  to{ background-position:100px 200px; transform:translateX(-14px); }
}
@media (prefers-reduced-motion: reduce){
  .site-header > .we-snow--header,
  .site-header > .we-snow--header::before,
  .site-header > .we-snow--header::after{ animation:none; opacity:.4; transform:none; filter:none; }
}
.site-header__media{ z-index:0; }
.site-header__inner,
.site-header__mobile-search-popover,
.site-header__mobile-search-backdrop{
  position:relative;
  z-index:3;
}
.site-header .dropdown{
  z-index:14000;
}

.site-footer a:hover,
footer a:hover{
  color:var(--brand-2);
}

/* Partnerkaart Kermis.nu (VS-parity) */
.we-kermis-card{
  overflow:hidden;
  border-radius:14px;
  border:1px solid rgba(255,255,255,.14);
  background:rgba(255,255,255,.06);
  box-shadow:0 10px 28px rgba(0,0,0,.22);
}
.we-kermis-card__header{
  position:relative;
  height:clamp(140px, 28vw, 220px);
  background:
    linear-gradient(180deg, rgba(8,12,22,.12), rgba(8,12,22,.72)),
    var(--we-kermis-header) center / cover no-repeat;
}
.we-kermis-card__header-img{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;pointer-events:none;
}
.we-kermis-card__logo{
  position:absolute;top:10px;right:10px;z-index:2;display:inline-flex;
  padding:6px 8px;border-radius:6px;background:rgba(0,0,0,.42);border:1px solid rgba(255,255,255,.18);line-height:0;
}
.we-kermis-card__logo img{display:block;width:auto;height:28px;max-width:120px;}
.we-kermis-card__logo-row{display:flex;justify-content:flex-end;padding:10px 12px 0;}
.we-kermis-card__logo--inline{position:static;}
.we-kermis-card__body{padding:16px 18px 18px;}
.we-kermis-card__eyebrow{
  margin:0 0 4px;font-size:.78rem;letter-spacing:.04em;text-transform:uppercase;opacity:.72;font-weight:700;
}

/* Breadcrumbs — detail + overzicht (page-overview.css dekt overview; detail ook) */
body.page--we-event .kv2-breadcrumb--overview,
body.page--promoten .kv2-breadcrumb--overview,
body.page--updates .kv2-breadcrumb--overview,
body.page--organisatoren .kv2-breadcrumb--overview{
  padding:10px 18px 4px;
  font-size:0.9rem;
  line-height:1.35;
  opacity:0.92;
  box-sizing:border-box;
}
body.page--we-event .kv2-breadcrumb--overview .kv2-breadcrumb__list,
body.page--promoten .kv2-breadcrumb--overview .kv2-breadcrumb__list,
body.page--updates .kv2-breadcrumb--overview .kv2-breadcrumb__list,
body.page--organisatoren .kv2-breadcrumb--overview .kv2-breadcrumb__list{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:0.35em 0.45em;
  list-style:none;
  margin:0;
  padding:0;
}
body.page--we-event .kv2-breadcrumb--overview .kv2-breadcrumb__item,
body.page--promoten .kv2-breadcrumb--overview .kv2-breadcrumb__item,
body.page--updates .kv2-breadcrumb--overview .kv2-breadcrumb__item,
body.page--organisatoren .kv2-breadcrumb--overview .kv2-breadcrumb__item{
  display:inline-flex;
  align-items:center;
}
body.page--we-event .kv2-breadcrumb--overview .kv2-breadcrumb__item:not(:last-child)::after,
body.page--promoten .kv2-breadcrumb--overview .kv2-breadcrumb__item:not(:last-child)::after,
body.page--updates .kv2-breadcrumb--overview .kv2-breadcrumb__item:not(:last-child)::after,
body.page--organisatoren .kv2-breadcrumb--overview .kv2-breadcrumb__item:not(:last-child)::after{
  content:'›';
  margin-left:0.4em;
  opacity:0.65;
  font-weight:500;
}
body.page--we-event .kv2-breadcrumb--overview .kv2-breadcrumb__link,
body.page--promoten .kv2-breadcrumb--overview .kv2-breadcrumb__link,
body.page--updates .kv2-breadcrumb--overview .kv2-breadcrumb__link,
body.page--organisatoren .kv2-breadcrumb--overview .kv2-breadcrumb__link{
  color:inherit;
  text-decoration:none;
  opacity:0.9;
}
body.page--we-event .kv2-breadcrumb--overview .kv2-breadcrumb__link:hover,
body.page--promoten .kv2-breadcrumb--overview .kv2-breadcrumb__link:hover,
body.page--updates .kv2-breadcrumb--overview .kv2-breadcrumb__link:hover,
body.page--organisatoren .kv2-breadcrumb--overview .kv2-breadcrumb__link:hover{
  text-decoration:underline;
  opacity:1;
}
body.page--we-event .kv2-breadcrumb--overview .kv2-breadcrumb__current,
body.page--promoten .kv2-breadcrumb--overview .kv2-breadcrumb__current,
body.page--updates .kv2-breadcrumb--overview .kv2-breadcrumb__current,
body.page--organisatoren .kv2-breadcrumb--overview .kv2-breadcrumb__current{
  opacity:0.78;
  font-weight:600;
}
.we-kermis-card__title{margin:0;font-size:clamp(1.25rem, 2.4vw, 1.55rem);line-height:1.2;font-weight:800;}
.we-kermis-card__place{margin:4px 0 0;opacity:.85;}
.we-kermis-card__dates{margin:8px 0 0;font-weight:700;color:rgba(255,210,160,.95);}
.we-kermis-card__intro{margin:10px 0 0;line-height:1.55;opacity:.92;}
.we-kermis-card__actions{margin:14px 0 0;}
.we-kermis-card__actions .btn{
  display:inline-block;padding:10px 14px;border-radius:10px;font-weight:700;text-decoration:none;
  background:var(--brand, #1a8fb8);color:#fff;border:0;
}

/* ---- Footer: ijsblauw i.p.v. Kermis-paars ---- */
.site-footer{
  background:linear-gradient(180deg, #0a2a36, #061820) !important;
  border-top:1px solid rgba(125,211,234,.18) !important;
}
.footer-links a,
.footer-nav__list a,
.footer-contact a:hover{
  color:var(--brand-2) !important;
}
.footer-links a:hover,
.footer-nav__list a:hover{
  color:#fff !important;
}
.footer-nav__title{
  color:rgba(125,211,234,.92) !important;
}
.footer-social a:hover{
  color:var(--accent) !important;
  border-color:rgba(var(--accent-rgb),.45) !important;
}

/* ---- Detailpagina: winterkleuren i.p.v. paars/oranje ---- */
body.page--we-event.page--kermis main.detail-grid{
  --kv2-section-head-glow: linear-gradient(180deg, rgba(14,74,92,.72) 0%, rgba(6,24,32,.28) 55%, transparent 100%) !important;
}
body.page--we-event.page--kermis #intro .h-underline::after,
body.page--we-event.page--kermis .h-underline::after{
  background:linear-gradient(90deg, var(--brand-2), var(--accent)) !important;
}
body.page--we-event.page--kermis .kv2-section-icon,
body.page--we-event.page--kermis .kv2-section-icon--svg{
  color:var(--brand-2) !important;
}
body.page--we-event.page--kermis .pi-opening-hrs,
body.page--we-event.page--kermis .chip,
body.page--we-event.page--kermis .kermis-hero__pill{
  --accent: var(--brand-2);
}
body.page--we-event.page--kermis a.pi-link,
body.page--we-event.page--kermis .pi-link-newsline,
body.page--we-event.page--kermis .kv2-countdown-inline__num{
  color:var(--brand-2) !important;
}

/* Breadcrumb onder hero */
body.page--we-event .kv2-breadcrumb--below-hero{
  padding-top:14px;
  padding-bottom:10px;
  opacity:.9;
}

/* ---- Page + hero sneeuw / nacht ---- */
body.page--we-event .page-bg--winter{
  background:
    radial-gradient(120% 80% at 50% -10%, rgba(26,143,184,.28), transparent 55%),
    linear-gradient(180deg, #041018 0%, #061820 45%, #0a2430 100%) !important;
  filter:none !important;
  opacity:1 !important;
  background-image:none !important;
}
.we-snow--page{
  position:fixed;
  inset:0;
  z-index:0;
  pointer-events:none;
  opacity:.35;
  background-image:
    radial-gradient(3px 3px at 12% 18%, rgba(255,255,255,.9), transparent 70%),
    radial-gradient(2px 2px at 28% 62%, rgba(255,255,255,.75), transparent 70%),
    radial-gradient(4px 4px at 48% 28%, rgba(255,255,255,.85), transparent 70%),
    radial-gradient(2.5px 2.5px at 72% 74%, rgba(255,255,255,.7), transparent 70%),
    radial-gradient(3.5px 3.5px at 88% 22%, rgba(255,255,255,.88), transparent 70%);
  background-size:340px 240px;
  animation:we-header-snow-drift 28s linear infinite;
}
body.page--we-event .site-header,
body.page--we-event main,
body.page--we-event .kermis-hero,
body.page--we-event .kv2-breadcrumb,
body.page--we-event .site-footer{
  position:relative;
  z-index:1;
}

body.page--we-event .kermis-hero--winter{
  background:#041018;
  min-height: clamp(220px, 28vw, 340px);
  height:auto;
}
body.page--we-event .kermis-hero--winter .kermis-hero__scrim{
  background:
    radial-gradient(90% 120% at 50% 0%, rgba(14,74,92,.55) 0%, rgba(4,16,24,.72) 55%, rgba(2,10,16,.88) 100%),
    linear-gradient(180deg, rgba(0,0,0,.15), rgba(0,0,0,.45)) !important;
}
/* Standaard winter-hero (geen foto): nachtelijke gradient — sneeuw komt uit .we-snow--hero */
body.page--we-event .kermis-hero--snow-night::before{
  content:"";
  position:absolute;
  inset:0;
  z-index:-2;
  background-color:#041018 !important;
  background-image:
    radial-gradient(ellipse 120% 80% at 50% -20%, rgba(125,211,234,.22), transparent 55%),
    radial-gradient(ellipse 90% 60% at 80% 100%, rgba(212,168,75,.12), transparent 50%),
    linear-gradient(165deg, #0a2a38 0%, #061820 42%, #030c12 100%) !important;
  background-size:auto !important;
  background-repeat:no-repeat !important;
  filter:none !important;
  transform:none !important;
  opacity:1 !important;
}
body.page--we-event .kermis-hero--snow-night .kermis-hero__scrim{
  background:
    linear-gradient(180deg, rgba(4,16,24,.15) 0%, rgba(4,16,24,.35) 55%, rgba(2,8,12,.55) 100%),
    radial-gradient(80% 70% at 50% 100%, rgba(26,143,184,.18), transparent 60%) !important;
}
.we-snow--hero{
  position:absolute;
  inset:0;
  z-index:0;
  pointer-events:none;
  opacity:.85;
  background-image:
    radial-gradient(4px 4px at 10% 15%, rgba(255,255,255,.98), transparent 70%),
    radial-gradient(3px 3px at 30% 40%, rgba(255,255,255,.9), transparent 70%),
    radial-gradient(5px 5px at 55% 12%, rgba(255,255,255,.95), transparent 70%),
    radial-gradient(2.5px 2.5px at 70% 55%, rgba(255,255,255,.82), transparent 70%),
    radial-gradient(4px 4px at 88% 28%, rgba(255,255,255,.96), transparent 70%),
    radial-gradient(3px 3px at 20% 75%, rgba(255,255,255,.88), transparent 70%);
  background-size:300px 200px;
  animation:we-header-snow-drift 14s linear infinite;
  filter:drop-shadow(0 0 1.5px rgba(255,255,255,.45));
}
body.page--we-event .kermis-hero__inner{
  z-index:1;
}
body.page--we-event .kermis-hero__pill{
  background:rgba(26,143,184,.35) !important;
  border-color:rgba(125,211,234,.4) !important;
}
@media (prefers-reduced-motion: reduce){
  .we-snow--page,
  .we-snow--hero{ animation:none; opacity:.4; }
}