:root {
  --sidebar-width: 292px;
  --app-bg: #f4f7fb;
  --panel: rgba(255,255,255,.88);
  --panel-solid: #ffffff;
  --border: rgba(15, 23, 42, .09);
  --text: #0f172a;
  --muted: #64748b;
  --primary: #2563eb;
  --primary-dark: #1d4ed8;
  --primary-soft: rgba(37, 99, 235, .11);
  --success-soft: rgba(22, 163, 74, .12);
  --warning-soft: rgba(245, 158, 11, .16);
  --danger-soft: rgba(220, 38, 38, .12);
  --shadow: 0 18px 50px rgba(15, 23, 42, .08);
  --radius: 18px;
}

* { text-rendering: optimizeLegibility; }
html { min-height: 100%; }
body {
  min-height: 100vh;
  margin: 0;
  color: var(--text);
  background:
    radial-gradient(circle at top left, rgba(37,99,235,.15), transparent 32rem),
    radial-gradient(circle at 85% 15%, rgba(14,165,233,.13), transparent 28rem),
    linear-gradient(180deg, #f8fbff 0%, var(--app-bg) 42%, #eef3f8 100%);
  font-size: .95rem;
}

a { color: var(--primary-dark); }
a:hover { color: #1e40af; }

.app-shell { min-height: 100vh; display: flex; }
.app-sidebar {
  position: sticky;
  top: 0;
  z-index: 1040;
  width: var(--sidebar-width);
  height: 100vh;
  overflow-y: auto;
  background: rgba(255,255,255,.78);
  border-right: 1px solid var(--border);
  backdrop-filter: blur(18px);
  box-shadow: 10px 0 40px rgba(15,23,42,.04);
}
.sidebar-inner { min-height: 100%; display: flex; flex-direction: column; }
.sidebar-scroll { flex: 1; }
.brand { font-weight: 800; letter-spacing: -.02em; }
.brand-mark {
  width: 44px;
  height: 44px;
  border-radius: 14px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-weight: 800;
  background: linear-gradient(135deg, #1d4ed8 0%, #06b6d4 100%);
  box-shadow: 0 12px 28px rgba(37,99,235,.25);
}
.nav-section {
  color: var(--muted);
  font-size: .70rem;
  text-transform: uppercase;
  letter-spacing: .10em;
  margin: .9rem .55rem .3rem;
  font-weight: 800;
}
.sidebar-link {
  position: relative;
  display: flex;
  align-items: center;
  gap: .65rem;
  padding: .66rem .82rem;
  border-radius: 14px;
  color: #182235;
  text-decoration: none;
  transition: background .16s ease, color .16s ease, transform .16s ease;
}
.sidebar-link::before {
  content: attr(data-icon);
  width: 1.35rem;
  text-align: center;
  opacity: .86;
}
.sidebar-link:hover { background: rgba(15,23,42,.055); color: #0f172a; transform: translateX(2px); }
.sidebar-link.active { background: var(--primary-soft); color: var(--primary-dark); font-weight: 700; }
.sidebar-link.active::after {
  content: '';
  position: absolute;
  right: .55rem;
  width: .42rem;
  height: .42rem;
  border-radius: 999px;
  background: var(--primary);
}

.sidebar-link-terminal {
  margin: .1rem 0 .45rem;
  color: #fff;
  font-weight: 800;
  background: linear-gradient(135deg, #1d4ed8 0%, #2563eb 55%, #0891b2 100%);
  box-shadow: 0 10px 22px rgba(37,99,235,.22);
}
.sidebar-link-terminal::before { opacity: 1; }
.sidebar-link-terminal:hover {
  color: #fff;
  background: linear-gradient(135deg, #1e40af 0%, #1d4ed8 55%, #0e7490 100%);
  transform: translateX(2px);
}
.sidebar-link-terminal .sidebar-link-external {
  margin-left: auto;
  font-size: .82rem;
  opacity: .82;
}

.app-content { flex: 1; min-width: 0; }
.topbar {
  position: sticky;
  top: 0;
  z-index: 1030;
  background: rgba(255,255,255,.74);
  border-bottom: 1px solid var(--border);
  backdrop-filter: blur(16px);
}
.page-title { font-size: 1.08rem; font-weight: 800; letter-spacing: -.015em; }
.content-wrap { max-width: 1540px; }

.card {
  border: 1px solid rgba(255,255,255,.65);
  box-shadow: var(--shadow);
  border-radius: var(--radius);
  background: var(--panel);
  backdrop-filter: blur(10px);
}
.card.p-3 { padding: 1.15rem !important; }
.card.p-4 { padding: 1.35rem !important; }
.kpi { font-size: clamp(1.7rem, 3vw, 2.45rem); font-weight: 850; letter-spacing: -.045em; }
.text-secondary { color: var(--muted) !important; }
.badge-soft { background: var(--primary-soft); color: var(--primary-dark); }

.btn { border-radius: 12px; font-weight: 700; }
.btn-sm { border-radius: 10px; }
.btn-primary {
  background: linear-gradient(135deg, var(--primary) 0%, #0891b2 100%);
  border: 0;
  box-shadow: 0 12px 24px rgba(37,99,235,.18);
}
.btn-primary:hover { filter: brightness(.97); }
.btn-outline-primary, .btn-outline-secondary, .btn-outline-dark { background: rgba(255,255,255,.58); }
.form-control, .form-select {
  border-radius: 12px;
  border-color: rgba(15,23,42,.13);
  min-height: 42px;
}
.form-control:focus, .form-select:focus {
  border-color: rgba(37,99,235,.55);
  box-shadow: 0 0 0 .22rem rgba(37,99,235,.12);
}
.form-label { color: #334155; font-weight: 700; font-size: .86rem; }

.table { --bs-table-bg: transparent; }
.table thead th {
  color: var(--muted);
  font-weight: 800;
  text-transform: uppercase;
  font-size: .72rem;
  letter-spacing: .055em;
  border-bottom-color: rgba(15,23,42,.10);
  white-space: nowrap;
}
.table tbody td { border-color: rgba(15,23,42,.075); }
.table-hover tbody tr:hover > * { background: rgba(37,99,235,.045); }
.table-responsive { border-radius: 14px; }
.col-tight { width: 90px; min-width: 90px; }
.col-hours { width: 140px; min-width: 140px; }
.col-type { width: 120px; min-width: 120px; }

.alert { border: 0; border-radius: 16px; box-shadow: 0 10px 25px rgba(15,23,42,.06); }
.alert-warning { background: var(--warning-soft); color: #713f12; }
.alert-secondary { background: rgba(100,116,139,.12); color: #334155; }
.alert-danger { background: var(--danger-soft); color: #7f1d1d; }
.alert-success { background: var(--success-soft); color: #14532d; }

.mobile-menu-btn { display: none; }
.sidebar-backdrop { display: none; }

.login-page {
  min-height: 100vh;
  display: grid;
  place-items: center;
  padding: 2rem 1rem;
}
.login-panel { width: min(100%, 520px); }
.login-hero {
  text-align: center;
  margin-bottom: 1rem;
}
.login-hero .brand-mark { width: 58px; height: 58px; font-size: 1.25rem; }

@media (max-width: 991.98px) {
  .app-sidebar {
    position: fixed;
    left: 0;
    transform: translateX(-102%);
    transition: transform .22s ease;
  }
  body.sidebar-open .app-sidebar { transform: translateX(0); }
  .sidebar-backdrop {
    display: block;
    position: fixed;
    inset: 0;
    z-index: 1035;
    background: rgba(15,23,42,.35);
    opacity: 0;
    pointer-events: none;
    transition: opacity .2s ease;
  }
  body.sidebar-open .sidebar-backdrop { opacity: 1; pointer-events: auto; }
  .mobile-menu-btn { display: inline-flex; }
  .topbar { padding-left: 1rem !important; padding-right: 1rem !important; }
  .container-fluid { padding: 1rem !important; }
}

@media print {
  .app-sidebar, .topbar, .no-print, .sidebar-backdrop { display: none !important; }
  body { background: #fff; }
  .container-fluid { padding: 0 !important; }
  .card { box-shadow: none !important; border: 1px solid #ddd; background: #fff; }
}

/* Medewerkerkaart: overzichtelijke HR-indeling */
.employee-hero {
  border: 1px solid rgba(15, 23, 42, .08);
  box-shadow: 0 12px 30px rgba(15, 23, 42, .06);
}
.section-title {
  font-weight: 700;
  margin-bottom: .85rem;
  padding-bottom: .45rem;
  border-bottom: 1px solid rgba(15, 23, 42, .08);
  color: #1f2a44;
}
.employee-photo {
  width: 100%;
  max-width: 110px;
  border-radius: 10px;
  border: 1px solid #ddd;
  object-fit: cover;
  aspect-ratio: 4 / 5;
}
.sticky-save {
  position: sticky;
  bottom: 1rem;
  z-index: 5;
  box-shadow: 0 12px 30px rgba(15, 23, 42, .10);
}
.action-buttons .btn {
  font-weight: 600;
}

/* Bootstrap modal fix: when a <form> wraps header/body/footer, Bootstrap's
   .modal-dialog-scrollable cannot see .modal-body as a direct child. Make the
   form the scroll container layout so long employee forms keep the footer visible. */
.modal-dialog-scrollable .modal-content > form {
  display: flex;
  flex-direction: column;
  max-height: calc(100vh - var(--bs-modal-margin) * 2);
  min-height: 0;
}
.modal-dialog-scrollable .modal-content > form .modal-header,
.modal-dialog-scrollable .modal-content > form .modal-footer {
  flex-shrink: 0;
}
.modal-dialog-scrollable .modal-content > form .modal-body {
  overflow-y: auto;
  min-height: 0;
}
@media (max-width: 575.98px) {
  .modal-dialog-scrollable .modal-content > form {
    max-height: calc(100vh - 1rem);
  }
}

/* Release menu v3: compacte, zakelijke accordeon-navigatie */
.sidebar-scroll {
  gap: .04rem !important;
  padding-bottom: .75rem;
}
.sidebar-link-top {
  margin: 0 0 .16rem;
}
.nav-group {
  margin: 0;
}
.nav-group > summary {
  list-style: none;
  cursor: pointer;
  user-select: none;
}
.nav-group > summary::-webkit-details-marker {
  display: none;
}
.nav-group > .nav-section {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .5rem;
  min-height: 38px;
  padding: .42rem .66rem;
  margin: .04rem .08rem;
  border-radius: 11px;
  color: #475569;
  font-size: .72rem;
  letter-spacing: .055em;
  line-height: 1.1;
  transition: background .16s ease, color .16s ease, transform .16s ease;
}
.nav-group > .nav-section span {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
}
.nav-group > .nav-section span::before {
  content: attr(data-icon);
  width: 1.25rem;
  text-align: center;
  font-size: .95rem;
  letter-spacing: 0;
  opacity: .9;
}
.nav-group > .nav-section::after {
  content: '›';
  font-size: 1rem;
  line-height: 1;
  transform: rotate(0deg);
  transition: transform .16s ease;
  opacity: .65;
}
.nav-group > .nav-section:hover {
  background: rgba(15,23,42,.045);
  color: #0f172a;
}
.nav-group[open] {
  margin: .06rem 0 .16rem;
}
.nav-group[open] > .nav-section {
  background: rgba(15,23,42,.045);
  color: #334155;
  margin-bottom: .08rem;
}
.nav-group[open] > .nav-section::after {
  transform: rotate(90deg);
}
.nav-group .sidebar-link {
  margin: .02rem .08rem .02rem .56rem;
  padding: .52rem .66rem;
  border-radius: 11px;
}
.nav-group:not([open]) .sidebar-link {
  display: none;
}
.nav-group:has(.sidebar-link.active) > .nav-section {
  background: var(--primary-soft);
  color: var(--primary-dark);
}
.nav-group:has(.sidebar-link.active) > .nav-section::after {
  opacity: 1;
}
@media (max-width: 991.98px) {
  .nav-group > .nav-section { min-height: 42px; }
}

/* Coolflow Software rebranding / professional blue theme */
:root {
  --app-bg: #f5f7fa;
  --primary: #2f80ed;
  --primary-dark: #1e3a5f;
  --primary-soft: rgba(47, 128, 237, .12);
  --shadow: 0 18px 48px rgba(30, 58, 95, .10);
}
.brand-mark {
  background: linear-gradient(135deg, #1e3a5f 0%, #2f80ed 58%, #56ccf2 100%);
  box-shadow: 0 14px 30px rgba(30,58,95,.25);
}
.brand { color: #12233a; }
.topbar {
  background: rgba(255,255,255,.82);
}
.app-sidebar {
  background: linear-gradient(180deg, rgba(255,255,255,.92), rgba(248,251,255,.82));
}
.card {
  border-color: rgba(30,58,95,.08);
}
.login-page-pro {
  place-items: stretch;
  padding: clamp(1rem, 3vw, 2.5rem);
}
.login-shell {
  width: min(1180px, 100%);
  margin: auto;
  display: grid;
  grid-template-columns: minmax(0, 1.12fr) minmax(390px, .88fr);
  min-height: min(760px, calc(100vh - 5rem));
  border-radius: 30px;
  overflow: hidden;
  background: rgba(255,255,255,.88);
  box-shadow: 0 30px 90px rgba(30,58,95,.18);
  border: 1px solid rgba(255,255,255,.72);
}
.login-showcase {
  position: relative;
  isolation: isolate;
  display: flex;
  align-items: flex-end;
  padding: clamp(2rem, 5vw, 4.2rem);
  color: #fff;
  background:
    linear-gradient(135deg, rgba(18,35,58,.94), rgba(30,58,95,.78)),
    radial-gradient(circle at 24% 22%, rgba(86,204,242,.42), transparent 17rem),
    linear-gradient(140deg, #1e3a5f 0%, #2f80ed 100%);
}
.login-showcase::before,
.login-showcase::after {
  content: '';
  position: absolute;
  z-index: -1;
  border-radius: 999px;
  background: rgba(255,255,255,.11);
}
.login-showcase::before { width: 420px; height: 420px; right: -120px; top: -90px; }
.login-showcase::after { width: 260px; height: 260px; left: -80px; bottom: 70px; }
.login-showcase-content { max-width: 560px; }
.login-eyebrow {
  display: inline-flex;
  padding: .42rem .72rem;
  border-radius: 999px;
  background: rgba(255,255,255,.14);
  border: 1px solid rgba(255,255,255,.20);
  font-weight: 800;
  font-size: .76rem;
  text-transform: uppercase;
  letter-spacing: .10em;
  margin-bottom: 1rem;
}
.login-showcase h1 {
  font-size: clamp(2.6rem, 6vw, 5.1rem);
  line-height: .93;
  letter-spacing: -.075em;
  font-weight: 900;
  margin: 0 0 1rem;
}
.login-showcase p {
  font-size: clamp(1rem, 2vw, 1.25rem);
  color: rgba(255,255,255,.82);
  max-width: 480px;
  margin-bottom: 1.4rem;
}
.login-points {
  display: flex;
  flex-wrap: wrap;
  gap: .65rem;
}
.login-points span {
  padding: .55rem .72rem;
  border-radius: 999px;
  background: rgba(255,255,255,.13);
  border: 1px solid rgba(255,255,255,.18);
  font-weight: 700;
  font-size: .88rem;
}
.login-shell .login-panel {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: clamp(1.4rem, 4vw, 3.2rem);
  background:
    radial-gradient(circle at top right, rgba(47,128,237,.12), transparent 18rem),
    #fff;
}
.login-card {
  box-shadow: 0 18px 42px rgba(30,58,95,.10);
  background: rgba(255,255,255,.96);
}
.login-card .form-control {
  min-height: 48px;
  border-radius: 14px;
}
.login-card .btn-primary {
  min-height: 48px;
  background: linear-gradient(135deg, #1e3a5f 0%, #2f80ed 100%);
}
@media (max-width: 900px) {
  .login-shell { grid-template-columns: 1fr; min-height: auto; }
  .login-showcase { min-height: 300px; align-items: center; }
  .login-shell .login-panel { padding: 1.25rem; }
}

/* v2.10 - moderne navigatie en compacte klantcontext */
:root {
  --sidebar-width: 308px;
  --sidebar-surface: rgba(250, 252, 255, .96);
  --sidebar-line: rgba(30, 58, 95, .10);
  --nav-hover: rgba(30, 58, 95, .055);
  --nav-active: rgba(47, 128, 237, .12);
}

.app-sidebar {
  overflow: hidden;
  padding: 0 !important;
  background: var(--sidebar-surface);
  border-right: 1px solid var(--sidebar-line);
  box-shadow: 14px 0 38px rgba(30, 58, 95, .055);
}
.sidebar-inner {
  height: 100vh;
  min-height: 0;
  padding: 1rem .8rem .8rem;
}
.sidebar-brand-row {
  display: flex;
  align-items: center;
  gap: .72rem;
  min-height: 54px;
  padding: 0 .4rem .8rem;
}
.sidebar-brand-copy { min-width: 0; }
.sidebar-brand-copy .brand {
  font-size: 1rem;
  line-height: 1.15;
  white-space: nowrap;
}
.sidebar-version {
  margin-top: .22rem;
  color: #7b8a9e;
  font-size: .73rem;
  font-weight: 600;
  white-space: nowrap;
}
.sidebar-version span { margin: 0 .12rem; opacity: .65; }
.brand-mark {
  flex: 0 0 42px;
  width: 42px;
  height: 42px;
  border-radius: 13px;
  font-size: .92rem;
}

.tenant-context {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto;
  align-items: center;
  gap: .58rem;
  margin: 0 .12rem .76rem;
  padding: .66rem .68rem;
  border: 1px solid rgba(47, 128, 237, .17);
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(47, 128, 237, .10), rgba(86, 204, 242, .07));
  box-shadow: 0 8px 22px rgba(30, 58, 95, .055);
}
.tenant-context-support {
  border-color: rgba(245, 158, 11, .28);
  background: linear-gradient(135deg, rgba(245, 158, 11, .12), rgba(255, 255, 255, .72));
}
.tenant-context-icon {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  color: #fff;
  background: linear-gradient(135deg, #1e3a5f, #2f80ed);
  box-shadow: 0 7px 16px rgba(30, 58, 95, .16);
}
.tenant-context-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: .05rem;
}
.tenant-context-copy span {
  color: #748398;
  font-size: .64rem;
  font-weight: 800;
  line-height: 1.1;
  letter-spacing: .055em;
  text-transform: uppercase;
}
.tenant-context-copy strong {
  overflow: hidden;
  color: #18304d;
  font-size: .82rem;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.tenant-context-actions {
  display: flex;
  align-items: center;
  gap: .24rem;
}
.tenant-context-actions a,
.tenant-context-actions button {
  display: grid;
  place-items: center;
  width: 28px;
  height: 28px;
  padding: 0;
  border: 0;
  border-radius: 9px;
  color: #40536c;
  background: rgba(255, 255, 255, .76);
  text-decoration: none;
  transition: color .15s ease, background .15s ease, transform .15s ease;
}
.tenant-context-actions a:hover,
.tenant-context-actions button:hover {
  color: var(--primary-dark);
  background: #fff;
  transform: translateY(-1px);
}

.sidebar-scroll {
  flex: 1;
  min-height: 0;
  display: block !important;
  overflow-x: hidden;
  overflow-y: auto;
  padding: .08rem .15rem .75rem .02rem;
  scrollbar-width: thin;
  scrollbar-color: rgba(100, 116, 139, .24) transparent;
}
.sidebar-scroll::-webkit-scrollbar { width: 6px; }
.sidebar-scroll::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgba(100, 116, 139, .22);
}
.sidebar-scroll::-webkit-scrollbar-track { background: transparent; }

.sidebar-link::before { content: none !important; display: none !important; }
.sidebar-link {
  min-width: 0;
  min-height: 40px;
  gap: .7rem;
  margin: .08rem 0;
  padding: .56rem .68rem;
  border: 1px solid transparent;
  border-radius: 11px;
  color: #334155;
  font-size: .845rem;
  font-weight: 600;
  line-height: 1.2;
  transform: none;
}
.sidebar-link > i:first-child {
  flex: 0 0 19px;
  width: 19px;
  color: #718096;
  font-size: 1rem;
  text-align: center;
  transition: color .15s ease;
}
.sidebar-link > span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sidebar-link:hover {
  color: #17263b;
  background: var(--nav-hover);
  border-color: rgba(30, 58, 95, .055);
  transform: none;
}
.sidebar-link:hover > i:first-child { color: #2f80ed; }
.sidebar-link.active {
  color: #17436f;
  font-weight: 800;
  background: linear-gradient(90deg, rgba(47, 128, 237, .16), rgba(47, 128, 237, .075));
  border-color: rgba(47, 128, 237, .13);
  box-shadow: inset 3px 0 0 #2f80ed;
}
.sidebar-link.active > i:first-child { color: #1f6fd0; }
.sidebar-link.active::after { content: none; }
.sidebar-link-top {
  min-height: 43px;
  margin: 0 0 .42rem;
  padding: .64rem .72rem;
  font-weight: 750;
}
.sidebar-link-top > i:first-child { color: #2f80ed; }

.nav-group {
  margin: .16rem 0;
  border: 1px solid transparent;
  border-radius: 13px;
  transition: background .16s ease, border-color .16s ease, box-shadow .16s ease;
}
.nav-group > summary::-webkit-details-marker { display: none; }
.nav-group > .nav-section {
  min-height: 43px;
  margin: 0;
  padding: .49rem .6rem;
  border-radius: 12px;
  color: #4b5c72;
  font-size: .78rem;
  font-weight: 800;
  letter-spacing: .005em;
  text-transform: none;
}
.nav-group > .nav-section span::before,
.nav-group > .nav-section::after { content: none !important; }
.nav-section-main {
  min-width: 0;
  display: flex !important;
  align-items: center;
  gap: .66rem !important;
}
.nav-section-icon {
  flex: 0 0 29px;
  display: grid !important;
  place-items: center;
  width: 29px;
  height: 29px;
  border-radius: 9px;
  color: #52657c;
  background: rgba(100, 116, 139, .095);
}
.nav-section-icon i { font-size: .93rem; }
.nav-chevron {
  flex: 0 0 auto;
  color: #8a98aa;
  font-size: .72rem;
  transition: transform .18s ease, color .18s ease;
}
.nav-group > .nav-section:hover {
  color: #19304b;
  background: rgba(30, 58, 95, .045);
}
.nav-group[open] {
  margin: .18rem 0 .28rem;
  padding: .16rem;
  border-color: rgba(30, 58, 95, .075);
  background: rgba(255, 255, 255, .68);
  box-shadow: 0 7px 20px rgba(30, 58, 95, .035);
}
.nav-group[open] > .nav-section {
  margin: 0;
  color: #213a58;
  background: rgba(30, 58, 95, .04);
}
.nav-group[open] .nav-chevron { transform: rotate(90deg); }
.nav-group:has(.sidebar-link.active) {
  border-color: rgba(47, 128, 237, .13);
  background: rgba(47, 128, 237, .035);
}
.nav-group:has(.sidebar-link.active) > .nav-section {
  color: #17436f;
  background: rgba(47, 128, 237, .09);
}
.nav-group:has(.sidebar-link.active) .nav-section-icon {
  color: #fff;
  background: linear-gradient(135deg, #1e3a5f, #2f80ed);
  box-shadow: 0 6px 14px rgba(47, 128, 237, .17);
}
.nav-group-body {
  padding: .12rem .18rem .24rem;
}
.nav-group .sidebar-link {
  margin: .04rem 0;
  padding: .51rem .62rem;
  border-radius: 10px;
}
.nav-group:not([open]) .nav-group-body { display: none; }
.nav-group:not([open]) .sidebar-link { display: none; }
.nav-subheading {
  margin: .46rem .64rem .18rem;
  color: #8a98aa;
  font-size: .62rem;
  font-weight: 850;
  letter-spacing: .085em;
  text-transform: uppercase;
}
.nav-subheading:first-child { margin-top: .26rem; }
.nav-external {
  flex: 0 0 auto;
  margin-left: auto;
  color: #8ca0b7;
  font-size: .72rem;
}
.nav-count {
  flex: 0 0 auto;
  min-width: 20px !important;
  margin-left: auto;
  padding: .16rem .38rem;
  border-radius: 999px;
  color: #7c4a03;
  background: #fef3c7;
  font-size: .67rem;
  font-weight: 900;
  text-align: center;
}
.nav-group-terminals[open] {
  border-color: rgba(47, 128, 237, .15);
  background: linear-gradient(180deg, rgba(47, 128, 237, .055), rgba(255, 255, 255, .72));
}
.sidebar-link-launch {
  border-color: rgba(47, 128, 237, .08);
  background: rgba(255, 255, 255, .67);
}
.sidebar-link-launch:hover {
  border-color: rgba(47, 128, 237, .17);
  background: rgba(47, 128, 237, .08);
}

.sidebar-user-card {
  display: grid;
  grid-template-columns: 34px minmax(0, 1fr) 30px;
  align-items: center;
  gap: .58rem;
  margin-top: .55rem;
  padding: .62rem .56rem;
  border-top: 1px solid rgba(30, 58, 95, .09);
}
.sidebar-user-avatar {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  color: #37516e;
  background: rgba(30, 58, 95, .08);
}
.sidebar-user-copy {
  min-width: 0;
  display: flex;
  flex-direction: column;
}
.sidebar-user-copy strong {
  overflow: hidden;
  color: #20344f;
  font-size: .8rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.sidebar-user-copy span {
  color: #8390a1;
  font-size: .68rem;
  text-transform: capitalize;
}
.sidebar-logout {
  display: grid;
  place-items: center;
  width: 30px;
  height: 30px;
  border-radius: 9px;
  color: #7b8a9e;
  text-decoration: none;
}
.sidebar-logout:hover {
  color: #b42318;
  background: rgba(220, 38, 38, .08);
}

.topbar {
  min-height: 70px;
  padding-top: .78rem !important;
  padding-bottom: .78rem !important;
  background: rgba(255, 255, 255, .88);
  box-shadow: 0 1px 0 rgba(30, 58, 95, .035);
}
.page-title { font-size: 1.03rem; }
.content-wrap { padding-top: 1.25rem !important; }

@media (max-width: 991.98px) {
  .app-sidebar { width: min(88vw, 318px); }
  .sidebar-inner { padding-top: .8rem; }
  .topbar { min-height: 62px; }
}

@media (prefers-reduced-motion: reduce) {
  .nav-chevron,
  .sidebar-link,
  .nav-group,
  .tenant-context-actions a,
  .tenant-context-actions button { transition: none !important; }
}
.nav-group.is-active-group {
  border-color: rgba(47, 128, 237, .13);
  background: rgba(47, 128, 237, .035);
}
.nav-group.is-active-group > .nav-section {
  color: #17436f;
  background: rgba(47, 128, 237, .09);
}
.nav-group.is-active-group .nav-section-icon {
  color: #fff;
  background: linear-gradient(135deg, #1e3a5f, #2f80ed);
  box-shadow: 0 6px 14px rgba(47, 128, 237, .17);
}

/* Coolflow compacte HTML-editor voor e-mailsjablonen */
.ff-html-editor {
  border: 1px solid var(--bs-border-color, #dee2e6);
  border-radius: .75rem;
  overflow: hidden;
  background: var(--bs-body-bg, #fff);
}
.ff-html-toolbar {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .3rem;
  padding: .55rem;
  border-bottom: 1px solid var(--bs-border-color, #dee2e6);
  background: rgba(248, 249, 250, .92);
}
.ff-editor-btn {
  min-width: 2rem;
  border-color: transparent;
}
.ff-editor-btn:hover,
.ff-editor-btn.active {
  border-color: var(--bs-primary, #0d6efd);
  color: var(--bs-primary, #0d6efd);
  background: #fff;
}
.ff-editor-separator {
  width: 1px;
  height: 1.7rem;
  margin: 0 .15rem;
  background: var(--bs-border-color, #dee2e6);
}
.ff-editor-block {
  width: 9.5rem;
}
.ff-editor-placeholder {
  width: min(15rem, 100%);
}
.ff-html-surface,
.ff-html-source {
  min-height: 18rem;
  width: 100%;
  padding: 1rem;
  border: 0 !important;
  border-radius: 0 !important;
  outline: 0;
  resize: vertical;
  background: var(--bs-body-bg, #fff);
  color: var(--bs-body-color, #212529);
  line-height: 1.55;
}
.ff-html-surface:focus {
  box-shadow: inset 0 0 0 2px rgba(13, 110, 253, .18);
}
.ff-html-surface p:first-child,
.ff-html-surface h2:first-child,
.ff-html-surface h3:first-child,
.ff-html-surface h4:first-child {
  margin-top: 0;
}
.ff-html-surface p:last-child,
.ff-html-surface ul:last-child,
.ff-html-surface ol:last-child {
  margin-bottom: 0;
}
.ff-html-source {
  display: block;
  min-height: 18rem;
  font-family: var(--bs-font-monospace, monospace);
  white-space: pre;
}
.ff-translation-status {
  display: flex;
  flex-wrap: wrap;
  gap: .4rem;
}
.ff-translation-status .badge {
  font-weight: 600;
  padding: .45rem .6rem;
}
@media (max-width: 575.98px) {
  .ff-editor-separator { display: none; }
  .ff-editor-block,
  .ff-editor-placeholder { width: 100%; }
  .ff-html-surface,
  .ff-html-source { min-height: 15rem; }
}

.ff-html-source[hidden], .ff-html-surface[hidden] { display: none !important; }

/* Medewerkersoverzicht v2.21.8 */
.employee-filter-card .form-label {
  margin-bottom: .34rem;
  color: #53677d;
  font-size: .73rem;
  font-weight: 750;
}
.employee-filter-chips {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem;
}
.employee-filter-chip {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  padding: .32rem .58rem;
  border-radius: 999px;
  color: #17436f;
  background: rgba(47, 128, 237, .09);
  font-size: .72rem;
  font-weight: 650;
  text-decoration: none;
}
.employee-filter-chip:hover { color: #0b5ed7; background: rgba(47, 128, 237, .14); }

.employee-overview-card { overflow: visible; transition: opacity .12s ease; }
.employee-overview-card.employee-search-loading { opacity: .58; pointer-events: none; }
.employee-overview-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  border-bottom: 1px solid rgba(30, 58, 95, .07);
}
.employee-bulk-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: .65rem 1rem;
  border-bottom: 1px solid rgba(13, 110, 253, .12);
  background: rgba(13, 110, 253, .055);
}
.employee-bulk-bar[hidden] { display: none !important; }
.employee-overview-scroll { min-height: 90px; }
.employee-overview-table {
  --employee-select-width: 44px;
  min-width: max-content;
  font-size: .78rem;
}
.employee-overview-table > :not(caption) > * > * {
  padding: .67rem .66rem;
  border-color: rgba(30, 58, 95, .07);
  vertical-align: middle;
}
.employee-overview-table thead th {
  position: relative;
  z-index: 4;
  color: #566a80;
  background: #f8fafc;
  font-size: .68rem;
  font-weight: 850;
  letter-spacing: .035em;
  text-transform: uppercase;
  white-space: nowrap;
}
.employee-overview-table thead th a { color: inherit; text-decoration: none; }
.employee-overview-table thead th a:hover { color: var(--bs-primary); }
.employee-overview-table tbody tr { cursor: pointer; transition: background .12s ease; }
.employee-overview-table tbody tr:hover > td { background: #f7fbff; }
.employee-overview-table tbody tr:focus-visible { outline: 2px solid rgba(13, 110, 253, .45); outline-offset: -2px; }
.employee-overview-table .employee-select-col {
  position: sticky;
  left: 0;
  z-index: 5;
  width: var(--employee-select-width);
  min-width: var(--employee-select-width);
  max-width: var(--employee-select-width);
  text-align: center;
  background: #fff;
}
.employee-overview-table thead .employee-select-col { z-index: 8; background: #f8fafc; }
.employee-overview-table .employee-first-name-col { min-width: 190px; }
.employee-overview-table .employee-last-name-col { min-width: 180px; }
.employee-overview-table tbody tr:hover .employee-select-col { background: #f7fbff; }
.employee-overview-table .employee-status-col { min-width: 118px; }
.employee-overview-table .employee-attendance-col { min-width: 176px; }
.employee-overview-table .employee-actions-col {
  position: sticky;
  right: 0;
  z-index: 4;
  min-width: 128px;
  background: #fff;
  box-shadow: -8px 0 16px -16px rgba(30, 58, 95, .7);
}
.employee-overview-table thead .employee-actions-col { z-index: 7; background: #f8fafc; }
.employee-overview-table tbody tr:hover .employee-actions-col { background: #f7fbff; }
.employee-overview-table tbody tr.employee-row-menu-open .employee-actions-col { z-index: 40; }
.employee-person {
  display: flex;
  align-items: center;
  gap: .65rem;
  min-width: 0;
}
.employee-avatar {
  display: grid;
  place-items: center;
  flex: 0 0 34px;
  width: 34px;
  height: 34px;
  border-radius: 10px;
  color: #1e4d7a;
  background: linear-gradient(145deg, rgba(47, 128, 237, .13), rgba(30, 58, 95, .07));
  font-size: .72rem;
  font-weight: 900;
}
.employee-person-copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
}
.employee-person-name {
  display: flex;
  align-items: center;
  gap: .35rem;
  overflow: hidden;
  color: #172b43;
  font-size: .82rem;
  font-weight: 800;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.employee-person-meta {
  overflow: hidden;
  color: #8996a6;
  font-size: .67rem;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.employee-dossier-alert { flex: 0 0 auto; color: #d97706; }
.employee-dossier-alert .bi-exclamation-octagon-fill { color: #dc3545; }
.employee-file-status {
  display: inline-flex;
  align-items: center;
  gap: .42rem;
  padding: .26rem .5rem;
  border: 1px solid transparent;
  border-radius: 999px;
  font-size: .7rem;
  font-weight: 800;
  line-height: 1;
}
.employee-file-status span {
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: currentColor;
}
.employee-file-status.is-active { color: #157347; border-color: rgba(25, 135, 84, .18); background: rgba(25, 135, 84, .1); }
.employee-file-status.is-inactive { color: #6c757d; border-color: rgba(108, 117, 125, .18); background: rgba(108, 117, 125, .08); }
.employee-file-status:hover { filter: brightness(.97); }
.employee-attendance {
  display: inline-flex;
  max-width: 205px;
  flex-direction: column;
  align-items: flex-start;
  gap: .2rem;
  padding: .34rem .52rem;
  border: 1px solid transparent;
  border-radius: .7rem;
  line-height: 1.12;
}
.employee-attendance-state {
  display: inline-flex;
  align-items: center;
  gap: .35rem;
  font-size: .72rem;
  font-weight: 850;
}
.employee-attendance small {
  display: flex;
  align-items: flex-start;
  gap: .3rem;
  font-size: .63rem;
  font-weight: 700;
  line-height: 1.2;
}
.employee-attendance small .bi { flex: 0 0 auto; }
.employee-attendance.is-present {
  color: #146c43;
  border-color: rgba(25, 135, 84, .2);
  background: rgba(25, 135, 84, .1);
}
.employee-attendance.is-absent {
  color: #b02a37;
  border-color: rgba(220, 53, 69, .2);
  background: rgba(220, 53, 69, .1);
}
.employee-cell-primary { display: block; max-width: 180px; color: #253b55; font-weight: 650; }
.employee-activity-text { display: block; max-width: 180px; color: #4c6076; line-height: 1.25; }
.employee-contact-cell { display: flex; max-width: 220px; flex-direction: column; gap: .18rem; }
.employee-contact-cell a {
  display: flex;
  align-items: center;
  gap: .35rem;
  overflow: hidden;
  color: #405872;
  text-decoration: none;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.employee-contact-cell a:hover { color: var(--bs-primary); }
.employee-arrangements { display: flex; flex-wrap: wrap; gap: .35rem; }
.employee-arrangements span {
  display: inline-flex;
  align-items: center;
  gap: .28rem;
  padding: .22rem .42rem;
  border-radius: 999px;
  font-size: .67rem;
  font-weight: 750;
}
.employee-arrangements .is-on { color: #0b5ed7; background: rgba(13, 110, 253, .1); }
.employee-arrangements .is-off { color: #7c8998; background: #f1f3f5; }
.employee-season-select { min-width: 145px; }
.employee-row-actions { display: inline-flex; align-items: center; justify-content: flex-end; gap: .3rem; }
.employee-row-actions .employee-action-icon,
.employee-row-actions .employee-more-actions {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  padding: 0;
}
.employee-row-actions .employee-action-icon .bi,
.employee-row-actions .employee-more-actions .bi { margin: 0 !important; font-size: .85rem; }
.employee-action-menu { z-index: 1085; min-width: 210px; box-shadow: 0 14px 36px rgba(15, 23, 42, .18); }
.employee-action-menu-floating { z-index: 1095; }
.employee-action-menu .dropdown-item { display: flex; align-items: center; gap: .6rem; font-size: .8rem; }
.employee-action-menu .dropdown-item i { width: 18px; color: #69809a; }
.employee-action-menu form { margin: 0; }
.employee-action-menu form .dropdown-item { width: 100%; border: 0; background: transparent; text-align: left; }
.employee-empty-icon {
  display: grid;
  place-items: center;
  width: 54px;
  height: 54px;
  margin: auto;
  border-radius: 16px;
  color: #6b8098;
  background: #f1f5f9;
  font-size: 1.3rem;
}
.employee-column-option {
  display: flex;
  align-items: center;
  gap: .65rem;
  padding: .65rem .72rem;
  border: 1px solid rgba(30, 58, 95, .09);
  border-radius: 11px;
  background: #fff;
  cursor: pointer;
}
.employee-column-option:hover { border-color: rgba(13, 110, 253, .25); background: #f8fbff; }
.employee-column-option span { font-size: .82rem; font-weight: 650; }
.employee-column-order-help {
  display: flex;
  align-items: center;
  gap: .55rem;
  color: #60738a;
  font-size: .8rem;
}
.employee-column-sort-list {
  display: flex;
  flex-direction: column;
  gap: .45rem;
}
.employee-column-sort-item {
  display: grid;
  grid-template-columns: 32px 22px minmax(0, 1fr) auto;
  align-items: center;
  gap: .55rem;
  min-height: 52px;
  padding: .45rem .55rem;
  border: 1px solid rgba(30, 58, 95, .12);
  border-radius: 11px;
  background: #fff;
  transition: border-color .15s, background-color .15s, opacity .15s, box-shadow .15s;
}
.employee-column-sort-item:hover { border-color: rgba(13, 110, 253, .3); }
.employee-column-sort-item.is-hidden { background: #f8fafc; opacity: .7; }
.employee-column-sort-item.is-dragging {
  opacity: .45;
  border-color: rgba(13, 110, 253, .55);
  box-shadow: 0 8px 24px rgba(15, 23, 42, .12);
}
.employee-column-drag-handle {
  display: grid;
  place-items: center;
  width: 30px;
  height: 34px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #718198;
  cursor: grab;
  touch-action: none;
}
.employee-column-drag-handle:active { cursor: grabbing; }
.employee-column-sort-copy { min-width: 0; cursor: pointer; }
.employee-column-sort-copy strong,
.employee-column-sort-copy small { display: block; }
.employee-column-sort-copy strong { font-size: .84rem; }
.employee-column-sort-copy small { color: #73849a; font-size: .7rem; margin-top: .08rem; }
.employee-column-move-buttons { display: inline-flex; gap: .3rem; }
.employee-column-move-buttons .btn {
  display: inline-grid;
  place-items: center;
  width: 32px;
  height: 32px;
  padding: 0;
}

@media (max-width: 991.98px) {
  .employee-overview-toolbar,
  .employee-bulk-bar { align-items: flex-start; flex-direction: column; }
}
@media (max-width: 575.98px) {
  .employee-overview-table { --employee-name-width: 210px; }
  .employee-row-actions .btn-primary { padding-left: .45rem; padding-right: .45rem; }
  .employee-row-actions .btn-primary .bi { margin-right: 0 !important; }
  .employee-row-actions .btn-primary { font-size: 0; }
  .employee-row-actions .btn-primary .bi { font-size: .8rem; }
}

/* Coolflow UX foundation v2.28 */
.skip-link {
  position: fixed;
  left: 1rem;
  top: .75rem;
  z-index: 5000;
  transform: translateY(-180%);
  background: #0f172a;
  color: #fff;
  padding: .7rem 1rem;
  border-radius: 10px;
  font-weight: 800;
  text-decoration: none;
  box-shadow: var(--shadow);
}
.skip-link:focus { transform: translateY(0); color: #fff; }
.page-subtitle { color: var(--muted); font-size: .9rem; }
.page-breadcrumbs { display:flex; align-items:center; gap:.3rem; margin-bottom:.15rem; font-size:.72rem; color:#64748b; }
.page-breadcrumbs a { color:#475569; text-decoration:none; font-weight:700; }
.page-breadcrumbs a:hover { color:var(--primary); }
.page-breadcrumbs .bi { font-size:.58rem; }
.ui-flash-stack { display:grid; gap:.65rem; margin-bottom:1rem; }
.ui-flash-stack .alert { margin:0; }
.ui-toast-dot { width:.68rem; height:.68rem; border-radius:50%; display:inline-block; margin-right:.55rem; }
.ui-dirty-bar {
  position: fixed;
  left: calc(var(--sidebar-w, 270px) + 1rem);
  right: 1rem;
  bottom: 1rem;
  z-index: 1065;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:1rem;
  padding:.85rem 1rem;
  border-radius:16px;
  color:#fff;
  background:#0f172a;
  box-shadow:0 18px 50px rgba(15,23,42,.28);
}
.ui-dirty-bar[hidden] { display:none !important; }
.ui-dirty-bar span { color:#cbd5e1; }
.ui-validation-summary { margin-bottom:1rem; }
.btn.is-loading { cursor:wait; }
.btn:disabled { cursor:not-allowed; }
.form-control.is-invalid, .form-select.is-invalid { background-image:none; }
.empty-state {
  padding:2.5rem 1.25rem;
  text-align:center;
  border:1px dashed rgba(15,23,42,.16);
  border-radius:16px;
  background:rgba(248,250,252,.72);
}
.empty-state-icon { width:48px; height:48px; display:grid; place-items:center; margin:0 auto .8rem; border-radius:14px; background:var(--primary-soft); color:var(--primary); font-size:1.35rem; }
.filter-chip { display:inline-flex; align-items:center; gap:.4rem; padding:.38rem .65rem; border-radius:999px; background:#eef2ff; color:#3730a3; font-size:.78rem; font-weight:800; text-decoration:none; }
.filter-chip:hover { background:#e0e7ff; color:#312e81; }
.pagination { --bs-pagination-border-radius: 10px; --bs-pagination-color: #334155; --bs-pagination-active-bg: var(--primary); --bs-pagination-active-border-color: var(--primary); }
.pagination-summary { color:var(--muted); font-size:.86rem; }
.table-responsive[data-sticky-actions] th:last-child,
.table-responsive[data-sticky-actions] td:last-child { position:sticky; right:0; z-index:2; background:rgba(255,255,255,.96); box-shadow:-8px 0 18px rgba(15,23,42,.035); }
.table-responsive[data-sticky-actions] thead th:last-child { z-index:3; }
.nav-tabs { gap:.2rem; border-bottom-color:rgba(15,23,42,.10); overflow-x:auto; overflow-y:hidden; flex-wrap:nowrap; scrollbar-width:thin; }
.nav-tabs .nav-link { white-space:nowrap; border-radius:12px 12px 0 0; font-weight:750; color:#64748b; }
.nav-tabs .nav-link.active { color:#0f172a; }
.employee-page-nav { display:flex; align-items:center; gap:.35rem; }
.employee-page-nav .btn { min-width:38px; }
.employee-subnav-note { color:var(--muted); font-size:.82rem; }

@media (max-width: 991.98px) {
  .ui-dirty-bar { left:1rem; }
}

@media (max-width: 767.98px) {
  .topbar { align-items:flex-start !important; }
  .topbar > .d-flex:last-child { width:100%; justify-content:flex-start !important; }
  .topbar .btn { flex:1 1 auto; }
  .page-breadcrumbs { display:none; }
  .ui-dirty-bar { flex-direction:column; align-items:stretch; }
  .ui-dirty-bar .btn { width:100%; }
  .table-responsive[data-mobile-cards] { overflow:visible; }
  .ui-mobile-table, .ui-mobile-table tbody, .ui-mobile-table tr, .ui-mobile-table td { display:block; width:100%; }
  .ui-mobile-table thead { display:none; }
  .ui-mobile-table tbody { display:grid; gap:.85rem; }
  .ui-mobile-table tbody tr {
    border:1px solid rgba(15,23,42,.10);
    border-radius:16px;
    padding:.5rem .85rem;
    background:#fff;
    box-shadow:0 8px 22px rgba(15,23,42,.045);
  }
  .ui-mobile-table tbody td {
    display:grid;
    grid-template-columns:minmax(105px, 38%) 1fr;
    gap:.75rem;
    align-items:start;
    padding:.6rem 0 !important;
    border-bottom:1px solid rgba(15,23,42,.07) !important;
    text-align:left !important;
    white-space:normal !important;
  }
  .ui-mobile-table tbody td:last-child { border-bottom:0 !important; }
  .ui-mobile-table tbody td::before { content:attr(data-label); color:#64748b; font-size:.72rem; font-weight:850; text-transform:uppercase; letter-spacing:.045em; }
  .ui-mobile-table tbody td[colspan] { display:block; text-align:center !important; }
  .ui-mobile-table tbody td[colspan]::before { display:none; }
  .table-responsive[data-sticky-actions] th:last-child,
  .table-responsive[data-sticky-actions] td:last-child { position:static; box-shadow:none; }
}
.employee-mail-frame { width:100%; height:430px; border:1px solid rgba(15,23,42,.12); border-radius:14px; background:#fff; }
.employee-merged-section { padding-top:.25rem; border-top:1px solid rgba(15,23,42,.08); }
.employee-section-icon { width:36px; height:36px; display:grid; place-items:center; border-radius:11px; background:var(--primary-soft); color:var(--primary); }
@media (max-width: 767.98px) { .employee-mail-frame { height:520px; } }

/* v2.28 - dashboard, workvoorraad en medewerkerkaart gebruiken de gedeelde stylesheet. */
body[data-page="index"] .dash-hero{border:1px solid #e5e7eb;border-radius:18px;background:#fff;box-shadow:0 8px 24px rgba(15,23,42,.05)}
body[data-page="index"] .dash-card{border:1px solid #e5e7eb;border-radius:16px;background:#fff;padding:1.1rem;height:100%;box-shadow:0 6px 18px rgba(15,23,42,.04);text-decoration:none;color:inherit;display:block}
body[data-page="index"] .dash-card:hover{border-color:#93c5fd;box-shadow:0 10px 28px rgba(37,99,235,.10)}
body[data-page="index"] .dash-card .n{font-size:2rem;font-weight:900;color:#111827;line-height:1}
body[data-page="index"] .muted{color:#64748b;font-size:.92rem}
body[data-page="index"] .quick-tile{border:1px solid #e5e7eb;border-radius:14px;background:#fff;padding:1rem;text-decoration:none;color:#111827;display:flex;align-items:center;justify-content:space-between;gap:1rem}
body[data-page="index"] .quick-tile:hover{border-color:#93c5fd;background:#f8fbff}
body[data-page="index"] .alert-row{border:1px solid #e5e7eb;border-radius:12px;background:#fff;padding:.85rem 1rem;display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-bottom:.6rem}
body[data-page="index"] .dot{width:.7rem;height:.7rem;border-radius:50%;display:inline-block;background:#f97316}
body[data-page="index"] .dot.red{background:#dc2626}
body[data-page="index"] .dot.green{background:#16a34a}
body[data-page="index"] .health-ring{width:96px;height:96px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(#0d6efd calc(var(--p)*1%),#e2e8f0 0)}
body[data-page="index"] .health-ring span{width:70px;height:70px;border-radius:50%;background:#fff;display:grid;place-items:center;font-weight:900}

body[data-page="workvoorraad"] .dash-hero{border:1px solid #e5e7eb;border-radius:16px;background:#fff;box-shadow:0 8px 24px rgba(15,23,42,.05)}
body[data-page="workvoorraad"] .kpi{border:1px solid #e5e7eb;border-radius:14px;background:#fff;padding:1rem;height:100%}
body[data-page="workvoorraad"] .kpi .n{font-size:1.8rem;font-weight:900;color:#111827}
body[data-page="workvoorraad"] .muted{color:#64748b;font-size:.9rem}
body[data-page="workvoorraad"] .workcard{border:1px solid #e5e7eb;border-radius:16px;background:#fff;box-shadow:0 8px 24px rgba(15,23,42,.05)}
body[data-page="workvoorraad"] .signal-list{min-width:280px}
body[data-page="workvoorraad"] .signal-critical{color:#b91c1c;font-weight:700}
body[data-page="workvoorraad"] .signal-warning{color:#475569}
body[data-page="workvoorraad"] .dossier-progress{height:7px;background:#e2e8f0;border-radius:999px;overflow:hidden}
body[data-page="workvoorraad"] .dossier-progress>span{display:block;height:100%;background:#0d6efd}
body[data-page="workvoorraad"] .table td{vertical-align:middle}
body[data-page="workvoorraad"] .health-ring{width:82px;height:82px;border-radius:50%;display:grid;place-items:center;background:conic-gradient(#0d6efd calc(var(--p)*1%),#e2e8f0 0)}
body[data-page="workvoorraad"] .health-ring span{width:60px;height:60px;border-radius:50%;background:#fff;display:grid;place-items:center;font-weight:900}
body[data-page="employee_data_completion"] .data-completion-card{border:1px solid #e5e7eb;border-radius:16px;background:#fff;box-shadow:0 8px 24px rgba(15,23,42,.05)}
body[data-page="employee_data_completion"] .data-completion-muted{color:#64748b;font-size:.86rem}
body[data-page="employee_data_completion"] .data-completion-issue{display:inline-block;border-radius:999px;padding:.2rem .5rem;font-size:.75rem;font-weight:800;background:#fff7ed;color:#9a3412;margin:.1rem}
body[data-page="employee_data_completion"] [data-autosave-field]{min-width:125px}
body[data-page="employee_data_completion"] .table td{vertical-align:middle}
body[data-page="employee_data_completion"] .data-completion-status{white-space:nowrap;font-size:.82rem}
body[data-page="employee_data_completion"] .data-completion-status.is-saving{color:#0d6efd}
body[data-page="employee_data_completion"] .data-completion-status.is-saved{color:#198754}
body[data-page="employee_data_completion"] .data-completion-status.is-error{color:#dc3545;font-weight:700}

body[data-page="employee"] .employee-hero{border:1px solid rgba(15,23,42,.08);border-radius:18px;background:#fff;box-shadow:0 14px 35px rgba(15,23,42,.06)}
body[data-page="employee"] .kv{display:grid;grid-template-columns:minmax(150px,220px) 1fr;gap:.35rem 1rem;padding:.65rem 0;border-bottom:1px solid rgba(15,23,42,.07)}
body[data-page="employee"] .kv:last-child{border-bottom:0}
body[data-page="employee"] .kv .k{color:#64748b;font-size:.86rem;font-weight:700}
body[data-page="employee"] .kv .v{color:#0f172a}
body[data-page="employee"] .doc-frame{width:100%;height:160px;border:1px solid rgba(15,23,42,.12);border-radius:14px;background:#f8fafc}
body[data-page="employee"] .doc-preview-button{width:100%;height:160px;border:1px solid rgba(15,23,42,.12);border-radius:14px;background:#f8fafc;padding:0;overflow:hidden;display:flex;align-items:center;justify-content:center;cursor:zoom-in}
body[data-page="employee"] .doc-preview-button:hover{border-color:#0d6efd;box-shadow:0 0 0 .18rem rgba(13,110,253,.12)}
body[data-page="employee"] .doc-image-preview{width:100%;height:100%;object-fit:contain;display:block}
body[data-page="employee"] .doc-slot{border:1px dashed rgba(15,23,42,.18);border-radius:16px;padding:1rem;background:#fff}
body[data-page="employee"] .other-document-upload{border:1px solid rgba(109,40,217,.16);border-radius:16px;padding:1rem;background:linear-gradient(135deg,rgba(109,40,217,.035),rgba(255,90,58,.025))}
body[data-page="employee"] .other-document-dropzone{min-height:118px;border:2px dashed rgba(109,40,217,.3);border-radius:14px;padding:1.1rem 1.25rem;background:#fff;display:flex;align-items:center;gap:1rem;cursor:pointer;transition:border-color .15s,background-color .15s,box-shadow .15s}
body[data-page="employee"] .other-document-dropzone:hover,body[data-page="employee"] .other-document-upload.dragover .other-document-dropzone{border-color:#6d28d9;background:#faf7ff;box-shadow:0 0 0 .2rem rgba(109,40,217,.08)}
body[data-page="employee"] .other-document-dropzone-icon{width:48px;height:48px;flex:0 0 48px;border-radius:14px;background:#f1e9ff;color:#6d28d9;display:grid;place-items:center;font-size:1.4rem}
body[data-page="employee"] .other-document-dropzone-copy{min-width:0;flex:1;display:flex;flex-direction:column;gap:.2rem}
body[data-page="employee"] .other-document-dropzone-copy strong{color:#2b123b;font-size:.96rem}
body[data-page="employee"] .other-document-dropzone-copy small{color:#64748b;line-height:1.4}
body[data-page="employee"] .other-document-upload.is-uploading{opacity:.68;pointer-events:none}
body[data-page="employee"] .doc-viewer-backdrop{position:fixed;inset:0;z-index:3000;background:rgba(15,23,42,.72);display:none;align-items:center;justify-content:center;padding:2rem}
body[data-page="employee"] .doc-viewer-backdrop.open{display:flex}
body[data-page="employee"] .doc-viewer-modal{width:min(96vw,1400px);height:min(92vh,900px);background:#fff;border-radius:18px;overflow:hidden;box-shadow:0 25px 80px rgba(0,0,0,.35);display:flex;flex-direction:column}
body[data-page="employee"] .doc-viewer-head{padding:.75rem 1rem;border-bottom:1px solid rgba(15,23,42,.12);display:flex;justify-content:space-between;align-items:center;gap:1rem}
body[data-page="employee"] .doc-viewer-body{flex:1;min-height:0;overflow:hidden;background:#f8fafc;display:flex;align-items:center;justify-content:center}
body[data-page="employee"] .doc-viewer-frame{width:100%;height:100%;border:0;background:#f8fafc;display:none}
body[data-page="employee"] .doc-viewer-image{width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;display:none;background:#f8fafc}
body[data-page="employee"] .doc-slot.dragover{border-color:#0d6efd;background:#eef6ff}
body[data-page="employee"] .iban-ok{color:#198754;font-weight:800}
body[data-page="employee"] .iban-bad{color:#dc3545;font-weight:800}
body[data-page="employee"] .audit-line{border-left:3px solid rgba(13,110,253,.25);padding-left:.75rem;margin:.45rem 0}
body[data-page="employee"] .dossier-alert{border:1px solid rgba(245,158,11,.3);background:#fffbeb;border-radius:14px}
body[data-page="employee"] .dossier-alert.is-critical{border-color:rgba(220,53,69,.3);background:#fff5f5}
body[data-page="employee"] .dossier-action-row{min-height:40px;display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.5rem .7rem;border:1px solid rgba(15,23,42,.12);border-radius:10px;background:#fff}
body[data-page="employee"] .employee-id-front-preview{position:relative;width:min(100%,340px);height:210px;margin:0 auto;padding:8px;overflow:hidden;border:1px solid rgba(15,23,42,.12);border-radius:14px;background:#eef3f8;display:grid;place-items:center}
body[data-page="employee"] .employee-id-front-preview>img{display:block!important;width:auto!important;height:auto!important;max-width:100%!important;max-height:100%!important;object-fit:contain!important;background:#eef3f8;pointer-events:none}
body[data-page="employee"] .employee-id-front-preview>iframe{display:block;width:100%;height:100%;border:0;background:#eef3f8;pointer-events:none}
body[data-page="employee"] .employee-id-front-file,body[data-page="employee"] .employee-id-front-missing{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;color:#64748b;background:#f8fafc}
body[data-page="employee"] .employee-id-front-file{height:100%}
body[data-page="employee"] .employee-id-front-missing{width:min(100%,340px);height:210px;margin:0 auto;border:1px dashed rgba(15,23,42,.2);border-radius:14px}
body[data-page="employee"] .employee-id-front-file i,body[data-page="employee"] .employee-id-front-missing>i{font-size:2.25rem;margin-bottom:.4rem}
body[data-page="employee"] .employee-id-front-open{position:absolute;inset:0;border:0;background:transparent;display:flex;align-items:flex-end;justify-content:center;padding:.75rem;cursor:zoom-in}
body[data-page="employee"] .employee-id-front-open span{padding:.35rem .65rem;border-radius:999px;background:rgba(15,23,42,.82);color:#fff;font-size:.78rem;font-weight:700;opacity:0;transform:translateY(4px);transition:opacity .15s,transform .15s}
body[data-page="employee"] .employee-id-front-open:hover span,body[data-page="employee"] .employee-id-front-open:focus-visible span{opacity:1;transform:translateY(0)}
body[data-page="employee"] .employee-id-front-open:focus-visible{outline:3px solid rgba(13,110,253,.35);outline-offset:-3px}
body[data-page="employee"] .dossier-score{font-size:1.35rem;font-weight:900}
@media(max-width:575.98px){body[data-page="employee"] .dossier-action-row{align-items:flex-start;flex-direction:column;gap:.2rem}body[data-page="employee"] .other-document-dropzone{align-items:flex-start;flex-wrap:wrap;padding:1rem}body[data-page="employee"] .other-document-dropzone-copy{flex-basis:calc(100% - 64px)}body[data-page="employee"] .other-document-dropzone>.btn{margin-left:64px}}

/* Stamgegevens bewerken: één rustige, taakgerichte formulierpagina */
body[data-page="employee_edit"] .employee-edit-form{max-width:100%}
body[data-page="employee_edit"] .employee-edit-grid{display:grid;gap:1rem}
body[data-page="employee_edit"] .employee-edit-card{border:1px solid rgba(15,23,42,.08);box-shadow:0 10px 28px rgba(15,23,42,.05)}
body[data-page="employee_edit"] .employee-edit-scope{max-width:430px;text-align:right}
body[data-page="employee_edit"] .employee-edit-intro{background:#fff}
body[data-page="employee_edit"] .employee-edit-activities{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.75rem 1rem;border:1px solid rgba(15,23,42,.1);border-radius:12px;padding:1rem;background:#f8fafc}
body[data-page="employee_edit"] .employee-edit-savebar{border:1px solid rgba(13,110,253,.18);background:rgba(255,255,255,.97);backdrop-filter:blur(10px)}
@media (max-width:1199.98px){body[data-page="employee_edit"] .employee-edit-activities{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media (max-width:767.98px){body[data-page="employee_edit"] .employee-edit-scope{text-align:left}body[data-page="employee_edit"] .employee-edit-activities{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:479.98px){body[data-page="employee_edit"] .employee-edit-activities{grid-template-columns:1fr}}


/* Vacation planning */
.vacation-toolbar .form-label{font-size:.78rem;font-weight:700;color:var(--bs-secondary-color);margin-bottom:.3rem}.vacation-board-card{overflow:hidden}.vacation-board{overflow:auto;max-height:68vh}.vacation-grid{display:grid;grid-template-columns:minmax(230px,280px) repeat(var(--period-count),var(--period-width));min-width:max-content}.vacation-grid-head{position:sticky;top:0;z-index:8;background:var(--bs-body-bg);border-bottom:1px solid var(--bs-border-color)}.vacation-grid-row{border-bottom:1px solid var(--bs-border-color)}.vacation-grid-row:hover .vacation-cell,.vacation-grid-row:hover .vacation-name-cell{background:rgba(var(--bs-primary-rgb),.035)}.vacation-name-cell{position:sticky;left:0;z-index:4;background:var(--bs-body-bg);padding:.65rem .8rem;border-right:1px solid var(--bs-border-color);min-height:58px;display:flex;flex-direction:column;justify-content:center}.vacation-name-cell span{display:block;font-size:.72rem;color:var(--bs-secondary-color);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:255px}.vacation-corner{z-index:10}.vacation-period-head{min-height:58px;padding:.45rem .2rem;text-align:center;border-right:1px solid var(--bs-border-color);display:flex;flex-direction:column;justify-content:center}.vacation-period-head strong{text-transform:uppercase;font-size:.78rem}.vacation-period-head span,.vacation-period-head small{font-size:.65rem;color:var(--bs-secondary-color);line-height:1.15}.vacation-period-head.has-warning{background:rgba(var(--bs-warning-rgb),.18);box-shadow:inset 0 -3px 0 rgba(var(--bs-warning-rgb),.85)}.vacation-cell{min-height:58px;border-right:1px solid var(--bs-border-color);padding:6px 1px;display:flex;flex-direction:column;justify-content:center;gap:3px;background-image:linear-gradient(to bottom,transparent 50%,rgba(0,0,0,.012) 50%)}.vacation-block{border:0;width:100%;height:24px;min-width:0;padding:0 .35rem;font-size:.65rem;font-weight:700;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-align:left;border-radius:0;cursor:pointer;transition:filter .15s,transform .15s}.vacation-block:hover{filter:brightness(.96);transform:translateY(-1px)}.vacation-block.is-start{border-radius:6px 0 0 6px;margin-left:2px;width:calc(100% - 2px)}.vacation-block.is-end{border-radius:0 6px 6px 0;margin-right:2px;width:calc(100% - 2px)}.vacation-block.is-start.is-end{border-radius:6px;margin:0 2px;width:calc(100% - 4px)}.vacation-block.approved{background:#d8f3e4;color:#17633a}.vacation-block.requested{background:#fff0c7;color:#775300}.vacation-block.draft{background:repeating-linear-gradient(135deg,#edf0f3,#edf0f3 6px,#dfe4e8 6px,#dfe4e8 12px);color:#4e5963}.vacation-block.rejected{background:#f8d7da;color:#842029}.vacation-block.cancelled{background:#e9ecef;color:#6c757d;text-decoration:line-through}.vacation-legend span{display:inline-flex;align-items:center;gap:.35rem}.legend-dot{width:.7rem;height:.7rem;border-radius:50%;display:inline-block}.legend-dot.approved{background:#51b67a}.legend-dot.requested{background:#e8b03f}.legend-dot.draft{background:#aab2ba}.legend-dot.rejected{background:#d46871}.legend-dot.cancelled{background:#adb5bd}@media(max-width:767px){.vacation-grid{grid-template-columns:minmax(185px,210px) repeat(var(--period-count),var(--period-width))}.vacation-name-cell{padding:.55rem;min-height:54px}.vacation-name-cell span{max-width:190px}.vacation-board{max-height:62vh}}
.vacation-status-approved{background:#d8f3e4;color:#17633a}.vacation-status-requested{background:#fff0c7;color:#775300}.vacation-status-draft{background:#e9ecef;color:#4e5963}.vacation-status-rejected{background:#f8d7da;color:#842029}.vacation-status-cancelled{background:#e9ecef;color:#6c757d;text-decoration:line-through}

/* Vakantieplanning: rolling 11-week view, mobile cards and occupancy settings */
.vacation-filter-checks{display:flex;flex-direction:column;justify-content:flex-end;gap:.25rem;padding-bottom:.25rem;white-space:nowrap}.vacation-mobile-board{display:none}.occupancy-settings-card{background:var(--bs-body-bg);transition:opacity .15s,background-color .15s}.occupancy-settings-card.is-inherited{opacity:.72;background:var(--bs-tertiary-bg)}.vacation-mobile-week{overflow:hidden;margin-bottom:.65rem}.vacation-mobile-week summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:.75rem;padding:.85rem 1rem;cursor:pointer;background:var(--bs-body-bg)}.vacation-mobile-week summary::-webkit-details-marker{display:none}.vacation-mobile-week summary>span:first-child{display:flex;flex-direction:column;min-width:0}.vacation-mobile-week summary strong{font-size:1rem}.vacation-mobile-week summary small{color:var(--bs-secondary-color)}.vacation-mobile-week summary:after{content:"\F282";font-family:"bootstrap-icons";font-size:.9rem;transition:transform .15s}.vacation-mobile-week[open] summary:after{transform:rotate(90deg)}.vacation-mobile-week.has-warning summary{box-shadow:inset 4px 0 0 rgba(var(--bs-warning-rgb),.95);background:rgba(var(--bs-warning-rgb),.08)}.vacation-mobile-counts{margin-left:auto;display:flex;align-items:center;justify-content:flex-end;gap:.35rem;flex-wrap:wrap}.vacation-mobile-week-body{border-top:1px solid var(--bs-border-color);padding:.55rem}.vacation-mobile-item{width:100%;border:0;border-left:5px solid transparent;border-radius:.65rem;padding:.7rem .75rem;margin:.25rem 0;display:flex;align-items:center;justify-content:space-between;gap:.75rem;text-align:left;background:var(--bs-tertiary-bg);color:var(--bs-body-color)}.vacation-mobile-item.approved{border-left-color:#51b67a;background:#eefaf3}.vacation-mobile-item.requested{border-left-color:#e8b03f;background:#fff8e5}.vacation-mobile-item.draft{border-left-color:#aab2ba;background:#f2f4f6}.vacation-mobile-item.rejected{border-left-color:#d46871;background:#fceced}.vacation-mobile-item.cancelled{border-left-color:#adb5bd;opacity:.75}.vacation-mobile-person{display:flex;flex-direction:column;min-width:0}.vacation-mobile-person strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.vacation-mobile-person small{color:var(--bs-secondary-color);line-height:1.3}.vacation-status-approved{background:#d8f3e4!important;color:#17633a!important}.vacation-status-requested{background:#fff0c7!important;color:#775300!important}.vacation-status-draft{background:#e3e7ea!important;color:#4e5963!important}.vacation-status-rejected{background:#f8d7da!important;color:#842029!important}.vacation-status-cancelled{background:#e9ecef!important;color:#6c757d!important}
@media(max-width:767.98px){.vacation-toolbar{padding:.8rem!important}.vacation-filter-checks{flex-direction:row;gap:1rem;padding:.25rem 0}.vacation-summary-cards .card{padding:.8rem!important}.vacation-summary-cards .display-6{font-size:1.75rem}.vacation-summary-cards .small{font-size:.72rem}.vacation-desktop-board{display:none}.vacation-mobile-board{display:block}.vacation-legend{width:100%;justify-content:flex-start}.vacation-mobile-counts .badge{font-size:.66rem}.vacation-mobile-item .badge{flex:0 0 auto}.occupancy-settings-card{padding:.85rem!important}}

/* Direct vakantie plannen door een periode op de medewerkerregel te selecteren. */
.vacation-selection-help{display:flex;align-items:center;gap:.4rem}.vacation-cell[data-vacation-select-cell]{position:relative;cursor:crosshair;transition:background-color .1s,box-shadow .1s}.vacation-cell[data-vacation-select-cell]:hover{background-color:rgba(var(--bs-primary-rgb),.055)}.vacation-cell.is-range-selecting{background-color:rgba(var(--bs-primary-rgb),.13)!important;box-shadow:inset 0 2px 0 rgba(var(--bs-primary-rgb),.82),inset 0 -2px 0 rgba(var(--bs-primary-rgb),.82);z-index:2}.vacation-cell.is-range-selecting.is-range-start{box-shadow:inset 2px 0 0 rgba(var(--bs-primary-rgb),.82),inset 0 2px 0 rgba(var(--bs-primary-rgb),.82),inset 0 -2px 0 rgba(var(--bs-primary-rgb),.82)}.vacation-cell.is-range-selecting.is-range-end{box-shadow:inset -2px 0 0 rgba(var(--bs-primary-rgb),.82),inset 0 2px 0 rgba(var(--bs-primary-rgb),.82),inset 0 -2px 0 rgba(var(--bs-primary-rgb),.82)}.vacation-cell.is-range-selecting.is-range-start.is-range-end{box-shadow:inset 0 0 0 2px rgba(var(--bs-primary-rgb),.82)}body.vacation-selection-active{user-select:none;cursor:crosshair}
@media(max-width:767.98px){.vacation-selection-help{display:none}}

/* Certificering & Kwaliteit */
.cert-readiness-banner{display:flex;align-items:center;justify-content:space-between;gap:1.5rem;padding:1.35rem 1.5rem;border-radius:1rem;border:1px solid var(--bs-border-color);background:linear-gradient(135deg,#f8fafc,#eef4f8)}
.cert-readiness-banner.is-ready{background:linear-gradient(135deg,#eefbf4,#dff5e9);border-color:#a8ddbf}.cert-readiness-banner.is-not-ready{background:linear-gradient(135deg,#fff8ed,#fff0d9);border-color:#f1c98b}
.cert-readiness-score{min-width:116px;text-align:center;padding:.75rem 1rem;border-radius:.85rem;background:rgba(255,255,255,.75);box-shadow:0 4px 18px rgba(15,23,42,.06)}.cert-readiness-score strong{display:block;font-size:1.75rem;line-height:1}.cert-readiness-score span{display:block;margin-top:.35rem;font-size:.75rem;color:var(--bs-secondary-color)}
.cert-stat-card,.cert-mini-stat{display:block;height:100%;padding:1rem 1.1rem;border:1px solid var(--bs-border-color);border-radius:.85rem;background:var(--bs-body-bg);color:var(--bs-body-color);box-shadow:0 4px 18px rgba(15,23,42,.035)}.cert-stat-card:hover{border-color:rgba(var(--bs-primary-rgb),.45);transform:translateY(-1px)}.cert-stat-card strong,.cert-mini-stat strong{display:block;font-size:1.65rem;line-height:1.15;margin:.25rem 0}.cert-stat-card small,.cert-mini-stat small,.cert-stat-label,.cert-mini-stat span{display:block;color:var(--bs-secondary-color);font-size:.78rem}
.cert-section-list{display:flex;flex-direction:column}.cert-section-row{display:grid;grid-template-columns:54px minmax(0,1fr) 92px;gap:1rem;align-items:center;padding:.85rem 1rem;border-bottom:1px solid var(--bs-border-color);color:var(--bs-body-color)}.cert-section-row:last-child{border-bottom:0}.cert-section-row:hover{background:var(--bs-tertiary-bg)}.cert-section-code{font-weight:700;color:var(--bs-primary)}.cert-section-copy strong{display:block;font-size:.88rem;margin-bottom:.4rem}.cert-section-copy .progress{height:6px}.cert-section-meta{text-align:right}.cert-section-meta strong,.cert-section-meta small{display:block}.cert-section-meta small{font-size:.7rem;color:var(--bs-secondary-color)}
.cert-choice{display:flex;align-items:flex-start;gap:.65rem;padding:.8rem;border:1px solid var(--bs-border-color);border-radius:.75rem;height:100%;cursor:pointer}.cert-choice:hover{background:var(--bs-tertiary-bg)}.cert-choice .form-check-input{margin-top:.15rem;flex:0 0 auto}
.cert-control-card{border-left:4px solid var(--bs-border-color)}.cert-control-card:has(.text-bg-danger){border-left-color:var(--bs-danger)}.cert-control-card .card-header{background:var(--bs-tertiary-bg)}
.cert-control-multiselect{font-size:.78rem}.cert-document-editor .card-body{max-height:calc(100vh - 9rem);overflow:auto}
.cert-audit-result{display:flex;flex-direction:column;align-items:center;text-align:center;padding:1.4rem;border-radius:1rem}.cert-audit-result i{font-size:2.25rem}.cert-audit-result strong{font-size:1.1rem;margin-top:.4rem}.cert-audit-result span{font-size:.75rem}.cert-audit-result.is-ready{background:#e5f7ed;color:#146c43}.cert-audit-result.is-not-ready{background:#fff0d8;color:#8a4b08}
@media(max-width:767.98px){.cert-readiness-banner{align-items:flex-start;padding:1rem}.cert-readiness-score{min-width:90px;padding:.65rem}.cert-section-row{grid-template-columns:42px minmax(0,1fr)}.cert-section-meta{grid-column:2;text-align:left;display:flex;gap:.5rem}.cert-document-editor .card-body{max-height:none}.cert-control-card .card-body{padding:.9rem}}
@media print{.cert-readiness-banner,.cert-stat-card,.cert-mini-stat,.audit-pack-cover{box-shadow:none!important}.cert-section-row{break-inside:avoid}.app-sidebar,.topbar,.no-print,.btn{display:none!important}.app-shell,.app-main{display:block!important;margin:0!important;padding:0!important}.main-content{max-width:none!important;padding:0!important}}

/* Certificering v2.35: begeleide cockpit, scopewizard, werkbank en auditruimte */
.cert-command-banner{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(320px,.8fr);gap:1.25rem;padding:1.45rem;border-radius:1.15rem;color:#fff;box-shadow:0 18px 42px rgba(15,23,42,.12);overflow:hidden;position:relative}.cert-command-banner:after{content:"";position:absolute;width:260px;height:260px;border-radius:50%;right:-100px;top:-145px;background:rgba(255,255,255,.08)}.cert-command-ready{background:linear-gradient(135deg,#125e43,#1e9b6d)}.cert-command-conditional{background:linear-gradient(135deg,#76500d,#c48113)}.cert-command-not_ready{background:linear-gradient(135deg,#682a34,#bd4456)}.cert-command-copy{position:relative;z-index:1}.cert-command-copy h2{font-size:clamp(1.35rem,2.4vw,2rem);margin:.25rem 0 .5rem}.cert-command-subtitle{margin:0;max-width:760px;color:rgba(255,255,255,.83)}.cert-command-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:.65rem;position:relative;z-index:1}.cert-command-metrics>div{background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.16);border-radius:.85rem;padding:.85rem}.cert-command-metrics span{display:block;font-size:.72rem;color:rgba(255,255,255,.75)}.cert-command-metrics strong{display:block;font-size:1.4rem;line-height:1.15;margin-top:.2rem}
.cert-work-list{display:flex;flex-direction:column}.cert-work-item{display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:.8rem;align-items:center;padding:.85rem 1rem;border-bottom:1px solid var(--bs-border-color)}.cert-work-item:last-child{border-bottom:0}.cert-work-item:hover{background:var(--bs-tertiary-bg)}.cert-work-icon{width:36px;height:36px;display:grid;place-items:center;border-radius:.75rem;background:var(--bs-tertiary-bg);color:var(--bs-primary);font-size:1rem}.cert-work-copy strong,.cert-work-copy span{display:block}.cert-work-copy strong{font-size:.9rem}.cert-work-copy span{font-size:.76rem;color:var(--bs-secondary-color);margin-top:.15rem}.cert-work-action{white-space:nowrap}.cert-health-row{display:grid;grid-template-columns:minmax(130px,.8fr) minmax(0,1.7fr) auto;gap:.8rem;align-items:center;padding:.65rem 0;border-bottom:1px solid var(--bs-border-color)}.cert-health-row:last-child{border-bottom:0}.cert-health-row .progress{height:7px}.cert-section-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem}.cert-section-tile{display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:.75rem;align-items:center;padding:.8rem;border:1px solid var(--bs-border-color);border-radius:.85rem;color:var(--bs-body-color);background:var(--bs-body-bg)}.cert-section-tile:hover{border-color:rgba(var(--bs-primary-rgb),.45);background:var(--bs-tertiary-bg)}.cert-section-tile .cert-section-code{width:44px;height:36px;border-radius:.65rem;background:rgba(var(--bs-primary-rgb),.09);display:grid;place-items:center}.cert-section-tile strong,.cert-section-tile small{display:block}.cert-section-tile small{color:var(--bs-secondary-color);font-size:.72rem}.cert-timeline{position:relative;padding-left:1.25rem}.cert-timeline:before{content:"";position:absolute;left:.37rem;top:.35rem;bottom:.35rem;width:2px;background:var(--bs-border-color)}.cert-timeline-step{position:relative;display:block;color:var(--bs-body-color);padding:0 0 1rem .65rem}.cert-timeline-step:last-child{padding-bottom:0}.cert-timeline-dot{position:absolute;left:-1.23rem;top:.2rem;width:.78rem;height:.78rem;border-radius:50%;background:var(--bs-secondary-bg);border:2px solid var(--bs-body-bg);box-shadow:0 0 0 2px var(--bs-border-color)}.cert-timeline-step.is-done .cert-timeline-dot{background:var(--bs-success);box-shadow:0 0 0 2px rgba(var(--bs-success-rgb),.25)}.cert-timeline-step.is-current .cert-timeline-dot{background:var(--bs-primary);box-shadow:0 0 0 3px rgba(var(--bs-primary-rgb),.2)}.cert-timeline-step strong,.cert-timeline-step span{display:block}.cert-timeline-step span{font-size:.72rem;color:var(--bs-secondary-color)}
.cert-scope-wizard{margin:auto;max-width:1280px}.cert-wizard-shell{display:grid;grid-template-columns:240px minmax(0,1fr);gap:1rem;align-items:start}.cert-wizard-nav{position:sticky;top:5.4rem;border:1px solid var(--bs-border-color);border-radius:1rem;background:var(--bs-body-bg);padding:.55rem}.cert-wizard-nav button{width:100%;display:flex;align-items:center;gap:.65rem;text-align:left;border:0;background:transparent;color:var(--bs-secondary-color);padding:.7rem;border-radius:.7rem;font-weight:650}.cert-wizard-nav button span{width:28px;height:28px;display:grid;place-items:center;border-radius:50%;background:var(--bs-tertiary-bg);font-size:.76rem;flex:0 0 28px}.cert-wizard-nav button>div{min-width:0}.cert-wizard-nav button strong,.cert-wizard-nav button small{display:block}.cert-wizard-nav button small{margin-top:.12rem;font-weight:500;line-height:1.25}.cert-wizard-nav button.active{color:var(--bs-primary);background:rgba(var(--bs-primary-rgb),.08)}.cert-wizard-nav button.active span{background:var(--bs-primary);color:#fff}.cert-wizard-content{min-width:0}.cert-wizard-step{display:none}.cert-wizard-step.active{display:block}.cert-wizard-footer{position:sticky;bottom:.75rem;display:flex;justify-content:space-between;gap:.75rem;align-items:center;padding:.75rem;margin-top:1rem;border:1px solid rgba(var(--bs-primary-rgb),.15);border-radius:.9rem;background:rgba(var(--bs-body-bg-rgb),.94);backdrop-filter:blur(10px);box-shadow:0 12px 28px rgba(15,23,42,.08);z-index:5}.cert-activity-choice{display:block;height:100%;border:1px solid var(--bs-border-color);border-radius:.9rem;padding:.8rem;background:var(--bs-body-bg);cursor:pointer}.cert-activity-choice:has(input:checked){border-color:var(--bs-primary);background:rgba(var(--bs-primary-rgb),.06);box-shadow:0 0 0 .16rem rgba(var(--bs-primary-rgb),.08)}.cert-activity-choice .form-check{margin:0}.cert-activity-choice strong,.cert-activity-choice small{display:block}.cert-activity-choice small{color:var(--bs-secondary-color);margin-top:.2rem}.cert-scope-rows{display:flex;flex-direction:column;gap:.7rem}.cert-scope-row{border:1px solid var(--bs-border-color);border-radius:.9rem;padding:.8rem;background:var(--bs-body-bg)}.cert-scope-row-head{display:flex;justify-content:space-between;gap:.75rem;align-items:center;margin-bottom:.65rem}
.cert-assessment-topbar{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1rem;align-items:center}.cert-assessment-progress{height:10px;background:var(--bs-tertiary-bg);border-radius:999px;overflow:hidden;margin-top:.45rem}.cert-assessment-progress span{display:block;height:100%;background:var(--bs-primary)}.cert-assessment-score{display:grid;grid-template-columns:repeat(3,minmax(85px,1fr));gap:.45rem}.cert-assessment-score>div{padding:.55rem .7rem;border-radius:.75rem;background:var(--bs-tertiary-bg);text-align:center}.cert-assessment-score span,.cert-assessment-score strong{display:block}.cert-assessment-score span{font-size:.68rem;color:var(--bs-secondary-color)}.cert-assessment-score strong{font-size:1.05rem}.cert-stat-major strong{color:var(--bs-danger)}.cert-stat-minor strong{color:#a66300}.cert-stat-unassessed strong{color:var(--bs-secondary-color)}.cert-workbench{display:grid;grid-template-columns:260px minmax(0,1fr) 330px;gap:1rem;align-items:start}.cert-chapter-sidebar{position:sticky;top:5.5rem;max-height:calc(100vh - 7rem);overflow:auto;border:1px solid var(--bs-border-color);border-radius:1rem;background:var(--bs-body-bg);padding:.5rem}.cert-chapter-sidebar a{display:grid;grid-template-columns:40px minmax(0,1fr) auto;gap:.55rem;align-items:center;padding:.6rem;border-radius:.65rem;color:var(--bs-body-color)}.cert-chapter-sidebar a:hover,.cert-chapter-sidebar a.active{background:var(--bs-tertiary-bg)}.cert-focus-card{border:1px solid var(--bs-border-color);border-radius:1rem;background:var(--bs-body-bg);box-shadow:0 10px 30px rgba(15,23,42,.05);overflow:hidden}.cert-focus-card>header{padding:1rem 1.1rem;border-bottom:1px solid var(--bs-border-color);background:var(--bs-tertiary-bg)}.cert-focus-form{padding:1.1rem}.cert-control-question{font-size:1.15rem;font-weight:750;line-height:1.45}.cert-explanation{padding:.85rem;border-left:4px solid var(--bs-primary);background:rgba(var(--bs-primary-rgb),.05);border-radius:0 .75rem .75rem 0}.cert-status-choices{display:grid;grid-template-columns:repeat(3,1fr);gap:.6rem}.cert-status-option{position:relative;display:block;border:1px solid var(--bs-border-color);border-radius:.8rem;padding:.8rem;cursor:pointer}.cert-status-option input{position:absolute;opacity:0}.cert-status-option strong,.cert-status-option small{display:block}.cert-status-option small{color:var(--bs-secondary-color);font-size:.72rem;margin-top:.15rem}.cert-status-option:has(input:checked){border-color:var(--bs-primary);background:rgba(var(--bs-primary-rgb),.07);box-shadow:0 0 0 .16rem rgba(var(--bs-primary-rgb),.08)}.cert-save-state{min-height:20px;font-size:.76rem}.cert-evidence-list{display:flex;flex-direction:column;gap:.55rem}.cert-evidence-item{border:1px solid var(--bs-border-color);border-radius:.75rem;padding:.7rem}.cert-evidence-item strong,.cert-evidence-item span{display:block}.cert-evidence-item span{font-size:.72rem;color:var(--bs-secondary-color)}.cert-action-mini{border:1px solid rgba(var(--bs-warning-rgb),.35);background:rgba(var(--bs-warning-rgb),.08);border-radius:.75rem;padding:.7rem}
.cert-action-board{display:grid;grid-template-columns:minmax(0,1fr);gap:1rem}.cert-action-board.has-editor{grid-template-columns:minmax(0,1fr) minmax(340px,420px)}.cert-action-columns{display:grid;grid-template-columns:repeat(4,minmax(230px,1fr));gap:.75rem;overflow-x:auto;padding-bottom:.25rem}.cert-action-column{border:1px solid var(--bs-border-color);border-radius:.9rem;background:var(--bs-tertiary-bg);min-height:460px;overflow:hidden}.cert-action-column>header{display:flex;justify-content:space-between;gap:.6rem;align-items:center;padding:.75rem;border-bottom:1px solid var(--bs-border-color);background:var(--bs-body-bg)}.cert-action-column>header>div{display:flex;align-items:center;gap:.45rem}.cert-board-dot{display:inline-block;width:.65rem;height:.65rem;border-radius:50%}.cert-action-stack{display:flex;flex-direction:column;gap:.55rem;padding:.6rem}.cert-action-card{display:flex;flex-direction:column;gap:.45rem;color:var(--bs-body-color);background:var(--bs-body-bg);border:1px solid var(--bs-border-color);border-radius:.75rem;padding:.7rem;box-shadow:0 4px 14px rgba(15,23,42,.035)}.cert-action-card:hover{border-color:rgba(var(--bs-primary-rgb),.4);transform:translateY(-1px)}.cert-action-card.is-overdue{border-left:4px solid var(--bs-danger)}.cert-action-meta{display:flex;flex-direction:column;gap:.2rem;color:var(--bs-secondary-color);font-size:.72rem}.cert-action-meta span{display:flex;gap:.35rem;align-items:center}.cert-board-empty{text-align:center;color:var(--bs-secondary-color);font-size:.76rem;padding:1.2rem}.cert-action-editor{position:sticky;top:5.5rem;max-height:calc(100vh - 6.5rem);overflow:auto}.cert-capa-steps{display:flex;flex-direction:column;gap:.7rem}.cert-capa-step{display:grid;grid-template-columns:30px minmax(0,1fr);gap:.65rem;align-items:start}.cert-capa-step>span{width:28px;height:28px;border-radius:50%;display:grid;place-items:center;background:var(--bs-primary);color:#fff;font-size:.75rem;font-weight:800;margin-top:1.7rem}.cert-capa-step>div{min-width:0}
.cert-eyebrow{font-size:.72rem;text-transform:uppercase;letter-spacing:.08em;font-weight:800;opacity:.75}.cert-audit-hero{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(330px,.8fr);gap:1rem;padding:1.25rem;border-radius:1rem;color:#fff;background:linear-gradient(135deg,#692b35,#b74354);box-shadow:0 14px 36px rgba(15,23,42,.1)}.cert-audit-hero.is-ready{background:linear-gradient(135deg,#125e43,#1e9b6d)}.cert-audit-hero h2{margin:.25rem 0 .4rem}.cert-audit-hero p{margin:0;color:rgba(255,255,255,.8)}.cert-audit-hero-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:.55rem}.cert-audit-hero-metrics>div{background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.14);border-radius:.8rem;padding:.7rem}.cert-audit-hero-metrics span,.cert-audit-hero-metrics strong{display:block}.cert-audit-hero-metrics span{font-size:.69rem;opacity:.78}.cert-audit-hero-metrics strong{font-size:1.05rem;margin-top:.15rem}.cert-share-created{display:block}.cert-share-row td{background:var(--bs-tertiary-bg);padding:1rem!important}.cert-share-list .list-group-item{padding:.8rem}.cert-audit-content-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.cert-audit-content-grid a{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.2rem .6rem;align-items:center;padding:1rem;border-right:1px solid var(--bs-border-color);border-bottom:1px solid var(--bs-border-color);color:var(--bs-body-color)}.cert-audit-content-grid a:nth-child(2n){border-right:0}.cert-audit-content-grid span,.cert-audit-content-grid strong{display:block}.cert-audit-content-grid span{font-size:.75rem;color:var(--bs-secondary-color)}.cert-audit-content-grid strong{font-size:.88rem}.cert-audit-content-grid i{grid-column:2;grid-row:1/3}.cert-audit-check{display:flex;justify-content:space-between;gap:.75rem;padding:.65rem 0;border-bottom:1px solid var(--bs-border-color)}.cert-audit-check:last-child{border-bottom:0}
@media(max-width:1199.98px){.cert-workbench{grid-template-columns:220px minmax(0,1fr)}.cert-workbench>aside:last-child{grid-column:2}.cert-action-board.has-editor{grid-template-columns:1fr}.cert-action-editor{position:static;max-height:none}.cert-action-columns{grid-template-columns:repeat(4,minmax(260px,1fr))}}
@media(max-width:991.98px){.cert-command-banner,.cert-audit-hero{grid-template-columns:1fr}.cert-wizard-shell{grid-template-columns:1fr}.cert-wizard-nav{position:static;display:flex;overflow:auto}.cert-wizard-nav button{min-width:max-content;width:auto}.cert-workbench{grid-template-columns:1fr}.cert-chapter-sidebar{position:static;max-height:none;display:flex;overflow:auto}.cert-chapter-sidebar a{min-width:220px}.cert-workbench>aside:last-child{grid-column:auto}.cert-section-grid{grid-template-columns:1fr}}
@media(max-width:767.98px){.cert-command-banner{padding:1rem}.cert-command-metrics,.cert-audit-hero-metrics{grid-template-columns:1fr}.cert-work-item{grid-template-columns:36px minmax(0,1fr)}.cert-work-action{grid-column:2}.cert-health-row{grid-template-columns:1fr}.cert-health-row>:last-child{text-align:left!important}.cert-status-choices{grid-template-columns:1fr}.cert-assessment-topbar{grid-template-columns:1fr}.cert-assessment-score{grid-template-columns:repeat(3,1fr)}.cert-action-columns{grid-template-columns:repeat(4,minmax(240px,1fr))}.cert-audit-content-grid{grid-template-columns:1fr}.cert-audit-content-grid a{border-right:0}.cert-wizard-footer{bottom:.25rem}.cert-scope-row .row>[class*="col-"]{margin-bottom:.35rem}}
@media(max-width:479.98px){.cert-assessment-score{grid-template-columns:1fr}.cert-section-tile{grid-template-columns:42px minmax(0,1fr)}.cert-section-tile>:last-child{grid-column:2}.cert-capa-step{grid-template-columns:1fr}.cert-capa-step>span{margin-top:0}}
/* Correcties voor de responsive beoordelingswerkbank */
.cert-assessment-progress{height:auto;background:transparent;border-radius:0;overflow:visible}.cert-assessment-progress>span,.cert-assessment-progress>strong{display:block}.cert-assessment-progress>span{font-size:.72rem;color:var(--bs-secondary-color)}.cert-assessment-progress>strong{font-size:.9rem}.cert-assessment-progress .progress{height:8px;margin-top:.45rem;background:var(--bs-tertiary-bg)}.cert-workbench>[class*="col-"]{width:auto;max-width:none;padding-left:0;padding-right:0}.cert-evidence-item details summary{cursor:pointer}.cert-evidence-item .form-label{margin-bottom:.2rem}
.cert-version-diff{display:flex;flex-direction:column;gap:.75rem}.cert-version-change{border:1px solid var(--bs-border-color);border-radius:.75rem;padding:.7rem}.cert-version-change>strong{display:block;margin-bottom:.35rem}.cert-version-change .small{padding:.35rem .45rem;border-radius:.4rem;background:var(--bs-tertiary-bg);margin-top:.3rem;max-height:150px;overflow:auto}.cert-version-change .small span{font-weight:800}
.cert-register-shortcut{display:flex;align-items:center;gap:.75rem;padding:.85rem 1rem;border:1px solid var(--bs-border-color);border-radius:.75rem;background:var(--bs-body-bg);height:100%;color:var(--bs-body-color);transition:border-color .15s ease,transform .15s ease,box-shadow .15s ease}.cert-register-shortcut:hover{border-color:var(--bs-primary);transform:translateY(-1px);box-shadow:0 .25rem .75rem rgba(0,0,0,.06)}.cert-register-shortcut>i:first-child{font-size:1.25rem;color:var(--bs-primary)}.cert-register-shortcut>div{display:flex;flex-direction:column;flex:1;min-width:0}.cert-register-shortcut span{font-size:.8rem;color:var(--bs-secondary-color)}
.cert-year-bar .form-select{min-width:10rem}

/* Certificering v2.35.1: visuele correcties cockpit en zelfbeoordeling */
.cert-assessment-summary{border:1px solid var(--bs-border-color);box-shadow:0 8px 24px rgba(15,23,42,.045);overflow:hidden}
.cert-assessment-summary .card-body{padding:.9rem 1rem}
.cert-assessment-topbar{display:grid;grid-template-columns:minmax(300px,1fr) auto auto;gap:1rem;align-items:center}
.cert-assessment-progress{min-width:0;height:auto;margin:0;background:transparent;border-radius:0;overflow:visible}
.cert-assessment-progress-head{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;margin-bottom:.55rem}
.cert-assessment-progress-head>div>span,.cert-assessment-progress-head>div>strong{display:block;height:auto;background:transparent}
.cert-assessment-progress-head>div>span{font-size:.72rem;color:var(--bs-secondary-color);line-height:1.2}
.cert-assessment-progress-head>div>strong{font-size:.92rem;color:var(--bs-body-color);line-height:1.35;margin-top:.12rem}
.cert-open-label{display:inline-flex!important;align-items:center;gap:.3rem;white-space:nowrap;padding:.28rem .5rem;border-radius:999px;background:var(--bs-tertiary-bg)!important;color:var(--bs-secondary-color);font-size:.72rem;line-height:1}
.cert-open-label strong{font-size:.78rem;color:var(--bs-body-color)}
.cert-assessment-progress .progress{height:8px;margin:0;background:var(--bs-tertiary-bg);border-radius:999px;overflow:hidden}
.cert-assessment-progress .progress-bar{border-radius:999px}
.cert-assessment-score{display:grid;grid-template-columns:repeat(2,minmax(112px,1fr));gap:.5rem}
.cert-assessment-score>div{min-width:112px;padding:.58rem .75rem;border:1px solid var(--bs-border-color);border-radius:.75rem;background:var(--bs-body-bg);text-align:left}
.cert-assessment-score span,.cert-assessment-score strong{display:block;height:auto;background:transparent}
.cert-assessment-score span{font-size:.68rem;color:var(--bs-secondary-color);line-height:1.25}
.cert-assessment-score strong{font-size:1.05rem;line-height:1.2;margin-top:.12rem}
.cert-filter-toggle{white-space:nowrap;align-self:stretch}

.cert-workbench{display:grid;grid-template-columns:238px minmax(0,1fr) 310px;gap:1rem;align-items:start}
.cert-workbench-chapters,.cert-workbench-main,.cert-workbench-side{min-width:0}
.cert-chapter-sidebar{position:sticky;top:5.5rem;max-height:calc(100vh - 7rem);overflow:hidden;padding:0;border:1px solid var(--bs-border-color);border-radius:1rem;background:var(--bs-body-bg)}
.cert-chapter-sidebar .card-header{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.8rem .85rem;background:var(--bs-body-bg);border-bottom:1px solid var(--bs-border-color)}
.cert-chapter-list{display:flex;flex-direction:column;max-height:calc(100vh - 11rem);overflow:auto;padding:.35rem}
.cert-chapter-link{display:grid;grid-template-columns:34px minmax(0,1fr) 14px;gap:.55rem;align-items:center;padding:.62rem .55rem;border-radius:.7rem;color:var(--bs-body-color);text-decoration:none;border:1px solid transparent;transition:background-color .15s ease,border-color .15s ease,box-shadow .15s ease}
.cert-chapter-link:hover{color:var(--bs-body-color);background:var(--bs-tertiary-bg);border-color:var(--bs-border-color)}
.cert-chapter-link.is-active{color:var(--bs-body-color);background:rgba(var(--bs-primary-rgb),.09);border-color:rgba(var(--bs-primary-rgb),.24);box-shadow:inset 3px 0 0 var(--bs-primary)}
.cert-chapter-code{display:grid;place-items:center;width:32px;height:32px;border-radius:.6rem;background:var(--bs-tertiary-bg);color:var(--bs-secondary-color);font-size:.72rem;font-weight:800}
.cert-chapter-link.is-active .cert-chapter-code{background:var(--bs-primary);color:#fff}
.cert-chapter-copy{min-width:0}
.cert-chapter-copy strong{display:block;font-size:.78rem;line-height:1.3;overflow-wrap:anywhere}
.cert-chapter-copy small{display:flex;flex-wrap:wrap;gap:.15rem .45rem;margin-top:.2rem;color:var(--bs-secondary-color);font-size:.65rem;line-height:1.3}
.cert-chapter-copy small span{white-space:nowrap}
.cert-chapter-link>i{font-size:.7rem;color:var(--bs-secondary-color)}
.cert-chapter-link.is-active>i{color:var(--bs-primary)}

.cert-focus-card{overflow:hidden}
.cert-focus-card .card-header{padding:.78rem .9rem}
.cert-focus-card .card-body{padding:1rem}
.cert-focus-form{padding:0}
.cert-control-question{font-size:1.08rem;line-height:1.4;margin-bottom:1rem}
.cert-explanation{font-size:.85rem}
.cert-status-option{min-width:0;padding:.75rem}
.cert-status-option span{min-width:0}
.cert-status-option strong{font-size:.86rem;margin-top:.2rem}
.cert-status-option small{line-height:1.3}
.cert-focus-card .card-footer{gap:.6rem;padding:.65rem .8rem}
.cert-focus-card .card-footer .btn{white-space:nowrap}
.cert-workbench-side{position:sticky;top:5.5rem;max-height:calc(100vh - 7rem);overflow:auto;padding-right:.15rem}
.cert-workbench-side .card{overflow:hidden}
.cert-workbench-side .card-header{padding:.75rem .85rem}
.cert-workbench-side .card-body{padding:.85rem}
.cert-evidence-list>a.cert-evidence-item{display:grid;grid-template-columns:20px minmax(0,1fr);gap:.55rem;align-items:start;color:var(--bs-body-color)}
.cert-evidence-item{overflow-wrap:anywhere}
.cert-evidence-item strong{font-size:.8rem;line-height:1.3}
.cert-evidence-item small{display:block;font-size:.68rem;line-height:1.35;color:var(--bs-secondary-color);margin-top:.12rem}
.cert-action-mini{display:block}
.cert-action-mini strong,.cert-action-mini span{display:block}
.cert-action-mini span{font-size:.7rem;color:var(--bs-secondary-color);margin-top:.2rem}

/* Cockpit: kaarten en kengetallen kloppend uitlijnen */
.cert-health-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1rem;align-items:center}
.cert-health-row strong{text-align:right}
.cert-section-tile{display:block;padding:.85rem;border:1px solid var(--bs-border-color);border-radius:.85rem;color:var(--bs-body-color);background:var(--bs-body-bg)}
.cert-section-tile>div:first-child{display:flex!important;align-items:center;justify-content:space-between;gap:.65rem}
.cert-section-tile>.cert-section-code{width:auto;height:auto;background:transparent;display:inline;color:var(--bs-primary)}
.cert-section-tile>strong{display:block;font-size:.84rem;line-height:1.35;margin-top:.55rem;min-height:2.25em}
.cert-section-tile>.progress{height:6px;margin-top:.65rem!important}
.cert-section-tile>.small{display:block;margin-top:.5rem!important;font-size:.68rem;line-height:1.35}

@media(max-width:1399.98px){
 .cert-workbench{grid-template-columns:220px minmax(0,1fr) 290px}
 .cert-status-option{padding:.65rem}
}
@media(max-width:1199.98px){
 .cert-assessment-topbar{grid-template-columns:minmax(0,1fr) auto}
 .cert-assessment-progress{grid-column:1/-1}
 .cert-filter-toggle{align-self:auto}
 .cert-workbench{grid-template-columns:220px minmax(0,1fr)}
 .cert-workbench-side{grid-column:2;position:static;max-height:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem;padding:0}
 .cert-workbench-side>.card{margin-bottom:0!important}
 .cert-workbench-side>#evidence{grid-row:span 2}
}
@media(max-width:991.98px){
 .cert-assessment-topbar{grid-template-columns:1fr auto}
 .cert-assessment-score{grid-template-columns:repeat(2,minmax(105px,1fr))}
 .cert-workbench{grid-template-columns:1fr}
 .cert-workbench-chapters,.cert-workbench-main,.cert-workbench-side{grid-column:1}
 .cert-chapter-sidebar{position:static;max-height:none}
 .cert-chapter-list{flex-direction:row;max-height:none;overflow:auto;padding:.4rem}
 .cert-chapter-link{min-width:210px}
 .cert-workbench-side{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:767.98px){
 .cert-assessment-summary .card-body{padding:.8rem}
 .cert-assessment-topbar{grid-template-columns:1fr}
 .cert-assessment-progress{grid-column:auto}
 .cert-assessment-score{grid-template-columns:repeat(2,minmax(0,1fr))}
 .cert-assessment-score>div{min-width:0}
 .cert-filter-toggle{width:100%}
 .cert-workbench-side{grid-template-columns:1fr}
 .cert-workbench-side>#evidence{grid-row:auto}
 .cert-focus-card .card-footer{flex-wrap:wrap}
 .cert-focus-card .card-footer>span{order:3;width:100%;text-align:center}
}
@media(max-width:479.98px){
 .cert-assessment-progress-head{align-items:flex-start}
 .cert-assessment-score{grid-template-columns:1fr}
 .cert-chapter-link{min-width:190px}
 .cert-focus-card .card-footer .btn{flex:1}
}
.cert-assessment-summary .cert-assessment-progress span{height:auto;background:transparent}
.cert-assessment-summary .cert-open-label{height:auto!important}
.cert-section-tile>div:first-child .cert-section-code{width:auto;height:auto;border-radius:0;background:transparent;display:inline;color:var(--bs-primary)}

/* Certificering v2.36.1: wizard- en datumherstel */
.cert-assessment-navigation{display:grid;grid-template-columns:auto minmax(150px,1fr) auto auto;align-items:center;gap:.65rem}
.cert-assessment-position{text-align:center;line-height:1.2}.cert-assessment-position strong,.cert-assessment-position small{display:block}.cert-assessment-position small{margin-top:.2rem;color:var(--bs-secondary-color);font-size:.7rem}
.cert-profile-discovery{border-color:rgba(var(--bs-primary-rgb),.22);background:linear-gradient(135deg,rgba(var(--bs-primary-rgb),.055),transparent)}
.cert-profile-discovery-icon,.cert-practical-icon{display:grid;place-items:center;flex:0 0 auto;width:46px;height:46px;border-radius:14px;background:rgba(var(--bs-primary-rgb),.12);color:var(--bs-primary);font-size:1.25rem}
.cert-practical-banner{color:var(--bs-body-color);border-color:rgba(var(--bs-primary-rgb),.22);transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease}.cert-practical-banner:hover{color:var(--bs-body-color);transform:translateY(-1px);border-color:var(--bs-primary);box-shadow:0 .5rem 1.25rem rgba(15,23,42,.07)}
.cert-practical-stats{align-items:center;color:var(--bs-secondary-color);font-size:.78rem}.cert-practical-stats span{display:flex;flex-direction:column}.cert-practical-stats strong{font-size:1rem;color:var(--bs-body-color)}
.cert-daily-kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.75rem}.cert-daily-kpi{padding:.85rem 1rem;border:1px solid var(--bs-border-color);border-radius:.85rem;background:var(--bs-body-bg)}.cert-daily-kpi span,.cert-daily-kpi strong{display:block}.cert-daily-kpi span{font-size:.72rem;color:var(--bs-secondary-color);line-height:1.25}.cert-daily-kpi strong{font-size:1.35rem;margin-top:.22rem}.cert-daily-kpi.is-warning{border-color:rgba(var(--bs-warning-rgb),.5);background:rgba(var(--bs-warning-rgb),.06)}.cert-daily-kpi.is-danger{border-color:rgba(var(--bs-danger-rgb),.45);background:rgba(var(--bs-danger-rgb),.055)}
.cert-quick-report{border-color:rgba(var(--bs-primary-rgb),.25)}.cert-daily-table thead th{font-size:.7rem;text-transform:uppercase;letter-spacing:.03em;color:var(--bs-secondary-color);white-space:nowrap}.cert-inline-check{display:grid;grid-template-columns:130px 105px minmax(145px,1fr) auto;gap:.4rem;align-items:center}.cert-employee-multiselect{min-height:9rem}
@media(max-width:1199.98px){.cert-daily-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:767.98px){.cert-assessment-navigation{grid-template-columns:1fr 1fr}.cert-assessment-position{grid-column:1/-1;grid-row:1}.cert-assessment-navigation .btn{width:100%}.cert-daily-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.cert-inline-check{grid-template-columns:1fr 1fr}.cert-inline-check input[name="observation"]{grid-column:1/-1}.cert-inline-check .btn{grid-column:1/-1}.cert-practical-stats{width:100%;justify-content:space-between}}
@media(max-width:479.98px){.cert-daily-kpis{grid-template-columns:1fr}.cert-assessment-navigation{grid-template-columns:1fr}}

/* Coolflow huisstijl v2.48 — beheeromgeving en publieke accountschermen.
   De afzonderlijke terminalpagina's laden deze stylesheet niet en blijven bewust ongewijzigd. */
:root {
  --brand-aubergine: #350640;
  --brand-aubergine-deep: #26032f;
  --brand-purple: #5a1382;
  --brand-purple-soft: rgba(90, 19, 130, .10);
  --brand-coral: #fb4b3a;
  --brand-orange: #fd7b35;
  --brand-gold: #fca922;
  --app-bg: #f7f4f8;
  --panel: rgba(255,255,255,.94);
  --border: rgba(53,6,64,.10);
  --text: #24142a;
  --muted: #756a79;
  --primary: var(--brand-purple);
  --primary-dark: var(--brand-aubergine);
  --primary-soft: var(--brand-purple-soft);
  --sidebar-surface: rgba(253,251,253,.97);
  --sidebar-line: rgba(53,6,64,.10);
  --nav-hover: rgba(90,19,130,.055);
  --nav-active: rgba(90,19,130,.10);
  --shadow: 0 18px 48px rgba(53,6,64,.09);
  --bs-primary: #5a1382;
  --bs-primary-rgb: 90,19,130;
  --bs-link-color: #5a1382;
  --bs-link-hover-color: #350640;
  --bs-focus-ring-color: rgba(90,19,130,.22);
}

body {
  color: var(--text);
  background:
    radial-gradient(circle at 0 0, rgba(90,19,130,.12), transparent 30rem),
    radial-gradient(circle at 94% 9%, rgba(251,75,58,.09), transparent 26rem),
    linear-gradient(180deg,#fdfbfd 0%,#f7f4f8 47%,#f3eef5 100%);
}

a { color: var(--brand-purple); }
a:hover { color: var(--brand-aubergine); }
.text-primary { color: var(--brand-purple) !important; }
.bg-primary { background-color: var(--brand-purple) !important; }
.border-primary { border-color: var(--brand-purple) !important; }

.app-sidebar {
  background:
    linear-gradient(180deg,rgba(255,255,255,.98),rgba(252,248,253,.97)),
    var(--sidebar-surface);
  border-right-color: rgba(53,6,64,.09);
  box-shadow: 14px 0 40px rgba(53,6,64,.055);
}
.sidebar-brand-row {
  display: grid;
  grid-template-columns: minmax(0,1fr);
  gap: .1rem;
  min-height: 76px;
  padding: .1rem .45rem .85rem;
}
.sidebar-brand-identity {
  display: inline-flex;
  width: min(100%, 210px);
  align-items: center;
  text-decoration: none;
}
.sidebar-brand-logo {
  display: block;
  width: 100%;
  height: 48px;
  object-fit: contain;
  object-position: left center;
}
.sidebar-version {
  margin: -.05rem 0 0 3.6rem;
  color: #8a778f;
  font-size: .67rem;
}
.brand { color: var(--brand-aubergine); }
.brand-mark {
  color: transparent !important;
  background-color: var(--brand-aubergine);
  background-image: url('../logo/favicon2.png');
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  box-shadow: 0 12px 26px rgba(53,6,64,.22);
}

.tenant-context {
  border-color: rgba(90,19,130,.16);
  background: linear-gradient(135deg,rgba(90,19,130,.075),rgba(251,75,58,.035));
}
.tenant-context-icon {
  color: var(--brand-purple);
  background: rgba(90,19,130,.10);
}
.tenant-context-copy span { color: #8d7b92; }
.tenant-context-copy strong { color: var(--brand-aubergine); }
.tenant-context-support { border-color: rgba(251,75,58,.20); }

.sidebar-link { color: #493d4d; }
.sidebar-link:hover {
  color: var(--brand-aubergine);
  background: rgba(90,19,130,.055);
}
.sidebar-link.active {
  color: var(--brand-aubergine);
  background: linear-gradient(90deg,rgba(90,19,130,.13),rgba(251,75,58,.055));
}
.sidebar-link.active::after { background: var(--brand-coral); }
.sidebar-link > i { color: #7b6a80; }
.sidebar-link.active > i { color: var(--brand-purple); }
.nav-group[open] {
  border-color: rgba(90,19,130,.10);
  background: rgba(255,255,255,.78);
  box-shadow: 0 7px 20px rgba(53,6,64,.035);
}
.nav-group[open] > .nav-section,
.nav-group:has(.sidebar-link.active) > .nav-section,
.nav-group.is-active-group > .nav-section {
  color: var(--brand-aubergine);
  background: rgba(90,19,130,.075);
}
.nav-group:has(.sidebar-link.active),
.nav-group.is-active-group {
  border-color: rgba(90,19,130,.14);
  background: rgba(90,19,130,.035);
}
.nav-group:has(.sidebar-link.active) .nav-section-icon,
.nav-group.is-active-group .nav-section-icon {
  color: #fff;
  background: linear-gradient(145deg,var(--brand-aubergine),var(--brand-purple));
  box-shadow: 0 7px 16px rgba(90,19,130,.20);
}
.nav-count { color: #6f3200; background: #fff0cf; }
.sidebar-user-avatar { color: var(--brand-purple); background: rgba(90,19,130,.09); }
.sidebar-user-copy strong { color: var(--brand-aubergine); }

.topbar {
  background: rgba(255,255,255,.89);
  border-bottom-color: rgba(53,6,64,.08);
  box-shadow: 0 7px 24px rgba(53,6,64,.035);
}
.page-title { color: var(--brand-aubergine); }
.page-breadcrumbs a:hover { color: var(--brand-purple); }

.card {
  border-color: rgba(53,6,64,.085);
  background: rgba(255,255,255,.95);
  box-shadow: 0 14px 38px rgba(53,6,64,.065);
}
.metric-card,
body[data-page="index"] .dash-card,
body[data-page="index"] .dash-hero,
body[data-page="index"] .quick-tile,
body[data-page="index"] .alert-row {
  border-color: rgba(53,6,64,.09);
}
body[data-page="index"] .dash-card:hover,
body[data-page="index"] .quick-tile:hover {
  border-color: rgba(90,19,130,.25);
  background: #fdf9fe;
  box-shadow: 0 12px 30px rgba(90,19,130,.10);
}
body[data-page="index"] .health-ring {
  background: conic-gradient(var(--brand-coral) calc(var(--p)*1%),#eadfeb 0);
}

.btn-primary {
  color: #fff;
  border-color: transparent;
  background: linear-gradient(135deg,var(--brand-coral),var(--brand-orange));
  box-shadow: 0 11px 24px rgba(251,75,58,.20);
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
  color: #fff !important;
  border-color: transparent !important;
  background: linear-gradient(135deg,#ef3f31,#f66a2c) !important;
  box-shadow: 0 13px 28px rgba(251,75,58,.25) !important;
}
.btn-outline-primary {
  color: var(--brand-purple);
  border-color: rgba(90,19,130,.34);
  background: rgba(255,255,255,.72);
}
.btn-outline-primary:hover,
.btn-outline-primary:focus {
  color: #fff;
  border-color: var(--brand-purple);
  background: var(--brand-purple);
}
.btn-link { color: var(--brand-purple); }
.btn-check:checked + .btn-outline-primary { color:#fff; border-color:var(--brand-purple); background:var(--brand-purple); }
.progress-bar { background: linear-gradient(90deg,var(--brand-purple),var(--brand-coral)); }
.pagination { --bs-pagination-active-bg: var(--brand-purple); --bs-pagination-active-border-color: var(--brand-purple); }
.nav-tabs .nav-link.active { color: var(--brand-aubergine); border-bottom-color: var(--brand-coral); }

.form-control:focus,
.form-select:focus,
.form-check-input:focus {
  border-color: rgba(90,19,130,.55);
  box-shadow: 0 0 0 .22rem rgba(90,19,130,.12);
}
.form-check-input:checked { border-color: var(--brand-purple); background-color: var(--brand-purple); }
.table-hover tbody tr:hover > * { background: rgba(90,19,130,.035); }
.badge-soft,
.filter-chip,
.employee-filter-chip {
  color: var(--brand-purple);
  background: rgba(90,19,130,.09);
}
.empty-state-icon,
.employee-section-icon {
  color: var(--brand-purple);
  background: rgba(90,19,130,.09);
}

.login-page-pro {
  background:
    radial-gradient(circle at 10% 10%,rgba(252,169,34,.20),transparent 24rem),
    radial-gradient(circle at 88% 15%,rgba(251,75,58,.17),transparent 28rem),
    linear-gradient(145deg,#23022d 0%,#350640 52%,#521072 100%);
}
.login-shell {
  border-color: rgba(255,255,255,.18);
  box-shadow: 0 34px 100px rgba(18,0,23,.38);
}
.login-showcase {
  background:
    radial-gradient(circle at 18% 16%,rgba(252,169,34,.33),transparent 14rem),
    radial-gradient(circle at 86% 72%,rgba(251,75,58,.28),transparent 20rem),
    linear-gradient(145deg,rgba(38,3,47,.96),rgba(90,19,130,.90));
}
.login-showcase::before { background: rgba(251,75,58,.12); }
.login-showcase::after { background: rgba(252,169,34,.11); }
.login-showcase-icon {
  display: block;
  width: 82px;
  height: 82px;
  margin: 0 0 1.15rem;
  border-radius: 24px;
  box-shadow: 0 18px 42px rgba(0,0,0,.24);
}
.login-showcase h1 { max-width: 620px; }
.login-eyebrow { border-color: rgba(252,169,34,.38); background: rgba(252,169,34,.11); }
.login-points span { border-color: rgba(255,255,255,.16); background: rgba(255,255,255,.10); }
.login-shell .login-panel {
  background:
    radial-gradient(circle at 100% 0,rgba(251,75,58,.08),transparent 18rem),
    radial-gradient(circle at 0 100%,rgba(90,19,130,.07),transparent 20rem),
    #fff;
}
.login-brand-logo {
  display: block;
  width: min(100%, 285px);
  height: auto;
  margin: 0 auto;
}
.login-card { border-color: rgba(53,6,64,.09); box-shadow: 0 18px 44px rgba(53,6,64,.08); }
.login-card .btn-primary { background: linear-gradient(135deg,var(--brand-coral),var(--brand-orange)); }

@media (max-width: 991.98px) {
  .sidebar-brand-logo { height: 46px; }
}
@media (max-width: 575.98px) {
  .login-page-pro { padding: 0; }
  .login-shell { border-radius: 0; }
  .login-showcase { min-height: 280px; }
  .login-showcase-icon { width: 66px; height: 66px; border-radius: 20px; }
}

.public-flow-page {
  min-height: 100vh;
  background:
    radial-gradient(circle at 0 0,rgba(90,19,130,.13),transparent 26rem),
    radial-gradient(circle at 100% 8%,rgba(251,75,58,.10),transparent 24rem),
    linear-gradient(180deg,#fdfbfd,#f4eef5);
}
.public-flow-container > .card { background: rgba(255,255,255,.97); }
.public-flow-brand {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1.25rem;
  padding: .75rem 1rem;
  border: 1px solid rgba(53,6,64,.09);
  border-radius: 18px;
  background: rgba(255,255,255,.88);
  box-shadow: 0 12px 34px rgba(53,6,64,.06);
}
.public-flow-brand img { width: 205px; height: 52px; object-fit: contain; object-position: left center; }
.public-flow-brand span { color: #786d7c; font-size: .8rem; font-weight: 800; text-align: right; }
@media (max-width: 480px) {
  .public-flow-brand { align-items: flex-start; flex-direction: column; }
  .public-flow-brand span { text-align: left; }
}


.login-page-centered-only {
  place-items: center;
  padding: clamp(1.25rem, 3vw, 2.5rem);
}
.login-panel-centered-shell {
  width: min(100%, 470px);
  padding: clamp(1.5rem, 4vw, 2.5rem);
  border-radius: 32px;
  background:
    radial-gradient(circle at 0 0, rgba(251,75,58,.08), transparent 14rem),
    radial-gradient(circle at 100% 100%, rgba(90,19,130,.08), transparent 16rem),
    rgba(255,255,255,.96);
  box-shadow: 0 34px 100px rgba(18,0,23,.34);
  border: 1px solid rgba(255,255,255,.22);
}
.login-panel-centered-shell .login-card {
  border-color: rgba(53,6,64,.08);
  box-shadow: 0 16px 36px rgba(53,6,64,.08);
}
.mfa-qr-wrap {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
}
.mfa-qr-code {
  width: 196px;
  min-height: 196px;
  padding: 10px;
  border-radius: 18px;
  background: #fff;
  border: 1px solid rgba(53,6,64,.10);
  box-shadow: 0 12px 28px rgba(53,6,64,.08);
}
.mfa-qr-code img,
.mfa-qr-code canvas {
  display: block;
  margin: 0 auto;
}
@media (max-width: 575.98px) {
  .login-page-centered-only {
    padding: .9rem;
  }
  .login-panel-centered-shell {
    border-radius: 24px;
    padding: 1.15rem;
  }
  .mfa-qr-code {
    width: 180px;
    min-height: 180px;
  }
}


/* v2.49.10 - sobere, gecentreerde MFA-setup */
.mfa-setup-shell {
  width: min(100%, 560px);
  padding: clamp(1.35rem, 3vw, 2rem);
  border-radius: 30px;
  background:
    radial-gradient(circle at 0 0, rgba(251,75,58,.055), transparent 13rem),
    radial-gradient(circle at 100% 100%, rgba(90,19,130,.055), transparent 15rem),
    rgba(255,255,255,.97);
  border: 1px solid rgba(255,255,255,.28);
  box-shadow: 0 34px 100px rgba(18,0,23,.34);
}
.mfa-setup-brand {
  text-align: center;
  margin-bottom: 1.25rem;
}
.mfa-setup-brand .login-brand-logo {
  width: min(100%, 230px);
  margin-bottom: .65rem;
}
.mfa-setup-brand h1 {
  margin: 0;
  color: #2c0736;
  font-size: clamp(1.55rem, 4vw, 2rem);
  font-weight: 850;
  letter-spacing: -.035em;
}
.mfa-setup-brand p {
  margin: .4rem auto 0;
  max-width: 430px;
  color: #766d79;
  font-size: .91rem;
}
.mfa-setup-notice {
  display: flex;
  align-items: center;
  gap: .75rem;
  margin-bottom: 1rem;
  padding: .85rem 1rem;
  border-radius: 16px;
  background: rgba(252,169,34,.14);
  color: #70410a;
}
.mfa-setup-notice-icon {
  flex: 0 0 34px;
  width: 34px;
  height: 34px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background: rgba(252,169,34,.22);
  font-weight: 900;
}
.mfa-setup-notice strong,
.mfa-setup-notice span { display: block; }
.mfa-setup-notice span { margin-top: .08rem; font-size: .84rem; opacity: .83; }
.mfa-setup-card {
  padding: clamp(1rem, 3vw, 1.35rem);
  border: 1px solid rgba(53,6,64,.09);
  border-radius: 22px;
  background: rgba(255,255,255,.95);
  box-shadow: 0 14px 34px rgba(53,6,64,.07);
}
.mfa-account-row {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  padding-bottom: 1rem;
  margin-bottom: 1.15rem;
  border-bottom: 1px solid rgba(53,6,64,.08);
}
.mfa-account-label { color: #766d79; font-size: .73rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; }
.mfa-account-name { margin-top: .1rem; color: #2c0736; font-weight: 800; overflow-wrap: anywhere; }
.mfa-step-heading {
  display: flex;
  align-items: flex-start;
  gap: .75rem;
  margin-bottom: .9rem;
}
.mfa-step-number {
  flex: 0 0 32px;
  width: 32px;
  height: 32px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: #fff;
  background: #5a1382;
  font-size: .85rem;
  font-weight: 900;
  box-shadow: 0 7px 18px rgba(90,19,130,.18);
}
.mfa-step-heading h2,
.mfa-start-state h2,
.mfa-done-state h2 {
  margin: 0;
  color: #2c0736;
  font-size: 1.06rem;
  font-weight: 850;
}
.mfa-step-heading p,
.mfa-start-state p,
.mfa-done-state p {
  margin: .18rem 0 0;
  color: #766d79;
  font-size: .86rem;
}
.mfa-qr-primary {
  display: flex;
  justify-content: center;
  margin: .2rem 0 .85rem;
}
.mfa-qr-code-large {
  width: 244px;
  min-height: 244px;
  padding: 11px;
  border-radius: 20px;
  box-shadow: none;
  border-color: rgba(53,6,64,.12);
}
.mfa-manual-key {
  border: 1px solid rgba(53,6,64,.08);
  border-radius: 14px;
  background: #fbf9fc;
  overflow: hidden;
}
.mfa-manual-key summary {
  cursor: pointer;
  padding: .75rem .9rem;
  color: #5a1382;
  font-weight: 800;
  font-size: .85rem;
  list-style-position: inside;
}
.mfa-manual-key-body {
  padding: 0 .9rem .9rem;
}
.mfa-secret-row {
  display: flex;
  align-items: center;
  gap: .55rem;
  flex-wrap: wrap;
}
.mfa-secret-row code {
  flex: 1 1 250px;
  min-width: 0;
  padding: .6rem .7rem;
  border-radius: 10px;
  background: #fff;
  border: 1px solid rgba(53,6,64,.08);
  color: #d73572;
  font-size: .88rem;
  overflow-wrap: anywhere;
}
.mfa-step-divider {
  height: 1px;
  margin: 1.15rem 0;
  background: rgba(53,6,64,.08);
}
.mfa-code-form {
  max-width: 360px;
  margin: 0 auto;
}
.mfa-code-input {
  margin-bottom: .75rem;
  min-height: 58px !important;
  font-size: 1.5rem;
  font-weight: 800;
  letter-spacing: .22em;
  color: #2c0736;
}
.mfa-start-state,
.mfa-done-state {
  text-align: center;
  padding: .4rem 0 .15rem;
}
.mfa-start-state .mfa-step-number,
.mfa-done-mark {
  margin: 0 auto .75rem;
}
.mfa-done-mark {
  width: 48px;
  height: 48px;
  display: grid;
  place-items: center;
  border-radius: 50%;
  color: #fff;
  background: #17834e;
  font-weight: 900;
  font-size: 1.2rem;
}
.mfa-start-state p,
.mfa-done-state p { margin: .35rem auto 1rem; max-width: 390px; }
.mfa-setup-footer { text-align: center; padding-top: .9rem; font-size: .86rem; }
.mfa-setup-footer a { color: rgba(255,255,255,.85); text-decoration: none; }
.mfa-setup-footer a:hover { color: #fff; text-decoration: underline; }
@media (max-width: 575.98px) {
  .mfa-setup-shell {
    border-radius: 24px;
    padding: 1rem;
  }
  .mfa-setup-card { padding: 1rem; }
  .mfa-account-row { align-items: flex-start; }
  .mfa-qr-code-large { width: 224px; min-height: 224px; }
}

/* Certification workplace instructions */
.cert-instruction-dashboard-banner{color:var(--bs-body-color);border-color:rgba(var(--bs-success-rgb),.28);background:linear-gradient(135deg,rgba(var(--bs-success-rgb),.045),rgba(var(--bs-primary-rgb),.035));transition:transform .15s ease,border-color .15s ease,box-shadow .15s ease}.cert-instruction-dashboard-banner:hover{color:var(--bs-body-color);transform:translateY(-1px);border-color:rgba(var(--bs-success-rgb),.65);box-shadow:0 .5rem 1.25rem rgba(15,23,42,.07)}
.cert-instruction-hero{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(330px,.9fr);gap:1rem;align-items:stretch;padding:1.35rem;border:1px solid rgba(var(--bs-primary-rgb),.2);border-radius:1rem;background:linear-gradient(135deg,rgba(var(--bs-primary-rgb),.09),rgba(var(--bs-success-rgb),.055));overflow:hidden;position:relative}.cert-instruction-hero:after{content:"";position:absolute;width:220px;height:220px;border-radius:50%;right:-95px;top:-125px;background:rgba(var(--bs-primary-rgb),.055)}.cert-instruction-hero-copy,.cert-instruction-kpis{position:relative;z-index:1}.cert-instruction-hero-copy p{max-width:780px;color:var(--bs-secondary-color)}.cert-instruction-kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.65rem}.cert-instruction-kpis>div{border:1px solid rgba(var(--bs-primary-rgb),.13);background:rgba(var(--bs-body-bg-rgb),.82);border-radius:.85rem;padding:.85rem}.cert-instruction-kpis strong,.cert-instruction-kpis span{display:block}.cert-instruction-kpis strong{font-size:1.25rem;line-height:1.15}.cert-instruction-kpis span{margin-top:.2rem;font-size:.72rem;color:var(--bs-secondary-color);line-height:1.2}
.cert-instruction-printbar{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem}.cert-instruction-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}.cert-instruction-card{border:1px solid var(--bs-border-color);border-radius:1rem;background:var(--bs-body-bg);overflow:hidden;box-shadow:0 .12rem .6rem rgba(15,23,42,.035)}.cert-instruction-card.is-confirmed{border-color:rgba(var(--bs-success-rgb),.38)}.cert-instruction-card-head{display:flex;gap:.8rem;align-items:flex-start;padding:1rem 1rem .75rem;border-bottom:1px solid var(--bs-border-color-translucent)}.cert-instruction-icon{width:42px;height:42px;flex:0 0 42px;border-radius:.8rem;display:grid;place-items:center;background:rgba(var(--bs-primary-rgb),.09);color:var(--bs-primary);font-size:1.15rem}.cert-instruction-check{color:var(--bs-success);font-size:1.35rem}.cert-instruction-body{padding:1rem}.cert-control-tags{display:flex;flex-wrap:wrap;gap:.35rem}.cert-control-tags span{font-size:.69rem;font-weight:700;color:var(--bs-secondary-color);border:1px solid var(--bs-border-color);border-radius:999px;padding:.22rem .48rem;background:var(--bs-tertiary-bg)}.cert-instruction-confirmed{padding:.7rem .8rem;border-radius:.7rem;background:rgba(var(--bs-success-rgb),.075);border:1px solid rgba(var(--bs-success-rgb),.18)}.cert-instruction-confirmed .small{margin-top:.15rem;color:var(--bs-secondary-color)}.cert-instruction-card-foot{padding:.85rem 1rem 1rem;background:var(--bs-tertiary-bg);border-top:1px solid var(--bs-border-color-translucent)}.cert-language-checks{display:flex;flex-wrap:wrap;gap:.55rem}.cert-language-checks label{display:flex;align-items:center;gap:.4rem;border:1px solid var(--bs-border-color);border-radius:.7rem;padding:.55rem .7rem;background:var(--bs-body-bg);cursor:pointer}.cert-audit-mini-list{padding-left:1.2rem;margin:0 0 1rem}.cert-audit-mini-list li{margin-bottom:.65rem;padding-left:.15rem}.cert-audit-mini-list li:last-child{margin-bottom:0}
@media(max-width:1199.98px){.cert-instruction-hero{grid-template-columns:1fr}.cert-instruction-kpis{max-width:650px}.cert-instruction-grid{grid-template-columns:1fr}}
@media(max-width:767.98px){.cert-instruction-kpis{grid-template-columns:1fr}.cert-instruction-printbar{align-items:stretch}.cert-instruction-printbar>div:last-child{width:100%}.cert-instruction-printbar select{width:100%!important}.cert-instruction-card-foot form.d-flex{align-items:stretch!important;flex-direction:column}.cert-instruction-card-foot form.d-flex .btn{width:100%}}
.cert-instruction-confirmed.is-outdated{background:rgba(var(--bs-warning-rgb),.08);border-color:rgba(var(--bs-warning-rgb),.3)}

/* GLOBALG.A.P. GRASP v2 */
.grasp-hero{display:flex;align-items:center;justify-content:space-between;gap:1.25rem;padding:1.35rem 1.5rem;border:1px solid rgba(var(--bs-primary-rgb),.18);border-radius:1rem;background:linear-gradient(135deg,rgba(var(--bs-primary-rgb),.075),rgba(var(--bs-info-rgb),.04));position:relative;overflow:hidden}.grasp-hero:after{content:"";position:absolute;width:240px;height:240px;border-radius:50%;right:-100px;top:-145px;background:rgba(var(--bs-primary-rgb),.05)}.grasp-hero>div{position:relative;z-index:1}.grasp-hero h2{font-size:1.35rem;margin:.2rem 0 .35rem}.grasp-hero p{margin:0;color:var(--bs-secondary-color);max-width:850px}.grasp-hero.is-ready{border-color:rgba(var(--bs-success-rgb),.35);background:linear-gradient(135deg,rgba(var(--bs-success-rgb),.07),rgba(var(--bs-primary-rgb),.035))}.grasp-hero-score{min-width:120px;text-align:center;padding:.8rem 1rem;border-radius:.9rem;background:rgba(var(--bs-body-bg-rgb),.86);border:1px solid var(--bs-border-color-translucent)}.grasp-hero-score strong,.grasp-hero-score span,.grasp-hero-score small{display:block}.grasp-hero-score strong{font-size:1.7rem;line-height:1}.grasp-hero-score span{font-size:.8rem;font-weight:700;margin-top:.25rem}.grasp-hero-score small{color:var(--bs-secondary-color);margin-top:.25rem}
.grasp-signal-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}.grasp-signal{display:flex;align-items:center;gap:.85rem;padding:.85rem;border:1px solid var(--bs-border-color);border-radius:.85rem;text-decoration:none;color:var(--bs-body-color);transition:border-color .15s ease,transform .15s ease}.grasp-signal:hover{color:var(--bs-body-color);border-color:rgba(var(--bs-primary-rgb),.45);transform:translateY(-1px)}.grasp-signal>i{width:38px;height:38px;display:grid;place-items:center;border-radius:.75rem;background:rgba(var(--bs-primary-rgb),.08);color:var(--bs-primary);font-size:1.05rem}.grasp-signal strong,.grasp-signal span,.grasp-signal small{display:block}.grasp-signal strong{font-size:1.15rem;line-height:1}.grasp-signal span{font-size:.83rem;font-weight:700;margin-top:.18rem}.grasp-signal small{font-size:.72rem;color:var(--bs-secondary-color);margin-top:.12rem}
.grasp-section-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.8rem}.grasp-section-tile{display:flex;flex-direction:column;gap:.6rem;padding:.9rem;border:1px solid var(--bs-border-color);border-radius:.85rem;color:var(--bs-body-color);text-decoration:none}.grasp-section-tile:hover{color:var(--bs-body-color);border-color:rgba(var(--bs-primary-rgb),.45)}.grasp-section-tile strong{font-size:.83rem;line-height:1.25}.grasp-section-tile small{color:var(--bs-secondary-color);font-size:.72rem}.grasp-section-tile .progress{height:5px}
.grasp-assessment-layout{display:grid;grid-template-columns:255px minmax(0,1fr);gap:1rem;align-items:start}.grasp-chapters{position:sticky;top:78px;max-height:calc(100vh - 96px);overflow:auto}.grasp-chapters .list-group-item{padding:.65rem .7rem}.grasp-chapter-code{width:32px;min-width:32px;height:32px;display:grid;place-items:center;border-radius:.55rem;background:var(--bs-tertiary-bg);font-weight:800;font-size:.76rem}.grasp-chapters .list-group-item.active .grasp-chapter-code{background:rgba(255,255,255,.16);color:#fff}.grasp-control-card .card-header{background:var(--bs-tertiary-bg)}.grasp-status-choice{display:flex;align-items:center;height:100%;border:1px solid var(--bs-border-color);border-radius:.75rem;padding:.65rem .7rem;cursor:pointer;background:var(--bs-body-bg)}.grasp-status-choice:has(input:checked){border-color:rgba(var(--bs-primary-rgb),.5);box-shadow:0 0 0 2px rgba(var(--bs-primary-rgb),.07)}.grasp-status-choice input{margin-right:.55rem}.grasp-status-choice span{display:flex;align-items:center;gap:.4rem;font-size:.82rem}.grasp-status-choice i{font-size:1rem}
.grasp-worker-table td{vertical-align:middle}.grasp-worker-table .table-warning>td{background-color:rgba(var(--bs-warning-rgb),.055)}.grasp-audit-facts>div{display:flex;flex-direction:column;gap:.2rem}.grasp-audit-facts span{font-size:.72rem;text-transform:uppercase;letter-spacing:.035em;color:var(--bs-secondary-color);font-weight:700}.grasp-audit-facts strong{font-size:.9rem}.grasp-audit-facts small{color:var(--bs-secondary-color)}.grasp-audit-score{height:100%;padding:.8rem;border:1px solid var(--bs-border-color);border-radius:.8rem}.grasp-audit-score span,.grasp-audit-score strong,.grasp-audit-score small{display:block}.grasp-audit-score span{font-size:.72rem;text-transform:uppercase;color:var(--bs-secondary-color);font-weight:700}.grasp-audit-score strong{font-size:1.45rem;margin:.15rem 0}.grasp-audit-score small{color:var(--bs-secondary-color)}
@media(max-width:1199.98px){.grasp-section-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.grasp-assessment-layout{grid-template-columns:1fr}.grasp-chapters{position:static;max-height:none}.grasp-chapters .list-group{display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:767.98px){.grasp-hero{align-items:flex-start;flex-direction:column}.grasp-hero-score{width:100%}.grasp-signal-grid,.grasp-section-grid,.grasp-chapters .list-group{grid-template-columns:1fr}.grasp-status-choice{padding:.55rem}.grasp-worker-table{min-width:900px}}
@media print{.grasp-no-print{display:none!important}.grasp-audit-pack .card{break-inside:auto;box-shadow:none}.grasp-audit-pack .card-header{background:#fff!important}.grasp-audit-cover{break-after:page}.grasp-audit-controls tr{break-inside:avoid}.grasp-worker-table{font-size:.78rem}.grasp-audit-pack{font-size:.84rem}.grasp-audit-pack h1{font-size:1.7rem}.grasp-audit-pack .table{font-size:.76rem}}

/* Mobile application shell
   Alleen pagina's die via _header.php lopen krijgen deze regels. Publieke,
   print-, scanner- en terminalschermen behouden daarmee hun eigen weergave. */
.app-body {
  overflow-x: hidden;
}
.app-body .topbar-heading,
.app-body .topbar-title-copy,
.app-body .topbar-actions {
  min-width: 0;
}
.app-body .mobile-menu-btn {
  width: 42px;
  height: 42px;
  flex: 0 0 42px;
  align-items: center;
  justify-content: center;
  padding: 0;
  border-radius: 12px;
  font-size: 1.25rem;
}
.app-body .table-responsive {
  max-width: 100%;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-inline: contain;
  scrollbar-width: thin;
}

@media (max-width: 991.98px) {
  .app-body.sidebar-open {
    overflow: hidden;
    touch-action: none;
  }
  .app-body.sidebar-open .app-sidebar {
    touch-action: pan-y;
  }
  .app-body .app-sidebar {
    width: min(92vw, 340px);
    max-width: 340px;
    height: 100dvh;
    outline: 0;
    box-shadow: 22px 0 52px rgba(24, 16, 31, .22);
  }
  .app-body .sidebar-inner {
    height: 100dvh;
    padding-top: max(.8rem, env(safe-area-inset-top));
    padding-bottom: max(.6rem, env(safe-area-inset-bottom));
  }
  .app-body .sidebar-link,
  .app-body .nav-section,
  .app-body .tenant-context-actions a,
  .app-body .tenant-context-actions button {
    min-height: 46px;
  }
  .app-body .sidebar-backdrop {
    background: rgba(31, 18, 36, .48);
    backdrop-filter: blur(2px);
  }
  .app-body .topbar {
    display: grid !important;
    grid-template-columns: minmax(0, 1fr);
    align-items: stretch !important;
    gap: .65rem !important;
    min-height: 0;
    padding: .7rem .85rem !important;
  }
  .app-body .topbar-heading {
    width: 100%;
  }
  .app-body .topbar-title-copy {
    flex: 1 1 auto;
  }
  .app-body .topbar .page-title {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  .app-body .topbar .page-subtitle {
    display: -webkit-box;
    overflow: hidden;
    max-width: none;
    line-height: 1.25;
    white-space: normal;
    text-overflow: clip;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }
  .app-body .topbar-actions {
    width: 100%;
    max-width: 100%;
    flex-wrap: nowrap !important;
    justify-content: flex-start !important;
    overflow-x: auto;
    overflow-y: hidden;
    padding-bottom: .15rem;
    scrollbar-width: none;
    scroll-snap-type: x proximity;
    -webkit-overflow-scrolling: touch;
  }
  .app-body .topbar-actions::-webkit-scrollbar {
    display: none;
  }
  .app-body .topbar-actions > * {
    flex: 0 0 auto !important;
    scroll-snap-align: start;
  }
  .app-body .topbar-actions .btn {
    min-height: 44px;
    white-space: nowrap;
  }
  .app-body .content-wrap {
    width: 100%;
    max-width: none;
    padding: 1rem !important;
  }
  .app-body .app-content > .px-4 {
    padding-right: 1rem !important;
    padding-left: 1rem !important;
  }
}

@media (max-width: 767.98px) {
  .app-body {
    font-size: .94rem;
  }
  .app-body .topbar {
    padding-right: max(.75rem, env(safe-area-inset-right)) !important;
    padding-left: max(.75rem, env(safe-area-inset-left)) !important;
  }
  .app-body .mobile-menu-btn {
    width: 44px;
    height: 44px;
    flex-basis: 44px;
  }
  .app-body .page-title {
    font-size: 1rem;
  }
  .app-body .page-subtitle {
    margin-top: .1rem;
    font-size: .78rem;
  }
  .app-body .page-breadcrumbs {
    display: none;
  }
  .app-body .topbar-actions {
    width: calc(100% + 1.5rem);
    max-width: none;
    margin-right: -.75rem;
    margin-left: -.75rem;
    padding-right: .75rem;
    padding-left: .75rem;
  }
  .app-body .topbar-actions .btn {
    flex: 0 0 auto !important;
  }
  .app-body .content-wrap {
    padding: .75rem !important;
  }
  .app-body .app-content > .px-4 {
    padding-right: .75rem !important;
    padding-left: .75rem !important;
  }
  .app-body .app-content > .pt-3 {
    padding-top: .75rem !important;
  }
  .app-body .row {
    --bs-gutter-x: 1rem;
  }
  .app-body .row.g-4,
  .app-body .row.gx-4 {
    --bs-gutter-x: 1rem;
  }
  .app-body .row.g-4,
  .app-body .row.gy-4 {
    --bs-gutter-y: 1rem;
  }
  .app-body .card {
    border-radius: 15px;
  }
  .app-body .card.p-4,
  .app-body .card-body.p-4,
  .app-body .card-header.p-4,
  .app-body .modal-body.p-4,
  .app-body .modal-header.p-4,
  .app-body .modal-footer.p-4 {
    padding: 1rem !important;
  }
  .app-body .card.p-3,
  .app-body .card-body.p-3,
  .app-body .card-header.p-3 {
    padding: .9rem !important;
  }
  .app-body .card-header.d-flex {
    align-items: flex-start !important;
    flex-wrap: wrap;
    gap: .65rem !important;
  }
  .app-body .card-header.d-flex > .d-flex,
  .app-body .card-body > .d-flex:not(.input-group),
  .app-body .alert.d-flex {
    max-width: 100%;
    flex-wrap: wrap;
  }
  .app-body .alert {
    padding: .85rem;
    border-radius: 13px;
  }
  .app-body .alert .btn {
    min-height: 44px;
  }
  .app-body .form-control,
  .app-body .form-select,
  .app-body .input-group > .btn,
  .app-body .btn {
    min-height: 44px;
  }
  .app-body .form-control,
  .app-body .form-select {
    font-size: 16px;
  }
  .app-body textarea.form-control {
    min-height: 112px;
  }
  .app-body .form-switch {
    min-height: 44px;
    display: flex;
    align-items: center;
  }
  .app-body .form-switch .form-check-input {
    min-height: 1.35rem;
    margin-top: 0;
    flex: 0 0 2.5rem;
  }
  .app-body .btn-group,
  .app-body .input-group,
  .app-body .pagination,
  .app-body .nav-tabs {
    max-width: 100%;
  }
  .app-body .nav-tabs {
    margin-right: -.75rem;
    margin-left: -.75rem;
    padding-right: .75rem;
    padding-left: .75rem;
  }
  .app-body .dropdown-menu {
    max-width: calc(100vw - 1.5rem);
  }
  .app-body .modal-dialog {
    margin: .6rem;
  }
  .app-body .modal-content {
    max-height: calc(100dvh - 1.2rem);
    border-radius: 16px;
  }
  .app-body .modal-body {
    overflow-y: auto;
    overscroll-behavior: contain;
  }
  .app-body .modal-footer {
    gap: .5rem;
  }
  .app-body .table-responsive:not([data-mobile-cards]) {
    margin-right: -.25rem;
    margin-left: -.25rem;
    padding-right: .25rem;
    padding-left: .25rem;
  }
  .app-body .table-responsive:not([data-mobile-cards]) .table {
    margin-bottom: .35rem;
  }
  .app-body .table > :not(caption) > * > * {
    padding: .65rem .7rem;
  }
  .app-body .ui-mobile-table tbody td {
    grid-template-columns: minmax(92px, 36%) minmax(0, 1fr);
    gap: .6rem;
  }
  .app-body .pagination {
    flex-wrap: wrap;
    row-gap: .35rem;
  }
  .app-body .ui-dirty-bar {
    right: .75rem;
    bottom: max(.75rem, env(safe-area-inset-bottom));
    left: .75rem;
  }
}

@media (max-width: 575.98px) {
  .app-body .card-header.d-flex > .d-flex,
  .app-body .card-header.d-flex > form.d-flex,
  .app-body .card-header .btn-group {
    width: 100%;
  }
  .app-body .card-header .btn-group {
    overflow-x: auto;
    scrollbar-width: none;
  }
  .app-body .card-header .btn-group::-webkit-scrollbar {
    display: none;
  }
  .app-body .modal-footer {
    align-items: stretch;
    flex-direction: column-reverse;
  }
  .app-body .modal-footer .btn {
    width: 100%;
    margin: 0;
  }
  .app-body .ui-mobile-table tbody tr {
    border-radius: 14px;
    padding: .4rem .7rem;
  }
}