:root{--grijs:#6a7586;}
@font-face{font-family:'Roboto';src:url('/css/roboto.woff2') format('woff2');font-weight:normal;font-style:normal;font-display:swap;}
@font-face{font-family:'Roboto';src:url('/css/roboto-bold.woff2') format('woff2');font-weight:bold;font-style:normal;font-display:swap;}
@font-face{font-family:'Roboto Condensed';src:url('/css/roboto-condensed.woff2') format('woff2');font-weight:normal;font-style:normal;font-display:swap;}
@font-face{font-family:'Roboto Condensed';src:url('/css/roboto-condensed-bold.woff2') format('woff2');font-weight:bold;font-style:normal;font-display:swap;}
html{height:100%;}
body{margin:0;padding:0;height:100vh;height:100dvh;overflow:hidden;display:flex;flex-direction:column;background-color:#e9f1fb;color:#222;font:15px/1.4 'Roboto',Arial,Helvetica,sans-serif;}
main{flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:0 14px 14px 14px;scrollbar-width:thin;scrollbar-color:#b9c5d8 transparent;}
h1{margin:12px 2px 10px 2px;color:#1860c0;font:bold 21px/1.1 'Roboto',Arial,sans-serif;text-align:center;}
header{flex:0 0 auto;padding:calc(env(safe-area-inset-top) + 12px) 14px 12px 14px;background:#e9f1fb;}
header h1{margin:0;}
header .zoek{margin-top:12px;}
.card{background:#fff;border-radius:14px;box-shadow:0 1px 4px rgba(24,96,192,0.12);overflow:hidden;}
.card + .card{margin-top:14px;}
.link{display:flex;align-items:center;gap:13px;padding:8px 12px;color:#222;text-decoration:none;border-bottom:1px solid #edf2f9;}
.link:last-child{border-bottom:none;}
.link:active{background:#f3f7fd;}
.link i{flex:0 0 auto;width:42px;height:42px;border-radius:12px;display:flex;align-items:center;justify-content:center;}
.link i svg{width:24px;height:24px;fill:none;stroke:#fff;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;}
.link span{flex:1;display:flex;flex-direction:column;gap:2px;font-weight:bold;font-size:15px;}
.link span small{font-weight:normal;font-size:13px;color:var(--grijs);}
.link > svg{flex:0 0 auto;width:20px;height:20px;fill:none;stroke:#b9c5d8;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.link i{background:#7bce23;}
menu{flex:0 0 auto;margin:0;padding:0 0 env(safe-area-inset-bottom) 0;background:#1860c0;display:flex;justify-content:center;}
menu a{flex:1;max-width:140px;display:flex;flex-direction:column;align-items:center;gap:3px;padding:8px 4px 7px 4px;color:#ffffff;text-decoration:none;font:11px/1 'Roboto',Arial,Helvetica,sans-serif;opacity:0.85;position:relative;}
menu a.actief{opacity:1;font-weight:bold;}
menu svg{width:26px;height:26px;fill:none;stroke:#ffffff;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;}
menu a::before{
 content:"";
 position:absolute;top:0;left:0;right:0;
 height:3px;
 background:#fff;
 opacity:0;
 transform:scaleX(.4);
 transition:opacity .18s ease,transform .18s ease;
}
menu a.actief::before{opacity:1;transform:scaleX(1);}
@media (prefers-reduced-motion:reduce){
 menu a::before{transition:none;}
}
menu li{display:contents;}
.zoek{display:flex;align-items:center;gap:11px;margin:0;padding:0 15px;background:#fff;border-radius:14px;box-shadow:0 1px 4px rgba(24,96,192,0.12);}
.zoek svg{flex:0 0 auto;width:20px;height:20px;fill:none;stroke:var(--grijs);stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.zoek input{flex:1;min-width:0;border:0;outline:0;padding:13px 0;background:transparent;color:#222;font:16px 'Roboto Condensed',Arial,Helvetica,sans-serif;}
.zoek input::placeholder{color:#b9c5d8;}
.lijst .link{gap:11px;font-family:'Roboto Condensed',Arial,Helvetica,sans-serif;}
.lijst .link span{font-family:'Roboto Condensed',Arial,Helvetica,sans-serif;font-size:16px;align-items:flex-start;text-align:left;}
.lijst .link b{flex:0 0 56px;display:flex;flex-direction:row;align-items:center;gap:6px;font-weight:normal;}
.lijst .link b img{width:22px;height:22px;border-radius:50%;box-shadow:0 0 0 1px rgba(0,0,0,0.08);}
.lijst .link b small{font-size:12px;color:var(--grijs);white-space:nowrap;}

img.live{height:16px;width:48px;}

/* datumblok (herbruikbaar: uitslagen, evenementen, inschrijven) */
.datum{flex:0 0 58px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;font-family:'Roboto Condensed',Arial,Helvetica,sans-serif;line-height:1.05;color:var(--grijs);}
.datum .dt-kop{display:flex;align-items:baseline;justify-content:center;gap:4px;}
.datum em{font-style:normal;}
.datum .dt-wkd{font-size:12px;}
.datum .dt-dag{font-size:23px;font-weight:bold;line-height:1;color:#1860c0;}
.datum .dt-mnd{margin-top:2px;font-size:11px;letter-spacing:.3px;white-space:nowrap;}

#leeg{display:none;flex-direction:column;align-items:center;gap:10px;padding:40px 0;text-align:center;color:var(--grijs);font-weight:bold;}
#leeg svg{width:42px;height:42px;fill:none;stroke:#b9c5d8;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;}
.paginatitel{position:relative;display:flex;align-items:center;justify-content:center;}
.paginatitel h1{margin:0;}
.titel-terug{position:absolute;left:0;display:flex;align-items:center;color:#0054a6;}
.titel-terug svg{width:28px;height:28px;}

 .ev-kop{display:flex;align-items:center;gap:16px;}
 .ev-datum{flex:0 0 auto;width:76px;border-radius:12px;overflow:hidden;text-align:center;box-shadow:0 1px 3px rgba(0,0,0,0.2);}
 .ev-datum .ev-mnd{background:#0054a6;color:#ffffff;font-size:13px;font-weight:bold;text-transform:uppercase;letter-spacing:1px;padding:3px 0;}
 .ev-datum .ev-dag{background:#ffffff;font-size:32px;font-weight:bold;line-height:1.2;padding:2px 0;}
 .ev-datum .ev-wkd{background:#ffffff;color:#666666;font-size:12px;padding:0 0 5px 0;}
 .ev-kop h2{margin:0 0 4px 0;font-size:20px;line-height:1.25;}
 .ev-plaats{display:flex;align-items:center;gap:6px;color:#666666;font-size:15px;}
 .ev-plaats svg{width:18px;height:18px;flex:0 0 auto;}
 .card-kaart{padding:0;overflow:hidden;}
 .card-kaart iframe{display:block;width:100%;height:300px;border:0;}
 .card-links{padding:0;}
 .ev-link{display:flex;align-items:center;gap:14px;padding:14px 16px;color:inherit;text-decoration:none;border-bottom:solid 1px #eeeeee;}
 .ev-link:last-child{border-bottom:none;}
 .ev-link .ev-icoon{flex:0 0 auto;display:flex;color:#0054a6;}
 .ev-link .ev-icoon svg{width:26px;height:26px;}
 .ev-link .ev-tekst{flex:1 1 auto;min-width:0;}
 .ev-link .ev-tekst b{display:block;font-size:16px;}
 .ev-link .ev-tekst span{display:block;color:#666666;font-size:14px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
 .ev-link .ev-pijl{flex:0 0 auto;display:flex;color:#999999;}
 .ev-link .ev-pijl svg{width:20px;height:20px;}
 .ev-fout{display:flex;align-items:center;gap:12px;color:#f44336;font-weight:bold;}
 .ev-fout svg{width:32px;height:32px;flex:0 0 auto;}

body:has(#uitslag) main{padding:0;overflow:hidden;display:flex;}
#uitslag{flex:1;width:100%;margin:0;border:0;}

/* === Archief: zoeken in historische uitslagen === */
#results .zk-event{margin-top:14px;}
.zk-intro{display:flex;flex-direction:column;align-items:center;gap:12px;padding:26px 20px;text-align:center;color:#000;}
.zk-intro svg{flex:0 0 auto;width:44px;height:44px;fill:none;stroke:#1860c0;stroke-width:2.5;stroke-linecap:round;stroke-linejoin:round;}
.zk-intro p{margin:0;font-size:15px;line-height:1.5;}
.zk-intro p + p{margin-top:6px;}
.zk-intro .zk-aantal{font-size:17px;}
.zk-intro .zk-aantal b{font-size:23px;font-weight:bold;font-variant-numeric:tabular-nums;color:#1860c0;}

#spinner{display:none;justify-content:center;margin-top:20px;color:#1860c0;}
#spinner svg{width:52px;height:52px;}
.zk-kop{display:flex;align-items:center;gap:12px;padding:12px 14px;color:inherit;text-decoration:none;border-bottom:1px solid #edf2f9;background:#f7faff;}
.zk-kop:active{background:#eef4fc;}
.zk-koptekst{flex:1;min-width:0;}
.zk-naam{display:block;font-weight:bold;font-size:16px;color:#1860c0;line-height:1.25;}
.zk-info{display:flex;flex-wrap:wrap;gap:3px 14px;margin-top:4px;color:var(--grijs);font-size:13px;}
.zk-info span{display:flex;align-items:center;gap:5px;}
.zk-info svg{width:15px;height:15px;flex:0 0 auto;fill:none;stroke:currentColor;stroke-width:1.75;stroke-linecap:round;stroke-linejoin:round;}
.zk-kop .pijl{flex:0 0 auto;width:20px;height:20px;fill:none;stroke:#b9c5d8;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.zk-groep{border-bottom:1px solid #edf2f9;}
.zk-groep:last-child{border-bottom:none;}
.zk-caption{display:flex;align-items:center;gap:6px;padding:10px 14px 4px 14px;font-weight:bold;font-size:13px;color:var(--grijs);font-family:'Roboto Condensed',Arial,Helvetica,sans-serif;}
.zk-caption svg.cert{width:16px;height:16px;flex:0 0 auto;fill:none;stroke:#7bce23;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}
.zk-rij{display:flex;align-items:center;gap:12px;padding:8px 14px;border-bottom:1px solid #edf2f9;font-family:'Roboto Condensed',Arial,Helvetica,sans-serif;}
.zk-rij:last-child{border-bottom:none;}
.zk-plts{flex:0 0 34px;text-align:center;font-weight:bold;font-size:15px;color:#1860c0;}
.zk-mid{flex:1;min-width:0;display:flex;flex-direction:column;gap:1px;}
.zk-mid b{font-size:16px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.zk-mid small{font-size:13px;color:var(--grijs);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.zk-tijd{flex:0 0 auto;display:flex;flex-direction:column;align-items:flex-end;gap:1px;text-align:right;}
.zk-tijd b{font-size:16px;font-variant-numeric:tabular-nums;}
.zk-tijd small{font-size:12px;color:var(--grijs);white-space:nowrap;font-variant-numeric:tabular-nums;}
.zk-tijd .sub{font-size:11px;color:var(--grijs);font-weight:normal;}
.zoek button{flex:0 0 auto;display:flex;align-items:center;border:0;background:none;padding:10px 0 10px 10px;cursor:pointer;color:#1860c0;}
.zoek button svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;}

#melding{display:none;padding:8px 14px;font-size:.85rem;color:#666;text-align:center}

#kaart { width:100%; height:220px; }
.kaart-pin { color:#1860c0; }
.kaart-pin svg { width:32px; height:32px; }