/* Aanbiedersportaal: bouwt voort op wmo.css (grote letters, hoog contrast). Invoer altijd 16px of groter. */

.wa-nav { display: flex; flex-wrap: wrap; gap: 6px 18px; align-items: center; margin: 14px 0 0; font-size: 18px; }
.wa-nav form { margin: 0; }
.wa-linkknop { background: none; border: 0; padding: 0; font: inherit; color: var(--accent); text-decoration: underline; cursor: pointer; }

.wa-melding { border-radius: 8px; padding: 14px 18px; margin: 20px 0; font-size: 18px; border: 2px solid var(--accent); background: var(--accent-zacht); }
.wa-melding.wa-fout, .wa-fout-blok { border-color: #a4161a; background: #fdf0f0; }
.wa-melding.wa-info { border-color: var(--rand); background: var(--vlak); }

form.wa-form { margin: 10px 0 0; }
.wa-blok { border: 2px solid var(--rand); border-radius: 10px; padding: 14px 18px 18px; margin: 22px 0; min-width: 0; }
.wa-blok > legend { font-size: 22px; font-weight: 700; padding: 0 6px; }
.wa-veld { margin: 16px 0 0; min-width: 0; }
.wa-veld label, .wa-zoekgem label { display: block; font-weight: 600; margin-bottom: 2px; }
.wa-hulp { display: block; font-size: 17px; color: var(--inkt-2); margin-bottom: 4px; }
.wa-optioneel { font-weight: 400; color: var(--inkt-2); font-size: 17px; }
.wa-veld input, .wa-veld textarea, .wa-veld select, .wa-zoekgem input, .wa-form select {
  width: 100%; max-width: 100%; font: inherit; font-size: 18px; padding: 11px 13px;
  border: 2px solid #8d877c; border-radius: 8px; background: #fff; color: var(--inkt);
}
.wa-veld textarea { min-height: 130px; resize: vertical; }
.wa-veld input:focus, .wa-veld textarea:focus, .wa-zoekgem input:focus, .wa-form select:focus,
.wa-keuze input:focus-visible { outline: 3px solid var(--accent); outline-offset: 2px; }
.wa-veld input[aria-invalid="true"], .wa-veld textarea[aria-invalid="true"] { border-color: #a4161a; }
.wa-fout { color: #a4161a; font-weight: 600; font-size: 17px; margin: 2px 0 6px; }
.wa-twee { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 2fr); gap: 0 14px; }

.wa-janee { border: 0; padding: 0; margin: 18px 0 0; min-width: 0; }
.wa-janee legend { font-weight: 600; padding: 0; margin-bottom: 4px; }
.wa-vinkjes { display: grid; gap: 4px; }
.wa-keuze { display: flex; gap: 10px; align-items: flex-start; padding: 7px 0; cursor: pointer; overflow-wrap: anywhere; }
.wa-keuze input { width: 24px; height: 24px; margin: 3px 0 0; flex: 0 0 auto; accent-color: var(--accent); }
.wa-janee .wa-keuze { display: inline-flex; margin-right: 22px; }
.wa-groot { font-weight: 600; }

.wa-zoekgem { margin: 12px 0; }
.wa-prov { border: 2px solid var(--rand); border-radius: 8px; margin: 8px 0; background: #fff; }
.wa-prov summary { cursor: pointer; padding: 11px 14px; font-weight: 700; font-size: 19px; }
.wa-prov[open] summary { border-bottom: 1px solid var(--rand); }
.wa-teller { font-weight: 400; color: var(--accent); font-size: 17px; margin-left: 6px; }
.wa-heel { padding: 10px 14px 4px; font-weight: 600; }
.wa-gemeenten { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(100%, 200px), 1fr)); gap: 0 14px; padding: 4px 14px 12px; }
.wa-gemeenten .wa-keuze { font-size: 17px; padding: 5px 0; }
.wa-uit { opacity: .45; }

button.knop, .wa-knop { display: inline-block; border: 0; cursor: pointer; font: inherit; font-size: 19px; font-weight: 600;
  background: var(--accent); color: #fff; padding: 13px 22px; border-radius: 8px; text-decoration: none; }
button.knop:hover, .wa-knop:hover { background: #164a75; }
.wa-knop-licht { background: #fff; color: var(--accent); border: 2px solid var(--accent); }
.wa-knop-licht:hover { background: var(--accent-zacht); color: var(--accent); }
.wa-knop-rood { background: #a4161a; }
.wa-knop-rood:hover { background: #7f1013; }
.wa-acties { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; margin: 18px 0; }
.wa-acties form { margin: 0; }

.wa-status { display: inline-block; padding: 3px 12px; border-radius: 999px; font-weight: 700; font-size: 17px; border: 2px solid; }
.wa-s-in_behandeling { color: #7a4a00; border-color: #c98a1b; background: #fff7e6; }
.wa-s-actief { color: #12602e; border-color: #2f8f4e; background: #ecf8f0; }
.wa-s-gepauzeerd { color: #3c424e; border-color: #8d877c; background: var(--vlak); }
.wa-s-afgewezen { color: #a4161a; border-color: #a4161a; background: #fdf0f0; }

.wa-kaart { border: 2px solid var(--rand); border-radius: 10px; padding: 16px 20px; margin: 20px 0; }
.wa-kaart h2 { margin-top: 0; }
.wa-gegevens { display: grid; grid-template-columns: minmax(0, 13em) minmax(0, 1fr); gap: 6px 16px; margin: 0; }
.wa-gegevens dt { font-weight: 600; color: var(--inkt-2); }
.wa-gegevens dd { margin: 0; overflow-wrap: anywhere; white-space: pre-line; }

.wa-filters { display: flex; flex-wrap: wrap; gap: 10px 14px; align-items: flex-end; margin: 16px 0; }
.wa-filters label { display: block; font-weight: 600; font-size: 17px; }
.wa-filters select { width: auto; min-width: 10em; }
.wa-tabel-wrap { overflow-x: auto; }
.wa-tabel { width: 100%; border-collapse: collapse; font-size: 17px; }
.wa-tabel th, .wa-tabel td { text-align: left; padding: 9px 8px; border-bottom: 1px solid var(--rand); vertical-align: top; }
.wa-tabel th { background: var(--vlak); }
.wa-log { font-size: 17px; padding-left: 20px; }
.wa-klein { font-size: 17px; color: var(--inkt-2); }

@media (max-width: 600px) {
  .wa-twee { grid-template-columns: minmax(0, 1fr); }
  .wa-gegevens { grid-template-columns: minmax(0, 1fr); }
  .wa-gegevens dd { margin-bottom: 8px; }
  main { padding-left: 16px; padding-right: 16px; }
  .wa-blok { padding: 10px 12px 14px; }
  .wa-tabel thead { display: none; }
  .wa-tabel tr { display: block; border: 2px solid var(--rand); border-radius: 8px; margin: 10px 0; padding: 6px 10px; }
  .wa-tabel td { display: block; border: 0; padding: 3px 0; }
}