/* Setup is een rustig formulier in de bestaande Instellingen-shell. */
.kop-head { display:flex; flex-wrap:wrap; align-items:flex-start; justify-content:space-between; gap:16px; }
.kop-head .btn { flex:none; }
.kop-form { padding:0; overflow:visible; }
.kop-form fieldset { min-width:0; border:0; margin:0; padding:0; }
.kop-section { padding:24px; border-bottom:1px solid var(--border); }
.kop-section h3 { margin:0 0 16px; font-size:18px; font-weight:600; }
.kop-grid { display:grid; grid-template-columns:minmax(0,1fr); gap:16px; }
.kop-field { min-width:0; display:flex; flex-direction:column; gap:8px; }
.kop-field label { font-size:14px; font-weight:500; }
.kop-field input,.kop-field select { box-sizing:border-box; width:100%; min-width:0; min-height:44px; font:inherit; font-size:16px; padding:8px 12px; border:1px solid var(--border); border-radius:8px; background:var(--surface); color:var(--text); }
.kop-field :disabled { opacity:1; color:var(--text-2); background:var(--bg); }
.kop-field :focus-visible,.kop-flow summary:focus-visible { outline:2px solid var(--pri); outline-offset:2px; }
.kop-provider button { display:flex; align-items:center; gap:12px; width:100%; min-height:48px; padding:12px; text-align:left; font:inherit; font-size:16px; border:1px solid var(--border); border-radius:8px; color:var(--text); background:var(--surface); cursor:pointer; }
.kop-provider button span:first-of-type { flex:1; min-width:0; overflow-wrap:anywhere; }
.kop-provider button img,.kop-provider button .ic { flex:none; width:24px; height:24px; object-fit:contain; }
.kop-provider { position:relative; }
.kop-provider-options { position:absolute; top:100%; left:0; right:0; z-index:30; box-sizing:border-box; margin-top:8px; padding:4px; max-height:min(320px,50dvh); overflow-y:auto; border:1px solid var(--border); border-radius:8px; background:#FFFFFF; box-shadow:0 8px 24px rgba(30,31,38,.12); }
.kop-provider-options button { border:0; }
.kop-provider-options button:hover,.kop-provider-options button[aria-pressed=true] { background:var(--pri-light); }
.kop-provider button:disabled { cursor:default; }
.od-impact { margin:24px 0; padding-top:24px; border-top:1px solid var(--border); }
.od-comparison { display:grid; gap:24px; margin:16px 0; }
.od-comparison > section { min-width:0; overflow-wrap:anywhere; }
.od-comparison h4 { margin:0 0 8px; }
.od-comparison dt { font-weight:600; margin-top:12px; }
.od-comparison dd { margin:4px 0 16px; }
.od-comparison ul { padding-left:24px; }
@media (min-width:1100px) { .od-comparison { grid-template-columns:repeat(3,minmax(0,1fr)); } }
.kop-account { display:flex; gap:12px; align-items:flex-start; margin-top:24px; font-size:14px; }
.kop-account .ic { flex:none; margin-top:4px; }
.kop-account p,.kop-hint { margin:4px 0 0; color:var(--text-2); font-size:14px; line-height:1.5; }
.kop-hint { margin-top:12px; }
.kop-flow { padding:16px 24px; border-bottom:1px solid var(--border); }
.kop-flow summary { cursor:pointer; min-height:44px; display:flex; align-items:center; font-weight:600; gap:8px; }
.kop-flow summary::before { content:'+'; }
.kop-flow[open] summary::before { content:'−'; }
.kop-flow ol { list-style:none; display:grid; grid-template-columns:minmax(0,1fr); gap:16px; padding:0; margin:16px 0; }
.kop-flow li { min-width:0; display:grid; gap:8px; }
.kop-flow li span,.kop-flow p { color:var(--text-2); font-size:14px; line-height:1.5; margin:0; }
.kop-footer { padding:16px 24px; display:grid; gap:12px; }
.kop-footer [role=status] { font-size:14px; color:var(--text-2); }
.kop-footer [role=alert] { margin:0; color:var(--danger,#B42A33); }
.kop-actions { display:flex; flex-wrap:wrap; gap:12px; }
.kop-actions .btn { min-height:48px; width:100%; justify-content:center; }
.kop1d button,.kop1d a,.kop1d summary { touch-action:manipulation; }
.kop1d button:active,.kop1d a:active,.kop1d summary:active { opacity:.75; }
@media (min-width:880px) {
  .kop-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .kop-flow ol { grid-template-columns:repeat(4,minmax(0,1fr)); }
  .kop-actions .btn { width:auto; }
}
/* Overdracht is een onderdeel van het bestaande board, geen tweede werkvoorraad. */
.od-bar,.od-actions,.od-panel-head { display:flex; flex-wrap:wrap; gap:12px; align-items:center; margin-bottom:16px; }
.od-bar .btn,.od-actions .btn,.od-panel .btn,.od-story .btn { min-height:44px; touch-action:manipulation; }
.od-panel { padding:24px; margin-bottom:24px; min-width:0; scroll-margin-top:80px; }
.od-panel-head { justify-content:space-between; }
.od-panel h2,.od-panel h3,.od-story h3 { margin:0 0 12px; font-size:18px; }
.od-panel fieldset { border:0; margin:0; padding:0; min-width:0; }
.od-field { display:grid; gap:8px; margin-bottom:16px; max-width:640px; }
.od-field select,.od-field input { min-height:44px; font:inherit; font-size:16px; border:1px solid var(--border); border-radius:8px; padding:8px 12px; width:100%; min-width:0; background:var(--surface); color:var(--text); }
.od-panel .od-sources { margin:16px 0; }
.od-sources legend { font-weight:600; }
.od-sources label { display:flex; align-items:center; gap:12px; min-height:44px; padding:8px 0; overflow-wrap:anywhere; }
.od-sources label[hidden] { display:none; }
.od-sources input { flex:none; width:20px; height:20px; }
.od-panel p,.od-story p { margin:8px 0 16px; line-height:1.5; overflow-wrap:anywhere; }
.od-binding { padding:12px 0; border-bottom:1px solid var(--border); }
.od-source { border-top:1px solid var(--border); padding:12px 0; overflow-wrap:anywhere; }
.od-source summary { min-height:44px; cursor:pointer; font-weight:500; touch-action:manipulation; }
.od-source summary .tag { margin-right:8px; }
.od-source ul { padding-left:24px; }
.od-source dt { font-weight:600; margin-top:12px; }
.od-source dd { margin:4px 0 12px 16px; white-space:pre-wrap; }
.od-source p { white-space:pre-wrap; }
.od-story { border-top:1px solid var(--border); padding:16px 0; }
.od-run { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px; padding:12px 0; border-bottom:1px solid var(--border); overflow-wrap:anywhere; }
.od-run > div { min-width:0; flex:1; }
.od-panel [role=alert] { color:var(--red-text); }
.od-panel button:active,.od-source summary:active,.od-bar .btn:active { opacity:.75; }
.od-inbox { padding:16px 0; border-bottom:1px solid var(--border); overflow-wrap:anywhere; }
.od-inbox h4 { margin:0 0 12px; font-size:16px; }
.od-inbox dt { font-weight:600; margin-top:12px; }
.od-inbox dd { margin:4px 0 12px; white-space:pre-wrap; }
.od-inbox ul { padding-left:24px; }
.od-reaction { margin-top:16px; }
.od-field textarea { font:inherit; font-size:16px; line-height:1.5; border:1px solid var(--border); border-radius:8px; padding:12px; width:100%; min-width:0; min-height:112px; resize:vertical; color:var(--text); background:var(--surface); }
@media (max-width:640px) {
  .od-panel { padding:16px; }
  .od-panel,.od-story { font-size:16px; }
  .od-bar,.od-actions { display:grid; grid-template-columns:1fr; }
  .od-bar .btn,.od-actions .btn { width:100%; min-height:48px; justify-content:center; }
}

.kop-account > div { min-width:0; flex:1; }
/* TK7: Azure DevOps-toegang. Het tokenveld met een oogknop ernaast; status van de toets in één blok. */
.kop-geheim { display:flex; gap:8px; min-width:0; }
.kop-geheim input { flex:1; min-width:0; }
.kop-geheim .btn { flex:none; min-width:44px; min-height:44px; }
.kop-veldhint { color:var(--text-2); font-size:13px; line-height:1.4; }
.kop-waarschuwing { color:var(--amber-strong) !important; font-weight:500; }
.kop-devops-uitslag { margin-top:16px; padding:12px 16px; border-radius:8px; border:1px solid var(--border); }
.kop-devops-uitslag.is-ok { background:var(--green-soft); border-color:var(--green); }
.kop-devops-uitslag.is-fout { background:var(--red-soft); border-color:var(--red); }
.kop-devops-uitslag b { display:block; color:var(--text); }
.kop-devops-uitslag p { color:var(--text); overflow-wrap:anywhere; }
.kop-devops-stand { margin-top:16px; }
.kop-devops-stand p { margin:4px 0 0; color:var(--text); font-size:14px; line-height:1.5; }
.kop-account .kop-grid { margin-top:16px; }
.kop-jira-actions { margin-top:12px; }
.kop-jira-actions .btn:focus-visible { outline:2px solid var(--pri); outline-offset:2px; }

/* TK1: tabblad Apps onder Koppelingen (src/views/appsleutels.js). De segmentknoppen zijn die van de
   werkbank (.del-seg); hier alleen wat eigen is: de rechtenlijst, het formulier en de eenmalige sleutel. */
.kop-tabs { margin-bottom:16px; }
.kop-tabs .del-seg-btn { min-height:44px; }
.apk-uitleg { margin:0 0 16px; padding:16px 24px; border:1px solid var(--border); border-radius:8px; background:var(--surface); }
.apk-uitleg p { margin:8px 0 0; color:var(--text-2); font-size:14px; line-height:1.5; }
.apk-env { display:grid; grid-template-columns:max-content minmax(0,1fr); gap:6px 16px; margin:12px 0 0; font-size:14px; }
.apk-env dt,.apk-env dd { margin:0; min-width:0; overflow-wrap:anywhere; }
.apk-env code,.apk-uitleg code { font-family:var(--mono); font-size:12.5px; }
.apk-vers { margin-bottom:16px; }
.apk-form { padding:0; margin-bottom:16px; }
.apk-plafond { display:grid; gap:8px; }
.apk-plafond-keuze { display:flex; gap:12px; align-items:flex-start; padding:12px; border:1px solid var(--border); border-radius:8px; cursor:pointer; min-height:44px; }
.apk-plafond-keuze.is-aan { border-color:var(--pri); background:var(--pri-light); }
.apk-plafond-keuze input { margin-top:4px; }
.apk-plafond-keuze > span { display:grid; gap:2px; min-width:0; }
.apk-plafond-keuze .muted { font-size:13px; }
.apk-projecten { display:grid; gap:8px; margin-top:12px; }
.apk-project { border:1px solid var(--border); border-radius:8px; padding:8px 12px; }
.apk-project.is-aan { border-color:var(--pri); }
.apk-project-kop { min-height:44px; display:flex; align-items:center; gap:8px; }
.apk-onderdelen { display:flex; flex-wrap:wrap; gap:4px 16px; padding:0 0 8px 28px; }
.apk-onderdelen .gb-check { min-height:36px; display:inline-flex; align-items:center; gap:6px; font-size:14px; }
/* TK2: het schrijfvinkje (bouwstatus) op een eigen regel onder de leesonderdelen; het vakje krimpt niet als de tekst afbreekt. */
.apk-onderdelen .apk-schrijf { flex-basis:100%; border-top:1px dashed var(--border); padding-top:6px; }
.apk-onderdelen .gb-check input { flex-shrink:0; }
.apk-acties { display:flex; flex-wrap:wrap; gap:6px; }
@media (min-width:640px) { .apk-env { font-size:14px; } .apk-plafond { grid-template-columns:1fr 1fr; } }
/* De tabel met zeven kolommen scrolt in zijn eigen vak; op een tablet rekte hij anders de pagina op. */
.apk-pagina .tbl-wrap { overflow-x:auto; max-width:100%; }
.apk-pagina .dz-table td:first-child { min-width:160px; }

/* Ontwerp 1d (Dennis, 19 okt): tegels, stroombalk, Vraagt aandacht en tabbladen; op de telefoon een
   lijst, een detailscherm en per onderdeel een scherm (.kop1d--hub, --detail, --paneel, --nieuw). */
.kop1d { min-width:0; display:grid; gap:16px; }
.kop1d-kop { display:flex; flex-wrap:wrap; align-items:flex-start; justify-content:space-between; gap:16px; }
.kop1d-kop .kop-tabs { margin:0; }
.kop1d-notice:empty { display:none; }
.kop1d-notice { font-size:14px; color:var(--text-2); }
.kop1d-m-only { display:none !important; }
.kop1d-groep { margin:0; font-size:13px; color:var(--text-2); }
.kop1d-sub { margin:4px 0 0; font-size:13px; color:var(--text-2); overflow-wrap:anywhere; }
.kop1d-hoofd { display:grid; gap:16px; min-width:0; }
.kop1d .panel { padding:0; margin:0; overflow:visible; min-width:0; }
.kop1d-kaart-kop { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; padding:16px 20px; border-bottom:1px solid var(--border); }
.kop1d-kaart-kop h3 { margin:0; font-size:16px; font-weight:600; display:flex; flex-wrap:wrap; align-items:center; gap:8px; }
.kop1d-kop-knoppen { display:flex; align-items:center; gap:8px; flex:none; }
.kop1d-klap { width:36px; height:36px; }
/* Tegels */
.kop1d-tegels { display:grid; grid-template-columns:repeat(auto-fill,minmax(200px,1fr)); gap:12px; }
.kop1d-tegel { position:relative; width:100%; height:100%; min-height:112px; display:flex; flex-direction:column; align-items:flex-start; gap:4px; padding:16px; text-align:left; font:inherit; color:var(--text);
  background:var(--surface); border:1px solid var(--border); border-radius:12px; box-shadow:0 1px 2px rgba(16,24,40,.05); cursor:pointer; }
.kop1d-tegel:hover { border-color:var(--border-3); }
.kop1d-tegel.is-aan { border-color:var(--pri); box-shadow:0 0 0 3px var(--ring); }
.kop1d-tegel:focus-visible { outline:2px solid var(--pri); outline-offset:2px; }
.kop1d-tegel-kop { width:100%; display:flex; justify-content:space-between; align-items:flex-start; gap:8px; margin-bottom:8px; }
.kop1d-tegel-tags { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:4px; }
.kop1d-tegel-naam { font-weight:600; font-size:14px; overflow-wrap:anywhere; }
.kop1d-tegel-tool,.kop1d-tegel-regel { font-size:13px; color:var(--text-2); overflow-wrap:anywhere; }
.kop1d-tegel-regel,.kop1d-tegel-aantal { display:none; }
.kop1d-tegel--nieuw { align-items:center; justify-content:center; border-style:dashed; border-color:var(--border-3); background:transparent; box-shadow:none; color:var(--text-2); font-weight:600; }
.kop1d-tegel--nieuw.is-aan { background:var(--pri-soft); color:var(--pri-text); }
.kop1d-plus { width:28px; height:28px; border-radius:50%; display:inline-flex; align-items:center; justify-content:center; background:var(--sunken); }
.kop1d-logo,.kop1d-pil-logo { flex:none; width:36px; height:36px; border-radius:8px; border:1px solid var(--border); background:var(--surface); display:inline-flex; align-items:center; justify-content:center; color:var(--text-2); }
.kop1d-logo img { width:22px; height:22px; object-fit:contain; }
.kop1d-pil-logo { width:auto; height:auto; border:0; background:none; }
.kop1d-pil-logo img { width:18px; height:18px; }
/* Detail en stroombalk */
.kop1d-lanes { display:grid; }
.kop1d-lane { display:grid; grid-template-columns:170px minmax(0,1fr); gap:16px; padding:16px 20px; border-bottom:1px solid var(--border); }
.kop1d-lane:last-child { border-bottom:0; }
.kop1d-lane-kop { display:flex; gap:12px; align-items:flex-start; min-width:0; }
.kop1d-lane-kop b { display:block; font-size:14px; }
.kop1d-lane-kop div span,.kop1d-schakel span span,.kop1d-menu button span span { display:block; font-size:13px; color:var(--text-2); }
.kop1d-lane-ic { flex:none; width:32px; height:32px; border-radius:8px; background:var(--sunken); display:inline-flex; align-items:center; justify-content:center; color:var(--text-2); }
.kop1d-lane-rechts { display:grid; gap:12px; min-width:0; }
.kop1d-pijl { display:flex; align-items:center; gap:8px; min-width:0; }
.kop1d-pil { display:inline-flex; align-items:center; gap:8px; padding:8px 12px; min-width:0; border:1px solid var(--border); border-radius:8px; font-size:13px; font-weight:500; background:var(--surface); }
.kop1d-lijn { flex:1; min-width:64px; max-width:140px; text-align:center; font-size:12px; color:var(--text-2); border-bottom:2px solid var(--border-3); padding-bottom:4px; }
.kop1d-lijn--aan { border-color:var(--green); } .kop1d-lijn--pauze { border-color:var(--amber); }
.kop1d-cijfers { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin:0; padding:12px; border-radius:8px; background:var(--surface-2); }
.kop1d-cijfers div { min-width:0; } .kop1d-cijfers dt { font-size:12px; color:var(--text-2); } .kop1d-cijfers dd { margin:2px 0 0; font-weight:600; font-size:15px; }
.kop1d-cijfers dd.is-fout { color:var(--red-strong); }
.kop1d-cijfers--5 { grid-template-columns:repeat(5,minmax(0,1fr)); }
/* 0370 (deel 2): de knop voor een ronde nu, de keuzes bij Meldingen en de standaard in de statusvertaling. */
.kop1d-nu { justify-self:start; min-height:44px; }
.kop1d-checks { display:grid; gap:8px; }
.kop1d-check { display:flex; align-items:flex-start; gap:12px; min-height:44px; padding:8px 12px; border:1px solid var(--border); border-radius:8px; cursor:pointer; }
.kop1d-check input { width:20px; height:20px; margin:2px 0 0; flex:none; }
.kop1d-check b { display:block; font-weight:500; } .kop1d-check span span { display:block; font-size:13px; color:var(--text-2); }
.kop1d-tabel select { box-sizing:border-box; width:100%; max-width:240px; min-height:44px; font:inherit; font-size:16px; padding:8px 12px; border:1px solid var(--border); border-radius:8px; background:var(--surface); color:var(--text); }
.kop1d-tabel select:focus-visible { outline:2px solid var(--pri); outline-offset:2px; }
.kop1d-tabel tbody th span.tag { display:inline-flex; vertical-align:middle; margin-left:4px; }
.kop1d-standaard { display:block; margin-top:4px; font-size:12px; color:var(--text-2); }
.kop1d-lane-tekst { margin:0; font-size:14px; color:var(--text-2); line-height:1.5; }
.kop1d-lanes > .kop1d-lane-tekst { padding:0 20px 16px; }
/* Vraagt aandacht */
.kop1d-aandacht-lijst { list-style:none; margin:0; padding:0; }
.kop1d-melding { display:grid; grid-template-columns:32px minmax(0,1fr) auto; gap:12px; padding:16px 20px; border-bottom:1px solid var(--border); }
.kop1d-melding:last-child { border-bottom:0; border-radius:0 0 12px 12px; }
.kop1d-melding--sleutel { background:var(--amber-soft); }
.kop1d-melding--sleutel .kop1d-melding-titel b,.kop1d-melding--sleutel p { color:var(--amber-strong); }
.kop1d-melding-ic { width:32px; height:32px; border-radius:8px; display:inline-flex; align-items:center; justify-content:center; background:var(--red-soft); color:var(--red-strong); }
.kop1d-melding--sleutel .kop1d-melding-ic { background:var(--surface); color:var(--amber-strong); }
.kop1d-melding--let-op .kop1d-melding-ic { background:var(--amber-soft); color:var(--amber-strong); }
.kop1d-melding-tekst { min-width:0; }
.kop1d-melding-titel { display:flex; flex-wrap:wrap; align-items:center; gap:8px; padding:0; border:0; background:none; font:inherit; color:var(--text); text-align:left; cursor:default; }
.kop1d-melding-titel b { font-size:14px; overflow-wrap:anywhere; }
.kop1d-melding p { margin:4px 0 0; font-size:14px; line-height:1.5; overflow-wrap:anywhere; }
.kop1d-hoe { color:var(--text-2); }
.kop1d-tijd { font-size:12px; color:var(--text-2); }
.kop1d-melding-knoppen { display:flex; flex-wrap:wrap; justify-content:flex-end; align-content:flex-start; gap:8px; }
/* Tabbladen */
.kop1d-tabbalk { display:flex; gap:4px; padding:0 12px; border-bottom:1px solid var(--border); overflow-x:auto; }
.kop1d-tab { min-height:48px; padding:0 12px; border:0; background:none; font:inherit; font-size:14px; color:var(--text-2); border-bottom:2px solid transparent; cursor:pointer; white-space:nowrap; }
.kop1d-tab.is-aan { color:var(--pri-text); border-bottom-color:var(--pri); font-weight:600; }
.kop1d-tab:focus-visible { outline:2px solid var(--pri); outline-offset:-2px; }
.kop1d-paneel { padding:16px 20px 20px; min-width:0; }
.kop1d-paneel[hidden] { display:none; }
.kop1d-paneel-raster { display:grid; grid-template-columns:minmax(0,1fr) 280px; gap:24px; align-items:start; }
.kop1d-paneel-raster > * { min-width:0; }
.kop1d-paneel .kop-section { padding:20px 0; }
.kop1d-paneel fieldset + fieldset > .kop-section:first-child { margin-top:4px; }
.kop1d-paneel .kop-section h3 { font-size:15px; margin-bottom:12px; }
.kop1d-paneel .kop-account { margin-top:0; }
.kop1d-paneel .kop-flow { padding:12px 0 0; border-bottom:0; }
.kop1d-paneel .kop-flow ol { grid-template-columns:minmax(0,1fr); }
.kop1d-paneel-voet { display:grid; gap:12px; }
.kop1d-paneel-voet [role=alert] { margin:0; color:var(--red-strong); }
.kop1d-zijen { display:grid; gap:16px; border-left:1px solid var(--border); padding-left:20px; }
.kop1d-zij h4 { margin:0 0 8px; font-size:13px; color:var(--text-2); font-weight:600; }
.kop1d-zij ul,.kop1d-zij ol { margin:0; padding-left:18px; display:grid; gap:6px; font-size:13px; line-height:1.5; }
.kop1d-paneel-raster > .kop1d-zij { border-left:1px solid var(--border); padding-left:20px; }
.kop1d-chips { display:flex; flex-wrap:wrap; align-items:center; gap:8px; margin-bottom:12px; }
.kop1d-chip { min-height:36px; padding:0 14px; border-radius:999px; border:1px solid var(--border-2); background:var(--surface); font:inherit; font-size:13px; color:var(--text-2); cursor:pointer; }
.kop1d-chip.is-aan { border-color:var(--pri); background:var(--pri-soft); color:var(--pri-text); font-weight:600; }
.kop1d-bordlink { margin-left:auto; font-size:13px; }
.kop1d-act { list-style:none; margin:0; padding:0; }
.kop1d-act li { display:grid; grid-template-columns:104px 110px minmax(0,1fr) auto; gap:12px; align-items:center; padding:12px 4px; border-top:1px solid var(--border); font-size:14px; }
.kop1d-act-tijd { color:var(--text-2); font-size:13px; white-space:nowrap; }
.kop1d-act-dir { display:inline-flex; align-items:center; gap:6px; color:var(--text-2); font-size:13px; }
.kop1d-act-dir.is-fout { color:var(--red-strong); } .kop1d-act-dir.is-let-op { color:var(--amber-strong); }
.kop1d-act-wat { min-width:0; } .kop1d-act-wat b { display:block; font-weight:500; overflow-wrap:anywhere; } .kop1d-act-wat span { font-size:13px; color:var(--text-2); }
.kop1d-leeg,.kop1d-voetnoot { margin:8px 0 0; font-size:14px; color:var(--text-2); }
.kop1d-voetnoot { font-size:12px; }
.kop1d-tabel { width:100%; border-collapse:collapse; margin-top:12px; font-size:14px; }
.kop1d-tabel th,.kop1d-tabel td { text-align:left; padding:10px 8px; border-top:1px solid var(--border); vertical-align:top; }
.kop1d-tabel thead th { font-size:12px; color:var(--text-2); font-weight:600; border-top:0; }
.kop1d-tabel tbody th { font-weight:500; } .kop1d-tabel tbody th span { display:block; font-size:12px; color:var(--text-2); font-weight:400; }
/* Nieuwe koppeling */
.kop1d-kiezer-lijst { display:grid; grid-template-columns:repeat(auto-fill,minmax(260px,1fr)); gap:12px; padding:16px 20px 20px; }
.kop1d-keuze { display:flex; align-items:flex-start; gap:12px; padding:14px; min-height:48px; text-align:left; font:inherit; color:var(--text); background:var(--surface); border:1px solid var(--border); border-radius:12px; cursor:pointer; }
.kop1d-keuze:hover { border-color:var(--pri); } .kop1d-keuze:focus-visible { outline:2px solid var(--pri); outline-offset:2px; }
.kop1d-keuze img,.kop1d-keuze > .ic { flex:none; width:24px; height:24px; object-fit:contain; }
.kop1d-keuze > span:nth-child(2) { flex:1; min-width:0; display:grid; gap:4px; } .kop1d-keuze > span:nth-child(2) span { font-size:13px; color:var(--text-2); line-height:1.4; }
.kop1d-keuze-knop { flex:none; font-size:13px; font-weight:600; color:var(--pri-text); }
/* De handleiding per tool (src/gids.js): onder elke keuze een link, de keuze zelf vult de rij. */
.kop1d-keuze-rij { display:grid; gap:2px; align-content:start; }
.kop1d-keuze-rij .gids-link { justify-self:start; }
/* De kale link naar een handleiding (DZ.gids.link met kaal), ook op Mijn account › AI-verbindingen. */
a.gids-link:not(.btn) { display:inline-flex; align-items:center; gap:6px; min-height:32px; padding:0 4px; font-size:13px; color:var(--pri-text); text-decoration:none; }
a.gids-link:not(.btn):hover { text-decoration:underline; }
@media (max-width:640px) { a.gids-link:not(.btn) { min-height:44px; font-size:14px; } }
.kop1d-blad,.kop1d-blad-achter { display:none; }
@media (max-width:900px) {
  .kop1d-paneel-raster { grid-template-columns:minmax(0,1fr); }
  .kop1d-zijen,.kop1d-paneel-raster > .kop1d-zij { border-left:0; padding-left:0; border-top:1px solid var(--border); padding-top:16px; }
  .kop1d-lane { grid-template-columns:minmax(0,1fr); }
  .kop1d-act li { grid-template-columns:96px minmax(0,1fr) auto; } .kop1d-act-dir { display:none; }
}
/* Telefoon: één scherm tegelijk, zoals de procespagina. Grote titel, gegroepeerde lijsten, één knop in de duimzone. */
@media (max-width:640px) {
  .kop1d { gap:12px; font-size:15px; }
  .kop1d-m-only { display:revert !important; }
  .kop1d-d-only { display:none !important; }
  .kop1d-kop { display:grid; gap:12px; }
  .kop1d-kop .kop-tabs { display:grid; grid-template-columns:1fr 1fr; }
  .kop1d-kop .settings-h2 { font-size:26px; }
  .kop1d--detail .kop1d-kop,.kop1d--paneel .kop1d-kop,.kop1d--nieuw .kop1d-kop { display:none; }
  .st-tel:has(.kop1d-terug) > .st-terug { display:none; }
  .kop1d-terug { display:inline-flex !important; justify-self:start; }
  /* Lijst */
  .kop1d-tegels { grid-template-columns:minmax(0,1fr); gap:0; border:1px solid var(--border); border-radius:12px; overflow:hidden; background:var(--surface); }
  .kop1d-tegel { min-height:64px; flex-direction:row; align-items:center; flex-wrap:wrap; gap:2px 12px; padding:12px 16px; border:0; border-bottom:1px solid var(--border); border-radius:0; box-shadow:none; }
  .kop1d-tegels > div:last-child .kop1d-tegel { border-bottom:0; }
  .kop1d-tegel.is-aan { box-shadow:none; border-color:var(--border); }
  .kop1d-tegel-kop { width:auto; margin:0; } .kop1d-tegel-tags,.kop1d-tegel-tool { display:none; }
  .kop1d-tegel-naam { flex:1 1 calc(100% - 120px); font-size:16px; font-weight:500; }
  .kop1d-tegel-regel { display:block; flex-basis:100%; padding-left:48px; margin-top:-6px; }
  .kop1d-tegel-aantal { display:inline-flex; position:absolute; right:40px; top:20px; padding:2px 8px; border-radius:6px; background:var(--red-soft); color:var(--red-strong); font-size:13px; font-weight:600; }
  .kop1d-tegel > .kop1d-m-only { position:absolute; right:14px; top:22px; color:var(--text-3); }
  .kop1d-tegel--nieuw { justify-content:flex-start; color:var(--pri-text); font-weight:500; background:var(--surface); }
  .kop1d-tegel--nieuw .kop1d-plus { background:var(--pri-soft); }
  .kop1d-hubmelding { display:flex !important; align-items:center; gap:12px; width:100%; min-height:64px; padding:14px 16px; text-align:left; font:inherit; color:var(--red-strong); background:var(--red-soft); border:0; border-radius:12px; }
  .kop1d-hubmelding > span { flex:1; min-width:0; } .kop1d-hubmelding b { display:block; font-size:16px; } .kop1d-hubmelding span span { font-size:14px; }
  /* Welk scherm: hub = lijst; detail = stroom, aandacht en menu; paneel = één onderdeel; nieuw = toolkeuze of formulier. */
  .kop1d--hub .kop1d-hoofd { display:none; }
  .kop1d--detail .kop1d-hub-only,.kop1d--detail .kop1d-tegels,.kop1d--detail .kop1d-hubmelding,.kop1d--detail .kop1d-tabs,
  .kop1d--paneel .kop1d-hub-only,.kop1d--paneel .kop1d-tegels,.kop1d--paneel .kop1d-hubmelding,.kop1d--paneel .kop1d-detail,.kop1d--paneel .kop1d-aandacht,.kop1d--paneel .kop1d-menu,
  .kop1d--nieuw .kop1d-hub-only,.kop1d--nieuw .kop1d-tegels,.kop1d--nieuw .kop1d-hubmelding { display:none !important; }
  .kop1d--paneel .kop1d-tabbalk { display:none; }
  .kop1d--paneel .kop1d-tabs { border:0; background:none; box-shadow:none; }
  .kop1d--paneel .kop1d-paneel { padding:0; }
  .kop1d-paneel-titel { margin:0 0 8px; font-size:26px; }
  .kop1d--nieuw .kop1d-paneel-titel,.kop1d-detail .kop1d-d-only { display:none !important; }
  .kop1d-detail { border:0; background:none; box-shadow:none; }
  .kop1d-detail > .kop1d-kaart-kop { padding:0 0 12px; border:0; }
  .kop1d-detail h3 { font-size:26px; }
  .kop1d-detail .kop1d-klap { display:none; }
  .kop1d-lanes,.kop1d-schakel { background:var(--surface); border:1px solid var(--border); }
  .kop1d-lanes { border-radius:12px 12px 0 0; } .kop1d-schakel { border-top:0; border-radius:0 0 12px 12px; }
  .kop1d-detail:not(:has(.kop1d-schakel)) .kop1d-lanes { border-radius:12px; }
  .kop1d-lane { padding:12px 16px; gap:8px; }
  .kop1d-pijl { display:none; } .kop1d-cijfers { grid-template-columns:repeat(2,minmax(0,1fr)); padding:8px 12px; }
  .kop1d-schakel { display:flex !important; align-items:center; gap:12px; padding:12px 16px; min-height:56px; }
  .kop1d-schakel > span:nth-child(2) { flex:1; min-width:0; } .kop1d-schakel b { display:block; }
  .kop1d-schakel .toggle { flex:none; }
  .kop1d-aandacht { border:0; background:none; box-shadow:none; }
  .kop1d-aandacht > .kop1d-kaart-kop { padding:8px 0; border:0; } .kop1d-aandacht h3 { font-size:13px; color:var(--text-2); font-weight:500; }
  .kop1d-aandacht h3 .ic,.kop1d-aandacht .kop1d-klap { display:none; }
  .kop1d-aandacht-lijst { background:var(--surface); border:1px solid var(--border); border-radius:12px; overflow:hidden; }
  .kop1d-melding { grid-template-columns:32px minmax(0,1fr); padding:12px 16px; }
  .kop1d-melding p,.kop1d-melding-knoppen { display:none; }
  .kop1d-melding-titel { width:100%; min-height:44px; cursor:pointer; padding-right:24px; position:relative; }
  .kop1d-melding-titel .tag { display:none; }
  .kop1d-melding-titel > .kop1d-m-only { position:absolute; right:0; top:12px; color:var(--text-3); }
  .kop1d-melding-titel b { font-size:16px; font-weight:500; flex-basis:100%; }
  .kop1d-menu ul { list-style:none; margin:4px 0 0; padding:0; background:var(--surface); border:1px solid var(--border); border-radius:12px; overflow:hidden; }
  .kop1d-menu button { width:100%; min-height:60px; display:flex; align-items:center; gap:12px; padding:10px 16px; text-align:left; font:inherit; color:var(--text); background:none; border:0; border-bottom:1px solid var(--border); }
  .kop1d-menu li:last-child button { border-bottom:0; }
  .kop1d-menu button > span:nth-child(2) { flex:1; min-width:0; } .kop1d-menu b { font-weight:500; font-size:16px; } .kop1d-menu .ti-chevron-right { color:var(--text-3); }
  .kop1d-paneel-raster { gap:16px; }
  .kop1d-paneel-voet { position:sticky; bottom:calc(var(--bottomnav-h) + var(--safe-b)); z-index:5; padding:12px 0; background:var(--bg); }
  .kop1d-paneel-voet .btn { width:100%; min-height:48px; justify-content:center; }
  .kop1d-act li { grid-template-columns:minmax(0,1fr); gap:4px; padding:12px; }
  .kop1d-act-tijd { order:3; }
  .kop1d-act li .tag { justify-self:start; }
  .kop1d-bordlink { margin-left:0; flex-basis:100%; }
  .kop1d-tabel { font-size:15px; }
  .kop1d-kiezer { border:0; background:none; box-shadow:none; }
  .kop1d-kiezer > .kop1d-kaart-kop { padding:0 0 8px; border:0; } .kop1d-kiezer h3 { font-size:26px; }
  .kop1d-kiezer-lijst { grid-template-columns:minmax(0,1fr); padding:0; }
  /* De sheet voor één melding, van onderen. */
  .kop1d-blad-achter { display:block; position:fixed; inset:0; z-index:80; background:rgba(16,24,40,.4); }
  .kop1d-blad { display:block; position:fixed; left:0; right:0; bottom:0; z-index:81; max-height:85dvh; overflow-y:auto; padding:20px 16px calc(16px + var(--safe-b)); background:var(--surface); border-radius:16px 16px 0 0; box-shadow:0 -4px 16px rgba(16,24,40,.12); }
  .kop1d-blad h3 { margin:8px 0; font-size:20px; padding-right:40px; } .kop1d-blad p { margin:0 0 12px; line-height:1.5; }
  .kop1d-blad-x { position:absolute; top:12px; right:12px; width:44px; height:44px; }
  .kop1d-blad-hoe { display:flex; gap:8px; padding:12px; border-radius:8px; background:var(--surface-2); margin-bottom:12px; } .kop1d-blad-hoe p { margin:0; }
  .kop1d-blad-knoppen { display:grid; gap:8px; } .kop1d-blad-knoppen .btn { width:100%; min-height:48px; justify-content:center; }
}
