/* OUDERAVOND — vaste huisstijl */
:root{--color-navy-900:#12385f;--color-navy-800:#194872;--color-navy-700:#235b86;--color-teal-700:#078f87;--color-teal-600:#0aa39a;--color-teal-500:#19b3a8;--color-teal-100:#dff5f2;--color-teal-50:#f0faf9;--color-yellow-600:#ee9d05;--color-yellow-500:#ffad16;--color-yellow-100:#fff0ca;--color-yellow-50:#fff9eb;--color-mint-300:#a8d6d2;--color-mint-200:#c7e5e2;--color-mint-100:#e3f2f0;--color-white:#fff;--color-gray-50:#f8fafb;--color-gray-100:#f1f5f7;--color-gray-200:#e2e9ed;--color-gray-300:#ced8de;--color-gray-400:#9baab3;--color-gray-500:#6c7b85;--color-gray-600:#53616b;--color-gray-700:#3a4852;--color-gray-800:#26343e;--color-gray-900:#17242d;--color-primary:var(--color-teal-700);--color-primary-hover:#067a74;--color-primary-active:#056963;--color-primary-light:var(--color-teal-100);--color-secondary:var(--color-navy-900);--color-secondary-hover:#0d2e4f;--color-accent:var(--color-yellow-500);--color-accent-hover:var(--color-yellow-600);--color-success:#27845c;--color-success-bg:#e7f5ed;--color-warning:#b96b00;--color-warning-bg:#fff3d7;--color-danger:#c53d42;--color-danger-bg:#fcebec;--color-info:#26739d;--color-info-bg:#e8f3f9;--text-primary:var(--color-gray-900);--text-secondary:var(--color-gray-600);--text-muted:var(--color-gray-500);--text-link:var(--color-teal-700);--text-on-primary:var(--color-white);--background-page:#f7fafb;--background-surface:var(--color-white);--background-subtle:var(--color-gray-50);--background-highlight:var(--color-teal-50);--border-color:var(--color-gray-200);--border-color-strong:var(--color-gray-300);--font-family:Inter,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;--font-size-xs:.75rem;--font-size-sm:.875rem;--font-size-base:1rem;--font-size-md:1.125rem;--font-size-lg:1.375rem;--font-size-xl:1.75rem;--font-size-2xl:2.25rem;--line-height-tight:1.25;--line-height-base:1.55;--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--radius-sm:6px;--radius-md:10px;--radius-lg:14px;--radius-xl:20px;--radius-pill:999px;--shadow-sm:0 1px 2px rgba(18,56,95,.05),0 1px 4px rgba(18,56,95,.04);--shadow-md:0 4px 12px rgba(18,56,95,.08);--shadow-lg:0 12px 32px rgba(18,56,95,.11);--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.25rem;--space-6:1.5rem;--space-8:2rem;--space-10:2.5rem;--space-12:3rem;--transition-fast:120ms ease;--transition-base:180ms ease;--focus-ring:0 0 0 3px rgba(10,163,154,.25)}*,*::before,*::after{box-sizing:border-box}html{font-family:var(--font-family);color:var(--text-primary);background:var(--background-page);line-height:var(--line-height-base)}body{margin:0;background:var(--background-page);color:var(--text-primary);font-size:var(--font-size-base)}h1,h2,h3,h4{margin-top:0;color:var(--color-navy-900);line-height:var(--line-height-tight)}h1{font-size:var(--font-size-2xl);font-weight:var(--font-weight-bold)}h2{font-size:var(--font-size-xl);font-weight:var(--font-weight-bold)}h3{font-size:var(--font-size-lg);font-weight:var(--font-weight-semibold)}p{margin-top:0}a{color:var(--text-link);text-decoration-thickness:1px;text-underline-offset:3px}a:hover{color:var(--color-primary-hover)}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline:none;box-shadow:var(--focus-ring)}.app-container{width:min(100% - 32px,1200px);margin-inline:auto}.page-header{margin-bottom:var(--space-8)}.page-header__title{margin-bottom:var(--space-2)}.page-header__description{max-width:720px;color:var(--text-secondary)}.card{background:var(--background-surface);border:1px solid var(--border-color);border-radius:var(--radius-lg);padding:var(--space-6);box-shadow:var(--shadow-sm)}.card--interactive{transition:border-color var(--transition-base),box-shadow var(--transition-base),transform var(--transition-base)}.card--interactive:hover{border-color:var(--color-mint-300);box-shadow:var(--shadow-md);transform:translateY(-1px)}.card__title{margin-bottom:var(--space-2);color:var(--color-navy-900)}.card__description{color:var(--text-secondary)}.button{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);min-height:44px;padding:.7rem 1.1rem;border:1px solid transparent;border-radius:var(--radius-md);font:inherit;font-weight:var(--font-weight-semibold);line-height:1;cursor:pointer;transition:background-color var(--transition-fast),border-color var(--transition-fast),color var(--transition-fast),transform var(--transition-fast);text-decoration:none}.button:active{transform:translateY(1px)}.button--primary{background:var(--color-primary);color:var(--text-on-primary)}.button--primary:hover{background:var(--color-primary-hover);color:#fff}.button--secondary{background:var(--color-navy-900);color:var(--color-white)}.button--secondary:hover{background:var(--color-secondary-hover)}.button--outline{background:var(--color-white);border-color:var(--color-teal-700);color:var(--color-teal-700)}.button--outline:hover{background:var(--color-teal-50)}.button--accent{background:var(--color-yellow-500);color:var(--color-navy-900)}.button--accent:hover{background:var(--color-yellow-600)}.button--danger{background:var(--color-danger);color:var(--color-white)}.button:disabled{cursor:not-allowed;opacity:.55}.form-group{margin-bottom:var(--space-5)}label{display:inline-block;margin-bottom:var(--space-2);color:var(--color-gray-800);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold)}input,select,textarea{display:block;width:100%;padding:.75rem .875rem;background:var(--color-white);border:1px solid var(--border-color-strong);border-radius:var(--radius-md);color:var(--text-primary);font:inherit;transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}input,select{min-height:44px}textarea{min-height:120px;resize:vertical}input:hover,select:hover,textarea:hover{border-color:var(--color-mint-300)}input:focus,select:focus,textarea:focus{border-color:var(--color-teal-600);outline:none;box-shadow:var(--focus-ring)}::placeholder{color:var(--color-gray-400)}.form-help{display:block;margin-top:var(--space-2);color:var(--text-muted);font-size:var(--font-size-sm)}.form-error{display:block;margin-top:var(--space-2);color:var(--color-danger);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium)}.is-invalid{border-color:var(--color-danger)}.badge{display:inline-flex;align-items:center;gap:var(--space-1);padding:.3rem .65rem;border-radius:var(--radius-pill);font-size:var(--font-size-xs);font-weight:var(--font-weight-semibold)}.badge--success{background:var(--color-success-bg);color:var(--color-success)}.badge--warning{background:var(--color-warning-bg);color:var(--color-warning)}.badge--danger{background:var(--color-danger-bg);color:var(--color-danger)}.badge--info{background:var(--color-info-bg);color:var(--color-info)}.badge--neutral{background:var(--color-gray-100);color:var(--color-gray-700)}.alert{padding:var(--space-4) var(--space-5);border:1px solid transparent;border-radius:var(--radius-md);margin-bottom:var(--space-5)}.alert--success{background:var(--color-success-bg);border-color:#b8ddc8;color:#1e6546}.alert--warning{background:var(--color-warning-bg);border-color:#f0d28f;color:#805000}.alert--danger{background:var(--color-danger-bg);border-color:#e9b9bb;color:#8f2d31}.alert--info{background:var(--color-info-bg);border-color:#bbd9e8;color:#205e7f}.navbar{background:var(--color-white);border-bottom:1px solid var(--border-color)}.navbar__inner{display:flex;align-items:center;min-height:68px}.nav-link{display:inline-flex;align-items:center;padding:var(--space-2) var(--space-3);border-radius:var(--radius-sm);color:var(--color-gray-700);font-weight:var(--font-weight-medium);text-decoration:none}.nav-link:hover{background:var(--color-teal-50);color:var(--color-teal-700)}.nav-link--active{background:var(--color-teal-100);color:var(--color-navy-900);font-weight:var(--font-weight-semibold)}.table-wrapper{overflow-x:auto;background:var(--color-white);border:1px solid var(--border-color);border-radius:var(--radius-lg)}table{width:100%;border-collapse:collapse}th,td{padding:.85rem 1rem;border-bottom:1px solid var(--border-color);text-align:left}th{background:var(--color-gray-50);color:var(--color-navy-900);font-size:var(--font-size-sm);font-weight:var(--font-weight-semibold)}tbody tr:hover{background:var(--color-teal-50)}tbody tr:last-child td{border-bottom:0}.timeslot{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);padding:var(--space-4);background:var(--color-white);border:1px solid var(--border-color);border-radius:var(--radius-md);cursor:pointer;transition:background-color var(--transition-fast),border-color var(--transition-fast),box-shadow var(--transition-fast)}.timeslot:hover{border-color:var(--color-teal-500);background:var(--color-teal-50)}.timeslot--selected{border:2px solid var(--color-teal-700);background:var(--color-teal-100);box-shadow:var(--focus-ring)}.timeslot--unavailable{background:var(--color-gray-100);color:var(--text-muted);cursor:not-allowed;opacity:.7}.timeslot__time{color:var(--color-navy-900);font-weight:var(--font-weight-bold)}.calendar-day{display:flex;align-items:center;justify-content:center;min-width:40px;min-height:40px;border-radius:var(--radius-md);color:var(--text-primary);cursor:pointer}.calendar-day:hover{background:var(--color-teal-100)}.calendar-day--selected{background:var(--color-teal-700);color:var(--color-white);font-weight:var(--font-weight-semibold)}.calendar-day--has-appointments::after{content:"";width:6px;height:6px;margin-left:4px;background:var(--color-yellow-500);border-radius:50%}.stat-card{padding:var(--space-5);background:var(--color-white);border:1px solid var(--border-color);border-radius:var(--radius-lg)}.stat-card__label{color:var(--text-secondary);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium)}.stat-card__value{margin-top:var(--space-1);color:var(--color-navy-900);font-size:var(--font-size-xl);font-weight:var(--font-weight-bold)}.stat-card__accent{width:36px;height:4px;margin-bottom:var(--space-4);background:var(--color-yellow-500);border-radius:var(--radius-pill)}.page-shell{padding-block:var(--space-8)}.brandbar{gap:var(--space-4)}.brand__logo,.brand__tenant-logo{display:block;max-height:42px;max-width:180px}.brand-separator{width:1px;height:36px;background:var(--border-color)}.nav-spacer{flex:1}.auth-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-6)}.app-footer{padding:var(--space-8) 0;color:var(--text-muted);font-size:var(--font-size-sm)}@media(max-width:768px){:root{--font-size-2xl:1.85rem;--font-size-xl:1.5rem}.app-container{width:min(100% - 24px,1200px)}.card{padding:var(--space-5)}.button{min-height:46px}.auth-grid{grid-template-columns:1fr}.brand__tenant-logo{max-width:120px}}@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}


/* =========================================================
   FOOTER
   ========================================================= */
.app-footer__inner { display:flex; align-items:center; justify-content:space-between; gap:var(--space-4); flex-wrap:wrap; }
.app-footer__links { display:flex; gap:var(--space-4); flex-wrap:wrap; }
.app-footer__links a { color:var(--text-secondary); font-size:var(--font-size-sm); }

/* =========================================================
   SETUP & BEHEER
   ========================================================= */
.setup-form { max-width: 760px; }
.section-divider { border: 0; border-top: 1px solid var(--border-color); margin: var(--space-8) 0; }
.form-optional { color: var(--text-muted); font-weight: var(--font-weight-normal); }
.input-prefix { display:flex; align-items:stretch; }
.input-prefix > span { display:flex; align-items:center; padding:0 var(--space-3); background:var(--color-gray-50); border:1px solid var(--border-color-strong); border-right:0; border-radius:var(--radius-md) 0 0 var(--radius-md); color:var(--text-secondary); white-space:nowrap; }
.input-prefix > input { border-radius:0 var(--radius-md) var(--radius-md) 0; }
.dashboard-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:var(--space-4); margin-bottom:var(--space-6); }
.admin-start-card { margin-top:var(--space-6); }
code { background:var(--color-gray-100); border-radius:var(--radius-sm); padding:.1rem .35rem; font-size:.9em; }
@media (max-width:768px) { .dashboard-grid { grid-template-columns:1fr; } .input-prefix { display:block; } .input-prefix > span { border-right:1px solid var(--border-color-strong); border-bottom:0; border-radius:var(--radius-md) var(--radius-md) 0 0; min-height:40px; } .input-prefix > input { border-radius:0 0 var(--radius-md) var(--radius-md); } }

