/* ─────────────────────────────────────────────────────────────
   Schil van het beheerportaal: zijbalk plus werkvlak.
   ───────────────────────────────────────────────────────────── */

html{background:#F4F6FB}
.dr-adm-body{margin:0;font-family:'DM Sans',system-ui,sans-serif;color:#1A1D2E;
  background:#F4F6FB;-webkit-font-smoothing:antialiased}
.dr-adm-body *{box-sizing:border-box}

.dr-shell{display:grid;grid-template-columns:250px 1fr;min-height:100vh;
  background:var(--dr-surface,#F4F6FB)}
.dr-shell__main{min-width:0}

.dr-side{background:#111436;color:#B9C4E0;padding:18px 0 30px;
  position:sticky;top:0;align-self:start;height:100vh;overflow-y:auto}
.dr-side__logo{display:flex;align-items:center;gap:10px;padding:0 20px 18px;margin-bottom:6px;
  border-bottom:1px solid rgba(255,255,255,.1);text-decoration:none}
.dr-side__logo b{font-family:'Archivo','Syne',sans-serif;font-weight:700;font-size:15px;color:#fff}
.dr-side__mark{width:30px;height:30px;border-radius:8px;background:#fff;color:var(--dr-blue,#17289B);
  display:grid;place-items:center;font-family:'Archivo',sans-serif;font-weight:700;font-size:15px}
.dr-side__grp{font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.14em;
  text-transform:uppercase;color:#6C7BA6;padding:16px 20px 6px;margin:0}
.dr-side a{display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:9px 20px;text-decoration:none;font-size:14px;color:#B9C4E0;
  border-left:2px solid transparent;line-height:1.35}
.dr-side a:hover{background:rgba(255,255,255,.06);color:#fff}
.dr-side a.dr-side__on{background:rgba(255,255,255,.09);color:#fff;
  border-left-color:var(--dr-blue-light,#3BA6D3);font-weight:500}
.dr-side__n{font-family:'IBM Plex Mono',monospace;font-size:11px;background:rgba(255,255,255,.14);
  padding:2px 7px;border-radius:99px;flex:none}

.dr-shell__top{display:flex;align-items:center;gap:14px;padding:0 26px;height:52px;
  background:#fff;border-bottom:1px solid var(--adm-line,rgba(23,40,155,.14))}
.dr-shell__crumb{font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--dr-muted,#5A607A)}
.dr-shell__crumb b{color:var(--dr-blue,#17289B);font-weight:500}
.dr-shell__who{margin-left:auto;font-size:13px;color:var(--dr-muted,#5A607A)}
.dr-shell__out{font-family:'IBM Plex Mono',monospace;font-size:11px;letter-spacing:.06em;
  background:none;border:1px solid rgba(23,40,155,.18);border-radius:7px;padding:6px 11px;
  color:var(--dr-muted,#5A607A);cursor:pointer}
.dr-shell__out:hover{border-color:var(--dr-blue,#17289B);color:var(--dr-blue,#17289B)}

/* het ingebedde vertaalscherm */
.dr-adm__frame{border:1px solid var(--adm-line,rgba(23,40,155,.14));border-top:3px solid var(--dr-blue,#17289B);
  border-radius:14px;overflow:hidden;background:#fff}
.dr-adm__frame iframe{display:block;width:100%;height:78vh;min-height:560px;border:0}

@media (max-width:900px){
  .dr-shell{grid-template-columns:1fr}
  .dr-side{position:static;max-height:none;display:flex;flex-wrap:wrap;gap:2px;padding:12px}
  .dr-side__logo{width:100%;border-bottom:0;padding:0 8px 12px}
  .dr-side__grp{width:100%;padding:8px 8px 4px}
  .dr-side a{border-left:0;border-radius:8px;padding:8px 12px}
  .dr-adm__frame iframe{height:70vh}
}

/* ─────────────────────────────────────────────────────────────
   Beheerschermen — Datarecuperatie

   Dichter en soberder dan de publieke pagina's: basisgrootte 14 px,
   compacte rijen, geen donkere banden. Hier telt snelheid, niet
   overtuiging. Wel dezelfde familie: hetzelfde blauw, dezelfde mono
   voor identificatoren en data, dezelfde hoeken.

   Alles onder .dr-adm gescoopt, zodat het de Jetstream-layout en de
   resterende Nicepage-klassen niet raakt.
   ───────────────────────────────────────────────────────────── */

.dr-adm{
  --adm-line:rgba(23,40,155,.14);
  --adm-line-soft:rgba(23,40,155,.08);
  --adm-ok:#1F8A4C; --adm-warn:#B3261E; --adm-wait:#B07A12;
  font-family:'DM Sans',system-ui,sans-serif;
  font-size:14px; line-height:1.55; color:var(--dr-text,#1A1D2E);
  max-width:1280px; margin:0 auto; padding:24px 26px 60px;
}

/* ── paginakop ────────────────────────────────────────────── */
.dr-adm__head{display:flex;flex-wrap:wrap;align-items:flex-end;gap:16px;margin-bottom:20px;
  padding-bottom:16px;border-bottom:2px solid var(--dr-blue,#17289B)}
.dr-adm__head h1{font-family:'Archivo','Syne',sans-serif;font-weight:700;font-size:23px;
  margin:0;letter-spacing:-.02em}
.dr-adm__head p{margin:4px 0 0;color:var(--dr-muted,#5A607A);font-size:13.5px}
.dr-adm__head .dr-adm__right{margin-left:auto;display:flex;gap:9px;flex-wrap:wrap}
.dr-adm__back{display:inline-flex;align-items:center;gap:7px;font-family:'IBM Plex Mono',monospace;
  font-size:12px;color:var(--dr-muted,#5A607A);text-decoration:none;margin-bottom:14px}
.dr-adm__back{color:var(--dr-blue,#17289B)}
.dr-adm__back:hover{color:var(--dr-blue-dark,#0E1C6E)}

/* ── kaart ────────────────────────────────────────────────── */
.dr-adm__card{background:#fff;border:1px solid var(--adm-line);border-top:3px solid var(--dr-blue,#17289B);
  border-radius:14px;overflow:hidden}
.dr-adm__card + .dr-adm__card{margin-top:20px}
.dr-adm__cardhead{display:flex;flex-wrap:wrap;align-items:center;gap:12px;
  padding:14px 18px;background:rgba(23,40,155,.045);border-bottom:1px solid rgba(23,40,155,.16)}
.dr-adm__cardhead h2{font-family:'Archivo','Syne',sans-serif;font-weight:700;font-size:15px;margin:0;color:var(--dr-blue,#17289B)}
.dr-adm__cardbody{padding:18px}

/* ── knoppen ──────────────────────────────────────────────── */
.dr-adm .dr-adm__btn{display:inline-flex;align-items:center;gap:7px;font-family:'Syne',sans-serif;
  font-weight:600;font-size:13px;padding:8px 15px;border-radius:9px;text-decoration:none;cursor:pointer;
  background:var(--dr-blue,#17289B);color:#fff;border:1px solid var(--dr-blue,#17289B);line-height:1.2}
.dr-adm .dr-adm__btn:hover{background:var(--dr-blue-dark,#0E1C6E);border-color:var(--dr-blue-dark,#0E1C6E)}
.dr-adm .dr-adm__btn--ghost{background:#fff;color:var(--dr-text,#1A1D2E);border-color:var(--adm-line)}
.dr-adm .dr-adm__btn--ghost:hover{background:var(--dr-surface,#F4F6FB);border-color:var(--dr-blue,#17289B);color:var(--dr-blue,#17289B)}
.dr-adm .dr-adm__btn--danger{background:#fff;color:var(--adm-warn);border-color:rgba(179,38,30,.3)}
.dr-adm .dr-adm__btn--sm{padding:5px 11px;font-size:12px;border-radius:7px}

/* ── filterbalk ───────────────────────────────────────────── */
.dr-adm__bar{display:flex;flex-wrap:wrap;gap:9px;align-items:center;
  padding:13px 18px;background:rgba(23,40,155,.03);border-bottom:1px solid var(--adm-line-soft)}
.dr-adm__search{flex:1 1 240px;max-width:340px}
.dr-adm__chip{font-family:'IBM Plex Mono',monospace;font-size:12px;padding:6px 12px;border-radius:999px;
  border:1px solid var(--adm-line);background:#fff;color:var(--dr-muted,#5A607A);cursor:pointer;text-decoration:none}
.dr-adm__chip--on{background:var(--dr-blue,#17289B);border-color:var(--dr-blue,#17289B);color:#fff}

/* ── tabel ────────────────────────────────────────────────── */
.dr-adm__tbl{width:100%;border-collapse:collapse}
.dr-adm__tbl th{text-align:left;font-family:'IBM Plex Mono',monospace;font-size:10px;letter-spacing:.11em;
  text-transform:uppercase;color:var(--dr-blue,#17289B);font-weight:500;padding:11px 14px;
  border-bottom:2px solid var(--dr-blue,#17289B);white-space:nowrap;position:sticky;top:0;
  background:rgba(23,40,155,.05);z-index:2}
.dr-adm__tbl td{padding:12px 14px;border-bottom:1px solid var(--adm-line-soft);vertical-align:middle}
.dr-adm__tbl tr:hover td{background:rgba(23,40,155,.035)}
.dr-adm__tbl .dr-adm__id{font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--dr-blue,#17289B)}
.dr-adm__tbl .dr-adm__ttl{font-weight:500}
.dr-adm__tbl .dr-adm__sub{display:block;font-size:12.5px;color:var(--dr-muted,#5A607A)}
.dr-adm__tbl .dr-adm__act{text-align:right;white-space:nowrap}

.dr-adm__pill{display:inline-flex;align-items:center;gap:6px;font-family:'IBM Plex Mono',monospace;
  font-size:11px;padding:3px 9px;border-radius:99px;background:var(--dr-surface,#F4F6FB);color:var(--dr-muted,#5A607A)}
.dr-adm__pill::before{content:"";width:6px;height:6px;border-radius:50%;background:currentColor}
.dr-adm__pill--on{color:var(--adm-ok);background:rgba(31,138,76,.1)}
.dr-adm__pill--wait{color:var(--adm-wait);background:rgba(176,122,18,.12)}
.dr-adm__pill--no{color:var(--adm-warn);background:rgba(179,38,30,.1)}
.dr-adm__lang{font-family:'IBM Plex Mono',monospace;font-size:10px;padding:2px 6px;border-radius:4px;
  background:rgba(23,40,155,.1);color:var(--dr-blue,#17289B)}
.dr-adm__langs{display:inline-flex;gap:3px}
.dr-adm__lang--mist{background:transparent;color:rgba(90,96,122,.45);
  border:1px dashed rgba(23,40,155,.22)}

.dr-adm__land{display:inline-block;font-family:'IBM Plex Mono',monospace;font-size:11px;font-weight:500;
  padding:3px 8px;border-radius:5px;border:1px solid rgba(23,40,155,.22);
  color:var(--dr-blue,#17289B);background:#fff;margin-right:6px;letter-spacing:.04em}

/* ── tabelvoet ────────────────────────────────────────────── */
.dr-adm__foot{display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding:12px 18px;
  background:rgba(23,40,155,.03);border-top:1px solid var(--adm-line-soft)}
.dr-adm__info{font-family:'IBM Plex Mono',monospace;font-size:12px;color:var(--dr-muted,#5A607A)}
.dr-adm__foot .pagination{margin-left:auto;margin-bottom:0}

/* ── formulier ────────────────────────────────────────────── */
.dr-adm__grid{display:grid;grid-template-columns:1fr 300px;gap:20px;align-items:start}
.dr-adm__fields{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.dr-adm__full{grid-column:1/-1}
.dr-adm label{display:block;font-family:'IBM Plex Mono',monospace;font-size:10.5px;letter-spacing:.1em;
  text-transform:uppercase;color:var(--dr-muted,#5A607A);margin-bottom:6px}
.dr-adm input[type=text],.dr-adm input[type=email],.dr-adm input[type=tel],
.dr-adm input[type=number],.dr-adm select,.dr-adm textarea{
  font-family:'DM Sans',sans-serif;font-size:14px;color:var(--dr-text,#1A1D2E);padding:9px 12px;
  border:1px solid var(--adm-line);border-radius:8px;background:#fff;width:100%}
.dr-adm input:focus,.dr-adm select:focus,.dr-adm textarea:focus{
  outline:2px solid var(--dr-blue,#17289B);outline-offset:1px;border-color:var(--dr-blue,#17289B)}
.dr-adm__hint{margin:5px 0 0;font-size:12.5px;color:var(--dr-muted,#5A607A)}
.dr-adm__save{position:sticky;bottom:0;background:rgba(23,40,155,.045);
  border-top:1px solid rgba(23,40,155,.16);
  padding:12px 18px;display:flex;flex-wrap:wrap;align-items:center;gap:10px}
.dr-adm__save .dr-adm__state{font-family:'IBM Plex Mono',monospace;font-size:12px;
  color:var(--dr-muted,#5A607A);margin-right:auto}

.dr-adm__row--off td{opacity:.5}
.dr-adm__row--off:hover td{opacity:.85;background:rgba(23,40,155,.03)}
.dr-adm__row--off .dr-adm__ttl{font-weight:400}

.dr-pager{display:flex;flex-wrap:wrap;gap:4px;align-items:center}
.dr-pager__btn{min-width:32px;height:32px;padding:0 9px;display:inline-flex;align-items:center;
  justify-content:center;border:1px solid var(--adm-line,rgba(23,40,155,.14));border-radius:8px;
  background:#fff;text-decoration:none;font-family:'IBM Plex Mono',monospace;font-size:12.5px;
  color:var(--dr-muted,#5A607A);line-height:1}
.dr-pager__btn:hover{border-color:var(--dr-blue,#17289B);color:var(--dr-blue,#17289B)}
.dr-pager__btn--on{background:var(--dr-blue,#17289B);border-color:var(--dr-blue,#17289B);color:#fff}
.dr-pager__btn--off{opacity:.4;pointer-events:none}
.dr-pager__gap{padding:0 4px;color:var(--dr-muted,#5A607A);font-family:'IBM Plex Mono',monospace;font-size:12.5px}

/* Laravel's standaardweergave laadt hier soms alsnog; die pijltjes zijn svg's
   zonder afmeting en renderen dan schermvullend. Dit vangt dat af. */
.dr-adm svg:not([width]):not([height]){width:16px;height:16px}

.dr-adm__tel{display:inline-flex;align-items:center;gap:6px;text-decoration:none;
  color:var(--dr-blue,#17289B);font-weight:500;border-bottom:1px solid rgba(23,40,155,.28)}
.dr-adm__tel::before{content:"";width:13px;height:13px;flex:none;background:currentColor;
  -webkit-mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M6.6 10.8c1.4 2.8 3.8 5.2 6.6 6.6l2.2-2.2c.3-.3.7-.4 1-.2 1.1.4 2.4.6 3.6.6.6 0 1 .4 1 1V20c0 .6-.4 1-1 1C10.6 21 3 13.4 3 4c0-.6.4-1 1-1h3.5c.6 0 1 .4 1 1 0 1.3.2 2.5.6 3.6.1.4 0 .8-.2 1.1l-2.3 2.1z'/></svg>") center/contain no-repeat;
          mask:url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'><path d='M6.6 10.8c1.4 2.8 3.8 5.2 6.6 6.6l2.2-2.2c.3-.3.7-.4 1-.2 1.1.4 2.4.6 3.6.6.6 0 1 .4 1 1V20c0 .6-.4 1-1 1C10.6 21 3 13.4 3 4c0-.6.4-1 1-1h3.5c.6 0 1 .4 1 1 0 1.3.2 2.5.6 3.6.1.4 0 .8-.2 1.1l-2.3 2.1z'/></svg>") center/contain no-repeat}
.dr-adm__tel:hover{color:var(--dr-blue-dark,#0E1C6E);border-bottom-color:var(--dr-blue,#17289B)}

/* ── cijferblokjes op het overzicht ───────────────────────── */
.dr-adm__stats{display:grid;grid-template-columns:repeat(6,1fr);gap:14px}
.dr-adm__stat{display:block;background:#fff;border:1px solid var(--adm-line);
  border-top:3px solid var(--dr-blue,#17289B);border-radius:14px;padding:20px 18px;
  text-decoration:none;color:inherit;transition:.15s}
.dr-adm__stat[href]:hover{border-color:var(--dr-blue,#17289B);transform:translateY(-2px);
  box-shadow:0 10px 26px rgba(10,16,40,.09)}
.dr-adm__stat b{display:block;font-family:'Archivo','Syne',sans-serif;font-weight:800;
  font-size:28px;line-height:1;letter-spacing:-.03em;color:var(--dr-blue,#17289B)}
.dr-adm__stat span{display:block;margin-top:8px;font-family:'IBM Plex Mono',monospace;
  font-size:10.5px;letter-spacing:.08em;text-transform:uppercase;color:var(--dr-muted,#5A607A)}
@media (max-width:1100px){ .dr-adm__stats{grid-template-columns:repeat(3,1fr)} }
@media (max-width:640px){ .dr-adm__stats{grid-template-columns:1fr 1fr} }

/* ── meldingen en lege staat ──────────────────────────────── */
.dr-adm__flash{border-radius:10px;padding:12px 16px;margin-bottom:18px;font-size:13.5px}
.dr-adm__flash--ok{background:rgba(31,138,76,.09);border:1px solid rgba(31,138,76,.3);color:#14532d}
.dr-adm__flash--no{background:rgba(179,38,30,.07);border:1px solid rgba(179,38,30,.3);color:#7f1d1d}
.dr-adm__empty{padding:52px 20px;text-align:center}
.dr-adm__empty b{display:block;font-family:'Archivo','Syne',sans-serif;font-weight:700;font-size:17px;margin-bottom:6px}
.dr-adm__empty p{margin:0 0 18px;color:var(--dr-muted,#5A607A)}

@media (max-width:1100px){ .dr-adm__grid{grid-template-columns:1fr} }
@media (max-width:860px){
  .dr-adm__fields{grid-template-columns:1fr}
  .dr-adm__tbl thead{display:none}
  .dr-adm__tbl tr{display:block;border-bottom:1px solid var(--adm-line);padding:10px 0}
  .dr-adm__tbl td{display:block;border:0;padding:3px 14px}
  .dr-adm__tbl .dr-adm__act{text-align:left;padding-top:9px}
}

/* hotfix 228: logo in de zijbalk van het beheer */
.dr-side__logo{display:flex;flex-direction:column;align-items:flex-start;gap:4px}
.dr-side__beeld img{display:block;width:170px;max-width:100%;height:auto}
.dr-side__beheer{font-size:11px;letter-spacing:.14em;text-transform:uppercase;opacity:.65;font-weight:600}

/* hotfix 229: logo van de homepage in een wit vlak */
.dr-side__logo{display:flex;flex-direction:column;align-items:flex-start;gap:6px}
.dr-side__beeld{display:inline-block;background:#fff;border-radius:10px;padding:8px 12px;line-height:0}
.dr-side__beeld img{display:block;height:34px;width:auto;max-width:100%}
.dr-side__beheer{font-size:11px;letter-spacing:.14em;text-transform:uppercase;opacity:.65;font-weight:600}