/* Ionaajumlijstgenerator – eigen stijlen; de overige pagina's blijven intact. */
.iona-generator-body { margin:0; min-height:100vh; color:#172445; background:radial-gradient(ellipse at 70% 0%, #f8f9fa 0%,transparent 37%),#e9e4d2; font-family:Verdana,Arial,sans-serif; }
.iona-generator-body * { box-sizing:border-box; }
.iona-generator-main { width:min(1180px,calc(100% - 36px)); margin:0 auto; padding:19px 0 55px; }
.iona-hero { border-radius:12px; background:linear-gradient(123deg,#0b1e5b,#263e77 64%,#294f83); color:white; padding:21px clamp(20px,4vw,48px) 23px; box-shadow:0 10px 25px #081b421c; }
.iona-hero .iona-hero-titel { display:flex; align-items:center; gap:1px; margin:0 0 8px; font-size:clamp(20px,3.1vw,39px); letter-spacing:-.02em; white-space:nowrap; }
.iona-hero-titel img { display:block; min-width:0; width:min(430px,57%); height:auto; max-height:75px; object-fit:contain; object-position:left center; filter:brightness(0) invert(1); }
.iona-hero p { margin:0; line-height:1.5; color:#e8ebf8; max-width:none; }
.iona-indeling { display:grid; grid-template-columns:minmax(290px,410px) minmax(0,1fr); align-items:start; gap:25px; margin-top:19px; }
.iona-paneel,.iona-uitslagpaneel { background:#fffdf7; border:1px solid #c9c6be; border-radius:11px; padding:24px; box-shadow:0 3px 13px #14254a0a; }
.iona-paneel h2,.iona-uitslagpaneel h2 { margin:0 0 10px; font-size:clamp(21px,2.2vw,27px); }
.iona-paneel>p { font-size:14px; line-height:1.5; color:#434c5d; margin:0 0 20px; }
.iona-schuif { border:0; padding:0; margin:0 0 22px; min-width:0; }
.iona-schuif legend { width:100%; font-size:15px; font-weight:700; margin:0 0 13px; padding:0; }
.iona-schuif-stand { color:#b92530; display:inline-block; font-size:14px; min-width:21px; text-align:center; padding:3px 6px; background:#f6e7e6; border-radius:5px; }
.iona-schuif label { display:block; }
.iona-schuif .iona-uiteinden { display:flex; }
.iona-schuif input[type=range] { display:block; width:100%; margin:0; accent-color:#ba3337; cursor:pointer; background:transparent; }
.iona-uiteinden { margin-top:7px; display:flex; justify-content:space-between; gap:12px; font-size:13px; line-height:1.3; color:#4b5262; }
.iona-uiteinden span:last-child { text-align:right; }
.iona-schaal { display:flex; justify-content:space-between; margin-top:7px; padding:0 3px; font-size:11px; color:#858586; }
.iona-bediening { display:flex; flex-wrap:wrap; gap:9px; align-items:center; margin-top:6px; }
.iona-knop { cursor:pointer; border:1px solid #274575; background:#18346b; color:#fff; font:600 13px Verdana,Arial,sans-serif; border-radius:7px; padding:11px 12px; transition:background .15s; }
.iona-knop:hover,.iona-knop:focus-visible { background:#294e8e; }
.iona-knop.excel { display:inline-flex; align-items:center; justify-content:center; gap:7px; background:#107c41; border-color:#0b6032; }
.iona-knop.excel:hover,.iona-knop.excel:focus-visible { background:#0b6032; }
.iona-knop.excel:disabled { opacity:.65; cursor:wait; }
.iona-excel-pictogram { display:block; flex:none; }
.iona-knop.secundair { background:transparent; color:#253f6d; }
.iona-knop.secundair:hover,.iona-knop.secundair:focus-visible { background:#e9edf5; }
.iona-uitslagkop { display:flex; flex-wrap:wrap; gap:10px; justify-content:space-between; align-items:start; }
.iona-uitslagkop h2 { margin-bottom:4px; }
.iona-knop.iona-opnieuw { font-size:12px; padding:6px 8px; }
.iona-voorkeur { margin:4px 0 12px; color:#5d6070; font-size:13px; line-height:1.55; }
.iona-ranglijst { list-style:none; padding:0; margin:0; }
.iona-rangregel { border-top:1px solid #dadbdc; padding:3px 0; display:flex; align-items:center; gap:9px; min-height:32px; }
.iona-rangregel:last-child { border-bottom:1px solid #dadbdc; }
.iona-rangregel:nth-child(-n+3) .iona-rangnummer { color:#b22332; font-weight:800; }
.iona-rangnummer { flex:0 0 28px; font-variant-numeric:tabular-nums; font-size:14px; color:#727887; text-align:right; }
.iona-nummerinformatie { flex:1; min-width:0; line-height:1.3; }
.iona-nummertitel { font-size:15px; font-weight:700; overflow-wrap:anywhere; }
.iona-album { font-size:12px; color:#6b6f7a; overflow-wrap:anywhere; }
.iona-album::before { content:" — "; white-space:pre; }
.iona-melding { min-height:20px; margin:10px 0 0; font-size:13px; color:#375f3c; }
.iona-uitleg { margin:25px 2px 0; font-size:13px; color:#565e6c; line-height:1.65; max-width:1070px; }
.iona-uitleg a { color:#173f91; }
.iona-uitleg summary { cursor:pointer; font-weight:700; }
.iona-uitleg p { margin:8px 0 0; }
@media (max-width:790px) { .iona-indeling { grid-template-columns:minmax(0,1fr); gap:16px; } .iona-paneel,.iona-uitslagpaneel { padding:20px; } .iona-generator-main { width:min(680px,calc(100% - 22px)); padding-top:15px; } .iona-hero { padding:21px 20px; } }
@media (max-width:470px) { .iona-hero .iona-hero-titel { font-size:clamp(17px,5.1vw,21px); } .iona-hero-titel img { width:min(430px,53%); } }
@media print { .globalnav,.iona-paneel,.iona-bediening,.iona-uitleg { display:none!important; } .iona-generator-body { background:#fff; } .iona-hero { border:0; box-shadow:none; color:#171717; background:#fff; padding:3px 0; } .iona-hero img { filter:none; } .iona-hero p { color:#333; } .iona-generator-main { width:100%; } .iona-indeling { display:block; margin-top:10px; } .iona-uitslagpaneel { border:0; box-shadow:none; padding:0; } .iona-rangregel { padding:3px 0; break-inside:avoid; } }

/* De handmatige Top 25 en de overige 41 nummers. */
.iona-rangnummer { flex-basis:24px; }
.iona-nummerinformatie { line-height:1.25; }
.iona-rijacties { display:flex; flex:0 0 auto; gap:3px; align-items:center; }
.iona-klein { display:inline-flex; justify-content:center; align-items:center; border:1px solid #c9d1df; border-radius:5px; padding:0; width:27px; height:27px; font:700 17px/1 Verdana,Arial,sans-serif; color:#24436b; background:#f5f7fb; cursor:pointer; }
.iona-klein:hover,.iona-klein:focus-visible { background:#dce8f8; border-color:#647fa5; }
.iona-klein:disabled { opacity:.28; cursor:default; }
.iona-klein.verwijder { color:#a42935; }
.iona-klein.verwijder:hover,.iona-klein.verwijder:focus-visible { background:#fae6e8; border-color:#a42935; }
.iona-overige { margin:15px 0 0; border:1px solid #cdd5e1; border-radius:8px; background:#f6f8fc; font-size:13px; }
.iona-overige summary { cursor:pointer; padding:11px 13px; color:#203862; line-height:1.5; }
.iona-overige summary:hover { background:#e9eff8; }
.iona-overige-inhoud { border-top:1px solid #dbe2e9; padding:11px 13px 13px; }
.iona-zoeklabel { display:block; margin-bottom:5px; font-weight:700; font-size:12px; }
.iona-zoekveld { border:1px solid #a7b2c5; width:100%; padding:8px 10px; border-radius:5px; font:13px Verdana,Arial,sans-serif; background:white; color:#172445; }
.iona-restlijst { margin-top:8px; }
.iona-restregel { display:flex; align-items:center; gap:8px; padding:4px 0; border-bottom:1px solid #dce2ec; min-height:33px; }
.iona-restregel:last-child { border-bottom:0; }
.iona-restregel .iona-nummerinformatie { flex:1; min-width:0; }
.iona-restregel .iona-nummertitel { font-size:13px; }
.iona-restregel .iona-album { font-size:11px; }
.iona-klein.toevoegen { background:#e6f3ea; border-color:#acd0b3; color:#196638; width:auto; min-width:30px; padding:0 7px; font-size:14px; }
.iona-klein.toevoegen:hover,.iona-klein.toevoegen:focus-visible { background:#cbe8d3; }
.iona-geen-resultaten { padding:8px 0; color:#626a79; }
@media (max-width:470px) {
  .iona-rangregel { gap:6px; }
  .iona-rangnummer { flex-basis:21px; font-size:12px; }
  .iona-nummertitel { font-size:13px; }
  .iona-album { font-size:11px; }
  .iona-rijacties { gap:2px; }
  .iona-klein { width:25px; height:27px; font-size:16px; }
  .iona-uitslagkop { align-items:center; }
  .iona-knop.iona-opnieuw { font-size:11px; padding:6px; }
  .iona-overige summary span { font-size:12px; }
}
@media print { .iona-overige,.iona-rijacties,.iona-opnieuw,.iona-melding { display:none!important; } }

/* Doorlopende bewerkbare rangschikking: Top 25 en Bubbling Unders. */
.iona-uitslagpaneel > .iona-bediening { margin:5px 0 2px; }
.iona-alleen25 { color:#636e7c; font-size:11px; line-height:1.4; margin:5px 0 2px; }
.iona-bubbling, .iona-verwijderd { margin-top:17px; padding-top:11px; border-top:2px solid #cbd3df; }
.iona-bubbling h3, .iona-verwijderd h3 { font-size:18px; margin:0 0 5px; color:#253c68; }
.iona-aantal { font-size:12px; font-weight:normal; color:#707986; }
.iona-kleine-uitleg { font-size:12px; line-height:1.5; margin:0 0 10px; color:#68717e; }
.iona-bubbling .iona-zoekveld { margin-bottom:3px; }
.iona-bubbling .iona-restlijst { margin-top:6px; }
.iona-bubbling .iona-rangregel { border-bottom:0; }
.iona-bubbling .iona-rangregel:last-child { border-bottom:1px solid #dadbdc; }
.iona-bubbling .iona-nummertitel { font-size:14px; }
.iona-rangregel .iona-klein.naar25 { width:38px; font-size:11px; font-weight:800; background:#e6f3ea; color:#176838; border-color:#aacbb6; }
.iona-klein.naar25:hover, .iona-klein.naar25:focus-visible { background:#cbe8d3; }
.iona-verwijderd { background:#f7f7f8; border-radius:6px; padding:11px 10px 8px; }
.iona-verwijderd .iona-restregel { min-height:32px; }
.iona-verwijderd .iona-restregel .iona-nummertitel { font-size:13px; }
.iona-uitslagpaneel .iona-melding { margin:3px 0 7px; min-height:17px; }
[hidden] { display:none!important; }
@media (max-width:470px) {
  .iona-rangregel .iona-klein.naar25 { width:34px; font-size:10px; }
  .iona-bubbling .iona-nummertitel { font-size:12px; }
  .iona-bubbling h3, .iona-verwijderd h3 { font-size:17px; }
}
@media print {
  .iona-bubbling,.iona-verwijderd,.iona-alleen25,.iona-melding,.iona-rijacties { display:none!important; }
  #iona-uitslag { display:block; }
}