/* =========================================================
   OUDERAVONDEN — BEHEER
   ========================================================= */
.admin-page-header{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-6)}
.form-section{margin-bottom:var(--space-6)}
.form-grid{display:grid;gap:var(--space-5)}
.form-grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}
.form-actions{display:flex;justify-content:flex-end;gap:var(--space-3);margin:var(--space-6) 0 var(--space-8)}
.check-row{display:flex;align-items:flex-start;gap:var(--space-3);padding:var(--space-3) 0;margin:0;font-size:var(--font-size-base);font-weight:var(--font-weight-medium)}
.check-row input{width:auto;min-height:0;margin:.25rem 0 0;accent-color:var(--color-teal-700)}
.event-status-line{display:flex;align-items:center;gap:var(--space-3);margin-bottom:var(--space-5);color:var(--text-muted);font-size:var(--font-size-sm)}
.table-subtext{margin-top:var(--space-1);color:var(--text-muted);font-size:var(--font-size-sm)}
.table-actions{text-align:right;white-space:nowrap}.button--compact{min-height:38px;padding:.55rem .8rem}
.empty-state{text-align:center;padding:var(--space-10)}.empty-state .card__description{max-width:620px;margin-inline:auto}
.admin-section{margin-top:var(--space-10)}
.template-grid,.admin-module-grid,.action-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-4)}
.template-card{display:flex;flex-direction:column;gap:var(--space-2);text-decoration:none}.template-card span{color:var(--text-secondary);font-size:var(--font-size-sm)}
.module-card{text-decoration:none}.module-card--disabled{background:var(--color-gray-50);box-shadow:none}.module-card--disabled .card__title,.module-card--disabled .card__description{opacity:.72}
.action-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.inline-actions{display:flex;gap:var(--space-3);flex-wrap:wrap}.inline-actions form{margin:0}
.danger-zone{margin-top:var(--space-8);border-color:#e9b9bb}.danger-zone h2{color:var(--color-danger)}
@media(max-width:768px){.admin-page-header{display:block}.admin-page-header>.button{margin-top:var(--space-4)}.form-grid--2,.template-grid,.admin-module-grid,.action-grid{grid-template-columns:1fr}.form-actions{flex-direction:column-reverse}.form-actions .button{width:100%}}

/* =========================================================
   DOCENTEN, LOKALEN & BESCHIKBAARHEID
   ========================================================= */
.admin-split-grid,
.staffing-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-6);
}
.form-grid--3 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: var(--space-4);
}
.field-set {
  margin: 0 0 var(--space-5);
  padding: var(--space-4);
  border: 1px solid var(--border-color);
  border-radius: var(--radius-md);
}
.field-set legend {
  padding: 0 var(--space-2);
  color: var(--color-navy-900);
  font-weight: var(--font-weight-semibold);
}
.check-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--space-2) var(--space-4);
}
.resource-grid,
.staffing-list {
  display: grid;
  gap: var(--space-5);
}
.resource-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.staffing-card__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: var(--space-4);
  margin-bottom: var(--space-6);
}
.repeat-list {
  display: grid;
  gap: var(--space-3);
  margin-bottom: var(--space-3);
}
.repeat-row {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
  gap: var(--space-2);
  align-items: center;
}
.compact-list {
  display: grid;
  gap: var(--space-2);
  margin-top: var(--space-5);
}
.compact-edit-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto auto;
  gap: var(--space-2);
  align-items: center;
}
.details-panel {
  margin-top: var(--space-5);
  border-top: 1px solid var(--border-color);
  padding-top: var(--space-4);
}
.details-panel summary {
  cursor: pointer;
  color: var(--color-navy-900);
  font-weight: var(--font-weight-semibold);
  margin-bottom: var(--space-4);
}
.inline-form {
  display: flex;
  gap: var(--space-3);
  align-items: end;
}
.inline-form select { max-width: 560px; }

@media (max-width: 900px) {
  .admin-split-grid,
  .staffing-grid,
  .resource-grid,
  .form-grid--3,
  .check-grid {
    grid-template-columns: 1fr;
  }
  .repeat-row,
  .compact-edit-row {
    grid-template-columns: 1fr;
  }
  .staffing-card__header,
  .inline-form {
    align-items: stretch;
    flex-direction: column;
  }
}

/* v1.3.0 — imports, docentselectie en beschikbaarheidsraster */
.import-grid,.teacher-check-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-4)}
.import-summary,.selection-toolbar,.availability-grid__legend,.availability-day__toolbar{display:flex;align-items:center;gap:var(--space-3);flex-wrap:wrap;justify-content:space-between}
.subject-group-title{margin:var(--space-4) 0 var(--space-2);font-size:var(--font-size-base)}
.teacher-check-card{display:flex;gap:var(--space-3);align-items:flex-start;padding:var(--space-4);border:1px solid var(--border-color);border-radius:var(--radius-md);background:var(--color-white);cursor:pointer}
.teacher-check-card:has(input:checked){border-color:var(--color-teal-600);background:var(--color-teal-50)}
.teacher-check-card input{width:auto;min-height:auto;margin-top:.25rem}.teacher-check-card span{display:flex;flex-direction:column}.teacher-check-card small{color:var(--text-secondary);margin-top:var(--space-1)}
.availability-progress{height:8px;max-width:180px;background:var(--color-gray-100);border-radius:var(--radius-pill);overflow:hidden}.availability-progress span{display:block;height:100%;background:var(--color-teal-600)}
.day-tabs{display:flex;gap:var(--space-2);overflow-x:auto;margin:var(--space-5) 0}.day-tab{border:1px solid var(--border-color);background:var(--color-white);border-radius:var(--radius-md);padding:.7rem 1rem;font:inherit;font-weight:var(--font-weight-semibold);white-space:nowrap;cursor:pointer}.day-tab.is-active{background:var(--color-teal-100);border-color:var(--color-teal-600);color:var(--color-navy-900)}
.availability-day{display:none}.availability-day.is-active{display:block}.slot-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(145px,1fr));gap:var(--space-3);margin-top:var(--space-4)}
.availability-slot{min-height:72px;text-align:left;border:1px solid var(--border-color-strong);border-radius:var(--radius-md);padding:var(--space-3);font:inherit;cursor:pointer;background:var(--color-gray-50);transition:background var(--transition-fast),border-color var(--transition-fast),transform var(--transition-fast)}.availability-slot:hover{transform:translateY(-1px)}.availability-slot.is-available{background:var(--color-success-bg);border-color:#9bcdb1}.availability-slot.is-off{background:var(--color-gray-100);color:var(--text-secondary)}.availability-slot__time,.availability-slot__state{display:block}.availability-slot__time{font-weight:var(--font-weight-bold);color:var(--color-navy-900)}.availability-slot__state{font-size:var(--font-size-sm);margin-top:var(--space-1)}
.legend-dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:5px}.legend-dot--available{background:var(--color-success)}.legend-dot--off{background:var(--color-gray-400)}.save-state{margin-left:auto;color:var(--text-muted);font-size:var(--font-size-sm)}
@media(max-width:768px){.import-grid,.teacher-check-grid{grid-template-columns:1fr}.slot-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}


/* =========================================================
   v1.4.0 — OUDERAVOND DASHBOARD, DAGRANGES & TENANTLOGO
   ========================================================= */
