.sva-wrap{max-width:1050px;margin:20px auto;padding:22px;color:#19352a;font-family:system-ui,sans-serif}.sva-head{display:flex;align-items:center;gap:22px;border-bottom:3px solid #147248;padding-bottom:20px}.sva-head img{width:100px;height:100px;object-fit:contain}.sva-head h2{margin:0;font-size:clamp(24px,4vw,34px)}.sva-head p{margin:5px 0}.sva-stat{display:flex;flex-direction:column;background:#e7f3eb;padding:20px;border-radius:12px;margin:18px 0}.sva-stat strong{font-size:30px}.sva-note{background:#f4f6e9;padding:12px}.sva-shifts{display:grid;gap:12px}.sva-shift{display:flex;align-items:center;justify-content:space-between;gap:18px;border:1px solid #d5e1d9;border-radius:12px;padding:16px}.sva-shift small{color:#52665b}.sva-shift p{margin:6px 0}.sva-shift button,.sva-wrap input[type=submit]{border:0;border-radius:8px;background:#126b45;color:white;padding:10px 16px;cursor:pointer}.sva-shift form{margin:5px 0}.sva-foot{border-top:1px solid #d5e1d9;margin-top:25px;padding-top:15px}@media(max-width:600px){.sva-wrap{padding:12px}.sva-head{gap:10px}.sva-head img{width:70px;height:70px}.sva-shift{align-items:flex-start;flex-direction:column}.sva-shift button{min-height:44px}}

/* Maandoverzicht 2027 */
.sva-month-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:18px 0 28px}.sva-month-tile{display:flex;flex-direction:column;gap:8px;padding:20px 15px;border:1px solid #c9dfd1;border-radius:12px;background:#f0f7f2;text-decoration:none!important;color:#173c2b!important;transition:background .15s}.sva-month-tile:hover,.sva-month-tile:focus{background:#dcefe2}.sva-month-tile strong{font-size:18px}.sva-month-tile span{font-size:13px;color:#4a6756}.sva-month-section{margin:25px 0 34px;scroll-margin-top:35px}.sva-month-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;border-bottom:2px solid #d5e1d9;margin-bottom:14px}.sva-month-heading h3{margin:8px 0 12px}.sva-month-heading a{font-size:13px}.sva-month-empty{color:#60736a;margin:4px 0 12px}@media(max-width:800px){.sva-month-grid{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:550px){.sva-month-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.sva-month-tile{padding:16px 12px}}

/* Versie 2.8: alle maanden onder elkaar; alleen gekozen maand zichtbaar */
.sva-month-grid{display:flex;flex-direction:column;gap:10px;max-width:720px}
.sva-month-tile{flex-direction:row;align-items:center;justify-content:space-between;padding:16px 20px}
@media(max-width:800px){.sva-month-grid{display:flex;flex-direction:column}}
@media(max-width:550px){.sva-month-grid{display:flex;flex-direction:column}.sva-month-tile{padding:16px 14px}}

/* v2.9: WordPress theme overrides prevented vertical month listing */
.sva-wrap .sva-month-grid{display:block!important;width:100%!important;max-width:720px!important;columns:1!important;column-count:1!important}
.sva-wrap .sva-month-grid .sva-month-tile{display:flex!important;width:100%!important;box-sizing:border-box!important;float:none!important;clear:both!important;margin:0 0 10px!important}

/* 2.9: voorkom dat thema/WordPress gridregels maandvakken naast elkaar zetten */
.sva-wrap .sva-month-grid{display:flex!important;flex-direction:column!important;grid-template-columns:1fr!important;width:100%!important;max-width:720px!important;align-items:stretch!important}
.sva-wrap .sva-month-grid>.sva-month-tile{display:flex!important;flex-direction:row!important;box-sizing:border-box!important;width:100%!important;max-width:none!important;float:none!important;clear:both!important}

/* v3.0: elk dienstitem een eigen verticaal blok, met compacte inschrijfknop */
.sva-wrap .sva-month-section .sva-shifts{display:flex!important;flex-direction:column!important;gap:14px!important;width:100%!important}
.sva-wrap .sva-month-section .sva-service-card{display:flex!important;flex-direction:column!important;align-items:stretch!important;justify-content:flex-start!important;gap:12px!important;width:100%!important;max-width:100%!important;box-sizing:border-box!important;padding:16px 18px!important;margin:0!important;background:#f9fcfa!important;border:1px solid #cbded1!important;border-left:5px solid #147248!important;border-radius:12px!important;float:none!important;clear:both!important}
.sva-wrap .sva-service-card>div{width:100%!important;min-width:0!important}
.sva-wrap .sva-service-card form{display:inline-block!important;width:auto!important;max-width:max-content!important;margin:0!important}
.sva-wrap .sva-service-card button{display:inline-flex!important;align-items:center!important;justify-content:center!important;width:auto!important;min-width:0!important;max-width:max-content!important;min-height:36px!important;padding:7px 14px!important;font-size:14px!important;line-height:1.3!important;border-radius:7px!important;white-space:nowrap!important}

/* v3.1: diensten per soort in een vak; gegevens op een regel, actie eronder */
.sva-wrap .sva-month-section .sva-shifts{display:block!important}
.sva-wrap .sva-service-group{display:block!important;border:2px solid #bfd9c8!important;border-radius:12px!important;background:#f7fbf8!important;padding:15px!important;margin:0 0 20px!important;width:100%!important;box-sizing:border-box!important}
.sva-wrap .sva-service-group h4{margin:0 0 12px!important;font-size:20px!important;color:#145b3b!important}
.sva-wrap .sva-service-list{display:block!important}
.sva-wrap .sva-service-entry{display:block!important;background:#fff!important;border:1px solid #d9e7dd!important;border-radius:8px!important;padding:12px 14px!important;margin:0 0 10px!important;box-sizing:border-box!important}
.sva-wrap .sva-service-line{display:flex!important;flex-wrap:wrap!important;align-items:center!important;gap:5px 16px!important;font-size:14px!important;line-height:1.5!important}
.sva-wrap .sva-service-line span{display:inline-block!important;width:auto!important;white-space:nowrap!important}
.sva-wrap .sva-service-action{display:block!important;margin-top:8px!important}
.sva-wrap .sva-service-action form{display:inline-block!important;width:auto!important;margin:0!important}
.sva-wrap .sva-service-action button{display:inline-block!important;width:auto!important;max-width:max-content!important;padding:5px 12px!important;font-size:13px!important;min-height:32px!important;line-height:1.3!important}
.sva-wrap .sva-service-notes{font-size:13px;margin:6px 0!important}

/* v3.2: per dienstsoort een kolom met een lichtblauw vak; diensten onder elkaar */
.sva-wrap .sva-month-section .sva-shifts{display:grid!important;grid-template-columns:repeat(3,minmax(0,1fr))!important;align-items:start!important;gap:14px!important;width:100%!important}
.sva-wrap .sva-service-group{display:flex!important;flex-direction:column!important;min-width:0!important;width:100%!important;max-width:none!important;padding:0!important;margin:0!important;border:0!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
.sva-wrap .sva-service-group h4{font-size:19px!important;font-weight:700!important;line-height:1.3!important;color:#171717!important;margin:0 0 8px!important;padding:0!important}
.sva-wrap .sva-service-list{display:block!important;min-height:150px!important;padding:14px 15px!important;background:#dceaf8!important;border:2px solid #263b49!important;border-radius:0!important;box-sizing:border-box!important;width:100%!important}
.sva-wrap .sva-service-entry{display:block!important;padding:0 0 14px!important;margin:0 0 14px!important;border:0!important;border-bottom:1px solid #b3c9db!important;border-radius:0!important;background:transparent!important;box-shadow:none!important}
.sva-wrap .sva-service-entry:last-child{border-bottom:0!important;margin-bottom:0!important;padding-bottom:0!important}
.sva-wrap .sva-service-line{display:flex!important;flex-direction:column!important;align-items:flex-start!important;gap:0!important;font-size:16px!important;line-height:1.35!important}
.sva-wrap .sva-service-line span{display:block!important;width:auto!important;max-width:100%!important;white-space:normal!important;overflow-wrap:anywhere!important}
.sva-wrap .sva-service-notes{font-size:15px!important;margin:4px 0!important}
.sva-wrap .sva-service-action{display:flex!important;justify-content:flex-end!important;margin-top:12px!important}
.sva-wrap .sva-service-action button{background:#9f514d!important;color:#fff!important;border:0!important;border-radius:0!important;font-weight:700!important;font-size:14px!important;line-height:1.2!important;min-height:30px!important;padding:5px 15px!important;width:auto!important}
@media(max-width:850px){.sva-wrap .sva-month-section .sva-shifts{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:570px){.sva-wrap .sva-month-section .sva-shifts{grid-template-columns:minmax(0,1fr)!important}}

/* v3.3: compactere dienstvakken en inschrijfknoppen */
.sva-wrap .sva-service-list{min-height:0!important;padding:9px 11px!important}
.sva-wrap .sva-service-entry{padding-bottom:8px!important;margin-bottom:8px!important}
.sva-wrap .sva-service-line{font-size:14px!important;line-height:1.2!important}
.sva-wrap .sva-service-notes{font-size:13px!important;margin:2px 0!important;line-height:1.2!important}
.sva-wrap .sva-service-action{margin-top:5px!important}
.sva-wrap .sva-service-action form{margin:0!important;padding:0!important}
.sva-wrap .sva-service-action button{min-height:25px!important;padding:3px 10px!important;font-size:12px!important;line-height:1.15!important}
.sva-wrap .sva-service-group h4{margin-bottom:5px!important}

/* v3.4: alle dienstsoorten, inclusief Wapenkeuren, naast elkaar in kolommen. */
@media(min-width:1150px){.sva-wrap{max-width:1400px!important}}
@media(min-width:1050px){.sva-wrap .sva-month-section .sva-shifts{grid-template-columns:repeat(4,minmax(0,1fr))!important}}
@media(min-width:851px) and (max-width:1049px){.sva-wrap .sva-month-section .sva-shifts{grid-template-columns:repeat(3,minmax(0,1fr))!important}}
@media(min-width:571px) and (max-width:850px){.sva-wrap .sva-month-section .sva-shifts{grid-template-columns:repeat(2,minmax(0,1fr))!important}}
@media(max-width:570px){.sva-wrap .sva-month-section .sva-shifts{grid-template-columns:minmax(0,1fr)!important}}

/* v3.5: vier categorieen per rij op normale desktopbreedte; compacte acties. */
@media (min-width: 780px) {
  .sva-wrap .sva-month-section .sva-shifts {
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:12px!important;
  }
}
@media (min-width: 540px) and (max-width: 779px) {
  .sva-wrap .sva-month-section .sva-shifts {grid-template-columns:repeat(2,minmax(0,1fr))!important;}
}
@media (max-width: 539px) {
  .sva-wrap .sva-month-section .sva-shifts {grid-template-columns:minmax(0,1fr)!important;}
}
.sva-wrap .sva-service-group {min-width:0!important;}
.sva-wrap .sva-service-list {padding:8px 10px!important;min-height:0!important;}
.sva-wrap .sva-service-action {margin:5px 0 0!important;min-height:0!important;}
.sva-wrap .sva-service-action form {display:inline-flex!important;flex:0 0 auto!important;width:auto!important;max-width:max-content!important;}
.sva-wrap .sva-service-action button,
.sva-wrap .sva-service-action form button[type="submit"] {
  display:inline-block!important;
  box-sizing:border-box!important;
  width:auto!important;
  height:auto!important;
  min-width:0!important;
  min-height:0!important;
  max-width:max-content!important;
  padding:5px 10px!important;
  margin:0!important;
  font-size:12px!important;
  line-height:1.2!important;
  border-radius:3px!important;
}

/* v3.6: klikbare dienstsoorten; diensten verschijnen alleen na openklappen. */
.sva-wrap .sva-service-accordion {display:block!important;align-self:start!important;min-width:0!important;}
.sva-wrap .sva-service-accordion > .sva-service-toggle {display:flex!important;align-items:center!important;justify-content:space-between!important;gap:8px!important;cursor:pointer!important;background:#dceaf8!important;border:2px solid #263b49!important;padding:12px!important;font-size:16px!important;font-weight:700!important;color:#172c38!important;list-style:none!important;min-height:55px!important;box-sizing:border-box!important;}
.sva-wrap .sva-service-accordion > .sva-service-toggle::-webkit-details-marker {display:none!important;}
.sva-wrap .sva-service-accordion > .sva-service-toggle::marker {content:'';}
.sva-wrap .sva-service-accordion > .sva-service-toggle:focus-visible {outline:3px solid #1764a5!important;outline-offset:3px!important;}
.sva-wrap .sva-service-count {font-size:12px!important;font-weight:400!important;white-space:nowrap!important;}
.sva-wrap .sva-service-chevron {font-size:19px!important;transition:transform .15s ease!important;}
.sva-wrap .sva-service-accordion[open] .sva-service-chevron {transform:rotate(180deg)!important;}
.sva-wrap .sva-service-accordion > .sva-service-list {border-top:0!important;}
.sva-wrap .sva-service-accordion:not([open]) > .sva-service-list {display:none!important;}

/* Versie 3.7: bezetting en namen per dienst */
.sva-wrap .sva-service-availability{font-size:13px!important;line-height:1.35!important;margin-top:5px!important}
.sva-wrap .sva-service-registrants{font-size:13px!important;line-height:1.35!important;margin-top:3px!important;overflow-wrap:anywhere!important}

/* Versie 4.2: compacte afmeldknop bij Mijn aangemelde diensten. */
.sva-my-cancel{margin:8px 0 0!important}.sva-my-cancel button{padding:5px 12px!important;min-height:0!important;width:auto!important;font-size:14px!important}