.dashboard-grid--compact{
  grid-template-columns:repeat(2,minmax(0,1fr));
}
.event-dashboard-stats{
  grid-template-columns:repeat(4,minmax(0,1fr));
}
.stat-card__value--text{
  font-size:var(--font-size-md);
}
.event-dashboard-grid{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--space-5);
}
.section-heading-row{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:var(--space-4);
  margin-bottom:var(--space-4);
}
.event-days{
  display:grid;
  gap:var(--space-3);
  margin:var(--space-4) 0 var(--space-6);
}
.event-day-row{
  display:grid;
  grid-template-columns:minmax(180px,1.3fr) minmax(130px,1fr) minmax(130px,1fr) auto;
  gap:var(--space-3);
  align-items:end;
  padding:var(--space-4);
  border:1px solid var(--border-color);
  border-radius:var(--radius-md);
  background:var(--background-subtle);
}
.event-day-row .form-group,
.break-row .form-group{
  margin-bottom:0;
}
.event-day-remove{
  margin-bottom:1px;
}
.event-day-summary{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:var(--space-4);
  padding:var(--space-3) 0;
  border-bottom:1px solid var(--border-color);
}
.event-day-summary:last-child{
  border-bottom:0;
}
.break-row{
  display:grid;
  grid-template-columns:minmax(150px,1.2fr) minmax(100px,.8fr) minmax(100px,.8fr) minmax(180px,1.5fr) auto;
  gap:var(--space-3);
  align-items:end;
  padding:var(--space-4);
  border:1px solid var(--border-color);
  border-radius:var(--radius-md);
  background:var(--background-subtle);
}
.availability-hours{
  display:grid;
  gap:var(--space-4);
  margin-top:var(--space-4);
}
.availability-hour-row{
  display:grid;
  grid-template-columns:110px minmax(0,1fr);
  gap:var(--space-4);
  align-items:start;
  padding-top:var(--space-4);
  border-top:1px solid var(--border-color);
}
.availability-hour-row:first-child{
  border-top:0;
  padding-top:0;
}
.availability-hour-label{
  padding-top:var(--space-3);
  color:var(--color-navy-900);
  font-size:var(--font-size-sm);
  font-weight:var(--font-weight-bold);
  white-space:nowrap;
}
.slot-grid--hour{
  margin-top:0;
  grid-template-columns:repeat(auto-fit,minmax(135px,1fr));
}
.availability-slot:disabled{
  cursor:default;
  opacity:1;
  transform:none;
}
.tenant-logo-preview{
  min-height:170px;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:var(--space-6);
  margin:var(--space-4) 0;
  border:1px solid var(--border-color);
  border-radius:var(--radius-md);
  background:var(--color-white);
}
.tenant-logo-preview img{
  display:block;
  max-width:100%;
  max-height:140px;
  object-fit:contain;
}

@media(max-width:1000px){
  .event-dashboard-stats{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
  .event-day-row,
  .break-row{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}
@media(max-width:768px){
  .dashboard-grid--compact,
  .event-dashboard-stats,
  .event-dashboard-grid,
  .event-day-row,
  .break-row{
    grid-template-columns:1fr;
  }
  .availability-hour-row{
    grid-template-columns:1fr;
    gap:var(--space-2);
  }
  .availability-hour-label{
    padding-top:0;
  }
  .slot-grid--hour{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}


/* v1.4.1 beschikbaarheidsraster */
.availability-slot.is-saving { opacity:.72; cursor:progress; }


/* =========================================================
   DOCENTPROFIEL / VAKKEN
   ========================================================= */
.subject-choice-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:var(--space-3);margin:var(--space-5) 0}.subject-choice{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-4);margin:0;border:1px solid var(--border-color);border-radius:var(--radius-md);background:var(--color-white);cursor:pointer}.subject-choice:hover{border-color:var(--color-mint-300);background:var(--color-teal-50)}.subject-choice input{width:auto;min-height:0;margin:0}.subject-choice span{display:flex;align-items:center;justify-content:space-between;gap:var(--space-2);width:100%}.subject-choice small{padding:.15rem .45rem;border-radius:var(--radius-pill);background:var(--color-yellow-100);color:var(--color-navy-900);font-weight:var(--font-weight-semibold)}

/* =========================================================
   BOEKINGEN & CRUD-ACTIES
   ========================================================= */
.home-actions,
.booking-event-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: var(--space-5);
}
.booking-login-card { margin-top: var(--space-6); }
.booking-teachers { display: grid; gap: var(--space-5); margin-top: var(--space-5); }
.booking-teacher { overflow: hidden; }
.booking-slots { display: flex; flex-wrap: wrap; gap: var(--space-2); align-items: center; }
.booking-slots__day { flex-basis: 100%; margin-top: var(--space-3); color: var(--color-navy-900); font-weight: var(--font-weight-semibold); }
.booking-slot { margin: 0; cursor: pointer; }
.booking-slot input { position: absolute; opacity: 0; pointer-events: none; width: 1px; height: 1px; }
.booking-slot span { display: inline-flex; min-height: 42px; align-items: center; padding: .55rem .8rem; border: 1px solid var(--border-color-strong); border-radius: var(--radius-md); background: var(--color-white); color: var(--color-navy-900); font-weight: var(--font-weight-semibold); }
.booking-slot input:checked + span { background: var(--color-teal-100); border-color: var(--color-teal-700); box-shadow: var(--focus-ring); }
.booking-slot input:focus-visible + span { box-shadow: var(--focus-ring); }
.booking-contact { margin-bottom: var(--space-5); }
.booking-submitbar { position: sticky; bottom: 0; display: flex; justify-content: flex-end; padding: var(--space-4) 0; background: linear-gradient(transparent, var(--background-page) 30%); }
.booking-narrow { max-width: 720px; margin-inline: auto; }
.booking-summary { margin: 0 0 var(--space-5); }
.booking-summary > div { display: grid; grid-template-columns: minmax(100px, 160px) 1fr; gap: var(--space-3); padding: var(--space-3) 0; border-bottom: 1px solid var(--border-color); }
.booking-summary dt { color: var(--text-secondary); font-weight: var(--font-weight-semibold); }
.booking-summary dd { margin: 0; }
.table-action-group,.resource-actions { display: flex; gap: var(--space-2); align-items: center; flex-wrap: wrap; }
.table-action-group form,.resource-actions form { margin: 0; }
.compact-edit-form { display: contents; }
@media (max-width: 600px) {
  .booking-summary > div { grid-template-columns: 1fr; gap: var(--space-1); }
  .booking-submitbar .button { width: 100%; }
}
.resource-delete-form { margin-top: var(--space-3); }
.booking-manage-section { margin-top: var(--space-6); padding-top: var(--space-5); border-top: 1px solid var(--border-color); }

/* =========================================================
   COMPACTE CHECKBOXEN
   ========================================================= */
.check-row--compact {
  display: inline-flex;
  align-items: center;
  gap: var(--space-3);
  min-height: 44px;
  margin: 0;
  cursor: pointer;
}
.check-row--compact input[type="checkbox"] {
  width: 20px;
  height: 20px;
  min-height: 20px;
  flex: 0 0 20px;
  margin: 0;
  accent-color: var(--color-primary);
}
.check-row--compact span { line-height: 1.35; }

/* =========================================================
   DOCENTPICKER
   ========================================================= */
.teacher-picker-card { margin-top: var(--space-6); }
.teacher-picker-controls {
  display: grid;
  grid-template-columns: minmax(180px, 0.7fr) minmax(260px, 1.3fr);
  gap: var(--space-5);
}
.teacher-picker-results {
  display: grid;
  gap: var(--space-2);
  max-height: 420px;
  overflow: auto;
  padding-right: var(--space-1);
}
.teacher-picker-option {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: var(--space-4);
  padding: var(--space-4);
  border: 1px solid var(--border-color);
  border-radius: var(--radius-md);
  background: var(--color-white);
  color: var(--text-primary);
  font: inherit;
  text-align: left;
  cursor: pointer;
}
.teacher-picker-option:hover { border-color: var(--color-teal-500); background: var(--color-teal-50); }
.teacher-picker-option.is-selected { border: 2px solid var(--color-teal-700); background: var(--color-teal-100); }
.teacher-picker-option strong,.teacher-picker-option small { display:block; }
.teacher-picker-option small { margin-top: var(--space-1); color: var(--text-secondary); }
.teacher-picker-option__action { color: var(--color-teal-700); font-weight: var(--font-weight-semibold); }
.teacher-picker-empty { color: var(--text-secondary); padding: var(--space-4); }
.booking-selected-teacher { margin-top: var(--space-5); }

/* =========================================================
   AGENDA-ABONNEMENT / SECTIEKOP
   ========================================================= */
.calendar-link-row { display:grid; grid-template-columns:minmax(260px,1fr) auto auto; gap:var(--space-3); align-items:center; }
.section-heading-row { display:flex; align-items:flex-start; justify-content:space-between; gap:var(--space-5); margin-bottom:var(--space-4); }
.section-heading-row h2 { margin-bottom:var(--space-1); }

@media (max-width: 768px) {
  .teacher-picker-controls { grid-template-columns:1fr; gap:var(--space-2); }
  .calendar-link-row { grid-template-columns:1fr; }
  .section-heading-row { flex-direction:column; }
}
.teacher-picker-hint { margin:0; padding:var(--space-4); color:var(--text-secondary); background:var(--color-gray-50); border-radius:var(--radius-md); }
.check-row--compact input[type="checkbox"] { padding:0; margin:0; }


/* =========================================================
   BOEKING — TIJDSLOTS PER HEEL UUR
   ========================================================= */

.booking-slots--grouped {
  display: block;
}

.booking-slots--grouped .booking-slots__day {
  margin-top: var(--space-5);
  margin-bottom: var(--space-3);
}

.booking-slots__hour-row {
  display: grid;
  grid-template-columns: minmax(110px, 150px) 1fr;
  gap: var(--space-4);
  align-items: start;
  padding: var(--space-3) 0;
  border-top: 1px solid var(--border-color);
}

.booking-slots__hour-label {
  padding-top: 0.6rem;
  color: var(--text-secondary);
  font-size: var(--font-size-sm);
  font-weight: var(--font-weight-semibold);
}

.booking-slots__hour-options {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-2);
}

.booking-topic-after-slots {
  margin-top: var(--space-6);
}

@media (max-width: 768px) {
  .booking-slots__hour-row {
    grid-template-columns: 1fr;
    gap: var(--space-2);
  }

  .booking-slots__hour-label {
    padding-top: 0;
  }
}

/* v1.6.0 - beschikbaarheid, platformbeheer en service */
.availability-meter{display:flex;width:100%;max-width:360px;height:12px;overflow:hidden;border-radius:999px;background:var(--color-gray-100);border:1px solid var(--border-color)}
.availability-meter>span{display:block;height:100%}
.availability-meter__available{background:var(--color-success)}
.availability-meter__blocked{background:var(--color-yellow-500)}
.availability-meter__school{background:var(--color-gray-300)}
.availability-legend--blocked{color:var(--color-warning)}
.availability-legend--school{color:var(--text-muted)}
.service-bar{background:var(--color-warning-bg);border-bottom:1px solid #f0d28f}
.service-bar__inner{display:flex;align-items:center;justify-content:space-between;gap:var(--space-3);padding-block:var(--space-2)}
.invoice-line{display:grid;grid-template-columns:minmax(220px,2fr) minmax(90px,.5fr) minmax(120px,.7fr) auto;gap:var(--space-2);margin-bottom:var(--space-2)}
.rich-editor{min-height:260px;border:1px solid var(--border-color-strong);border-radius:var(--radius-md);padding:var(--space-4);background:#fff;margin-bottom:var(--space-4)}
.editor-toolbar{display:flex;gap:var(--space-2);margin-bottom:var(--space-2)}
.editor-toolbar button{border:1px solid var(--border-color);background:#fff;border-radius:var(--radius-sm);padding:.45rem .7rem;cursor:pointer}
.legal-preview{padding:var(--space-5);background:var(--background-subtle);border:1px solid var(--border-color);border-radius:var(--radius-md);margin-bottom:var(--space-4)}
.premium-card{border-color:var(--color-yellow-500);background:var(--color-yellow-50)}
.danger-zone{border-color:#e9b9bb}
.actions-inline{display:flex;gap:var(--space-2);align-items:center;flex-wrap:wrap}
@media(max-width:768px){.invoice-line{grid-template-columns:1fr}.service-bar__inner{align-items:flex-start;flex-direction:column}}

/* =========================================================
   v1.6.1 - LIVE FACTUURWIZARD
   ========================================================= */
.invoice-settings{margin-bottom:var(--space-6)}
.invoice-settings summary{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);cursor:pointer;color:var(--color-navy-900)}
.invoice-settings summary span{color:var(--text-secondary);font-size:var(--font-size-sm);font-weight:var(--font-weight-normal)}
.invoice-settings[open] summary{margin-bottom:var(--space-5)}
.invoice-wizard-card{margin-bottom:var(--space-8)}
.invoice-wizard{display:grid;grid-template-columns:minmax(0,1fr) minmax(420px,.82fr);gap:var(--space-8);align-items:start}
.invoice-wizard__form{min-width:0}
.invoice-step{padding:0 0 var(--space-6);margin:0 0 var(--space-6);border-bottom:1px solid var(--border-color)}
.invoice-step__heading{display:flex;gap:var(--space-3);align-items:flex-start;margin-bottom:var(--space-5)}
.invoice-step__heading>span{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;flex:0 0 30px;border-radius:var(--radius-pill);background:var(--color-teal-100);color:var(--color-navy-900);font-weight:var(--font-weight-bold)}
.invoice-step__heading h3{margin:0 0 var(--space-1)}
.invoice-step__heading p{margin:0;color:var(--text-secondary);font-size:var(--font-size-sm)}
.optional{color:var(--text-muted);font-weight:var(--font-weight-normal);font-size:var(--font-size-xs)}
.form-grid--address .form-group--wide{grid-column:span 2}
.invoice-discount-presets{display:flex;gap:var(--space-2);flex-wrap:wrap}
.invoice-wizard__submit{display:flex;justify-content:flex-end;position:sticky;bottom:0;padding:var(--space-4) 0;background:linear-gradient(transparent,var(--background-surface) 32%)}
.invoice-live-preview__sticky{position:sticky;top:var(--space-4)}
.invoice-live-preview__label{display:flex;justify-content:space-between;gap:var(--space-3);margin-bottom:var(--space-3);color:var(--color-navy-900)}
.invoice-live-preview__label span{color:var(--text-secondary);font-size:var(--font-size-sm)}
.invoice-paper{aspect-ratio:210/297;min-height:680px;padding:34px;background:#fff;border:1px solid var(--border-color);border-radius:var(--radius-sm);box-shadow:var(--shadow-md);font-size:12px;color:#26343e;overflow:hidden}
.invoice-paper__top{display:grid;grid-template-columns:1fr 1fr;gap:24px;min-height:150px}
.invoice-paper__recipient,.invoice-paper__sender div{display:flex;flex-direction:column;line-height:1.5}
.invoice-paper__sender{text-align:right}.invoice-paper__sender img{width:62px;max-height:62px;object-fit:contain;margin:0 0 6px auto}
.invoice-paper h2{font-size:26px;margin:0 0 18px;color:var(--color-navy-900)}
.invoice-paper__meta{margin:0 0 28px}.invoice-paper__meta>div{display:grid;grid-template-columns:120px 1fr;gap:8px;margin:3px 0}.invoice-paper__meta dt{font-weight:var(--font-weight-normal)}.invoice-paper__meta dd{margin:0}
.invoice-paper__items{width:100%;border-collapse:collapse;margin-top:10px}.invoice-paper__items th{font-size:11px;font-weight:var(--font-weight-normal);border-bottom:1px solid var(--color-gray-600);padding:0 4px 5px}.invoice-paper__items td{font-size:11px;padding:5px 4px}.invoice-paper__items th:not(:first-child),.invoice-paper__items td.num{text-align:right}
.invoice-paper__totals{width:58%;margin:24px 0 0 auto}.invoice-paper__totals>div{display:flex;justify-content:space-between;gap:12px;padding:4px}.invoice-paper__discount{color:var(--color-warning)}.invoice-paper__grand{margin-top:18px;font-size:14px;font-weight:var(--font-weight-bold)}
.invoice-paper__pay{margin-top:55px;text-align:center;line-height:1.45;font-size:10px}
.invoice-paper [hidden]{display:none!important}
@media(max-width:1100px){.invoice-wizard{grid-template-columns:1fr}.invoice-live-preview__sticky{position:static}.invoice-live-preview{max-width:650px;width:100%;margin:auto}}
@media(max-width:620px){.form-grid--address .form-group--wide{grid-column:auto}.invoice-paper{padding:20px;min-height:560px}.invoice-live-preview__label{flex-direction:column}.invoice-paper__top{gap:12px}.invoice-paper__totals{width:75%}}


/* Mail editor */
.mail-editor-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(360px,.9fr);gap:var(--space-6);align-items:start}.mail-preview-panel{position:sticky;top:var(--space-4)}.mail-preview-panel iframe{width:100%;height:680px;border:1px solid var(--border-color);border-radius:var(--radius-md);background:#f7fafb}.mail-preview-subject{font-weight:var(--font-weight-semibold);color:var(--color-navy-900);margin-bottom:var(--space-3)}.mail-preview-error{color:var(--color-danger);font-size:var(--font-size-sm);margin-top:var(--space-2)}.rte-toolbar{display:flex;gap:var(--space-2);flex-wrap:wrap;margin-bottom:var(--space-2)}.rte-toolbar button,.mail-variable{background:#fff;border:1px solid var(--border-color-strong);border-radius:var(--radius-sm);padding:.45rem .65rem;font:inherit;cursor:pointer}.rte-toolbar button:hover,.mail-variable:hover{background:var(--color-teal-50);border-color:var(--color-teal-500)}.rte-editor{min-height:280px;padding:var(--space-4);background:#fff;border:1px solid var(--border-color-strong);border-radius:var(--radius-md);line-height:1.55}.rte-editor:focus{outline:none;border-color:var(--color-teal-600);box-shadow:var(--focus-ring)}.rte-editor[data-disabled="1"]{background:var(--color-gray-50);color:var(--text-secondary)}.mail-variable-list{display:flex;align-items:center;gap:var(--space-2);flex-wrap:wrap;margin:var(--space-4) 0}.mail-variable{font-size:var(--font-size-xs);color:var(--color-navy-900)}.mail-actions-card,.mail-test-form{display:flex;gap:var(--space-4);align-items:end;flex-wrap:wrap;margin-top:var(--space-5)}.mail-test-form label{min-width:220px}.mail-source-choice{margin-bottom:var(--space-4)}@media(max-width:900px){.mail-editor-layout{grid-template-columns:1fr}.mail-preview-panel{position:static}.mail-preview-panel iframe{height:560px}}
.mail-managed-note{margin:-.25rem 0 var(--space-3);padding:.65rem .8rem;background:var(--color-gray-50);border-radius:var(--radius-sm);border:1px solid var(--border-color)}

/* =========================================================
   ROOSTER LOCATIES / ACCOUNTS
   ========================================================= */
.scheduler-toolbar{margin-bottom:var(--space-6)}
.scheduler-metrics{display:flex;gap:var(--space-8);flex-wrap:wrap;margin-bottom:var(--space-5)}
.scheduler-metrics>div{display:flex;flex-direction:column}.scheduler-metrics strong{font-size:var(--font-size-xl);color:var(--color-navy-900)}.scheduler-metrics span{font-size:var(--font-size-sm);color:var(--text-secondary)}
.schedule-tabs{display:flex;gap:var(--space-2);margin-bottom:var(--space-4);overflow-x:auto}.schedule-tab{border:1px solid var(--border-color);background:var(--color-white);border-radius:var(--radius-md);padding:.65rem 1rem;font:inherit;font-weight:600;cursor:pointer;white-space:nowrap}.schedule-tab.is-active{background:var(--color-teal-100);border-color:var(--color-teal-600);color:var(--color-navy-900)}
.schedule-day{display:none}.schedule-day.is-active{display:block}.schedule-scroll{overflow:auto;border:1px solid var(--border-color);border-radius:var(--radius-lg);background:var(--color-white)}.schedule-board{display:grid;grid-template-columns:180px minmax(calc(var(--schedule-cols) * 62px),1fr);min-width:max-content}.schedule-corner,.schedule-location-label{position:sticky;left:0;z-index:4;background:var(--color-white);border-right:1px solid var(--border-color);border-bottom:1px solid var(--border-color);padding:.75rem}.schedule-corner{top:0;z-index:6;background:var(--color-gray-50);font-weight:700;color:var(--color-navy-900)}.schedule-location-label small{display:block;color:var(--text-secondary);font-size:var(--font-size-xs);margin-top:.15rem}.schedule-time-head,.schedule-track{display:grid;grid-template-columns:repeat(var(--schedule-cols),minmax(62px,1fr));position:relative}.schedule-time-head{position:sticky;top:0;z-index:5;background:var(--color-gray-50);border-bottom:1px solid var(--border-color);min-height:44px}.schedule-time-head span{padding:.7rem .3rem;border-left:1px solid var(--border-color);font-size:var(--font-size-xs);color:var(--text-secondary)}.schedule-track{min-height:62px;border-bottom:1px solid var(--border-color)}.schedule-track.is-drop-target{background:var(--color-teal-50)}.schedule-grid-cell{grid-row:1;border-left:1px solid var(--color-gray-100);min-height:62px}.schedule-assignment{grid-row:1;z-index:2;margin:6px 3px;padding:.4rem .55rem;border-radius:var(--radius-sm);border:1px solid var(--color-teal-600);background:var(--color-teal-100);color:var(--color-navy-900);text-align:left;overflow:hidden;cursor:grab;min-width:0}.schedule-assignment.is-manual{border-color:var(--color-yellow-600);background:var(--color-yellow-50)}.schedule-assignment.is-selected{box-shadow:var(--focus-ring);outline:2px solid var(--color-teal-700)}.schedule-assignment.is-saving{opacity:.55}.schedule-assignment strong,.schedule-assignment span{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.schedule-assignment span{font-size:var(--font-size-xs);font-weight:500;margin-top:2px}.scheduler-help{margin-top:var(--space-4)}
.role-picker{display:flex;gap:var(--space-4);flex-wrap:wrap;margin-bottom:var(--space-4)}.account-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:var(--space-4)}
@media(max-width:768px){.schedule-board{grid-template-columns:140px minmax(calc(var(--schedule-cols) * 54px),1fr)}.scheduler-metrics{gap:var(--space-4)}}

/* =========================================================
   CENTRALE HOMEPAGE — rustig canvas, augustus 2026
   Alleen actief op de publieke marketing-homepage.
   ========================================================= */
.marketing-home{display:grid;gap:0;margin-top:calc(var(--space-8) * -1);margin-bottom:var(--space-8)}
.marketing-hero{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 340px;grid-template-areas:"copy login" "art art";column-gap:clamp(2rem,5vw,5rem);row-gap:var(--space-8);align-items:start;min-height:640px;padding:clamp(3rem,6vw,5.5rem) 0 var(--space-12)}
.marketing-hero::before{content:"";position:absolute;z-index:-1;inset:0 50% auto 50%;width:100vw;height:72%;transform:translateX(-50%);background:linear-gradient(180deg,var(--color-teal-50) 0%,rgba(240,250,249,.38) 62%,rgba(247,250,251,0) 100%)}
.marketing-hero__copy{grid-area:copy;max-width:660px;padding-top:var(--space-5)}
.marketing-hero h1{margin-bottom:var(--space-5);font-size:clamp(2.6rem,5vw,4.7rem);letter-spacing:-.035em;line-height:1.02}
.marketing-lead{max-width:650px;margin-bottom:0;color:var(--color-gray-700);font-size:clamp(1.1rem,1.7vw,1.35rem);line-height:1.65}
.marketing-eyebrow,.marketing-kicker{margin-bottom:var(--space-3);color:var(--color-teal-700);font-size:var(--font-size-sm);font-weight:var(--font-weight-bold);letter-spacing:.09em;text-transform:uppercase}
.marketing-login-card{grid-area:login;position:relative;z-index:2;padding:var(--space-6);background:var(--color-white);border:1px solid var(--color-mint-200);border-radius:var(--radius-xl);box-shadow:var(--shadow-lg)}
.marketing-login-card h2{margin-bottom:var(--space-3);font-size:var(--font-size-lg)}
.marketing-login-card>p{color:var(--text-secondary)}
.marketing-login-card__button{width:100%;margin-top:var(--space-2)}
.marketing-login-card .marketing-login-card__note{margin:var(--space-3) 0 0;text-align:center;color:var(--text-muted);font-size:var(--font-size-sm)}
.marketing-login-card__alternative{margin-top:var(--space-5)}
.marketing-login-card__divider{display:flex;align-items:center;gap:var(--space-3);margin:var(--space-4) 0;color:var(--text-muted);font-size:var(--font-size-sm)}
.marketing-login-card__divider::before,.marketing-login-card__divider::after{content:"";height:1px;flex:1;background:var(--border-color)}
.marketing-otp summary{cursor:pointer;color:var(--color-teal-700);font-weight:var(--font-weight-semibold);text-align:center}
.marketing-otp[open] summary{margin-bottom:var(--space-3)}
.marketing-otp>p{margin-bottom:var(--space-3);color:var(--text-secondary);font-size:var(--font-size-sm)}
.marketing-otp .form-group{margin-bottom:var(--space-3)}

.marketing-hero__art{grid-area:art;display:flex;justify-content:center;align-items:flex-end;min-height:300px}
.marketing-hero__art img{display:block;width:min(100%,1040px);height:auto;max-height:410px;object-fit:contain}
.marketing-section{display:grid;align-items:center;min-height:420px;padding:clamp(4rem,8vw,7rem) 0}
.marketing-section--split{grid-template-columns:minmax(0,1fr) minmax(300px,.78fr);gap:clamp(3rem,8vw,7rem)}
.marketing-section--reverse{grid-template-columns:minmax(300px,.78fr) minmax(0,1fr)}
.marketing-section--soft{position:relative}
.marketing-section--soft::before,.marketing-section--privacy::before,.marketing-section--school::before{content:"";position:absolute;z-index:-1;inset:0 50%;width:100vw;transform:translateX(-50%)}
.marketing-section--soft::before{background:var(--color-white)}
.marketing-section__copy{max-width:650px}
.marketing-section__copy h2{margin-bottom:var(--space-5);font-size:clamp(1.9rem,3.4vw,3rem);letter-spacing:-.02em}
.marketing-section__copy p{margin-bottom:var(--space-4);color:var(--color-gray-700);font-size:var(--font-size-md);line-height:1.75}
.marketing-section__copy--center{max-width:790px;margin-inline:auto;text-align:center}
.marketing-illustration{margin:0;text-align:center}
.marketing-illustration img{display:block;width:min(100%,440px);height:auto;margin-inline:auto;object-fit:contain}
.marketing-illustration--small img{width:min(100%,280px)}
.marketing-illustration--conversation img{width:min(100%,520px)}
.marketing-illustration--school img{width:min(100%,500px)}
.marketing-section--privacy{position:relative;min-height:360px;padding-block:clamp(4rem,7vw,6rem)}
.marketing-section--privacy::before{background:var(--color-teal-50)}
.marketing-text-link{display:inline-block;margin-top:var(--space-2);font-weight:var(--font-weight-semibold)}
.marketing-section--practice{display:block;min-height:0}
.marketing-practice-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-8);margin-top:var(--space-10)}
.marketing-practice-grid--single{grid-template-columns:minmax(0,780px);justify-content:center}
.marketing-screenshot{margin:0}
.marketing-screenshot img{display:block;width:100%;height:auto;border:1px solid var(--border-color);border-radius:var(--radius-lg);box-shadow:var(--shadow-md);background:var(--color-white)}
.marketing-screenshot figcaption{display:grid;gap:var(--space-1);padding:var(--space-4) var(--space-2) 0;color:var(--text-secondary)}
.marketing-screenshot figcaption strong{color:var(--color-navy-900);font-size:var(--font-size-md)}
.marketing-section--school{position:relative;grid-template-columns:minmax(0,1fr) minmax(320px,.8fr);gap:clamp(2rem,7vw,6rem);min-height:430px;margin-top:var(--space-8)}
.marketing-section--school::before{background:linear-gradient(135deg,var(--color-white),var(--color-teal-50))}
.marketing-section--school .button{margin-top:var(--space-3)}

@media(max-width:900px){
  .marketing-hero{grid-template-columns:1fr;grid-template-areas:"copy" "login" "art";min-height:0;padding-top:var(--space-10)}
  .marketing-hero__copy{padding-top:0}
  .marketing-login-card{width:min(100%,520px)}
  .marketing-section--split,.marketing-section--reverse,.marketing-section--school{grid-template-columns:1fr;gap:var(--space-8);min-height:0}
  .marketing-section--reverse .marketing-illustration{order:2}
  .marketing-section--reverse .marketing-section__copy{order:1}
  .marketing-section--school .marketing-illustration{order:2}
  .marketing-practice-grid{grid-template-columns:1fr}
}
@media(max-width:600px){
  .marketing-home{margin-top:calc(var(--space-8) * -1)}
  .marketing-hero{row-gap:var(--space-6);padding-top:var(--space-8)}
  .marketing-hero h1{font-size:2.65rem}
  .marketing-login-card{padding:var(--space-5)}
  .marketing-hero__art{min-height:210px}
  .marketing-section{padding:3.75rem 0}
  .marketing-section__copy p{font-size:var(--font-size-base)}
}

/* =========================================================
   v1.6.2 — professioneel docentdashboard
   ========================================================= */
.teacher-dashboard-primary{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:var(--space-6);
  align-items:stretch;
}
.teacher-dashboard-card{
  position:relative;
  min-width:0;
  overflow:hidden;
}
.teacher-dashboard-card__body{
  position:relative;
  z-index:1;
  height:100%;
  display:flex;
  flex-direction:column;
}
.teacher-dashboard-card__heading,
.teacher-dashboard-section__heading,
.teacher-calendar-card__content{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:var(--space-5);
}
.teacher-dashboard-card__heading{
  min-height:104px;
}
.teacher-dashboard-card__heading h2,
.teacher-dashboard-section__heading h2,
.teacher-calendar-card__content h2{
  margin-bottom:var(--space-2);
}
.teacher-dashboard-card__eyebrow{
  display:block;
  margin-bottom:var(--space-1);
  color:var(--color-teal-700);
  font-size:var(--font-size-xs);
  font-weight:var(--font-weight-bold);
  letter-spacing:.08em;
  text-transform:uppercase;
}
.teacher-dashboard-card__art{
  width:104px;
  height:104px;
  object-fit:contain;
  flex:0 0 auto;
  margin-top:-.5rem;
}
.teacher-profile-summary{
  margin:var(--space-2) 0 var(--space-5);
  display:grid;
  gap:0;
}
.teacher-profile-summary>div{
  display:grid;
  grid-template-columns:110px minmax(0,1fr);
  gap:var(--space-3);
  padding:.7rem 0;
  border-bottom:1px solid var(--border-color);
}
.teacher-profile-summary>div:last-child{border-bottom:0}
.teacher-profile-summary dt{
  color:var(--text-muted);
  font-size:var(--font-size-sm);
  font-weight:var(--font-weight-semibold);
}
.teacher-profile-summary dd{
  min-width:0;
  margin:0;
  overflow-wrap:anywhere;
  color:var(--color-gray-800);
  font-weight:var(--font-weight-medium);
}
.teacher-profile-summary__missing{
  color:var(--color-warning);
  font-weight:var(--font-weight-semibold);
}
.teacher-dashboard-card__actions{
  display:flex;
  gap:var(--space-3);
  flex-wrap:wrap;
  margin-top:auto;
}
.teacher-event-list{
  display:grid;
  margin-top:var(--space-2);
  border-top:1px solid var(--border-color);
}
.teacher-event-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) auto auto;
  gap:var(--space-3);
  align-items:center;
  padding:var(--space-3) 0;
  border-bottom:1px solid var(--border-color);
  color:inherit;
  text-decoration:none;
}
.teacher-event-row:hover strong{color:var(--color-primary-hover)}
.teacher-event-row__main{display:flex;min-width:0;flex-direction:column}
.teacher-event-row__main strong{color:var(--color-navy-900)}
.teacher-event-row__main small{margin-top:2px;color:var(--text-secondary)}
.teacher-event-row__arrow{color:var(--color-teal-700);font-size:1.6rem;line-height:1}
.teacher-dashboard-empty{margin:var(--space-2) 0 auto}
.teacher-dashboard-secondary{margin-top:var(--space-8)}
.teacher-dashboard-section__heading{
  align-items:center;
  margin-bottom:var(--space-4);
}
.teacher-dashboard-section__art{
  width:86px;
  height:82px;
  object-fit:contain;
  flex:0 0 auto;
}
.teacher-appointment-grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:var(--space-4);
}
.teacher-appointment-card{
  display:flex;
  min-width:0;
  flex-direction:column;
  gap:var(--space-3);
}
.teacher-appointment-card__time{
  width:max-content;
  padding:.35rem .7rem;
  border-radius:var(--radius-pill);
  background:var(--color-teal-100);
  color:var(--color-navy-900);
  font-size:var(--font-size-md);
  font-weight:var(--font-weight-bold);
}
.teacher-appointment-card__content{flex:1}
.teacher-appointment-card__content h3{margin-bottom:var(--space-1)}
.teacher-appointment-card__content p{margin:0;color:var(--text-secondary);font-size:var(--font-size-sm)}
.teacher-calendar-card{overflow:hidden}
.teacher-calendar-card__content{align-items:center}
.teacher-calendar-card__art{
  width:120px;
  height:105px;
  object-fit:contain;
  flex:0 0 auto;
  margin:-.8rem 0 -.4rem;
}
@media(max-width:900px){
  .teacher-dashboard-primary,
  .teacher-appointment-grid{grid-template-columns:1fr}
  .teacher-dashboard-card__heading{min-height:auto}
}
@media(max-width:600px){
  .teacher-dashboard-card__art{width:82px;height:82px}
  .teacher-profile-summary>div{grid-template-columns:1fr;gap:2px}
  .teacher-event-row{grid-template-columns:minmax(0,1fr) auto}
  .teacher-event-row .badge{grid-column:1/2;width:max-content}
  .teacher-event-row__arrow{grid-column:2;grid-row:1/3}
  .teacher-dashboard-card__actions{flex-direction:column}
  .teacher-dashboard-card__actions .button{width:100%}
  .teacher-dashboard-section__art{width:68px;height:68px}
  .teacher-calendar-card__art{width:88px;height:82px}
}

/* Juridische pagina's */
.legal-document{max-width:900px;margin:0 auto;padding:clamp(1.5rem,4vw,3.5rem) 0 4rem}
.legal-document__header{padding-bottom:clamp(2rem,4vw,3rem);border-bottom:1px solid var(--color-border,#dce5e8)}
.legal-document__eyebrow{margin:0 0 .6rem;color:var(--color-teal-700,#176f70);font-size:.82rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}
.legal-document__header h1{margin:0;color:var(--color-navy-900,#12385f);font-size:clamp(2rem,5vw,3.3rem);line-height:1.08}
.legal-document__intro{max-width:760px;margin:1.25rem 0 0;font-size:clamp(1.05rem,2vw,1.2rem);line-height:1.75;color:var(--color-text,#334b57)}
.legal-document__meta{margin:1rem 0 0;color:var(--color-muted,#687d86);font-size:.92rem}
.legal-document__body{padding-top:1.25rem}.legal-document__body>p,.legal-document__body section{max-width:780px}
.legal-document__body section{padding:1.35rem 0;border-bottom:1px solid var(--color-border,#e3eaed)}.legal-document__body section:last-child{border-bottom:0}
.legal-document__body h2{margin:0 0 .8rem;color:var(--color-navy-900,#12385f);font-size:clamp(1.2rem,2vw,1.45rem);line-height:1.3}
.legal-document__body p,.legal-document__body li,.legal-document__body address{line-height:1.75}.legal-document__body p{margin:.65rem 0}.legal-document__body ul{margin:.75rem 0 1rem;padding-left:1.3rem}.legal-document__body li+li{margin-top:.25rem}.legal-document__body a{color:var(--color-teal-700,#176f70);text-underline-offset:3px}.legal-document__body address{margin:1rem 0;font-style:normal}

/* Groepsactiviteiten en professionele beheer-dashboardtegels */
.module-card--art{position:relative;overflow:hidden;min-height:210px;padding-right:42%;display:flex;flex-direction:column;justify-content:flex-end}
.module-card--art>img{position:absolute;right:-10px;top:10px;width:44%;height:135px;object-fit:contain;object-position:center;pointer-events:none}
.module-card--art .card__title,.module-card--art .card__description{position:relative;z-index:1}
.list-stack{display:grid;gap:var(--space-4)}
.activity-list-card{display:flex;justify-content:space-between;gap:1.5rem;align-items:center;text-decoration:none}
.activity-list-card__stats{text-align:right;white-space:nowrap;color:var(--color-gray-600)}
.slot-admin-grid,.student-slot-grid,.public-activity-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-4);margin:var(--space-4) 0}
.slot-admin-card__head,.teacher-activity-slot .section-heading-row{display:flex;justify-content:space-between;gap:1rem}
.slot-create-card{margin-top:var(--space-5)}
.teacher-check-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem 1rem;margin:.5rem 0 1rem}
.teacher-check-grid label{font-weight:400}
.compact-form{display:grid;gap:.75rem;margin:1rem 0}.compact-form>label{display:grid;gap:.25rem}
.student-slot-card{display:flex;justify-content:space-between;gap:1rem;align-items:center}.student-slot-card--selected{outline:2px solid #2f7f75}
.teacher-activity-slot{margin-bottom:var(--space-4)}
.activity-actions{display:flex;justify-content:flex-end;margin-bottom:var(--space-4)}
.danger-zone{margin-top:var(--space-6);padding-top:var(--space-4);border-top:1px solid var(--color-gray-200)}
.teacher-group-link{max-width:720px}
@media(max-width:768px){.module-card--art{min-height:190px;padding-right:38%}.module-card--art>img{width:40%;height:120px}.slot-admin-grid,.student-slot-grid,.public-activity-grid{grid-template-columns:1fr}.teacher-check-grid{grid-template-columns:1fr}.activity-list-card,.student-slot-card{align-items:flex-start;flex-direction:column}.activity-list-card__stats{text-align:left}}

.participant-list{display:grid;gap:.35rem;margin:.75rem 0}.participant-list>div{padding:.45rem .6rem;background:#f6f9fa;border-radius:8px}


/* Persoonlijke gegevens / privacy-inzage */
.personal-data-section{margin-bottom:var(--space-5)}
.personal-data-section>h2{margin-top:0;color:var(--color-navy-900)}
.personal-data-section h3{margin-top:var(--space-5);color:var(--color-navy-900)}
.personal-data-block+.personal-data-block{border-top:1px solid var(--border-color);margin-top:var(--space-5);padding-top:var(--space-5)}
.data-list{display:grid;gap:0;margin:0}
.data-list>div{display:grid;grid-template-columns:minmax(150px,220px) minmax(0,1fr);gap:var(--space-4);padding:.7rem 0;border-bottom:1px solid var(--border-color)}
.data-list>div:last-child{border-bottom:0}.data-list dt{font-weight:700;color:var(--color-navy-900)}.data-list dd{margin:0;overflow-wrap:anywhere}.personal-data-note{border-left:4px solid var(--color-teal-500)}
@media(max-width:680px){.data-list>div{grid-template-columns:1fr;gap:.2rem}}

/* Leerlingdashboard */
.student-dashboard-header{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-5)}
.student-dashboard-kicker{display:block;margin-bottom:var(--space-1);font-size:.82rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--color-primary)}
.student-dashboard-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-5);align-items:stretch;margin:var(--space-5) 0 var(--space-8)}
.student-dashboard-tile{display:flex;min-width:0;min-height:330px;flex-direction:column;padding:var(--space-5);text-decoration:none}
.student-dashboard-tile__art{display:flex;align-items:center;justify-content:center;height:185px;margin:-.25rem -.25rem var(--space-3);overflow:hidden}
.student-dashboard-tile__art img{display:block;width:100%;height:100%;object-fit:contain;object-position:center}
.student-dashboard-tile__body{display:flex;flex:1;flex-direction:column}
.student-dashboard-tile__body h2{margin:0 0 var(--space-2);font-size:1.18rem}
.student-dashboard-tile__body p{margin:0;color:var(--text-muted);line-height:1.55}
#account-email{scroll-margin-top:1.5rem}
@media(max-width:980px){.student-dashboard-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:640px){.student-dashboard-header{flex-direction:column}.student-dashboard-grid{grid-template-columns:1fr;gap:var(--space-4)}.student-dashboard-tile{min-height:0}.student-dashboard-tile__art{height:165px}}

/* Schoolbeheer: veilige voorbeeldomgeving van de leerlingview. */
.student-preview-kicker{display:block;margin-bottom:var(--space-1);font-size:.82rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--color-primary)}
.student-preview-notice{margin-bottom:var(--space-5)}
.student-preview-frame{overflow:hidden;border:1px solid var(--border-color);border-radius:var(--radius-lg);background:var(--background-surface);box-shadow:var(--shadow-sm)}
.student-preview-frame__bar{display:flex;align-items:center;justify-content:space-between;gap:var(--space-4);padding:var(--space-4) var(--space-5);border-bottom:1px solid var(--border-color);background:var(--background-subtle)}
.student-preview-frame__bar>div{display:flex;align-items:center;gap:var(--space-2);min-width:0}
.student-preview-frame__label{font-size:.8rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--text-muted)}
.student-preview-nav{display:flex;gap:.35rem;padding:.75rem var(--space-5);overflow-x:auto;border-bottom:1px solid var(--border-color);background:var(--background-surface)}
.student-preview-nav__link{flex:0 0 auto;padding:.58rem .78rem;border-radius:999px;color:var(--text-muted);font-weight:650;text-decoration:none;white-space:nowrap}
.student-preview-nav__link:hover,.student-preview-nav__link.is-active{background:var(--background-subtle);color:var(--color-primary)}
.student-preview-frame__body{padding:var(--space-6)}
.student-preview-screen-header{display:flex;align-items:flex-start;justify-content:space-between;gap:var(--space-4);margin-bottom:var(--space-5)}
.student-preview-screen-header h2{margin:.15rem 0 .4rem;font-size:1.7rem}
.student-preview-screen-header p{margin:0;color:var(--text-muted)}
.student-preview-list{display:grid;gap:var(--space-3)}
.student-preview-list__item,.student-preview-sample-registration{display:flex;align-items:center;justify-content:space-between;gap:var(--space-5)}
.student-preview-list__item h3,.student-preview-sample-registration h3{margin:.45rem 0 .25rem}
.student-preview-list__item p,.student-preview-sample-registration p{margin:0;color:var(--text-muted)}
.student-preview-list__item small,.student-preview-sample-registration small{display:block;margin-top:.4rem;color:var(--text-muted)}
@media(max-width:760px){.student-preview-frame__bar,.student-preview-list__item,.student-preview-sample-registration{align-items:flex-start;flex-direction:column}.student-preview-frame__body{padding:var(--space-4)}.student-preview-nav{padding-left:var(--space-4);padding-right:var(--space-4)}}
.student-preview-frame .personal-data-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-4)}
.student-preview-frame .muted{color:var(--text-muted)}
@media(max-width:760px){.student-preview-frame .personal-data-grid{grid-template-columns:1fr}}

/* =========================================================
   Security & gegevensbescherming
   ========================================================= */
.security-overview{overflow:hidden}.security-biv-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-4);margin-top:var(--space-4)}.security-biv{display:flex;gap:var(--space-3);align-items:flex-start;padding:var(--space-4);border:1px solid var(--border-color);border-radius:var(--radius-md);background:var(--background-subtle)}.security-biv__letter{display:grid;place-items:center;min-width:42px;height:42px;border-radius:50%;background:var(--color-navy-900);color:#fff;font-weight:800}.security-biv p,.security-check p,.security-action p,.security-framework p{margin:.35rem 0 0;color:var(--text-secondary)}.security-check-list,.security-action-list{display:grid;gap:var(--space-3);margin-top:var(--space-4)}.security-check,.security-action{display:grid;grid-template-columns:110px minmax(0,1fr);gap:var(--space-3);align-items:start;padding:var(--space-3) 0;border-bottom:1px solid var(--border-color)}.security-check:last-child,.security-action:last-child{border-bottom:0}.security-status{display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;border-radius:999px;padding:.25rem .6rem;font-size:.78rem;font-weight:800}.security-status--ok{background:var(--color-success-bg);color:var(--color-success)}.security-status--attention{background:#fff4d8;color:#7a5610}.security-status--manual{background:var(--color-gray-100);color:var(--text-secondary)}.security-table-wrap{overflow-x:auto;margin-top:var(--space-4)}.security-table{width:100%;border-collapse:collapse;min-width:850px}.security-table th,.security-table td{padding:.8rem .7rem;border-bottom:1px solid var(--border-color);text-align:left;vertical-align:top}.security-table th{font-size:.8rem;text-transform:uppercase;letter-spacing:.03em;color:var(--text-muted)}.security-framework{padding:var(--space-3) 0;border-bottom:1px solid var(--border-color)}.security-framework:last-child{border-bottom:0}@media(max-width:900px){.security-biv-grid{grid-template-columns:1fr}.security-check,.security-action{grid-template-columns:1fr}.security-check .security-status,.security-action .badge{justify-self:start}}

/* Inklapbare voorwaarden en jaarverlengingsdocumenten */
.document-disclosure > summary {
  cursor: pointer;
  font-weight: 700;
  list-style-position: outside;
  padding: .35rem 0;
}
.document-disclosure > summary:hover { text-decoration: underline; }
.document-disclosure[open] > summary { margin-bottom: var(--space-3); }
.document-disclosure .legal-preview { margin-top: var(--space-3); }

/* Passkeys technisch beheer */
.recovery-codes{margin-top:var(--space-4);padding:var(--space-4);border:1px solid var(--border-color,#dbe4ec);border-radius:12px;background:#fff}.recovery-codes pre{white-space:pre-wrap;overflow-wrap:anywhere;font-size:1rem;line-height:1.7}.card>summary{cursor:pointer}.card>summary+*{margin-top:var(--space-4)}

/* Groepsactiviteiten: compacte docentselectie + live zoeken */
.teacher-picker{min-width:0}
.teacher-search-label{display:block;max-width:420px;margin:.35rem 0 .75rem;font-weight:600}
.teacher-search-label .teacher-search{margin-top:.35rem}
.teacher-check-grid{align-items:start}
.teacher-check-option{display:flex!important;align-items:center;gap:.6rem;min-height:36px;margin:0!important;padding:.35rem .45rem;border-radius:var(--radius-sm);font-weight:400!important;cursor:pointer}
.teacher-check-option:hover{background:var(--color-teal-50)}
.teacher-check-option input[type="checkbox"]{display:inline-block;width:18px!important;height:18px!important;min-width:18px!important;min-height:18px!important;padding:0!important;margin:0!important;flex:0 0 18px;accent-color:var(--color-teal-700);border-radius:4px}
.teacher-check-option span{min-width:0;line-height:1.35}
.teacher-search-empty{margin:.4rem 0 0;color:var(--text-muted);font-size:var(--font-size-sm)}
.slot-material-panel{margin-top:1.25rem;padding-top:1.15rem;border-top:1px solid var(--border-color)}
.slot-material-panel h3{margin-bottom:.4rem;font-size:1.05rem}
.material-upload-form{display:flex;align-items:flex-end;gap:.75rem;flex-wrap:wrap;margin:.75rem 0}
.material-upload-form label{min-width:min(100%,420px);margin:0;flex:1}
.material-upload-form input[type="file"]{margin-top:.35rem}
@media(max-width:640px){.material-upload-form{align-items:stretch;flex-direction:column}.material-upload-form .button{width:100%}}
.teacher-check-option[hidden]{display:none!important}
.student-slot-register-form{width:min(100%,360px);display:flex;flex-direction:column;gap:.45rem}.student-slot-register-form label{margin:0}.student-slot-register-form .button{margin-top:.35rem}
.school-choice-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:14px;margin:18px 0}.school-choice input{position:absolute;opacity:0}.school-choice span{display:flex;min-height:150px;align-items:center;justify-content:center;flex-direction:column;gap:8px;padding:18px;border:2px solid #dce5ea;border-radius:14px;cursor:pointer;text-align:center}.school-choice input:checked+span{border-color:#12385f;box-shadow:0 0 0 2px rgba(18,56,95,.12)}.school-choice img{width:72px;height:72px;object-fit:contain}.school-choice small{opacity:.7}

/* =========================================================
   Responsive shell & navigatie — 2026-09-24
   Voorkomt viewport-overflow en laat de hoofdheader netjes
   omslaan op tablets en telefoons zonder JavaScript-menu.
   ========================================================= */
html,body{max-width:100%;overflow-x:clip}
img,svg,video,canvas{max-width:100%}
.app-container,.page-shell,.navbar__inner,.service-bar__inner{min-width:0}
.page-shell>*{min-width:0}
.card,.page-header,.admin-page-header,.section-heading-row,.button-row,.inline-actions{min-width:0;max-width:100%}
pre{max-width:100%;overflow-x:auto}
.navbar__inner{gap:var(--space-2);flex-wrap:wrap}
.brand{display:flex;align-items:center;min-width:0;flex:0 1 auto}
.brand__logo,.brand__tenant-logo{width:auto;height:auto;object-fit:contain}
.nav-link{min-width:0;white-space:normal;text-align:center}

@media(max-width:768px){
  .navbar__inner{padding-block:var(--space-2);min-height:0}
  .brandbar{column-gap:var(--space-3);row-gap:var(--space-2)}
  .brand{max-width:min(46vw,180px)}
  .brand__logo{max-width:100%;max-height:38px}
  .brand__tenant-logo{max-width:min(38vw,120px);max-height:38px}
  .brand-separator{height:32px;flex:0 0 1px}
  .nav-spacer{display:block;flex:0 0 100%;height:0}
  .nav-link{flex:1 1 140px;justify-content:center;padding:.65rem .55rem;background:var(--color-gray-50)}
  .page-shell{padding-block:var(--space-6)}
  .page-header{margin-bottom:var(--space-6)}
  .admin-page-header,.student-dashboard-header,.section-heading-row{align-items:stretch;flex-direction:column}
  .admin-page-header .button-row,.page-header .button-row{width:100%;display:flex;flex-wrap:wrap}
  .admin-page-header .button-row .button,.page-header .button-row .button{flex:1 1 180px}
  .service-bar__inner .button{max-width:100%;white-space:normal}
}

@media(max-width:420px){
  .app-container{width:min(100% - 20px,1200px)}
  .card{padding:var(--space-4)}
  .brand{max-width:45vw}
  .brand__tenant-logo{max-width:36vw}
  .nav-link{flex-basis:calc(50% - var(--space-2));font-size:var(--font-size-sm)}
  .button{max-width:100%;white-space:normal;text-align:center}
}

/* Booking and availability: occupied slots must never look selectable. */
.booking-slot--occupied span {background:var(--color-gray-100);color:var(--text-secondary);border-color:var(--border-color-strong);font-weight:normal;cursor:not-allowed;}
.availability-slot.is-booked,.availability-slot.is-booked:disabled {background:#fce9e5;border-color:#d18a7b;color:#743a31;opacity:1;cursor:not-allowed;}
.legend-dot--booked {background:#d18a7b;}

/* Teacher appointment details, scoped to roster. */
.availability-slot-details{min-width:0}.availability-slot-details>summary{list-style:none;cursor:pointer;width:100%}.availability-slot-details>summary::-webkit-details-marker{display:none}.availability-appointment-detail{padding:12px;border:1px solid var(--border-color,#d5dbe2);border-radius:8px;margin-top:6px;overflow-wrap:anywhere}.availability-appointment-detail form{margin-top:10px}

.availability-meter__booked{background:#376fbd;display:block;height:100%}.availability-legend--booked{color:#376fbd}

/* Testleerling en docentpicker — 2026-09-30 */
.student-test-actions{display:flex;flex-wrap:wrap;gap:var(--space-3);align-items:center;margin-top:var(--space-4)}
.student-test-actions form{margin:0}
.teacher-picker-option[hidden],.booking-teacher[hidden]{display:none!important}
@media(max-width:520px){.student-test-actions{align-items:stretch;flex-direction:column}.student-test-actions form,.student-test-actions .button{width:100%}}

/* Teacher upcoming appointments grouped by date. */
.teacher-appointment-groups{display:grid;gap:20px}.teacher-appointment-group{display:grid;gap:10px}.teacher-appointment-group__date{margin:0;font-size:1rem;color:var(--muted,#586774);font-weight:800}.appointment-detail-card{display:grid;gap:20px}

.scheduler-service__search{max-width:560px;margin:1rem 0}.scheduler-service__search input{width:100%}.scheduler-service tr[hidden]{display:none}
/* Collectieve pauzes blijven zichtbaar in het docentrooster. */
.availability-slot.is-school-break{background:#f3f4f6;border-color:#c9d0d5;color:#4b5962;cursor:not-allowed;opacity:1}
.legend-dot--break{background:#c9d0d5}

/* Rolafhankelijke sticky hoofdnavigatie — 2026-10-05 */
.navbar--sticky{position:sticky;top:0;z-index:1000;box-shadow:0 1px 8px rgba(18,56,95,.06)}
.role-nav{display:flex;align-items:center;justify-content:flex-end;gap:var(--space-1);min-width:0}
.nav-menu{position:relative;min-width:0}
.nav-menu__trigger{display:inline-flex;align-items:center;gap:.4rem;min-height:44px;padding:.55rem .75rem;border:0;border-radius:var(--radius-sm);background:transparent;color:var(--color-gray-700);font:inherit;font-weight:var(--font-weight-medium);cursor:pointer;white-space:nowrap}
.nav-menu__trigger:hover,.nav-menu.is-open>.nav-menu__trigger{background:var(--color-teal-50);color:var(--color-teal-700)}
.nav-menu__panel{display:none;position:absolute;right:0;top:100%;width:max-content;min-width:240px;max-width:min(420px,calc(100vw - 24px));padding:8px;background:var(--color-white);border:1px solid var(--border-color);border-radius:var(--radius-md);box-shadow:var(--shadow-lg)}
.nav-menu.is-open>.nav-menu__panel{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:4px}
.nav-menu__item{display:flex;flex-direction:column;gap:2px;min-width:0;padding:.7rem .8rem;border-radius:var(--radius-sm);color:var(--color-gray-800);text-decoration:none;overflow-wrap:anywhere}
.nav-menu__item:hover,.nav-menu__item:focus-visible{background:var(--color-teal-50);color:var(--color-navy-900)}
.nav-menu__item strong{font-size:var(--font-size-sm)}.nav-menu__item span{color:var(--text-muted);font-size:var(--font-size-xs);font-weight:400}

@media(max-width:900px){.navbar__inner{flex-wrap:wrap}.role-nav{order:3;flex:1 0 100%;justify-content:stretch;gap:6px}.role-nav .nav-menu{flex:1 1 0}.nav-menu__trigger{width:100%;justify-content:center;background:var(--color-gray-50)}.nav-menu__panel{position:fixed;left:12px;right:12px;top:auto;width:auto;max-width:none}.nav-menu.is-open>.nav-menu__panel{grid-template-columns:repeat(auto-fit,minmax(190px,1fr))}}
@media(max-width:520px){.role-nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.role-nav .nav-menu{min-width:0}.nav-menu__trigger{white-space:normal;text-align:center}.nav-menu.is-open>.nav-menu__panel{grid-template-columns:1fr}}

/* Dropdowns: geen hover-gap; open-status wordt uitsluitend door JS geregeld. */
.nav-menu__panel{top:100%;margin-top:0}
.nav-menu__trigger:focus-visible{outline:2px solid var(--color-teal-700);outline-offset:2px}
/* Rustiger dashboard, met de primaire acties direct bovenaan. */
.dashboard-priority-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--space-3);margin:var(--space-3) 0 var(--space-4)}
.dashboard-priority-grid .module-card{min-height:0}
.dashboard-secondary-title{margin:var(--space-4) 0 var(--space-2)}
@media(max-width:650px){.dashboard-priority-grid{grid-template-columns:1fr}}

/* Directe, altijd klikbare hoofdnavigatie: geen hover-dropdowns */
.role-nav--links{display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:8px}
.role-nav--links .nav-direct{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:44px;padding:7px 12px;border-radius:10px;text-decoration:none;font-weight:600;color:var(--color-navy-900,#12385f);white-space:nowrap}
.role-nav--links .nav-direct:hover,.role-nav--links .nav-direct:focus-visible{background:var(--color-teal-50,#e8f6f5);outline-offset:2px}
.role-nav--links .nav-direct--icon img{width:31px;height:31px;object-fit:contain}
.admin-module-grid{grid-template-columns:repeat(auto-fit,minmax(215px,1fr));gap:12px}
.admin-module-grid .module-card--art{min-height:145px;padding:18px 34% 16px 16px}
.admin-module-grid .module-card--art>img{width:35%;height:95px;right:0;top:12px}
.admin-module-grid .module-card .card__title{font-size:1.05rem}
.admin-module-grid .module-card .card__description{font-size:.88rem}
@media(max-width:900px){.role-nav--links{order:3;flex:1 0 100%;justify-content:center}.role-nav--links .nav-direct{flex:1 1 auto}}
@media(max-width:520px){.role-nav--links{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:100%}.role-nav--links .nav-direct{white-space:normal;text-align:center;padding:7px}.role-nav--links .nav-direct--icon img{width:26px;height:26px}}

/* Dashboard: uniforme bovenuitlijning en gescheiden tekst- en beeldruimte. */
.admin-module-grid .module-card--art,
.dashboard-priority-grid .module-card--art{
 display:flex;flex-direction:column;justify-content:flex-start;align-items:flex-start;
 min-width:0;min-height:168px;padding:18px 36% 18px 18px;text-align:left;
}
.admin-module-grid .module-card--art>img,
.dashboard-priority-grid .module-card--art>img{
 position:absolute;top:16px;right:12px;width:calc(36% - 20px);height:96px;
 max-width:110px;object-fit:contain;object-position:top right;
}
.admin-module-grid .module-card--art .card__title,
.dashboard-priority-grid .module-card--art .card__title{
 margin:0 0 8px;max-width:100%;font-size:1.05rem;line-height:1.3;overflow-wrap:break-word;
}
.admin-module-grid .module-card--art .card__description,
.dashboard-priority-grid .module-card--art .card__description{
 margin:0;max-width:100%;font-size:.88rem;line-height:1.45;overflow-wrap:break-word;
}
.account-subjects{margin:1rem 0}
.account-subjects h3{font-size:1rem;margin-bottom:.5rem}
.account-subjects__list{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.account-subjects__list li{padding:5px 10px;border-radius:8px;background:var(--color-teal-50);color:var(--color-navy-900)}
@media(max-width:520px){
 .admin-module-grid .module-card--art,.dashboard-priority-grid .module-card--art{min-height:145px;padding-right:35%}
 .admin-module-grid .module-card--art>img,.dashboard-priority-grid .module-card--art>img{height:76px}
}

/* Leerling: groepsactiviteiten als compacte chronologische tijdlijn */
.activity-public-card{display:flex;flex-direction:column;align-items:flex-start;gap:.55rem;text-decoration:none!important;color:inherit;min-height:0}
.activity-public-card :is(h2,p,span){text-decoration:none!important}
.activity-public-card .card__title{margin:0;color:var(--color-navy-900)}
.activity-public-card .card__description{margin:0;color:var(--text-muted)}
.activity-public-card__count{color:var(--color-teal-700);font-weight:700;font-size:.9rem}
.activity-public-card__description{font-style:italic;font-weight:400;color:var(--text-muted);line-height:1.5;margin:.25rem 0 0}
.activity-public-card:hover,.activity-public-card:focus-visible{border-color:var(--color-teal-500);box-shadow:var(--shadow-md)}
.group-activity-intro{margin-bottom:1.5rem}
.student-activity-timeline{display:flex;flex-direction:column;gap:1.75rem;margin:1.5rem 0}
.student-activity-day__heading{font-size:1.2rem;margin:0 0 1rem;color:var(--color-navy-900)}
.student-activity-timeblock{display:grid;grid-template-columns:minmax(120px,170px) minmax(0,1fr);gap:1rem;position:relative;margin-bottom:1.25rem}
.student-activity-timeblock__time{border-left:3px solid var(--color-teal-500);padding:.25rem 0 .25rem 1rem;color:var(--color-navy-900);font-weight:700;align-self:stretch}
.student-activity-timeblock__time span,.student-activity-timeblock__time small{display:block}
.student-activity-timeblock__time small{font-weight:400;color:var(--text-muted);margin-top:.25rem}
.student-activity-timeblock__items{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr));gap:1rem;min-width:0}
.student-activity-card{display:flex;flex-direction:column;align-items:stretch;justify-content:space-between;gap:1.1rem;min-width:0;padding:1.25rem}
.student-activity-card__details{min-width:0}
.student-activity-card .card__title{margin:.6rem 0;font-size:1.25rem}
.student-activity-card .card__description{margin:.4rem 0}
.student-activity-card__teachers{margin:.65rem 0 0}
.student-activity-card__action{width:100%}
.student-activity-card__action form{width:100%}
.student-activity-card__action .button{width:100%}
.student-activity-card__notice{color:var(--text-muted);margin:0;font-weight:600}
.student-activity-card .student-slot-register-form{width:100%;max-width:none}
.student-activity-card .student-slot-register-form input{width:100%;box-sizing:border-box}
@media(max-width:650px){.student-activity-timeblock{grid-template-columns:1fr;gap:.65rem}.student-activity-timeblock__time{padding:.3rem 0 .3rem .8rem}.student-activity-timeblock__items{grid-template-columns:1fr}}