:root {
  --bg: #f4f7fb;
  --card: #ffffff;
  --line: #d6dde7;
  --line-strong: #c1ccda;
  --text: #243246;
  --muted: #74839a;
  --primary: #37a2e6;
  --primary-dark: #2287c7;
  --green: #2fbb49;
  --red: #e3263b;
  --pink: #d41b89;
  --purple: #7641ba;
  --yellow: #f0b400;
  --chip: #fbfdff;
  --shadow: 0 8px 24px rgba(27, 43, 65, 0.05);
  --radius: 16px;
}
.po-correction-row td{background:#fff8e8!important;border-top:2px solid #edcf83}.po-correction-row strong{color:#78560b}
.po-check-page{max-width:1100px;margin:0 auto}.po-check-item{padding:11px 13px;margin:7px 0;border-radius:10px;font-weight:750}.po-check-item.block{background:#ffe9e9;color:#9c2929}.po-check-item.warning{background:#fff5d9;color:#805c0e}.po-check-item.ok{background:#e8f7ee;color:#217247}.po-final-approve{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:16px;border:2px solid #55a97b;border-radius:14px;background:#f1fbf5}.po-final-approve label{display:flex;gap:9px;align-items:center;font-weight:800}@media(max-width:700px){.po-final-approve{align-items:stretch;flex-direction:column}}
.audit-page{max-width:1250px;margin:0 auto}.audit-filters{display:grid;grid-template-columns:2fr 1fr 1fr auto auto;gap:10px;align-items:end;margin-bottom:14px;padding:14px}.audit-filters label{display:grid;gap:5px;font-size:.72rem;font-weight:800}.audit-filters input,.audit-filters select{min-height:38px;border:1px solid #ccd8e4;border-radius:9px;padding:7px 9px}.audit-timeline{display:grid;gap:9px}.audit-entry{padding:14px;border-left:4px solid #3b9cd3}.audit-entry-head{display:flex;justify-content:space-between;gap:16px}.audit-entry-head>div{display:flex;flex-direction:column;gap:3px}.audit-entry-head>div:last-child{text-align:right}.audit-entry-head small,.audit-entry-head time{color:#748397;font-size:.68rem}.audit-action{color:#1a74a7;font-size:.67rem;font-weight:900;text-transform:uppercase}.audit-entry details{margin-top:10px;border-top:1px solid #e4ebf1;padding-top:8px}.audit-entry summary{cursor:pointer;color:#4b6175;font-size:.72rem;font-weight:800}.audit-change-grid{display:grid;grid-template-columns:minmax(130px,.7fr) 1fr 1fr;gap:1px;margin-top:8px;background:#dfe7ee;border:1px solid #dfe7ee}.audit-change-grid>*{padding:7px;background:#fff;overflow-wrap:anywhere;font-size:.68rem}.audit-change-grid b{background:#f3f6f9}.audit-change-grid code{font-family:inherit;color:#42566a}@media(max-width:850px){.audit-filters{grid-template-columns:1fr 1fr}.audit-filters label:first-child{grid-column:1/-1}.audit-entry-head{flex-direction:column}.audit-entry-head>div:last-child{text-align:left}.audit-change-grid{grid-template-columns:1fr}.audit-change-grid b{display:none}}
.publication-state-line{display:flex;gap:5px;align-items:center;flex-wrap:wrap;margin-bottom:2px}.publication-state,.publication-proof{display:inline-flex;padding:3px 6px;border-radius:999px;font-size:8px;font-weight:900;text-transform:uppercase;letter-spacing:.03em}.publication-state{background:#eaf0f6;color:#4d6177}.publication-gewijzigd-na-publicatie .publication-state{background:#ffe6cf;color:#9a4b08}.publication-proof.seen{background:#e8f3ff;color:#226aa0}.publication-proof.confirmed{background:#e4f7eb;color:#197044}.publication-ack-actions{display:flex;gap:6px;margin-top:8px;padding-top:8px;border-top:1px solid #e7edf2}.publication-ack-actions .mobile-mini{flex:1}.publication-gewijzigd-na-publicatie{box-shadow:inset 4px 0 #e7791b}
.delivery-summary{display:flex;gap:7px;flex-wrap:wrap}.delivery-summary span,.delivery-status{display:inline-flex;padding:5px 8px;border-radius:999px;background:#eef2f6;color:#53657a;font-size:.68rem;font-weight:800}.delivery-summary .ok,.delivery-status.ok{background:#e8f7ee;color:#217247}.delivery-summary .danger,.delivery-status.danger{background:#ffe9e9;color:#a62c2c}.delivery-status.waiting{background:#fff5d9;color:#805c0e}.notification-delivery-card{margin-top:14px}.notification-delivery-card td small{color:#6b7b8d}.notification-delivery-card td strong,.notification-delivery-card td small{display:block}
.roster-sticky-toolbar{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;gap:8px 14px}.roster-sticky-toolbar .toolbar-left{align-self:center}.roster-sticky-toolbar .toolbar-right{display:flex;align-items:flex-end;justify-content:flex-end;gap:7px;margin-left:0}.toolbar-action-group,.toolbar-primary-action{position:relative;display:flex;align-items:center;gap:4px;padding:15px 5px 4px;border-left:1px solid #dbe3ec}.toolbar-action-group:first-child{border-left:0}.toolbar-group-label{position:absolute;top:1px;left:8px;color:#77869a;font-size:.52rem;font-weight:800;line-height:1;text-transform:uppercase;letter-spacing:.07em}.toolbar-planning-group{padding-left:0}.toolbar-planning-group .smart-plan-week-btn{background:#fff8e8;border-color:#edd79d;color:#73510b}.toolbar-planning-group .prepublish-toolbar-btn{background:#edf8f2;border-color:#a9d9bd;color:#17653d}.toolbar-primary-action{padding-right:0}.toolbar-primary-action .primary-btn{box-shadow:0 3px 9px rgba(34,135,199,.2)}@media(max-width:1180px){.roster-sticky-toolbar{grid-template-columns:1fr}.roster-sticky-toolbar .toolbar-right{width:100%;justify-content:flex-start;overflow-x:auto;padding-bottom:2px}.toolbar-action-group,.toolbar-primary-action{flex:none}}@media(max-width:720px){.roster-sticky-toolbar .toolbar-right{align-items:stretch;flex-direction:column;overflow:visible}.toolbar-action-group,.toolbar-primary-action{width:100%;padding:17px 0 5px;border-left:0;border-top:1px solid #dbe3ec;flex-wrap:wrap}.toolbar-action-group .tool-btn,.toolbar-action-group form,.toolbar-primary-action .primary-btn{flex:1}.toolbar-action-group form .tool-btn{width:100%}}
* { box-sizing: border-box; }
html { font-size: clamp(13px, 0.78vw + 9px, 16px); }
body {
  margin: 0;
  font-family: Arial, Helvetica, sans-serif;
  background: var(--bg);
  color: var(--text);
}
a { color: inherit; text-decoration: none; }
button, input, select { font: inherit; }
button { cursor: pointer; border: 0; }
.page-shell { padding: clamp(10px, 1vw, 16px); }
.card {
  background: var(--card);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}
.hidden-by-setting { display: none !important; }

.toolbar {
  display: flex;
  justify-content: space-between;
  gap: 12px;
  padding: clamp(10px, 1vw, 14px);
  margin-bottom: 12px;
  flex-wrap: wrap;
}
.toolbar-left, .toolbar-right, .view-switch, .nav-pill-group, .toolbar-form-inline {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}
.toolbar-right { margin-left: auto; }
.view-tab, .icon-btn, .date-pill, .tool-btn, .toolbar-select, .primary-btn, .primary-soft-btn {
  min-height: clamp(42px, 2.9vw, 48px);
  border: 1px solid var(--line);
  background: #fff;
  border-radius: 12px;
  padding: 0 clamp(12px, 1vw, 18px);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  color: var(--text);
  line-height: 1;
  white-space: nowrap;
}
.view-tab.active {
  background: #eef7fd;
  color: var(--primary-dark);
  border-color: #84c6ee;
}
.date-pill { min-width: clamp(140px, 16vw, 200px); }
.primary-btn, .primary-soft-btn {
  background: var(--primary);
  color: #fff;
  border-color: transparent;
}
.primary-btn:hover, .primary-soft-btn:hover { background: var(--primary-dark); }
.toolbar-select { min-width: min(100%, clamp(180px, 16vw, 230px)); }
.toolbar-select-form { flex-wrap: nowrap; }

.layout-shell {
  display: grid;
  grid-template-columns: clamp(280px, 23vw, 360px) minmax(0, 1fr);
  gap: 12px;
  align-items: start;
  transition: grid-template-columns .22s ease;
}
.layout-shell.sidebar-collapsed {
  grid-template-columns: 88px minmax(0, 1fr);
}
.left-shell {
  overflow: hidden;
  min-height: calc(100vh - 120px);
  width: 100%;
  transition: width .22s ease;
}
.left-shell.collapsed { width: 88px; }
.left-shell.collapsed .left-shell-title,
.left-shell.collapsed .left-tabs,
.left-shell.collapsed .left-pane,
.left-shell.collapsed .left-shell-toggle-label { display: none; }
.left-shell-head {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px;
  border-bottom: 1px solid var(--line);
}
.left-shell-title {
  font-size: clamp(1rem, 0.8rem + 0.6vw, 1.25rem);
  font-weight: 700;
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.left-shell-toggle {
  justify-content: space-between;
  min-width: 220px;
  gap: 10px;
  white-space: nowrap;
}
.left-shell-toggle-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 1.35rem;
  line-height: 1;
  transition: transform .22s ease;
}
.layout-shell.sidebar-collapsed .left-shell-toggle-icon { transform: rotate(180deg); }
.left-shell.collapsed .left-shell-head {
  justify-content: center;
  padding: 12px 8px;
}
.left-shell.collapsed .left-shell-toggle {
  min-width: 0;
  width: 52px;
  height: 52px;
  padding: 0;
  border-radius: 14px;
}
.left-tabs {
  display: flex;
  padding: 10px 12px 0 12px;
  gap: 10px;
}
.left-tab {
  border: 1px solid var(--line);
  background: #fff;
  border-radius: 12px 12px 0 0;
  padding: 12px 16px;
  font-size: clamp(1rem, 0.9rem + 0.4vw, 1.1rem);
  font-weight: 700;
}
.left-tab.active {
  color: var(--primary-dark);
  border-color: #84c6ee;
}
.left-pane { display: none; padding: 12px; }
.left-pane.active { display: block; }
.left-pane-actions {
  display: flex;
  justify-content: flex-end;
  gap: 12px;
  align-items: center;
  margin-bottom: 10px;
}
.left-pane-actions-searchable { flex-wrap: wrap; }
.pane-search {
  flex: 1 1 180px;
  min-height: 42px;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 0 12px;
  min-width: 0;
}
.pane-icon { font-size: 1.35rem; color: var(--text); }
.square-btn {
  width: 50px;
  min-width: 50px;
  padding: 0;
  font-size: 1.7rem;
}
.template-list, .team-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.template-card {
  border: 2px solid var(--template-color, #0b8f50);
  background: #f7fbf8;
  border-radius: 16px;
  padding: 12px 12px 12px 18px;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}
.template-card::before {
  content: "";
  position: absolute;
  left: 8px;
  top: 8px;
  bottom: 8px;
  width: 7px;
  border-radius: 999px;
  background: var(--template-color, #0b8f50);
}
.template-card-main { min-width: 0; }
.template-card-title {
  font-size: clamp(0.96rem, 0.85rem + 0.4vw, 1.1rem);
  font-weight: 700;
  padding-left: 12px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.template-card-time {
  font-size: 0.92rem;
  color: var(--muted);
  padding-left: 12px;
  margin-top: 4px;
}
.copy-mini-btn {
  border: 1px solid var(--line);
  background: #fff;
  border-radius: 10px;
  padding: 8px 12px;
  font-size: 0.82rem;
  font-weight: 700;
}
.team-list-item {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}
.team-list-link {
  display: flex;
  align-items: center;
  gap: 14px;
  flex: 1;
  padding: 12px 10px;
  border-radius: 12px;
  min-width: 0;
}
.team-list-link span:last-child {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.team-list-item.active .team-list-link { background: #edf6fd; }
.team-color { width: 28px; height: 28px; border-radius: 8px; display: inline-block; flex: 0 0 auto; }
.empty-box {
  border: 1px dashed var(--line);
  border-radius: 14px;
  padding: 18px;
  color: var(--muted);
}

.roster-shell { overflow: hidden; }
.roster-topline {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 14px;
  padding: clamp(14px, 1vw, 18px);
  border-bottom: 1px solid var(--line);
  flex-wrap: wrap;
}
.roster-heading-block { min-width: 0; }
.roster-topline h1 {
  margin: 0;
  font-size: clamp(1.2rem, 0.95rem + 0.8vw, 2rem);
  line-height: 1.15;
}
.roster-topline p {
  margin: 6px 0 0;
  color: var(--muted);
  font-size: clamp(0.95rem, 0.88rem + 0.24vw, 1.1rem);
}
.roster-topline-actions, .inline-form {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.roster-grid-wrap {
  overflow: auto;
  max-width: 100%;
}
.roster-grid {
  display: grid;
  align-items: stretch;
  min-width: 0;
}
.day-head, .schedule-cell, .left-header, .row-label, .employee-card {
  border-right: 1px solid var(--line);
  border-bottom: 1px solid var(--line);
}
.left-header {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: clamp(14px, 1vw, 18px);
  background: #fbf6fa;
  min-height: clamp(74px, 8vw, 88px);
  border-top: 4px solid var(--pink);
}
.team-bullet {
  width: clamp(34px, 2.8vw, 42px);
  height: clamp(34px, 2.8vw, 42px);
  border-radius: 50%;
  border: 4px solid var(--pink);
  flex: 0 0 auto;
}
.team-head-name {
  font-size: clamp(1rem, 0.9rem + 0.5vw, 1.6rem);
  font-weight: 700;
}
.team-head-sub {
  color: var(--muted);
  font-size: clamp(0.85rem, 0.8rem + 0.2vw, 1rem);
  margin-top: 4px;
}
.day-head {
  min-height: clamp(74px, 8vw, 88px);
  display: flex;
  align-items: center;
  justify-content: center;
  background: #f9f4f8;
  border-top: 4px solid var(--pink);
  font-size: clamp(1rem, 0.85rem + 0.45vw, 1.5rem);
  font-weight: 700;
  position: relative;
  text-align: center;
  padding: 8px;
}
.day-head.today::before {
  content: "Vandaag";
  position: absolute;
  top: 6px;
  background: var(--purple);
  color: #fff;
  font-size: 0.78rem;
  font-weight: 700;
  border-radius: 999px;
  padding: 6px 14px;
}
.row-label {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 14px 16px;
  min-height: clamp(58px, 6vw, 74px);
  background: #fbfcfe;
  font-size: clamp(1rem, 0.86rem + 0.48vw, 1.35rem);
  font-weight: 700;
  color: #54677f;
}
.row-label small {
  color: var(--muted);
  margin-top: 4px;
  font-size: 0.82rem;
  line-height: 1.25;
}
.row-label-open-divider {
  border-top: 2px solid var(--line-strong);
}
.schedule-cell {
  min-height: clamp(58px, 6vw, 74px);
  background: #fff;
  padding: 6px;
  min-width: 0;
}
.publication-cell {
  background: #f7fafc;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: clamp(48px, 5vw, 56px);
}
.publication-cell.published { background: #def0e4; }
.publication-cell.auto { background: #dce8f8; }
.publication-toggle {
  border-radius: 999px;
  border: 1px solid #ccd8e6;
  background: #fff;
  padding: 8px 12px;
  font-size: 0.8rem;
  font-weight: 700;
  max-width: 100%;
}
.publication-toggle:disabled { opacity: 1; cursor: default; }
.coverage-row-cell, .open-row-cell, .agenda-row-cell, .team-note-cell, .weather-cell {
  vertical-align: top;
  background: #fff;
}
.coverage-row-cell { background: #fbfdff; }
.coverage-badge, .open-mini, .assigned-card, .agenda-chip, .note-chip, .weather-chip {
  position: relative;
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1px solid #d9e0ea;
  border-radius: 12px;
  background: #fff;
  min-height: clamp(34px, 4vw, 44px);
  padding: 5px 8px 5px 14px;
  margin-bottom: 6px;
  min-width: 0;
}
.coverage-badge::before, .open-mini::before, .assigned-card::before {
  content: "";
  position: absolute;
  left: 5px;
  top: 5px;
  bottom: 5px;
  width: 5px;
  border-radius: 999px;
  background: var(--item-color, #f08b85);
}
.coverage-badge, .open-mini { justify-content: space-between; }
.coverage-badge { padding-right: 7px; }
.open-mini { min-height: clamp(32px, 3.8vw, 38px); }
.open-mini-main { min-width: 0; flex: 1; padding-left: 6px; }
.mini-title {
  font-size: clamp(0.72rem, 0.66rem + 0.18vw, 0.84rem);
  font-weight: 700;
  line-height: 1.1;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  min-width: 0;
}
.mini-time {
  font-size: clamp(0.68rem, 0.62rem + 0.15vw, 0.8rem);
  color: var(--muted);
  margin-top: 2px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.count-pill, .assign-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 999px;
  min-width: clamp(46px, 4vw, 58px);
  height: clamp(26px, 2.5vw, 32px);
  padding: 0 10px;
  font-size: clamp(0.72rem, 0.66rem + 0.15vw, 0.8rem);
  font-weight: 700;
  flex: 0 0 auto;
}
.count-pill.ok { background: var(--green); color: #fff; }
.count-pill.warn { background: var(--red); color: #fff; }
.assign-pill {
  min-width: 32px;
  width: 32px;
  padding: 0;
  border: 1px solid #ccd8e6;
  background: #fff;
  color: var(--text);
}
.agenda-chip, .note-chip, .weather-chip {
  padding-left: 10px;
  color: var(--muted);
  font-size: 0.78rem;
  background: #fbfcfe;
}
.weather-chip { background: #eff6ff; color: #4b6482; }

.employee-card {
  display: grid;
  grid-template-columns: clamp(38px, 3vw, 46px) 1fr;
  gap: 12px;
  padding: 14px;
  min-height: clamp(84px, 7vw, 92px);
  background: #fff;
  min-width: 0;
}
.avatar {
  width: clamp(38px, 3vw, 46px);
  height: clamp(38px, 3vw, 46px);
  border-radius: 50%;
  background: #e5ebf4;
  color: #647492;
  font-weight: 700;
  display: grid;
  place-items: center;
  font-size: clamp(0.95rem, 0.85rem + 0.2vw, 1rem);
}
.employee-name {
  font-size: clamp(0.95rem, 0.82rem + 0.32vw, 1.15rem);
  font-weight: 700;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.employee-meta {
  color: var(--muted);
  margin-top: 6px;
  font-size: 0.9rem;
}
.employee-balance {
  margin-top: 6px;
  font-weight: 700;
  font-size: 0.94rem;
}
.employee-balance.negative { color: var(--red); }
.employee-balance.positive { color: var(--green); }
.employee-day-cell {
  min-height: clamp(84px, 7vw, 92px);
  background: #fff;
}
.employee-row-start { border-top: 2px solid var(--line-strong); }
.employee-card.has-conflict, .employee-day-cell.has-conflict, .employee-total-cell.has-conflict {
  background: linear-gradient(0deg, rgba(227, 38, 59, 0.02), rgba(227, 38, 59, 0.02)), #fff;
}
.assigned-card {
  border: 2px solid var(--item-color, #37a2e6);
  padding-left: 14px;
  background: #fbfdff;
}
.availability-pill {
  display: inline-flex;
  align-items: center;
  min-height: 28px;
  border-radius: 999px;
  padding: 0 12px;
  font-size: 0.76rem;
  font-weight: 700;
  background: var(--avail-color, #bfe3c6);
  color: #415a4a;
  margin-top: 6px;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.availability-pill.absence {
  background: #f5e7b6;
  color: #745c12;
}
.totals-cell {
  background: #fbfcfe;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  color: #5b6a80;
  flex-direction: column;
  text-align: center;
  padding: 8px;
}
.employee-total-cell {
  font-size: 0.9rem;
  gap: 4px;
}
.total-main { font-size: 0.9rem; font-weight: 700; }
.total-extra {
  font-size: 0.7rem;
  font-weight: 600;
  color: var(--muted);
}
.dropzone.dragover {
  outline: 2px dashed var(--primary);
  outline-offset: -4px;
  background: #eef8ff;
}
.inline-copy-form, .inline-form { margin: 0; }

.modal-backdrop, .drawer-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(16, 30, 53, 0.34);
  display: none;
  align-items: center;
  justify-content: center;
  z-index: 6000;
}
.modal-backdrop.open{background:rgba(16,30,53,.48);backdrop-filter:blur(2px)}.modal-backdrop.open .modal-card{position:relative;z-index:6001}
.modal-backdrop.open, .drawer-backdrop.open { display: flex; }
.modal-card {
  width: min(640px, calc(100vw - 28px));
  background: #fff;
  border-radius: 16px;
  padding: 18px;
  box-shadow: 0 18px 40px rgba(14, 26, 51, 0.2);
}
.compact-modal { width: min(460px, calc(100vw - 28px)); }
.modal-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 12px;
  gap: 12px;
}
.modal-head h3 { margin: 0; }
.modal-head button {
  background: transparent;
  font-size: 20px;
}
.form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px;
}
.grid-span-2 { grid-column: 1 / -1; }
label {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-size: 14px;
  font-weight: 700;
}
input[type="text"], input[type="date"], input[type="time"], input[type="number"], input[type="color"], select {
  min-height: 44px;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 0 12px;
}
.modal-actions {
  display: flex;
  justify-content: flex-end;
  margin-top: 14px;
}
.actions-list {
  display: grid;
  gap: 10px;
}
.action-wide {
  width: 100%;
  justify-content: flex-start;
}
.settings-drawer {
  margin-left: auto;
  width: min(430px, 100vw);
  height: 100vh;
  background: #fff;
  box-shadow: -10px 0 30px rgba(14, 26, 51, 0.16);
  display: flex;
  flex-direction: column;
}
.drawer-head {
  background: var(--primary);
  color: #fff;
  padding: 18px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
}
.drawer-head h3 { margin: 0; font-size: 20px; }
.drawer-head button { background: transparent; color: #fff; font-weight: 700; }
.drawer-body { padding: 18px; overflow: auto; }
.drawer-search {
  width: 100%;
  min-height: 46px;
  border: 1px solid var(--line);
  border-radius: 12px;
  padding: 0 14px;
  margin-bottom: 16px;
}
.settings-section-title {
  font-size: 1.05rem;
  font-weight: 700;
  color: #4b5f78;
  background: #f0f4f8;
  border-radius: 12px;
  padding: 12px 14px;
  margin: 18px 0 12px;
}
.settings-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.settings-list label {
  flex-direction: row;
  align-items: center;
  font-size: 1rem;
  font-weight: 400;
}
.settings-list input { width: 18px; height: 18px; }

@media (max-width: 1180px) {
  .layout-shell { grid-template-columns: 1fr; }
  .layout-shell.sidebar-collapsed { grid-template-columns: 1fr; }
  .left-shell { min-height: auto; }
  .left-shell.collapsed { width: 100%; }
  .left-shell.collapsed .left-shell-title,
  .left-shell.collapsed .left-tabs,
  .left-shell.collapsed .left-pane,
  .left-shell.collapsed .left-shell-toggle-label { display: initial; }
  .left-shell.collapsed .left-shell-head { justify-content: space-between; padding: 12px; }
  .left-shell.collapsed .left-shell-toggle { width: auto; min-width: 220px; height: auto; padding: 0 16px; }
  .layout-shell.sidebar-collapsed .left-shell-toggle-icon { transform: none; }
}

@media (max-width: 900px) {
  html { font-size: 14px; }
  .toolbar-left, .toolbar-right { width: 100%; }
  .toolbar-right { justify-content: flex-start; }
  .tool-btn, .primary-btn, .toolbar-select, .date-pill { width: 100%; }
  .toolbar-select-form { width: 100%; }
  .nav-pill-group { width: 100%; }
  .nav-pill-group .icon-btn { flex: 0 0 44px; }
  .date-pill { flex: 1 1 auto; }
  .roster-topline-actions { width: 100%; }
  .roster-topline-actions > * { flex: 1 1 180px; }
  .form-grid { grid-template-columns: 1fr; }
  .grid-span-2 { grid-column: auto; }
}

@media (max-width: 640px) {
  .page-shell { padding: 8px; }
  .toolbar { padding: 10px; }
  .view-switch { width: 100%; }
  .view-tab { flex: 1 1 0; }
  .left-shell-head { flex-wrap: wrap; }
  .left-shell-toggle { min-width: 0; width: 100%; }
  .left-tabs { flex-wrap: wrap; }
  .left-tab { flex: 1 1 0; text-align: center; }
  .drawer-body, .modal-card { padding: 14px; }
  .settings-list label { font-size: 0.95rem; }
}


.team-section {
  margin-bottom: 28px;
}
.team-section-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 10px 4px 14px;
}
.team-section-title {
  font-size: clamp(1.2rem, 1rem + 0.6vw, 1.9rem);
  font-weight: 800;
  color: var(--text);
}
.team-section-subtitle {
  color: var(--muted);
  margin-top: 2px;
}
.team-auto-btn {
  white-space: nowrap;
}
.team-grid-wrap {
  overflow-x: auto;
}
.team-roster-grid {
  align-items: stretch;
  min-width: max-content;
}
.label-publish,
.publication-cell,
.publication-total-cell {
  min-height: 72px !important;
  height: 72px;
}
.publication-toggle {
  width: 100%;
  min-height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  line-height: 1.15;
  font-size: 0.9rem;
  font-weight: 700;
  border-radius: 999px;
}
.publication-toggle.is-published {
  background: #ecf8ef;
}
.publication-toggle.is-auto {
  background: #e8f0fb;
}
.compact-card {
  min-height: 56px;
  padding: 8px 10px 8px 14px;
  border-radius: 14px;
}
.compact-title {
  font-size: 0.95rem;
  font-weight: 700;
  color: var(--text);
  line-height: 1.15;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  max-width: calc(100% - 74px);
}
.compact-time {
  font-size: 0.82rem;
  color: var(--muted);
  line-height: 1.1;
}
.coverage-row-cell,
.open-row-cell {
  padding: 10px 8px;
}
.coverage-badge,
.open-mini,
.assigned-card {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 4px 8px;
  align-items: center;
  border: 1px solid #d7e1ee;
  background: #fff;
  margin-bottom: 8px;
}
.coverage-badge::before,
.open-mini::before,
.assigned-card::before {
  content: "";
  position: absolute;
  left: 6px;
  top: 8px;
  bottom: 8px;
  width: 5px;
  border-radius: 999px;
  background: var(--shift-color, var(--pink));
}
.coverage-count {
  justify-self: end;
  min-width: 64px;
  padding: 8px 10px;
  border-radius: 999px;
  color: #fff;
  font-weight: 700;
  font-size: 0.9rem;
  line-height: 1;
  text-align: center;
}
.coverage-count.ok { background: #2dbf4f; }
.coverage-count.warn { background: #e3273f; }
.open-row-top {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 8px;
}
.cell-add-btn {
  width: 28px;
  height: 28px;
  border-radius: 10px;
  border: 1px dashed #c2cedd;
  background: #f8fbfe;
  color: #556b84;
  font-size: 1rem;
  font-weight: 700;
}
.open-create-dropzone.dragover {
  background: #eef6ff;
}
.open-mini {
  grid-template-columns: minmax(0, 1fr) auto auto;
}
.mini-action-btn {
  width: 34px;
  height: 34px;
  border-radius: 12px;
  border: 1px solid #ccd7e4;
  background: #f9fbfd;
  color: #45596f;
  font-size: 1rem;
}
.employee-label {
  padding: 14px 16px;
}
.employee-label-flex {
  display: flex;
  gap: 14px;
  align-items: flex-start;
}
.employee-label .avatar {
  width: 52px;
  height: 52px;
  border-radius: 50%;
  background: #e6ebf3;
  color: #596a84;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.35rem;
  font-weight: 700;
  flex: 0 0 auto;
}
.employee-dropzone {
  padding: 8px;
  min-height: 86px;
  background: #fff;
}
.assigned-card {
  grid-template-columns: minmax(0, 1fr);
}
.compact-status {
  display: inline-flex;
  align-items: center;
  min-height: 34px;
  border-radius: 999px;
  padding: 6px 12px;
  font-size: 0.86rem;
  color: #38586f;
  margin-top: 6px;
}
.large-empty {
  padding: 40px;
  text-align: center;
}
@media (max-width: 980px) {
  .team-section-bar {
    flex-direction: column;
    align-items: flex-start;
  }
  .team-auto-btn {
    width: 100%;
  }
}

/* ===== MBS beheerlaag ===== */
.global-nav {
  position: sticky;
  top: 0;
  z-index: 50;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 9px clamp(12px, 2vw, 26px);
  background: rgba(255,255,255,.96);
  border-bottom: 1px solid var(--line);
  box-shadow: 0 4px 18px rgba(27,43,65,.04);
  backdrop-filter: blur(10px);
}
.global-brand { display:flex; align-items:center; gap:10px; min-width:max-content; }
.global-brand-mark {
  display:inline-flex; align-items:center; justify-content:center;
  width:42px; height:42px; border-radius:12px;
  background:#243246; color:#fff; font-weight:900; letter-spacing:.04em;
}
.global-brand strong { display:block; font-size:1rem; }
.global-brand small { display:block; color:var(--muted); font-size:.72rem; margin-top:2px; }
.global-links { display:flex; align-items:center; gap:5px; flex-wrap:wrap; justify-content:flex-end; }
.global-links a { padding:10px 13px; border-radius:10px; color:#526177; font-weight:700; font-size:.88rem; }
.global-links a:hover { background:#f0f5fa; }
.global-links a.active { background:#eaf5fc; color:var(--primary-dark); }

.admin-page { padding: clamp(14px, 2vw, 28px); max-width: 1680px; margin: 0 auto; }
.admin-titlebar { display:flex; align-items:flex-end; justify-content:space-between; gap:18px; margin-bottom:20px; }
.admin-titlebar h1 { margin:3px 0 5px; font-size:clamp(1.7rem, 2.2vw, 2.45rem); }
.admin-titlebar p { margin:0; color:var(--muted); }
.eyebrow { display:block; color:var(--primary-dark); font-weight:800; font-size:.78rem; text-transform:uppercase; letter-spacing:.1em; }
.title-actions { display:flex; gap:10px; flex-wrap:wrap; justify-content:flex-end; }
.metric-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-bottom:16px; }
.metric-card { background:#fff; border:1px solid var(--line); border-radius:16px; box-shadow:var(--shadow); padding:17px; min-height:126px; display:flex; flex-direction:column; }
.metric-card span { color:var(--muted); font-weight:700; font-size:.82rem; }
.metric-card strong { font-size:2rem; margin:10px 0 3px; }
.metric-card small { color:var(--muted); margin-top:auto; }
.compact-metrics .metric-card { min-height:105px; }
.admin-grid { display:grid; gap:14px; margin-bottom:14px; }
.admin-grid-2 { grid-template-columns:repeat(2,minmax(0,1fr)); }
.admin-card { background:#fff; border:1px solid var(--line); border-radius:16px; box-shadow:var(--shadow); padding:16px; margin-bottom:14px; min-width:0; }
.admin-card-head { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-bottom:12px; }
.admin-card-head h2 { margin:0 0 4px; font-size:1.08rem; }
.admin-card-head p { margin:0; color:var(--muted); font-size:.84rem; }
.admin-card-head > a { color:var(--primary-dark); font-weight:800; font-size:.84rem; }
.admin-table-wrap { overflow:auto; }
.admin-table { width:100%; border-collapse:collapse; min-width:680px; }
.admin-table th { text-align:left; color:#6b788b; font-size:.75rem; text-transform:uppercase; letter-spacing:.04em; border-bottom:1px solid var(--line); padding:10px 9px; white-space:nowrap; }
.admin-table td { border-bottom:1px solid #edf1f5; padding:11px 9px; vertical-align:middle; font-size:.88rem; }
.admin-table tbody tr:last-child td { border-bottom:0; }
.admin-table td small { display:block; color:var(--muted); margin-top:3px; }
.empty-table { text-align:center; color:var(--muted); padding:28px !important; }
.status-pill { display:inline-flex; align-items:center; justify-content:center; border-radius:999px; padding:5px 9px; background:#eef2f6; color:#506074; font-size:.74rem; font-weight:800; white-space:nowrap; }
.status-pill.ok { background:#e4f7e7; color:#227a33; }
.status-pill.warn { background:#fff0e2; color:#a04d16; }
.status-pill.info { background:#e7f3fc; color:#2277a9; }
.status-pill.muted { background:#eff1f4; color:#7b8797; }
.filter-bar { display:flex; gap:9px; align-items:center; flex-wrap:wrap; }
.filter-bar input, .filter-bar select { min-height:42px; border:1px solid var(--line); border-radius:10px; background:#fff; padding:0 11px; min-width:180px; }
.filter-bar input[type="search"] { flex:1 1 280px; }
.person-cell { display:flex; align-items:center; gap:10px; min-width:190px; }
.person-cell .avatar { flex:0 0 auto; }
.row-muted { opacity:.62; }
.small-btn { min-height:34px !important; padding:0 10px !important; border-radius:9px !important; font-size:.78rem; }
.wide-modal { width:min(760px, calc(100vw - 24px)); }
.check-stack { display:flex; flex-direction:column; gap:8px; padding-top:8px; }
.check-stack label { display:flex !important; flex-direction:row !important; align-items:center; gap:8px; font-weight:600 !important; }
.check-stack input { width:auto !important; min-height:0 !important; }
.module-chip-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; }
.module-chip-grid > div { border:1px solid var(--line); background:#f9fbfd; border-radius:12px; padding:13px; }
.module-chip-grid strong { display:block; font-size:.88rem; margin-bottom:5px; }
.module-chip-grid span { display:block; color:var(--muted); font-size:.76rem; line-height:1.35; }
.icon-danger, .mini-delete-btn, .card-delete-btn { display:inline-flex; align-items:center; justify-content:center; border-radius:7px; background:#fff1f1; color:#c93434; font-weight:900; }
.icon-danger { width:28px; height:28px; }
.open-delete-form { display:inline; margin:0; }
.mini-delete-btn { width:24px; height:24px; padding:0; font-size:1rem; }
.assigned-card { position:relative; }
.card-delete-form { position:absolute; right:4px; top:4px; margin:0; opacity:0; transition:opacity .15s ease; }
.assigned-card:hover .card-delete-form { opacity:1; }
.card-delete-btn { width:22px; height:22px; padding:0; }
.assigned-card.has-conflict { outline:2px solid #ef9b22; outline-offset:-2px; }
.conflict-mark { color:#d37d00; font-size:.8rem; }
.employee-conflict { background:#fff8ea !important; }
.availability-chip { display:flex !important; flex-direction:column; align-items:flex-start !important; gap:2px; }
.availability-chip strong { font-size:.72rem; }
.availability-chip span { font-size:.68rem; }
.field-help { display:block; color:var(--muted); font-weight:400; font-size:.72rem; margin-top:5px; line-height:1.35; }

@media (max-width: 1100px) {
  .metric-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .admin-grid-2 { grid-template-columns:1fr; }
  .module-chip-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .global-nav { align-items:flex-start; }
}
@media (max-width: 760px) {
  .global-nav { position:static; flex-direction:column; gap:8px; }
  .global-links { width:100%; justify-content:flex-start; overflow:auto; flex-wrap:nowrap; }
  .global-links a { white-space:nowrap; }
  .admin-titlebar { align-items:flex-start; flex-direction:column; }
  .metric-grid { grid-template-columns:1fr 1fr; }
  .module-chip-grid { grid-template-columns:1fr; }
}
@media (max-width: 520px) {
  .metric-grid { grid-template-columns:1fr; }
}

/* ===== V3 centrale MBS Personeel-koppeling ===== */
.integration-card {
  display:grid; grid-template-columns:minmax(0,1fr) auto; gap:14px 20px; align-items:center;
  margin-bottom:16px; padding:16px 18px; border:1px solid #dbe6ef; border-left:5px solid #7d93aa;
  border-radius:16px; background:#fff; box-shadow:var(--shadow);
}
.integration-card.integration-ok { border-left-color:#23a55a; }
.integration-card.integration-error { border-left-color:#d94848; background:#fffafa; }
.integration-main { display:flex; align-items:center; gap:13px; min-width:0; }
.integration-main strong { display:block; font-size:1rem; }
.integration-main p { margin:4px 0 0; color:var(--muted); font-size:.78rem; word-break:break-all; }
.integration-icon { width:42px; height:42px; border-radius:12px; display:grid; place-items:center; background:#eaf5fc; color:var(--primary-dark); font-size:1.35rem; font-weight:900; }
.integration-meta { display:flex; align-items:center; gap:8px; flex-wrap:wrap; justify-content:flex-end; }
.integration-meta small { color:var(--muted); }
.integration-message { grid-column:1/-1; padding:9px 11px; border-radius:10px; background:#f6f9fc; color:#526177; font-size:.8rem; }
.status-pill.danger { background:#ffe8e8; color:#a92929; }
.personnel-metrics { grid-template-columns:repeat(5,minmax(0,1fr)); }
.metric-card.accent { border-top:4px solid var(--primary); }
.personnel-filters select { min-width:170px; }
.linked-personnel-table { min-width:1280px; }
.competency-chips { display:flex; gap:5px; flex-wrap:wrap; max-width:340px; }
.competency-chip { display:inline-flex; align-items:center; padding:5px 8px; border-radius:999px; background:#eef6fb; color:#2f668a; border:1px solid #d7e9f4; font-size:.72rem; font-weight:800; }
.empty-inline { color:var(--muted); font-size:.76rem; }
.source-badge { display:inline-flex; border-radius:8px; padding:5px 8px; font-size:.7rem; font-weight:900; white-space:nowrap; }
.source-badge.linked { background:#e6f7eb; color:#24773a; }
.source-badge.local { background:#fff2df; color:#9b6118; }
.row-actions { white-space:nowrap; }
.link-icon-btn { display:inline-flex; width:34px; height:34px; align-items:center; justify-content:center; margin-left:4px; border:1px solid var(--line); border-radius:9px; color:#53657b; font-weight:900; background:#fff; }
.readonly-source-box { padding:13px 14px; border:1px solid #d7e6f1; border-radius:12px; background:#f4f9fc; margin-bottom:14px; }
.readonly-source-box strong { display:block; margin-bottom:4px; }
.readonly-source-box p { margin:0; color:var(--muted); font-size:.8rem; line-height:1.45; }
.team-checkbox-fieldset, .competency-fieldset { border:1px solid var(--line); border-radius:13px; padding:12px; margin:0 0 14px; }
.team-checkbox-fieldset legend, .competency-fieldset legend { padding:0 6px; font-weight:900; font-size:.83rem; color:#405166; }
.team-checkbox-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }
.team-check-card { display:flex !important; flex-direction:row !important; align-items:flex-start; gap:9px; padding:10px; border:1px solid #e2e9f0; border-radius:10px; background:#fbfcfd; cursor:pointer; }
.team-check-card input { width:auto !important; min-height:0 !important; margin-top:3px; }
.team-check-card strong { display:block; font-size:.8rem; }
.team-check-card small { display:block; color:var(--muted); margin-top:2px; font-size:.7rem; }
.toggle-row { display:flex !important; flex-direction:row !important; align-items:flex-start; gap:9px; padding:12px; background:#fafbfd; border-radius:10px; }
.toggle-row input { width:auto !important; min-height:0 !important; margin-top:3px; }
.toggle-row strong, .toggle-row small { display:block; }
.toggle-row small { color:var(--muted); margin-top:3px; font-weight:400; }
.connector-help-card h2 { margin:4px 0 13px; }
.ownership-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; }
.ownership-grid > div { padding:14px; border:1px solid var(--line); border-radius:12px; background:#fafcfe; }
.ownership-grid strong { display:block; margin-bottom:5px; }
.ownership-grid p { margin:0; color:var(--muted); font-size:.82rem; line-height:1.45; }
.template-card-requirements { margin-top:5px; color:#2a7b50; font-size:.68rem; font-weight:800; line-height:1.3; }
.template-card-actions { display:flex; gap:5px; align-items:center; }
.field-hint { margin:-2px 0 10px; color:var(--muted); font-size:.75rem; line-height:1.4; }
.competency-checkbox-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; max-height:260px; overflow:auto; }
.competency-checkbox-grid label { display:flex !important; flex-direction:row !important; align-items:center; gap:7px; padding:8px; border:1px solid #e5eaf0; border-radius:9px; background:#fbfcfd; font-size:.78rem; font-weight:700 !important; }
.competency-checkbox-grid input { width:auto !important; min-height:0 !important; }

@media (max-width: 1200px) {
  .personnel-metrics { grid-template-columns:repeat(3,minmax(0,1fr)); }
}
@media (max-width: 820px) {
  .integration-card { grid-template-columns:1fr; }
  .integration-meta { justify-content:flex-start; }
  .team-checkbox-grid, .competency-checkbox-grid, .ownership-grid { grid-template-columns:1fr; }
  .personnel-metrics { grid-template-columns:repeat(2,minmax(0,1fr)); }
}


/* V4 smart planning */
.warning-card { border-color: #f0c36a; }
.smart-plan-form, .smart-plan-settings { display: grid; gap: 16px; }
.form-grid-2 { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 12px; }
.smart-plan-form label, .smart-plan-settings > label:not(.switch-row) { display: grid; gap: 7px; font-weight: 750; color: #263750; }
.smart-plan-form input, .smart-plan-form select, .smart-plan-settings select { min-height: 46px; border: 1px solid #d5deea; border-radius: 12px; padding: 0 13px; background: #fff; font: inherit; }
.switch-row { display: grid; grid-template-columns: 22px 1fr; gap: 10px; align-items: start; padding: 12px 0; border-bottom: 1px solid #edf1f6; }
.switch-row input { margin-top: 4px; width: 18px; height: 18px; }
.switch-row span { display: grid; gap: 3px; }
.switch-row small { color: #708099; font-weight: 500; }
.smart-results-card { margin-top: 20px; }
.score-pill { display: inline-flex; min-width: 58px; justify-content: center; padding: 8px 10px; border-radius: 999px; background: #e9f6ff; color: #1c6e9c; font-weight: 850; }
.reason-list { display: flex; flex-wrap: wrap; gap: 6px; max-width: 620px; }
.reason-list span { display: inline-flex; padding: 5px 8px; border-radius: 8px; background: #f4f7fa; color: #52627a; font-size: 12px; font-weight: 650; }
.run-chip-list { display: grid; grid-template-columns: repeat(auto-fit,minmax(180px,1fr)); gap: 10px; }
.run-chip { text-decoration: none; color: inherit; border: 1px solid #dfe6ef; border-radius: 12px; padding: 12px; display: grid; gap: 4px; background: #fff; }
.run-chip:hover { border-color: #8fc9ef; background: #f8fcff; }
.run-chip span, .run-chip small { color: #718096; }
@media (max-width: 800px) { .form-grid-2 { grid-template-columns: 1fr; } }

/* V5 smart planning review workflow */
.smart-plan-titlebar { align-items:flex-start; gap:20px; }
.smart-run-status { display:grid; gap:6px; justify-items:end; }
.smart-run-status small { color:var(--muted); font-weight:700; }
.auto-plan-metrics-v5 { grid-template-columns:repeat(5,minmax(0,1fr)); }
.metric-card small { display:block; margin-top:6px; color:var(--muted); font-size:.72rem; }
.metric-card small a { color:var(--primary-dark); text-decoration:none; font-weight:800; }
.smart-result-head { align-items:flex-start; gap:18px; }
.smart-run-actions { display:flex; flex-wrap:wrap; gap:9px; align-items:center; justify-content:flex-end; }
.smart-run-actions form { margin:0; }
.secondary-action { text-decoration:none; background:#eef7fc; color:#176a99; border:1px solid #cce4f3; }
.danger-outline-btn { border:1px solid #e8b6b6; color:#a83838; background:#fff; min-height:42px; padding:0 14px; border-radius:11px; font-weight:850; cursor:pointer; }
.smart-slot-list { display:grid; gap:14px; }
.smart-slot-card { border:1px solid #dfe7ef; border-radius:16px; background:#fff; padding:16px; box-shadow:0 4px 16px rgba(25,49,80,.04); }
.smart-slot-card.is-applied { border-color:#b9dfc5; background:#fbfffc; }
.smart-slot-meta { display:grid; grid-template-columns:140px minmax(0,1fr) auto; gap:14px; align-items:center; padding-bottom:13px; border-bottom:1px solid #edf1f5; }
.smart-slot-meta h3, .smart-selected-candidate h3 { margin:0; font-size:1rem; color:#1e2d43; }
.smart-slot-meta p, .smart-selected-candidate p { margin:3px 0 0; color:var(--muted); font-size:.78rem; }
.smart-date-block { display:grid; gap:4px; }
.smart-date-block strong { font-size:.88rem; }
.smart-date-block span { color:var(--muted); font-size:.76rem; }
.smart-selected-candidate { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-top:14px; padding:13px 14px; border-radius:13px; background:#f7fbfe; border:1px solid #e0edf5; }
.smart-primary-reasons { margin-top:10px; max-width:none; }
.candidate-alternatives { margin-top:15px; display:grid; gap:7px; }
.candidate-alternatives-title { font-size:.75rem; font-weight:900; color:#51637a; text-transform:uppercase; letter-spacing:.04em; }
.candidate-option { display:grid; grid-template-columns:42px minmax(0,1fr) 72px 76px; gap:10px; align-items:center; border:1px solid #e4eaf1; border-radius:11px; padding:9px 10px; background:#fff; margin:0; }
.candidate-option.is-selected { border-color:#8cc7eb; background:#f5fbff; }
.candidate-rank { width:32px; height:32px; display:grid; place-items:center; border-radius:9px; background:#f1f4f7; color:#637187; font-weight:900; font-size:.74rem; }
.candidate-name { display:grid; gap:2px; min-width:0; }
.candidate-name strong { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:.83rem; }
.candidate-name small { color:var(--muted); font-size:.7rem; }
.score-pill.small { min-width:54px; padding:6px 8px; font-size:.73rem; }
.mini-select-btn { min-height:34px; border-radius:9px; border:1px solid #cdd9e4; background:#fff; color:#28425d; font-weight:850; cursor:pointer; }
.mini-select-btn:disabled { background:#e8f6ed; color:#277242; border-color:#cae8d3; cursor:default; }
.empty-smart-result { display:grid; gap:8px; justify-items:start; padding:24px 4px 6px; }
.empty-smart-result strong { font-size:1rem; }
.empty-smart-result p { margin:0; color:var(--muted); max-width:760px; line-height:1.5; }
.run-chip.active { border-color:#63b5e8; background:#f2faff; box-shadow:inset 0 0 0 1px #8dcaef; }
.status-pill.success { background:#e5f6e9; color:#24763b; }
.proposal-badge { display:inline-flex; margin-left:5px; padding:2px 6px; border-radius:999px; background:#fff0c8; color:#855e00; border:1px solid #f1d994; font-size:.58rem; font-weight:900; vertical-align:middle; }
.assigned-card.proposal-card { background:linear-gradient(180deg,#fffdf7,#fff9e7); border-style:dashed; }
@media (max-width:1200px) { .auto-plan-metrics-v5 { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:820px) {
  .auto-plan-metrics-v5 { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .smart-slot-meta { grid-template-columns:1fr; }
  .smart-run-actions { justify-content:flex-start; }
  .candidate-option { grid-template-columns:38px minmax(0,1fr) 62px; }
  .candidate-option .mini-select-btn { grid-column:1/-1; }
}


/* V6 workload fairness analysis */
.workload-analysis-card { margin-top:20px; overflow:hidden; }
.workload-analysis-head { align-items:flex-start; gap:18px; }
.workload-analysis-head h2 { margin:4px 0 4px; }
.workload-legend { display:flex; flex-wrap:wrap; gap:10px; justify-content:flex-end; font-size:.72rem; color:var(--muted); font-weight:800; }
.workload-legend span { display:inline-flex; align-items:center; gap:6px; }
.balance-dot { width:9px; height:9px; border-radius:50%; display:inline-block; }
.balance-dot.room { background:#4a9d68; }
.balance-dot.balanced { background:#59a6d2; }
.balance-dot.attention { background:#dfa244; }
.workload-summary-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:10px; margin:2px 0 16px; }
.workload-summary-grid > div { padding:13px 14px; border:1px solid #e1e8f0; border-radius:12px; background:#fbfcfe; display:grid; gap:3px; }
.workload-summary-grid span { color:var(--muted); font-size:.72rem; font-weight:750; }
.workload-summary-grid strong { color:#22354c; font-size:1.15rem; }
.workload-summary-grid .has-attention { border-color:#efd39b; background:#fffaf0; }
.workload-table-wrap { overflow:auto; border:1px solid #e2e8ef; border-radius:14px; }
.workload-table { min-width:1120px; margin:0; }
.workload-table thead th { background:#f6f9fc; position:sticky; top:0; z-index:1; }
.workload-table tbody tr.is-proposed-person { background:#fbfdff; }
.workload-table tbody tr.is-proposed-person td:first-child { box-shadow:inset 3px 0 0 #55a9da; }
.workload-table td { vertical-align:middle; }
.workload-table td > strong { display:block; color:#25374d; font-size:.82rem; }
.workload-table td > small, .load-cell small, .daypart-cell small { display:block; margin-top:3px; color:var(--muted); font-size:.68rem; }
.workload-person { display:grid; gap:3px; min-width:180px; }
.workload-person strong { font-size:.82rem; color:#24364c; }
.workload-person span { display:flex; gap:6px; align-items:center; color:var(--muted); font-size:.68rem; }
.workload-person b { padding:3px 6px; border-radius:999px; background:#eaf6fc; color:#2475a2; font-size:.62rem; }
.load-cell { min-width:145px; }
.load-cell strong { font-size:.82rem; color:#263a50; }
.load-cell strong em { color:#2f8a57; font-style:normal; font-size:.69rem; }
.load-track { width:132px; max-width:100%; height:7px; border-radius:999px; background:#edf1f5; overflow:hidden; margin-top:6px; }
.load-track span { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#72b7de,#4f94c4); }
.daypart-cell { min-width:150px; }
.daypart-bar { width:140px; max-width:100%; height:9px; display:flex; overflow:hidden; border-radius:999px; background:#edf1f4; }
.daypart-bar span { height:100%; }
.daypart-bar .morning { background:#e7b458; }
.daypart-bar .afternoon { background:#68a8d2; }
.daypart-bar .night { background:#53637d; }
.balance-badge { display:inline-flex; padding:6px 8px; border-radius:999px; font-size:.68rem; font-weight:900; white-space:nowrap; }
.balance-badge.room { background:#e8f6ec; color:#287443; }
.balance-badge.balanced { background:#eaf5fb; color:#2b7199; }
.balance-badge.attention { background:#fff3dc; color:#97641c; }
.balance-badge.heavy { background:#fde9e9; color:#aa3f3f; }
.balance-badge.neutral { background:#f0f2f5; color:#667386; }
.balance-detail { display:block; max-width:190px; margin-top:5px; color:var(--muted); font-size:.65rem; line-height:1.35; }
.workload-note { margin-top:12px; padding:10px 12px; border-radius:10px; background:#f7fafc; color:#66768a; font-size:.72rem; line-height:1.45; }
.candidate-loadline { display:block; margin-top:6px; color:#5e7188; font-size:.69rem; font-weight:650; }
@media (max-width:1100px) { .workload-summary-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media (max-width:700px) { .workload-summary-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .workload-legend { justify-content:flex-start; } }


/* ===== V7 compact week + manual proposal editing ===== */
.roster-notice { margin:0 0 10px; padding:10px 14px; border:1px solid #c9e2f1; border-radius:11px; background:#f2faff; color:#235d7e; font-size:.82rem; font-weight:750; }
.view-week .team-grid-wrap { overflow-x:hidden; }
.view-week .team-roster-grid { width:100%; min-width:0 !important; grid-template-columns:minmax(150px,17%) repeat(7,minmax(0,1fr)) minmax(52px,5.5%) !important; }
.view-week .day-head { min-width:0; padding:6px 2px; min-height:54px; font-size:clamp(.72rem,.66rem + .18vw,.9rem); }
.view-week .day-head.today::before { top:3px; padding:3px 7px; font-size:.56rem; }
.view-week .row-label { min-width:0; }
.view-week .schedule-cell { min-width:0; padding:4px; }
.view-week .publication-toggle { padding:5px 4px; min-height:30px; font-size:.62rem; border-radius:8px; }
.view-week .label-publish, .view-week .publication-cell, .view-week .publication-total-cell { min-height:44px !important; height:auto; }
.view-week .coverage-row-cell, .view-week .open-row-cell { padding:5px 4px; }
.view-week .compact-card { min-height:38px; padding:5px 6px 5px 10px; margin-bottom:3px; border-radius:8px; }
.view-week .compact-title { font-size:.68rem; max-width:100%; line-height:1.05; }
.view-week .compact-time { font-size:.61rem; margin-top:1px; }
.view-week .coverage-badge, .view-week .open-mini { margin-bottom:3px; min-height:34px; border-radius:8px; }
.view-week .open-mini { grid-template-columns:minmax(0,1fr) auto; }
.view-week .open-mini .mini-action-btn { display:none; }
.view-week .coverage-count { font-size:.6rem; min-width:0; }
.view-week .employee-label { padding:5px 7px; min-height:50px; }
.view-week .employee-label-flex { gap:6px; align-items:center; min-width:0; }
.view-week .employee-label .avatar { width:30px; height:30px; font-size:.72rem; }
.view-week .employee-label-flex > div:last-child { min-width:0; }
.view-week .employee-name { font-size:.72rem; line-height:1.05; }
.view-week .employee-meta { margin-top:2px; font-size:.61rem; }
.view-week .employee-balance { margin-top:1px; font-size:.61rem; }
.view-week .employee-dropzone, .view-week .total-cell-employee { min-height:50px; padding:4px; }
.view-week .availability-chip.compact-status { min-height:20px; padding:2px 5px; margin-top:2px; font-size:.58rem; border-radius:6px; }
.view-week .total-hours { font-size:.68rem; }
.view-week .proposal-badge { display:none; }
.view-week .card-delete-btn { transform:scale(.78); transform-origin:top right; }
.proposal-inline-actions { display:flex; flex-wrap:wrap; align-items:center; gap:4px; margin-top:3px; }
.proposal-edit-btn, .proposal-lock-btn { border:0; background:#eef6fb; color:#245c7e; border-radius:6px; padding:3px 5px; font-size:.56rem; font-weight:850; cursor:pointer; }
.proposal-lock-form { margin:0; }
.manual-lock-badge { display:inline-flex; align-items:center; border-radius:6px; padding:3px 5px; background:#fff0c8; color:#805c00; font-size:.54rem; font-weight:900; }
.draggable-proposal-shift { cursor:grab; }
.draggable-proposal-shift.dragging { opacity:.48; }
.employee-dropzone.proposal-dragover { outline:2px dashed #4599c9; outline-offset:-2px; background:#f0f9ff; }
.candidate-pool-details { margin-top:12px; border:1px solid #e0e8f0; border-radius:12px; background:#fbfdff; overflow:hidden; }
.candidate-pool-details summary { cursor:pointer; list-style:none; display:flex; align-items:center; justify-content:space-between; gap:12px; padding:10px 12px; color:#40566f; font-size:.76rem; font-weight:900; }
.candidate-pool-details summary::-webkit-details-marker { display:none; }
.candidate-pool-details summary::before { content:'›'; width:20px; height:20px; display:grid; place-items:center; border-radius:6px; background:#edf3f7; transition:transform .15s ease; }
.candidate-pool-details[open] summary::before { transform:rotate(90deg); }
.candidate-pool-details summary span { margin-right:auto; }
.candidate-pool-details summary b { min-width:76px; text-align:center; padding:4px 7px; border-radius:999px; background:#edf6fb; color:#24678f; font-size:.64rem; }
.candidate-pool-details.zzp-pool summary { background:#f7fbfe; }
.expanded-pool { margin:0; padding:0 10px 10px; }
.expanded-pool .candidate-option { margin-top:6px; }
@media (max-width:1150px) {
  .view-week .team-roster-grid { grid-template-columns:minmax(132px,16%) repeat(7,minmax(0,1fr)) 48px !important; }
  .view-week .employee-label .avatar { display:none; }
  .view-week .employee-label { padding:5px; }
  .view-week .compact-title { font-size:.62rem; }
  .view-week .compact-time { font-size:.56rem; }
}

/* ===== V8 apart voorstelrooster ===== */
.proposal-roster-page { display:grid; gap:12px; }
.proposal-roster-hero { display:flex; align-items:flex-start; justify-content:space-between; gap:20px; padding:18px 20px; border-left:4px solid #4aa2d4; background:linear-gradient(120deg,#fbfdff,#f2faff); }
.proposal-roster-hero h1 { margin:3px 0 4px; font-size:1.32rem; color:#21344a; }
.proposal-roster-hero p { margin:0; max-width:850px; color:var(--muted); font-size:.78rem; line-height:1.45; }
.proposal-roster-hero-actions { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px; align-items:center; }
.proposal-summary-strip { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:8px; }
.proposal-summary-strip > div { background:#fff; border:1px solid #e0e8ef; border-radius:12px; padding:10px 12px; display:flex; align-items:center; justify-content:space-between; gap:8px; box-shadow:0 3px 12px rgba(35,55,79,.03); }
.proposal-summary-strip span { color:var(--muted); font-size:.68rem; font-weight:800; }
.proposal-summary-strip strong { color:#24384e; font-size:1.03rem; }
.proposal-summary-strip .has-manual { background:#fffaf0; border-color:#edd89f; }
.proposal-summary-strip .has-unresolved { background:#fff6f6; border-color:#efcaca; }
.proposal-roster-toolbar { margin:0; }
.proposal-main-actions { gap:7px; }
.compact-action-btn { min-height:38px; padding:0 11px; }
.active-filter-btn { background:#e7f5fc !important; border-color:#8cc9e9 !important; color:#17658e !important; }
.icon-btn.disabled { opacity:.35; pointer-events:none; }
.proposal-roster-shell { padding:10px; overflow:hidden; }
.proposal-roster-explain { display:flex; flex-wrap:wrap; align-items:center; gap:12px; padding:4px 4px 12px; color:#5c6e82; font-size:.68rem; font-weight:800; }
.proposal-roster-explain span { display:inline-flex; align-items:center; gap:5px; }
.proposal-roster-explain small { margin-left:auto; color:var(--muted); font-size:.65rem; font-weight:650; }
.legend-swatch { width:10px; height:10px; border-radius:3px; border:1px solid transparent; }
.legend-swatch.baseline { background:#eef3f7; border-color:#cdd9e2; }
.legend-swatch.proposed { background:#e8f5fc; border-color:#58a8d4; border-style:dashed; }
.legend-swatch.manual { background:#fff0c8; border-color:#d8af4a; }
.legend-swatch.applied { background:#e8f6ec; border-color:#72ba87; }
.legend-swatch.unresolved { background:#fdecec; border-color:#da7777; }
.proposal-team-section { margin-top:10px; }
.proposal-team-section:first-of-type { margin-top:0; }
.proposal-team-bar { padding:8px 11px; }
.proposal-team-actions { display:flex; align-items:center; gap:6px; }
.proposal-team-actions form { margin:0; }
.proposal-mini-scope { border:1px solid #d4dee7; background:#fff; color:#52677d; border-radius:8px; padding:5px 8px; font-size:.62rem; font-weight:850; cursor:pointer; }
.proposal-mini-scope.primary { background:#eef8fd; border-color:#b9dbed; color:#23698f; }
.proposal-grid-wrap { overflow-x:hidden; }
.proposal-roster-page.view-week .proposal-roster-grid { width:100%; min-width:0 !important; grid-template-columns:minmax(145px,16.5%) repeat(7,minmax(0,1fr)) minmax(50px,5%) !important; }
.proposal-left-head { min-height:48px; }
.proposal-day-head { min-height:48px !important; padding:5px 2px !important; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:3px; }
.proposal-day-head.outside-run { opacity:.42; background:#f5f6f7; }
.proposal-day-apply { border:0; border-radius:6px; padding:2px 5px; background:#edf7fc; color:#24739f; font-size:.54rem; font-weight:900; cursor:pointer; }
.proposal-coverage-label,.proposal-open-label { font-size:.68rem; }
.proposal-coverage-label small,.proposal-open-label small { display:block; font-size:.56rem; margin-top:2px; color:var(--muted); }
.proposal-coverage-cell,.proposal-unresolved-cell { min-height:40px; padding:3px !important; }
.proposal-coverage-badge { min-height:34px !important; }
.proposal-unresolved-chip { position:relative; border:1px solid #edc0c0; border-left:3px solid var(--shift-color,#cf5c5c); border-radius:7px; background:#fff7f7; padding:4px 5px; margin-bottom:3px; display:grid; gap:1px; min-width:0; }
.proposal-unresolved-chip strong { font-size:.59rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.proposal-unresolved-chip span { color:var(--muted); font-size:.53rem; }
.proposal-unresolved-chip b { color:#a84646; font-size:.54rem; }
.warning-text { color:#b24c4c !important; }
.proposal-employee-label { min-height:48px !important; }
.proposal-preview-dropzone { min-height:48px !important; padding:3px !important; transition:background .12s ease, outline .12s ease; }
.proposal-preview-dropzone.preview-dragover { background:#eff9ff; outline:2px dashed #4a9dcc; outline-offset:-2px; }
.proposal-baseline-card { opacity:.82; background:#f7f9fb; border-color:#d7e0e7; }
.proposal-applied-card { opacity:1; background:#eef9f1 !important; border-color:#9fd0ad !important; }
.view-week .proposal-badge.visible-badge { display:inline-flex !important; background:#e4f5e9; color:#287643; border-color:#b7dec2; }
.proposal-preview-card { position:relative; border:1px dashed #4d9dcc; border-left:3px solid #4d9dcc; border-radius:8px; background:linear-gradient(180deg,#f8fcff,#edf8fd); padding:5px 5px 4px; margin-bottom:3px; min-width:0; cursor:grab; box-shadow:0 2px 6px rgba(40,104,139,.05); }
.proposal-preview-card.is-manual { background:linear-gradient(180deg,#fffdf7,#fff6dd); border-color:#d2a842; border-left-color:#d2a842; }
.proposal-preview-card.dragging { opacity:.45; }
.proposal-preview-card-top { display:flex; justify-content:space-between; align-items:center; margin-bottom:1px; height:12px; }
.proposal-preview-card-top span { font-size:.55rem; }
.proposal-preview-card-top b { border-radius:999px; padding:1px 4px; background:#fff; color:#317ca5; font-size:.5rem; }
.proposal-preview-card .compact-title { font-size:.61rem !important; }
.proposal-preview-card .compact-time { font-size:.53rem !important; }
.proposal-preview-type { margin-top:2px; color:#5f7488; font-size:.49rem; font-weight:750; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.proposal-preview-actions { display:flex; gap:3px; align-items:center; margin-top:4px; }
.proposal-preview-actions > form { margin:0; }
.proposal-preview-lock,.proposal-preview-apply,.proposal-candidate-popover > summary { border:1px solid #cddce6; border-radius:6px; min-height:21px; display:grid; place-items:center; padding:2px 5px; background:#fff; color:#315f79; font-size:.51rem; font-weight:900; cursor:pointer; list-style:none; }
.proposal-preview-apply { background:#e8f6ec; border-color:#b6dcc1; color:#287344; }
.proposal-candidate-popover { position:relative; margin:0; }
.proposal-candidate-popover > summary::-webkit-details-marker { display:none; }
.proposal-candidate-menu { position:absolute; z-index:60; left:0; top:26px; width:245px; max-height:310px; overflow:auto; padding:8px; background:#fff; border:1px solid #d8e1e8; border-radius:10px; box-shadow:0 14px 35px rgba(31,51,73,.18); }
.proposal-candidate-menu > strong { display:block; padding:2px 4px 6px; color:#42586e; font-size:.64rem; }
.proposal-candidate-row { margin:0; }
.proposal-candidate-row button { width:100%; border:0; border-radius:7px; background:#fff; padding:5px; display:flex; justify-content:space-between; align-items:center; gap:8px; text-align:left; cursor:pointer; }
.proposal-candidate-row button:hover { background:#f2f8fc; }
.proposal-candidate-row.current button { background:#eaf6fc; }
.proposal-candidate-row span { display:grid; min-width:0; }
.proposal-candidate-row b { font-size:.61rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.proposal-candidate-row small { color:var(--muted); font-size:.52rem; }
.proposal-candidate-row em { font-style:normal; font-size:.57rem; color:#397ba0; font-weight:900; }
.proposal-candidate-separator { margin:5px 2px 3px; padding-top:5px; border-top:1px solid #edf0f3; color:#718093; font-size:.55rem; font-weight:900; text-transform:uppercase; }
@media (max-width:1200px) {
  .proposal-summary-strip { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .proposal-roster-page.view-week .proposal-roster-grid { grid-template-columns:minmax(125px,15%) repeat(7,minmax(0,1fr)) 46px !important; }
  .proposal-roster-explain small { width:100%; margin-left:0; }
}
@media (max-width:900px) {
  .proposal-roster-hero { flex-direction:column; }
  .proposal-roster-hero-actions { justify-content:flex-start; }
  .proposal-main-actions { width:100%; justify-content:flex-start; }
}

/* V9 uitgebreide dienst-/opdrachtgegevens */
.service-modal {
  width: min(980px, calc(100vw - 28px));
  max-height: min(92vh, 980px);
  overflow: auto;
}
.service-modal .modal-head { position: sticky; top: -18px; background:#fff; z-index:3; padding:18px 0 10px; }
.service-modal .modal-head small { display:block; margin-top:3px; color:var(--muted); }
.service-form { gap:14px 16px; }
.form-section-title {
  margin-top:5px; padding:10px 0 4px; border-bottom:1px solid #e5ebf1;
  font-weight:900; color:#263750; font-size:.92rem;
}
textarea {
  width:100%; min-height:112px; resize:vertical; border:1px solid var(--line); border-radius:12px;
  padding:11px 12px; font:inherit; line-height:1.45; color:inherit; background:#fff;
}
input[type="file"] {
  border:1px dashed #b8c7d6; border-radius:12px; padding:10px 12px; background:#fafcff; font:inherit;
}
.form-grid-inline { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.repeat-fieldset { border:1px solid var(--line); border-radius:13px; padding:12px 14px; margin:0; }
.repeat-fieldset legend { padding:0 6px; font-size:.8rem; font-weight:900; color:#405166; }
.weekday-checks { display:flex; flex-wrap:wrap; gap:9px; margin:3px 0 6px; }
.weekday-checks label { display:block; position:relative; }
.weekday-checks input { position:absolute; opacity:0; pointer-events:none; }
.weekday-checks span {
  width:38px; height:38px; border:1px solid #d5dee8; border-radius:50%; display:grid; place-items:center;
  background:#fff; color:#6f7c8c; font-weight:850; cursor:pointer;
}
.weekday-checks input:checked + span { background:#e7f5fd; border-color:#59afe2; color:#1776ad; box-shadow:inset 0 0 0 1px #59afe2; }
.custom-fields-block { border:1px solid #e1e8ef; border-radius:13px; padding:12px; background:#fbfcfe; }
.custom-fields-head { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:9px; }
.custom-fields-list { display:grid; gap:8px; }
.custom-field-row { display:grid; grid-template-columns:minmax(150px,.75fr) minmax(220px,1.6fr) 28px; gap:8px; align-items:center; }
.custom-field-row input { width:100%; min-width:0; }
.input-suffix { color:var(--muted); font-weight:500; margin-top:-3px; }
.mini-detail-btn {
  display:inline-flex; align-items:center; justify-content:center; width:22px; height:22px; border-radius:7px;
  border:1px solid #cfe0ed; background:#eef7fc; color:#176a99; text-decoration:none; font-size:.7rem; font-weight:950;
}
.inline-detail-link { color:#287eae; text-decoration:none; font-weight:800; font-size:.62rem; }
.inline-detail-link:hover { text-decoration:underline; }
.service-details-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.service-details-grid .full { grid-column:1/-1; }
.service-detail-card { padding:13px; border:1px solid var(--line); border-radius:12px; background:#fbfcfe; }
.service-detail-card strong { display:block; font-size:.75rem; color:#6c7b8e; text-transform:uppercase; letter-spacing:.035em; margin-bottom:5px; }
.service-detail-card span, .service-detail-card p { margin:0; white-space:pre-wrap; line-height:1.45; }
.attachment-list { display:grid; gap:8px; }
.attachment-row { display:flex; align-items:center; justify-content:space-between; gap:10px; padding:9px 11px; border:1px solid #e0e8ef; border-radius:10px; background:#fff; }
.attachment-row a { min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; color:#2479aa; font-weight:800; text-decoration:none; }

@media (max-width: 760px) {
  .service-modal { max-height:96vh; }
  .form-grid-inline, .service-details-grid { grid-template-columns:1fr; }
  .service-details-grid .full { grid-column:auto; }
  .custom-field-row { grid-template-columns:1fr 1fr 28px; }
}

/* V10 beschikbaarheid met tijden, afwezigheid en toeslaginstellingen */
.availability-time-grid { display:grid; grid-template-columns:1fr 1fr; gap:10px; }
.absence-dot { display:inline-block; width:9px; height:9px; border-radius:50%; margin-right:7px; vertical-align:1px; }
.absence-types-card { margin-top:18px; }
.absence-type-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:10px; }
.absence-type-item { display:grid; grid-template-columns:18px minmax(0,1fr) auto; gap:9px; align-items:center; border:1px solid var(--line); border-radius:12px; padding:11px 12px; background:#fff; }
.absence-type-item.inactive { opacity:.52; background:#f7f8fa; }
.absence-swatch { width:14px; height:14px; border-radius:4px; }
.absence-type-item strong,.absence-type-item small { display:block; }
.absence-type-item small { color:var(--muted); margin-top:2px; }
.mini-link { border:0; background:transparent; color:#357da5; cursor:pointer; font-size:.72rem; font-weight:800; }
.payroll-explain { display:grid; grid-template-columns:1fr 1fr; gap:14px; margin-bottom:18px; }
.payroll-explain > p { grid-column:1/-1; margin:0; color:var(--muted); }
.payroll-rule-summary { border:1px solid var(--line); background:#fbfcfe; padding:14px; border-radius:13px; display:grid; gap:4px; }
.payroll-rule-summary strong { margin-bottom:3px; }
.payroll-rule-summary span { color:#53677d; }
.payroll-table .compact-input { min-width:105px; max-width:130px; }
.percent-input { display:flex; align-items:center; gap:6px; }
.percent-input input { width:95px; }
.percent-input span { color:var(--muted); font-weight:800; }
.wage-source-card { margin-top:18px; }
.wage-source-card h2 { margin-top:0; }
.wage-source-card p { margin-bottom:0; color:var(--muted); }
@media(max-width:760px){ .availability-time-grid,.payroll-explain{grid-template-columns:1fr}.payroll-explain>p{grid-column:auto}.absence-type-grid{grid-template-columns:1fr} }

/* V11 compact beschikbaarheid: bewerken + alles beter in beeld */
.availability-admin-page {
  max-width: none;
  padding: 10px clamp(10px, 1.2vw, 18px) 18px;
}
.availability-titlebar { align-items:center; margin-bottom:10px; }
.availability-titlebar h1 { font-size:clamp(1.45rem,1.7vw,2rem); margin:2px 0 3px; }
.availability-titlebar p { font-size:.78rem; max-width:920px; line-height:1.35; }
.availability-title-actions { gap:6px; }
.availability-filter-card { padding:8px 10px; margin-bottom:10px; }
.availability-cleanup-btn { min-height:32px; padding:6px 9px; font-size:.65rem; }
.availability-cleanup-modal .modal-head > div { display:grid; gap:2px; }
.availability-cleanup-modal .modal-head small { color:var(--muted); font-size:.7rem; }
.planner-live-alert { position:fixed; z-index:1000; right:20px; bottom:20px; width:min(420px,calc(100vw - 24px)); display:grid; grid-template-columns:38px minmax(0,1fr) 28px; gap:10px; align-items:start; padding:14px; border:1px solid #9bccea; border-radius:15px; background:#fff; box-shadow:0 18px 48px rgba(20,48,75,.25); animation:planner-alert-in .22s ease-out; }
.planner-live-alert[hidden] { display:none !important; }
.planner-alert-icon { width:36px; height:36px; display:grid; place-items:center; border-radius:11px; background:#e4f4fd; color:#1784bd; font-size:1.05rem; font-weight:950; }
.planner-alert-copy { min-width:0; display:grid; gap:3px; }
.planner-alert-copy small { color:#2786b8; font-size:.61rem; font-weight:900; text-transform:uppercase; letter-spacing:.04em; }
.planner-alert-copy strong { color:#20364d; font-size:.8rem; line-height:1.25; }
.planner-alert-copy span { color:#687b8f; font-size:.66rem; }
.planner-alert-close { border:0; background:transparent; color:#66798c; font-size:1.1rem; cursor:pointer; }
.planner-alert-action { grid-column:2/4; justify-self:start; margin-top:3px; padding:7px 10px; border-radius:8px; background:#299bdd; color:#fff; font-size:.67rem; font-weight:850; text-decoration:none; }
.planner-alert-bell { position:relative; width:36px; height:36px; display:grid; place-items:center; border:1px solid #d6e0e9; border-radius:10px; background:#fff; color:#425a70; font-size:1.15rem; font-weight:900; text-decoration:none; }
.planner-alert-bell:hover,.planner-alert-bell.active { border-color:#68b4de; background:#eef8fe; color:#227eaf; }
.planner-alert-bell b { position:absolute; right:-5px; top:-6px; min-width:17px; height:17px; box-sizing:border-box; display:grid; place-items:center; padding:0 4px; border:2px solid #fff; border-radius:999px; background:#df3341; color:#fff; font-size:.52rem; }
.planner-alert-bell b[hidden] { display:none; }
.planner-alert-center { max-width:1120px; }
.planner-alert-list { display:grid; gap:7px; }
.planner-alert-row { display:grid; grid-template-columns:36px minmax(0,1fr) auto; gap:11px; align-items:center; padding:11px; border:1px solid #e0e7ed; border-radius:11px; background:#fff; }
.planner-alert-row.unread { border-color:#9bceea; background:#f4fbff; box-shadow:inset 3px 0 #2d9edc; }
.planner-alert-row .planner-alert-icon { width:32px; height:32px; font-size:.8rem; }
.planner-alert-row-copy { min-width:0; display:grid; gap:2px; }
.planner-alert-row-copy strong { color:#233a50; font-size:.76rem; }
.planner-alert-row-copy span { color:#536a80; font-size:.67rem; }
.planner-alert-row-copy small { color:#8391a0; font-size:.58rem; }
.planner-alert-row-actions { display:flex; align-items:center; gap:8px; }
@media(max-width:620px){.planner-live-alert{right:12px;bottom:12px}.planner-alert-row{grid-template-columns:32px 1fr}.planner-alert-row-actions{grid-column:2}.planner-alert-bell{width:33px;height:33px}}
@keyframes planner-alert-in { from { opacity:0; transform:translateY(12px) scale(.98); } to { opacity:1; transform:none; } }
.cleanup-warning { display:grid; gap:3px; margin-bottom:12px; padding:10px; border-radius:10px; background:#fff5e4; color:#6f5012; }
.cleanup-warning strong { font-size:.74rem; }
.cleanup-warning small { font-size:.64rem; }
.availability-filter-bar { flex-wrap:nowrap; min-width:0; }
.availability-filter-bar select { min-height:34px; min-width:220px; max-width:360px; font-size:.78rem; }
.availability-filter-summary { margin-left:auto; color:var(--muted); font-size:.7rem; font-weight:800; white-space:nowrap; }

.availability-admin-grid {
  display:grid;
  grid-template-columns:minmax(0,1.04fr) minmax(0,.96fr);
  gap:10px;
  align-items:start;
}
.availability-list-card { padding:10px; margin-bottom:10px; min-width:0; }
.compact-card-head { margin-bottom:6px; gap:8px; }
.compact-card-head h2 { font-size:.92rem; margin-bottom:2px; }
.compact-card-head p { font-size:.68rem; line-height:1.28; }
.compact-counter {
  display:inline-flex; align-items:center; justify-content:center; min-width:28px; height:24px; padding:0 7px;
  border-radius:999px; background:#edf5fb; color:#2e7199; font-size:.68rem; font-weight:900;
}
.availability-table-wrap {
  overflow-x:hidden;
  overflow-y:auto;
  max-height:calc(100vh - 250px);
  min-height:270px;
  scrollbar-gutter:stable;
}
.availability-compact-table { min-width:0 !important; table-layout:fixed; }
.availability-compact-table th {
  position:sticky; top:0; z-index:2; background:#fff;
  padding:6px 5px; font-size:.61rem; letter-spacing:.025em;
}
.availability-compact-table td { padding:6px 5px; font-size:.72rem; line-height:1.2; }
.availability-compact-table td small { font-size:.59rem; margin-top:1px; }
.availability-compact-table .status-pill { padding:3px 6px; font-size:.59rem; max-width:100%; overflow:hidden; text-overflow:ellipsis; }
.availability-table .col-date { width:76px; }
.availability-table .col-person { width:25%; }
.availability-table .col-status { width:105px; }
.availability-table .col-time { width:83px; }
.availability-table .col-note { width:auto; }
.availability-table .col-actions { width:58px; }
.leave-table .col-period { width:91px; }
.leave-table .col-person { width:24%; }
.leave-table .col-type { width:25%; }
.leave-table .col-time { width:82px; }
.leave-table .col-status { width:89px; }
.leave-table .col-actions { width:58px; }
.nowrap-cell { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.compact-person-cell { overflow:hidden; }
.compact-person-cell strong { display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.compact-type-cell { overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.compact-type-cell > span:last-child { overflow:hidden; text-overflow:ellipsis; }
.compact-note { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:#53657a; }
.period-cell strong,.period-cell small { display:block; white-space:nowrap; }
.compact-action-cell { display:flex; align-items:center; justify-content:flex-end; gap:4px; white-space:nowrap; }
.compact-action-cell form { margin:0; }
.mini-edit-btn,.compact-icon-btn {
  width:24px; height:24px; padding:0; display:inline-flex; align-items:center; justify-content:center;
  border-radius:7px; font-size:.72rem; font-weight:900; cursor:pointer;
}
.mini-edit-btn { border:1px solid #c9dce8; background:#eef7fc; color:#2377a4; }
.mini-edit-btn:hover { background:#dff1fb; border-color:#9fc7dc; }
.compact-icon-btn { width:24px !important; height:24px !important; }

.availability-details-card { padding:0; overflow:hidden; margin-top:0; }
.availability-details-card > summary {
  list-style:none; cursor:pointer; display:flex; align-items:center; justify-content:space-between; gap:12px;
  padding:10px 12px; user-select:none;
}
.availability-details-card > summary::-webkit-details-marker { display:none; }
.availability-details-card > summary strong,.availability-details-card > summary small { display:block; }
.availability-details-card > summary strong { font-size:.82rem; }
.availability-details-card > summary small { margin-top:2px; color:var(--muted); font-size:.65rem; }
.availability-details-card > summary:before { content:'▸'; color:#6a7a8d; font-weight:900; }
.availability-details-card[open] > summary:before { content:'▾'; }
.availability-details-card > summary > span:first-of-type { flex:1; }
.details-card-body { border-top:1px solid var(--line); padding:10px 12px 12px; }
.details-card-actions { display:flex; justify-content:flex-end; margin-bottom:8px; }
.availability-admin-page .absence-type-grid { grid-template-columns:repeat(auto-fit,minmax(205px,1fr)); gap:7px; }
.availability-admin-page .absence-type-item { padding:8px 9px; }
.availability-admin-page .absence-type-item strong { font-size:.72rem; }
.availability-admin-page .absence-type-item small { font-size:.61rem; }

@media (max-width: 1250px) {
  .availability-admin-grid { grid-template-columns:1fr; }
  .availability-table-wrap { max-height:390px; }
  .availability-filter-summary { display:none; }
}
@media (max-width: 760px) {
  .availability-filter-bar { flex-wrap:wrap; }
  .availability-filter-bar select { width:100%; max-width:none; }
  .availability-table-wrap { overflow-x:auto; max-height:360px; }
  .availability-compact-table { min-width:650px !important; }
}


/* ===== V12 extra compacte roosterweergave ===== */
/* Compact is standaard; de knop kan terugschakelen naar een ruimere stand. */
.layout-shell { grid-template-columns:clamp(235px,19vw,305px) minmax(0,1fr); gap:9px; }
.left-shell-head { padding:8px; gap:7px; }
.left-shell-title { font-size:.82rem; }
.left-shell-toggle { min-width:165px; min-height:34px; padding:0 10px; font-size:.75rem; border-radius:9px; }
.left-shell-toggle-icon { font-size:1rem; }
.left-tabs { padding:6px 8px 0; gap:5px; }
.left-tab { padding:8px 10px; border-radius:9px 9px 0 0; font-size:.76rem; }
.left-pane { padding:8px; }
.left-pane-actions { gap:6px; margin-bottom:6px; }
.pane-search { min-height:34px; border-radius:9px; padding:0 9px; font-size:.75rem; }
.pane-icon { font-size:1rem; }
.square-btn { width:36px; min-width:36px; min-height:34px; font-size:1.2rem; border-radius:9px; }
.template-list,.team-list { gap:6px; }
.template-card {
  display:grid; grid-template-columns:minmax(0,1fr); align-items:stretch; gap:5px;
  border-width:1.5px; border-radius:10px; padding:7px 8px 7px 15px; min-height:0;
}
.template-card::before { left:6px; top:6px; bottom:6px; width:4px; }
.template-card-title { padding-left:0; font-size:.76rem; line-height:1.1; }
.template-card-time { padding-left:0; margin-top:2px; font-size:.66rem; line-height:1; }
.template-card-requirements {
  margin-top:3px !important; padding-left:0; font-size:.59rem !important; line-height:1.1 !important;
  white-space:nowrap; overflow:hidden; text-overflow:ellipsis;
}
.template-card-actions { gap:4px; padding-top:2px; }
.copy-mini-btn { min-height:24px; border-radius:7px; padding:0 7px; font-size:.61rem; line-height:1; }
.team-list-link { gap:8px; padding:7px 7px; border-radius:8px; font-size:.73rem; }
.team-color { width:18px; height:18px; border-radius:5px; }

.roster-topline { padding:8px 10px; gap:8px; }
.roster-topline h1 { font-size:1rem; line-height:1.1; }
.roster-topline p { margin-top:2px; font-size:.68rem; }
.roster-topline-actions { gap:5px; }
.roster-topline-actions .tool-btn { min-height:30px; padding:0 9px; font-size:.65rem; border-radius:8px; }
.team-section { margin-bottom:12px; }
.team-section-bar { padding:4px 3px 6px; gap:7px; min-height:34px; }
.team-section-heading { display:flex; align-items:center; gap:6px; min-width:0; }
.team-section-title { font-size:.88rem; line-height:1.08; }
.team-section-subtitle { margin-top:1px; font-size:.61rem; line-height:1.1; }
.team-auto-btn { min-height:28px !important; padding:0 8px !important; font-size:.61rem !important; border-radius:8px !important; }
.team-collapse-btn {
  width:26px; height:26px; flex:0 0 26px; display:grid; place-items:center; border:1px solid var(--line);
  border-radius:7px; background:#fff; color:#64778d; font-size:.76rem; font-weight:900;
}
.team-section.is-collapsed .team-grid-wrap { display:none; }
.team-section.is-collapsed { margin-bottom:5px; }
.team-section.is-collapsed .team-section-bar { border:1px solid var(--line); background:#fff; border-radius:9px; padding:5px 7px; }

.team-panel-head.left-header { min-height:44px; padding:6px 7px; gap:6px; }
.team-bullet { width:22px; height:22px; border-width:3px; }
.team-head-name { font-size:.76rem; line-height:1.08; }
.team-head-sub { margin-top:1px; font-size:.59rem; line-height:1.08; }
.day-head { min-height:44px; padding:4px 2px; font-size:.75rem; }
.day-head.today::before { top:2px; padding:2px 5px; font-size:.49rem; }
.row-label { min-height:40px; padding:7px 8px; font-size:.76rem; line-height:1.08; }
.row-label small { margin-top:2px; font-size:.59rem; line-height:1.15; }
.schedule-cell { min-height:40px; padding:4px; }
.label-publish,.publication-cell,.publication-total-cell { min-height:38px !important; height:auto; }
.publication-toggle { min-height:26px; padding:4px 5px; font-size:.57rem; border-radius:7px; }
.coverage-row-cell,.open-row-cell { padding:4px 3px; }
.employee-dropzone { min-height:46px; padding:4px; }
.employee-label { min-height:46px !important; }

/* Bovenste bedieningsbalk ook compacter. */
.toolbar { padding:7px 8px; gap:7px; margin-bottom:8px; }
.toolbar-left,.toolbar-right,.view-switch,.nav-pill-group,.toolbar-form-inline { gap:6px; }
.view-tab,.icon-btn,.date-pill,.tool-btn,.toolbar-select,.primary-btn,.primary-soft-btn {
  min-height:34px; padding:0 10px; border-radius:9px; font-size:.72rem;
}
.date-pill { min-width:125px; }
.toolbar-select { min-width:min(100%,170px); }
.compact-toolbar-btn { background:#f7fafc; }

/* Week gebruikt nog iets meer ruimte voor de dagkolommen. */
.view-week .team-roster-grid { grid-template-columns:minmax(118px,14.5%) repeat(7,minmax(0,1fr)) 42px !important; }
.view-week .team-panel-head.left-header { min-height:42px; }
.view-week .day-head { min-height:42px; font-size:.68rem; }
.view-week .row-label { padding:5px 6px; min-height:36px; font-size:.68rem; }
.view-week .row-label small { font-size:.53rem; }
.view-week .employee-label { min-height:42px; padding:4px 5px; }
.view-week .employee-dropzone { min-height:42px; }

/* Ruime stand voor planners die bewust grotere elementen willen. */
html[data-roster-density="comfortable"] .layout-shell { grid-template-columns:clamp(280px,23vw,360px) minmax(0,1fr); gap:12px; }
html[data-roster-density="comfortable"] .left-shell-head { padding:12px; gap:10px; }
html[data-roster-density="comfortable"] .left-shell-title { font-size:1rem; }
html[data-roster-density="comfortable"] .left-shell-toggle { min-width:220px; min-height:42px; padding:0 14px; font-size:.88rem; border-radius:12px; }
html[data-roster-density="comfortable"] .left-tabs { padding:10px 12px 0; gap:10px; }
html[data-roster-density="comfortable"] .left-tab { padding:12px 16px; font-size:.95rem; }
html[data-roster-density="comfortable"] .left-pane { padding:12px; }
html[data-roster-density="comfortable"] .left-pane-actions { gap:10px; margin-bottom:10px; }
html[data-roster-density="comfortable"] .pane-search { min-height:42px; font-size:.9rem; }
html[data-roster-density="comfortable"] .square-btn { width:48px; min-width:48px; min-height:42px; font-size:1.5rem; }
html[data-roster-density="comfortable"] .template-list { gap:10px; }
html[data-roster-density="comfortable"] .template-card { padding:10px 10px 10px 18px; gap:7px; border-radius:14px; }
html[data-roster-density="comfortable"] .template-card-title { font-size:.92rem; }
html[data-roster-density="comfortable"] .template-card-time { font-size:.8rem; }
html[data-roster-density="comfortable"] .template-card-requirements { font-size:.67rem !important; }
html[data-roster-density="comfortable"] .copy-mini-btn { min-height:30px; padding:0 10px; font-size:.72rem; }
html[data-roster-density="comfortable"] .roster-topline { padding:12px 14px; }
html[data-roster-density="comfortable"] .roster-topline h1 { font-size:1.35rem; }
html[data-roster-density="comfortable"] .roster-topline p { font-size:.85rem; margin-top:4px; }
html[data-roster-density="comfortable"] .team-section { margin-bottom:22px; }
html[data-roster-density="comfortable"] .team-section-bar { padding:8px 4px 11px; min-height:44px; }
html[data-roster-density="comfortable"] .team-section-title { font-size:1.15rem; }
html[data-roster-density="comfortable"] .team-section-subtitle { font-size:.75rem; }
html[data-roster-density="comfortable"] .team-panel-head.left-header { min-height:58px; padding:10px; }
html[data-roster-density="comfortable"] .team-bullet { width:30px; height:30px; }
html[data-roster-density="comfortable"] .team-head-name { font-size:.95rem; }
html[data-roster-density="comfortable"] .team-head-sub { font-size:.72rem; }
html[data-roster-density="comfortable"] .row-label { min-height:52px; padding:10px 12px; font-size:.92rem; }
html[data-roster-density="comfortable"] .row-label small { font-size:.7rem; }
html[data-roster-density="comfortable"] .schedule-cell { min-height:52px; }
html[data-roster-density="comfortable"] .toolbar { padding:10px; margin-bottom:12px; }
html[data-roster-density="comfortable"] .view-tab,
html[data-roster-density="comfortable"] .icon-btn,
html[data-roster-density="comfortable"] .date-pill,
html[data-roster-density="comfortable"] .tool-btn,
html[data-roster-density="comfortable"] .toolbar-select,
html[data-roster-density="comfortable"] .primary-btn,
html[data-roster-density="comfortable"] .primary-soft-btn { min-height:42px; padding:0 13px; font-size:.86rem; }

@media (max-width:1180px) {
  .layout-shell { grid-template-columns:1fr; }
  .team-section-heading { width:100%; }
}

/* V13 Financieel + kosten zichtbaar in Planning */
.finance-page { padding:18px 22px 36px; max-width:1800px; margin:0 auto; }
.finance-head { display:flex; justify-content:space-between; gap:16px; align-items:flex-start; margin-bottom:12px; }
.finance-head h1 { margin:0; font-size:2rem; }
.finance-head p { margin:4px 0 0; color:var(--muted); }
.finance-toolbar { padding:9px 10px; display:flex; align-items:center; gap:10px; flex-wrap:wrap; margin-bottom:12px; }
.finance-filter-form { margin-left:auto; display:flex; gap:8px; }
.finance-filter-form select { min-height:34px; border:1px solid var(--line); border-radius:9px; background:#fff; padding:0 10px; min-width:160px; }
.finance-kpis { display:grid; grid-template-columns:repeat(6,minmax(130px,1fr)); gap:9px; margin-bottom:12px; }
.finance-kpi { background:#fff; border:1px solid var(--line); border-radius:14px; padding:12px 13px; min-width:0; }
.finance-kpi.primary { border-color:#a7dcd4; background:#f1fbf8; }
.finance-kpi span,.finance-kpi small { display:block; color:var(--muted); font-size:.68rem; }
.finance-kpi strong { display:block; font-size:1.25rem; margin:4px 0 2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.finance-warning { margin-bottom:12px; background:#fff5db; border:1px solid #f2d582; color:#745617; padding:9px 12px; border-radius:10px; font-size:.78rem; font-weight:700; }
.finance-grid-2 { display:grid; grid-template-columns:1.2fr .8fr; gap:12px; margin-bottom:12px; }
.finance-card { padding:12px; margin-bottom:12px; }
.finance-card .admin-card-head { margin-bottom:8px; }
.finance-card .admin-card-head h2 { margin:0; font-size:1rem; }
.finance-card .admin-card-head p { margin:2px 0 0; font-size:.7rem; color:var(--muted); }
.finance-table th,.finance-table td { padding:7px 8px; font-size:.7rem; white-space:nowrap; }
.finance-table th { font-size:.61rem; }
.finance-table .table-sub { display:block; color:var(--muted); font-size:.58rem; margin-top:2px; }
.finance-missing { color:#b46b00; font-size:.62rem; font-weight:800; }
.finance-employee-scroll { max-height:340px; overflow:auto; }
.finance-detail-card details summary { cursor:pointer; font-weight:800; font-size:.8rem; }
.finance-detail-scroll { max-height:360px; overflow:auto; margin-top:10px; }

.row-label-costs { background:#f4fbf8; color:#176d5e; border-top:1px solid #cfe8e1; }
.roster-cost-cell { min-height:34px !important; background:#f7fcfa; display:flex; align-items:center; justify-content:center; flex-direction:column; gap:1px; padding:3px 2px !important; text-align:center; }
.roster-cost-cell strong { color:#146e60; font-size:.62rem; line-height:1.05; white-space:normal; word-break:normal; }
.roster-cost-cell .cost-warning { color:#a76800; font-size:.47rem; line-height:1.05; }
.roster-cost-total { background:#eaf8f4; }
.total-cell-employee .total-cost { margin-top:2px; color:#146e60; font-size:.55rem; font-weight:800; line-height:1.05; text-align:center; }
.total-cell-employee .total-cost-missing { color:#a76800; font-size:.48rem; font-weight:800; text-align:center; line-height:1; }

/* Iets bredere Totalen-kolom voor uren + kosten, zonder het weekoverzicht kwijt te raken. */
.view-week .team-roster-grid { grid-template-columns:minmax(112px,14%) repeat(7,minmax(0,1fr)) 66px !important; }
.view-week .total-cell-employee { padding:3px 2px; }
.view-week .total-cell-employee .total-hours { font-size:.58rem; }

@media(max-width:1250px) {
  .finance-kpis { grid-template-columns:repeat(3,1fr); }
  .finance-grid-2 { grid-template-columns:1fr; }
}
@media(max-width:760px) {
  .finance-page { padding:10px; }
  .finance-kpis { grid-template-columns:repeat(2,1fr); }
  .finance-filter-form { width:100%; margin-left:0; }
  .finance-filter-form select { flex:1; min-width:0; }
}

/* ===== V13.3 meervoudig diensten beheren ===== */
.bulk-service-bar{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:10px 14px;margin:0 0 10px;background:#fff8e8;border:1px solid #efd49a}
.bulk-service-bar[hidden]{display:none!important}.bulk-service-bar small{display:block;color:#748196;margin-top:2px}.bulk-service-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.danger-btn{border:1px solid #f1b3b3;background:#fff0f0;color:#b4232b;border-radius:10px;padding:8px 12px;font-weight:800;cursor:pointer}
.bulk-service-check{display:none;position:absolute;top:4px;left:4px;z-index:5;width:22px;height:22px;border-radius:7px;background:white;border:1px solid #c8d4e2;align-items:center;justify-content:center;box-shadow:0 1px 4px rgba(20,35,58,.12)}
.bulk-service-check input{width:15px;height:15px;margin:0;accent-color:#1582c6}
.bulk-selection-mode .bulk-service-check{display:flex}
.bulk-selection-mode .assigned-card,.bulk-selection-mode .open-mini{padding-left:30px}
.bulk-selection-mode .draggable-open-shift,.bulk-selection-mode .draggable-proposal-shift{cursor:default}

/* V13.3.1 bulk toolbar visibility hotfix */
.bulk-service-bar{position:sticky;top:8px;z-index:120;box-shadow:0 8px 24px rgba(20,35,58,.12)}
.bulk-service-bar .bulk-service-actions button{font-weight:800}
.bulk-selection-mode [data-bulk-toggle]{background:#fff3cf;border-color:#e5bd59;color:#6e5100}

/* V14 - ZZP inkooporders, tariefafspraken en bewerkbare basisgegevens */
.zzp-rate-confirm { padding: 10px 12px; border: 1px solid #d8e4ef; border-radius: 12px; background: #f8fbfd; margin-top: 8px; }
.zzp-rate-confirm[hidden] { display: none !important; }
.team-list-actions { display:flex; gap:4px; align-items:center; }
.danger-text { color:#b92d34 !important; }
.purchase-page { padding: 22px; }
.compact-page-head { display:flex; justify-content:space-between; align-items:flex-start; gap:18px; margin-bottom:16px; }
.compact-page-head h1 { margin:0; font-size:32px; }
.compact-page-head p { margin:4px 0 0; color:#6b7b91; }
.po-kpis { margin-bottom:16px; }
.po-kpis .kpi-card.warning { border-color:#f1b44c; background:#fff9ed; }
.section-head { display:flex; justify-content:space-between; gap:16px; align-items:center; margin-bottom:14px; }
.section-head h2 { margin:0 0 3px; font-size:22px; }
.section-head p { margin:0; color:#748397; }
.po-generate-form input { min-width:145px; }
.po-table td small { display:block; color:#718098; margin-top:3px; }
.po-lines summary { cursor:pointer; font-weight:700; }
.po-line { display:grid; grid-template-columns:minmax(180px,1fr) auto auto; gap:14px; padding:8px 0; border-top:1px solid #edf1f5; align-items:center; }
.po-line span small { display:block; color:#73849a; }
.po-carpool-line{margin-top:5px;padding:9px 10px;border:1px solid #cfe2ee;border-radius:9px;background:#f2f9fd;color:#175d83}.purchase-carpool-summary td{background:#f2f9fd;color:#175d83;border-top:2px solid #b8d7e8}.assigned-carpool-option{padding:10px 12px;border:1px solid #cfe2ee;border-radius:10px;background:#f3faff}.assigned-carpool-option>span{display:flex;align-items:center;gap:8px}.assigned-carpool-option input{width:auto!important}.assigned-carpool-option small{font-weight:500;color:#60758a}
.agreement-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(330px,1fr)); gap:12px; }
.agreement-card { border:1px solid #dbe4ee; border-radius:14px; padding:14px; background:#fff; }
.agreement-title { display:flex; justify-content:space-between; gap:10px; align-items:center; }
.agreement-card > small { color:#6f7f94; }
.agreement-scope { margin:9px 0; padding:7px 9px; border-radius:9px; background:#f5f8fb; font-size:13px; color:#4b5e75; }
.compact-form-grid { margin-top:10px; }
.card-actions { display:flex; justify-content:flex-end; gap:8px; margin-top:10px; }
.mini-danger { border:0; background:transparent; color:#b92d34; font-weight:700; cursor:pointer; }
.status-pill { padding:5px 9px; border-radius:999px; background:#e9f5ef; color:#147454; font-size:12px; font-weight:800; }
.workflow-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:12px; }
.workflow-grid > div { padding:12px; border:1px solid #e1e7ef; border-radius:12px; background:#fafcfe; }
.workflow-grid p { margin:5px 0 0; color:#63758c; line-height:1.45; }
.absence-type-actions { display:flex; gap:8px; align-items:center; }
@media(max-width:1100px){ .workflow-grid{grid-template-columns:repeat(2,1fr)} .section-head{align-items:flex-start;flex-direction:column} }
@media(max-width:720px){ .workflow-grid{grid-template-columns:1fr} .agreement-grid{grid-template-columns:1fr} .po-line{grid-template-columns:1fr} }

/* V14.1 direct template -> medewerker */
.employee-dropzone.dragover-template { outline: 2px solid #2f9fe3; outline-offset: -3px; background: #eef8ff !important; }
#direct-rate-modal .modal-card { max-width: 520px; }

/* V15: tarief per individuele ZZP/BV-dienst */
.shift-rate-chip {
  margin-top: 3px; border: 1px solid #cbd7e4; background: #f8fbfe; color: #27415f;
  border-radius: 999px; padding: 2px 7px; font-size: 10px; line-height: 1.25; font-weight: 800; cursor: pointer;
}
.shift-rate-chip:hover { background: #eef6fc; border-color: #9fb5ca; }
.shift-rate-chip.rate-missing { background: #fff5e6; border-color: #f2c36b; color: #8a5b00; }
.rate-source-box { margin: 8px 0 2px; padding: 8px 10px; background: #f5f8fb; border: 1px solid #dde6ef; border-radius: 10px; font-size: 12px; }
.rate-variants summary { cursor: pointer; font-weight: 800; color: #27415f; }
.rate-variant-list { margin-top: 7px; display: grid; gap: 5px; min-width: 250px; }
.rate-variant-list > div { padding: 7px 8px; background: #f7f9fc; border: 1px solid #e0e7ef; border-radius: 9px; }
.rate-variant-list span { display: block; color: #687b91; font-size: 11px; margin-top: 2px; }
.shift-rate-history-box { margin: 8px 0 4px; border: 1px solid #dde6ef; border-radius: 10px; padding: 8px 10px; background: #fff; }
.shift-rate-history-box summary { cursor: pointer; font-size: 12px; font-weight: 800; color: #27415f; }
.shift-rate-history-list { display: grid; gap: 5px; margin-top: 7px; max-height: 180px; overflow: auto; }
.shift-rate-history-list > div { padding: 6px 7px; border-radius: 8px; background: #f7f9fc; border: 1px solid #e4eaf1; }
.shift-rate-history-list span { display: block; margin-top: 2px; font-size: 10px; color: #6b7c91; }


/* ===== V16 responsive Financieel + Inkooporder preview + Exact voorbereiding ===== */
.finance-page{width:100%;max-width:100%;min-width:0;box-sizing:border-box;overflow:hidden;padding:14px clamp(10px,1.4vw,20px) 32px}
.finance-page>*{min-width:0;max-width:100%}
.finance-toolbar{display:grid;grid-template-columns:auto minmax(260px,1fr) auto;align-items:center;width:100%}
.finance-toolbar .nav-pill-group{justify-self:center;min-width:0}
.finance-filter-form{margin-left:0;justify-self:end;min-width:0}
.finance-filter-form select{max-width:210px;min-width:135px}
.finance-kpis{grid-template-columns:repeat(6,minmax(0,1fr));width:100%}
.finance-grid-2{grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);width:100%}
.finance-grid-2>*{min-width:0;width:100%}
.finance-card{min-width:0;overflow:hidden}
.finance-card .table-scroll{width:100%;max-width:100%;overflow:auto}
.finance-card .admin-table{min-width:0;width:100%;table-layout:auto}
.finance-card .finance-table th,.finance-card .finance-table td{padding:6px 7px}
.finance-card .finance-table th:first-child,.finance-card .finance-table td:first-child{white-space:normal}
.finance-employee-scroll .admin-table{min-width:760px}
.finance-detail-scroll .admin-table{min-width:1000px}
@media(max-width:1450px){
 .finance-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}
 .finance-grid-2{grid-template-columns:minmax(0,1fr)}
 .finance-toolbar{grid-template-columns:auto minmax(220px,1fr)}
 .finance-filter-form{grid-column:1/-1;justify-self:stretch;display:grid;grid-template-columns:1fr 1fr}
 .finance-filter-form select{max-width:none;width:100%}
}
@media(max-width:820px){
 .finance-toolbar{display:flex;align-items:stretch;flex-direction:column}
 .finance-toolbar .nav-pill-group{justify-self:auto;align-self:center}
 .finance-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}
 .finance-head{flex-direction:column}
}

.purchase-page{max-width:100%;width:100%;min-width:0;overflow:hidden;padding:16px clamp(10px,1.5vw,22px) 32px}
.purchase-page .admin-card{min-width:0;overflow:hidden}
.purchase-page .table-scroll{max-width:100%;overflow:auto}
.purchase-page .po-table{min-width:900px}
.po-action-cell{white-space:nowrap}.po-action-cell small{margin-top:5px!important}.po-preview-btn{display:inline-flex;text-decoration:none;align-items:center;justify-content:center}
.exact-status-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.exact-status-strip>div{border:1px solid #e0e7ef;background:#f8fafc;border-radius:10px;padding:10px}.exact-status-strip span{display:block;color:var(--muted);font-size:.68rem}.exact-status-strip strong{display:block;margin-top:3px;font-size:.85rem}

.po-preview-page{padding:18px clamp(10px,2vw,28px) 40px;background:#eef3f8;min-height:calc(100vh - 70px)}
.po-preview-toolbar{max-width:1180px;margin:0 auto 12px;display:flex;justify-content:space-between;align-items:center;gap:10px}.po-preview-toolbar-actions{display:flex;gap:8px;align-items:center}
.purchase-document{max-width:1180px;margin:0 auto;background:#fff;border:1px solid #dfe5ec;box-shadow:0 10px 34px rgba(24,47,77,.08);padding:34px 38px;color:#17273d}
.purchase-document-head{display:flex;justify-content:space-between;gap:30px;border-bottom:2px solid #102039;padding-bottom:18px}.purchase-doc-brand{display:flex;align-items:center;gap:12px}.purchase-doc-brandmark{width:52px;height:52px;border-radius:13px;background:#102039;color:#fff;display:grid;place-items:center;font-weight:900;font-size:1.15rem}.purchase-doc-brand strong,.purchase-doc-number strong{display:block;font-size:1.25rem}.purchase-doc-brand small,.purchase-doc-number span,.purchase-doc-number small{display:block;color:#6c7d91;margin-top:3px}.purchase-doc-number{text-align:right}
.purchase-doc-parties{display:grid;grid-template-columns:1fr 1fr;gap:28px;padding:24px 0}.purchase-doc-parties>div{border-left:3px solid #dfe6ee;padding-left:14px}.purchase-doc-parties strong{display:block;font-size:1rem;margin-top:5px}.purchase-doc-parties small{display:block;color:#697a8f;margin-top:4px;line-height:1.4}.doc-label{font-size:.68rem;text-transform:uppercase;letter-spacing:.06em;color:#728298;font-weight:800}
.purchase-doc-meta{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-bottom:22px}.purchase-doc-meta>div{background:#f5f7fa;border:1px solid #e3e8ee;border-radius:9px;padding:9px 11px}.purchase-doc-meta span{display:block;color:#758499;font-size:.65rem}.purchase-doc-meta strong{display:block;margin-top:3px;font-size:.78rem}
.purchase-doc-lines{overflow:auto}.purchase-doc-lines table{width:100%;border-collapse:collapse;min-width:820px}.purchase-doc-lines th{background:#102039;color:white;text-align:left;padding:9px 8px;font-size:.68rem;text-transform:uppercase;letter-spacing:.03em}.purchase-doc-lines td{border-bottom:1px solid #e7ebf0;padding:10px 8px;font-size:.78rem}.purchase-doc-lines td small{display:block;color:#758499;margin-top:3px}.purchase-doc-lines .num{text-align:right;white-space:nowrap}
.purchase-doc-total{margin:18px 0 0 auto;width:min(350px,100%);display:flex;justify-content:space-between;align-items:center;border-top:2px solid #102039;padding-top:12px}.purchase-doc-total span{font-weight:800}.purchase-doc-total strong{font-size:1.3rem}.purchase-doc-note{margin-top:22px;padding:12px 14px;background:#f7f9fb;border-radius:9px}.purchase-doc-note p{margin:5px 0 0}.purchase-doc-footer{margin-top:28px;padding-top:14px;border-top:1px solid #dde4eb;color:#617388;font-size:.72rem}
.exact-preview-card{max-width:1180px;margin:12px auto 0;background:#fff;border:1px solid #dfe5ec;border-radius:12px;padding:14px 16px}.exact-preview-card h2{margin:0;font-size:1rem}.exact-preview-card p{margin:4px 0 10px;color:#6b7b91;font-size:.76rem}.exact-preview-status{display:flex;justify-content:space-between;gap:10px;padding:9px 11px;border-radius:9px}.exact-preview-status.pending{background:#fff7e5;color:#7d5b12}.exact-preview-status.ready{background:#eaf8f1;color:#176b4a}.exact-preview-card details{margin-top:10px}.exact-preview-card summary{cursor:pointer;font-weight:800;font-size:.76rem}.exact-preview-card pre{overflow:auto;max-height:320px;background:#0f1c2c;color:#d8e6f3;padding:12px;border-radius:8px;font-size:.68rem}

.exact-page{max-width:1500px}.exact-connection-card{display:grid;grid-template-columns:280px minmax(0,1fr);gap:16px;align-items:center;background:#fff7e5;border:1px solid #f0d18b;border-radius:14px;padding:15px;margin-bottom:14px}.exact-connection-card.connected{background:#ecfaf4;border-color:#aedecb}.exact-connection-card>div>span{display:block;color:#6b7a90;font-size:.7rem}.exact-connection-card>div>strong{display:block;font-size:1.15rem;margin:3px 0}.exact-connection-card small{color:#687a90}.exact-config-checks{display:flex;gap:7px;flex-wrap:wrap}.exact-config-checks span{padding:6px 9px;border-radius:999px;background:#f1e3bd;color:#755a17;font-weight:800;font-size:.7rem}.exact-config-checks span.ok{background:#d9f2e6;color:#176a49}.exact-mapping-form{display:grid;grid-template-columns:1.4fr 1fr 1.4fr 1.2fr auto;gap:8px;margin-bottom:12px}.exact-mapping-form input,.exact-mapping-form select{min-width:0;border:1px solid var(--line);border-radius:9px;padding:8px}.mono-cell{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:.7rem;max-width:280px;overflow:hidden;text-overflow:ellipsis}.exact-roadmap{margin-top:14px}
@media(max-width:900px){.purchase-document{padding:22px 18px}.purchase-doc-parties{grid-template-columns:1fr}.purchase-doc-meta{grid-template-columns:1fr 1fr}.exact-status-strip{grid-template-columns:1fr}.exact-connection-card{grid-template-columns:1fr}.exact-mapping-form{grid-template-columns:1fr 1fr}.exact-mapping-form button{grid-column:1/-1}.po-preview-toolbar{align-items:flex-start;flex-direction:column}.po-preview-toolbar-actions{width:100%;justify-content:space-between}}
@media print{.global-nav,.no-print{display:none!important}body{background:white}.po-preview-page{padding:0;background:white}.purchase-document{max-width:none;border:0;box-shadow:none;padding:14mm}.purchase-doc-lines table{min-width:0}.purchase-document{font-size:10pt}@page{size:A4 landscape;margin:8mm}}

/* ========================= V17 AUTH / USERS / MOBILE ========================= */
.auth-aware-nav{gap:14px}.auth-aware-nav .global-links{min-width:0;overflow-x:auto;scrollbar-width:none}.auth-aware-nav .global-links::-webkit-scrollbar{display:none}.user-menu-wrap{margin-left:auto;flex:0 0 auto;display:flex;align-items:center;gap:7px}.user-menu{position:relative}.user-menu summary{list-style:none;display:flex;align-items:center;gap:8px;cursor:pointer;border:1px solid #d7e0ec;border-radius:12px;padding:5px 8px;background:#fff}.user-menu summary::-webkit-details-marker{display:none}.user-avatar{display:grid;place-items:center;width:30px;height:30px;border-radius:9px;background:#10203a;color:#fff;font-size:11px;font-weight:900}.user-menu-name{display:flex;flex-direction:column;line-height:1.05;max-width:130px}.user-menu-name strong{font-size:12px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-menu-name small{font-size:10px;color:#73819a;text-transform:capitalize}.user-menu-popover{position:absolute;right:0;top:calc(100% + 8px);z-index:2000;min-width:210px;background:#fff;border:1px solid #d7e0ec;border-radius:14px;box-shadow:0 14px 40px rgba(20,35,58,.16);padding:7px}.user-menu-popover a{display:block;padding:10px 11px;border-radius:9px;text-decoration:none;color:#182943;font-size:13px;font-weight:700}.user-menu-popover a:hover{background:#eef6fc}.user-menu-popover .logout-link{color:#b32828;border-top:1px solid #edf1f6;margin-top:4px}

.auth-body{margin:0;min-height:100vh;background:linear-gradient(145deg,#eef4fa,#f9fbfd);font-family:Inter,Segoe UI,Arial,sans-serif;color:#15253e}.auth-shell{min-height:100vh;display:grid;place-items:center;padding:24px}.auth-card{width:min(430px,100%);background:#fff;border:1px solid #dce4ee;border-radius:26px;padding:30px;box-shadow:0 20px 55px rgba(24,44,74,.12)}.auth-card-wide{width:min(680px,100%)}.auth-brand{display:flex;align-items:center;gap:9px;margin-bottom:28px;font-size:20px}.auth-brand span{background:#11203a;color:#fff;border-radius:9px;padding:7px 9px;font-weight:900}.auth-brand strong{font-size:22px}.auth-card h1{font-size:30px;margin:0 0 8px}.muted{color:#6e7f99}.small{font-size:12px}.stack-form{display:grid;gap:15px;margin-top:22px}.stack-form label,.form-grid label{display:grid;gap:7px;font-size:13px;font-weight:800;color:#263751}.stack-form input,.form-grid input,.form-grid select{width:100%;border:1px solid #cfd9e6;border-radius:11px;padding:12px 13px;font:inherit;background:#fff;color:#172740}.primary-btn,.secondary-btn,.danger-btn{display:inline-flex;align-items:center;justify-content:center;border:0;border-radius:11px;padding:10px 15px;text-decoration:none;font-weight:800;cursor:pointer;font-size:13px}.primary-btn{background:#2e9edc;color:#fff}.secondary-btn{background:#fff;border:1px solid #ccd8e6;color:#1d2e47}.danger-btn{background:#d9363e;color:#fff}.wide{width:100%}.auth-foot{font-size:12px;color:#8391a6;text-align:center;margin:18px 0 0}.text-link{display:inline-block;margin-top:16px;color:#277fac;text-decoration:none}.notice{border-radius:12px;padding:12px 14px;margin:14px 0;font-size:13px;font-weight:700}.notice.success{background:#e7f8ef;color:#176f4f}.notice.warning{background:#fff4d8;color:#7b5b00}.notice.danger{background:#ffe9e9;color:#a7282f}.twofa-grid{display:grid;grid-template-columns:220px 1fr;gap:22px;align-items:center;margin:22px 0}.qr-image{display:block;width:210px;height:210px;border:1px solid #dbe4ee;border-radius:18px;padding:10px}.qr-fallback{width:210px;height:210px;display:grid;place-items:center;background:#f3f6fa;border:1px dashed #bccadc;border-radius:18px;color:#74839a;text-align:center}.secret-box{background:#f4f7fb;border-radius:14px;padding:15px}.secret-box small{display:block;color:#6b7a91;margin-bottom:8px}.secret-box code{display:block;word-break:break-all;font-size:15px;font-weight:800}.recovery-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:9px;margin:20px 0}.recovery-grid code{padding:12px;background:#f1f5f9;border-radius:10px;text-align:center;font-weight:900;letter-spacing:.08em}.button-row{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap}

.page-wrap{padding:22px 28px 48px;max-width:1500px;margin:0 auto}.narrow-page{max-width:980px}.page-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;margin-bottom:18px}.page-heading h1{margin:0;font-size:34px}.page-heading p{margin:6px 0 0;color:#70819b}.panel{background:#fff;border:1px solid #dce4ee;border-radius:20px;padding:20px;margin-bottom:18px;box-shadow:0 3px 14px rgba(26,50,80,.04)}.panel h2{margin:0 0 13px;font-size:21px}.form-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}.users-create-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.form-actions{display:flex;align-items:end}.check-label{display:flex!important;grid-auto-flow:column;justify-content:start;align-items:center;gap:8px!important}.check-label input,.permission-card input,.team-access-card input{width:auto!important}.responsive-table{overflow:auto}.data-table{width:100%;border-collapse:collapse;min-width:820px}.data-table th{text-align:left;color:#71819a;font-size:11px;text-transform:uppercase;letter-spacing:.05em;padding:10px;border-bottom:1px solid #dce4ee}.data-table td{padding:11px 10px;border-bottom:1px solid #edf1f5;font-size:13px}.data-table td small{display:block;color:#7a899e;margin-top:3px}.status-pill{display:inline-flex;padding:5px 8px;border-radius:999px;font-size:11px;font-weight:800}.status-pill.good{background:#e4f7ec;color:#167248}.status-pill.warn{background:#fff1cd;color:#775600}.status-pill.bad{background:#ffe3e3;color:#a1272d}.small-btn{padding:7px 10px;font-size:11px}.section-head{display:flex;justify-content:space-between;align-items:flex-start;gap:18px;margin-bottom:12px}.section-head h2{margin-bottom:3px}.section-head p{margin:0;color:#71819a}.permission-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.permission-card{display:flex;gap:9px;align-items:flex-start;border:1px solid #dce4ee;border-radius:13px;padding:11px;background:#fbfcfe}.permission-card span{display:flex;flex-direction:column}.permission-card strong{font-size:12px}.permission-card small{font-size:9px;color:#8a98aa;margin-top:3px}.disabled-grid{opacity:.45;pointer-events:none}.team-access-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.team-access-card{border:1px solid #dce4ee;border-radius:13px;padding:11px}.team-access-card>label:first-child{display:flex;gap:8px;align-items:flex-start}.team-access-card span{display:flex;flex-direction:column}.team-access-card strong{font-size:12px}.team-access-card small{font-size:10px;color:#8090a5}.mini-check{display:flex;gap:6px;align-items:center;margin:8px 0 0 24px;font-size:10px;color:#607087}.sticky-save{position:sticky;bottom:12px;z-index:20;display:flex;justify-content:flex-end;padding:10px;border-radius:15px;background:rgba(244,247,251,.9);backdrop-filter:blur(8px)}.danger-zone{border-color:#f1c9cb}.account-summary{display:grid;grid-template-columns:2fr repeat(3,1fr);gap:12px}.account-summary>div{display:flex;flex-direction:column;gap:4px}.account-summary span,.account-summary small{color:#71819a;font-size:12px}

.mobile-planning-body{margin:0;background:#f3f6fa;color:#14243c;font-family:Inter,Segoe UI,Arial,sans-serif;padding-bottom:72px}.mobile-top{position:sticky;top:0;z-index:100;background:#10203a;color:#fff;padding:12px 14px;display:flex;align-items:center;justify-content:space-between;box-shadow:0 3px 12px rgba(0,0,0,.15)}.mobile-top>div:first-child{display:flex;flex-direction:column}.mobile-top strong{font-size:17px}.mobile-top small{color:#b9c7da;font-size:11px;margin-top:2px}.mobile-user-actions{display:flex;gap:10px}.mobile-user-actions a{color:#fff;text-decoration:none;font-size:11px;font-weight:800}.mobile-planning-wrap{max-width:760px;margin:0 auto;padding:12px}.mobile-week-head{display:grid;grid-template-columns:42px 1fr 42px;align-items:center;background:#fff;border:1px solid #dce4ee;border-radius:15px;margin-bottom:12px;overflow:hidden}.mobile-week-head>a{display:grid;place-items:center;height:54px;text-decoration:none;color:#1d6f9f;font-size:28px}.mobile-week-head>div{text-align:center;display:flex;flex-direction:column}.mobile-week-head strong{font-size:14px}.mobile-week-head small{color:#75859a;font-size:10px;margin-top:2px}.mobile-day{background:#fff;border:1px solid #dce4ee;border-radius:17px;margin-bottom:12px;overflow:hidden}.mobile-day.today{border-color:#49a8dc;box-shadow:0 0 0 2px #d9f0fb}.mobile-day-title{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;background:#f8fafc;border-bottom:1px solid #e6ebf2}.mobile-day-title strong{font-size:14px}.mobile-day-title span{font-size:10px;color:#738198}.mobile-empty{padding:18px;color:#8a97a8;text-align:center;font-size:12px}.mobile-shift-card{display:grid;grid-template-columns:58px 1fr auto;gap:10px;padding:12px;border-bottom:1px solid #edf1f5}.mobile-shift-card:last-child{border-bottom:0}.mobile-shift-time{display:flex;flex-direction:column;font-weight:900;color:#152944;font-size:13px}.mobile-shift-time span{font-weight:400;color:#9aa6b6}.mobile-shift-main{display:flex;flex-direction:column;gap:3px;min-width:0}.mobile-shift-main strong{font-size:13px}.mobile-shift-main span{font-size:11px;color:#62748d}.mobile-shift-main .person-line{color:#1f7ca9;font-weight:800}.mobile-shift-main small{font-size:10px;color:#77869a}.mobile-status{align-self:start;padding:4px 6px;border-radius:999px;background:#e9f5fc;color:#236d98;font-size:9px;font-weight:900}.mobile-status.open{background:#fff0da;color:#9a6200}.open-card{background:#fffaf2}.mobile-bottom{position:fixed;left:0;right:0;bottom:0;height:58px;background:#fff;border-top:1px solid #dce4ee;display:grid;grid-template-columns:1fr 1fr;z-index:100}.mobile-bottom a{display:grid;place-items:center;text-decoration:none;color:#718098;font-size:11px;font-weight:800}.mobile-bottom a.active{color:#248ac1;background:#f3faff}

@media(max-width:1100px){.users-create-grid,.form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.permission-grid,.team-access-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.account-summary{grid-template-columns:repeat(2,1fr)}}
@media(max-width:760px){.auth-aware-nav .global-links{display:none}.user-menu-name{display:none}.page-wrap{padding:14px}.page-heading h1{font-size:26px}.users-create-grid,.form-grid,.permission-grid,.team-access-grid,.account-summary{grid-template-columns:1fr}.twofa-grid{grid-template-columns:1fr;justify-items:center}.recovery-grid{grid-template-columns:1fr}.auth-card{padding:22px}.section-head{flex-direction:column}}

/* V17.3 - template synchronisatie melding */
.template-sync-note{display:flex;gap:10px;align-items:flex-start;margin:-4px 0 14px;padding:10px 12px;border:1px solid #b9ddca;background:#eefaf3;border-radius:12px;color:#245b3d;font-size:13px;line-height:1.35}.template-sync-note strong{white-space:nowrap}.template-sync-note span{color:#587064}


/* V17.4 · dienstprioriteit */
.planning-priority-badge {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  border-radius: 999px;
  padding: 3px 8px;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.15;
  border: 1px solid #cfd8e3;
  background: #f5f7fa;
  color: #536274;
  white-space: nowrap;
}
.planning-priority-badge.critical {
  background: #ffe8e8;
  border-color: #f39a9a;
  color: #b42318;
}
.planning-priority-badge.high {
  background: #fff1dc;
  border-color: #f0b45f;
  color: #9a5b00;
}
.planning-priority-badge.normal {
  background: #eaf4ff;
  border-color: #aed0ef;
  color: #205f91;
}
.planning-priority-badge.low,
.planning-priority-badge.last {
  background: #f3f4f6;
  border-color: #d8dde4;
  color: #697586;
}
.planning-priority-badge.mini {
  padding: 2px 6px;
  font-size: 9px;
  margin-top: 2px;
}


/* V18 locatie/reiskosten */
.address-lookup-host{position:relative}
.address-suggestions{position:absolute;left:0;right:0;top:100%;z-index:1200;background:#fff;border:1px solid #cfd9e6;border-radius:12px;box-shadow:0 12px 30px rgba(17,40,70,.16);max-height:280px;overflow:auto;padding:5px;margin-top:4px}
.address-suggestions[hidden]{display:none!important}
.address-suggestions button{display:flex;flex-direction:column;gap:2px;width:100%;border:0;background:transparent;text-align:left;padding:9px 10px;border-radius:8px;cursor:pointer;color:#142a45}
.address-suggestions button:hover,.address-suggestions button:focus{background:#eef7fd;outline:none}
.address-suggestions button strong{font-size:13px}.address-suggestions button span{font-size:11px;color:#6b7f97}
.travel-chip{display:inline-flex;align-items:center;gap:4px;margin-top:4px;padding:3px 7px;border-radius:999px;background:#eef8f2;color:#17623b;border:1px solid #bee6cd;font-size:10px;font-weight:700;line-height:1.2;white-space:nowrap}
.travel-settings-card .money-input{display:flex;align-items:center;border:1px solid #ccd7e4;border-radius:9px;background:white;overflow:hidden}.travel-settings-card .money-input span{padding:0 0 0 12px;color:#64748b}.travel-settings-card .money-input input{border:0!important;box-shadow:none!important}

/* V18.2 · zichtbaarheid planning in andere teams */
.other-team-ghost-card{
  position:relative;
  margin:4px 3px;
  padding:7px 8px;
  border:1px dashed #aeb8c4;
  border-left:4px solid #8e99a6;
  border-radius:10px;
  background:repeating-linear-gradient(135deg,#eef1f4 0,#eef1f4 8px,#e8ecf0 8px,#e8ecf0 16px);
  color:#5f6b78;
  opacity:.82;
  box-shadow:none;
  pointer-events:none;
  filter:grayscale(1);
}
.other-team-ghost-card.proposal-ghost{
  background:repeating-linear-gradient(135deg,#f2f4f6 0,#f2f4f6 7px,#e9edf1 7px,#e9edf1 14px);
  border-style:dashed;
  opacity:.72;
}
.other-team-ghost-top{display:flex;align-items:center;justify-content:space-between;gap:5px;font-size:9px;font-weight:800;text-transform:uppercase;letter-spacing:.02em}
.other-team-ghost-top span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.other-team-ghost-top b{flex:0 0 auto;font-size:8px;padding:2px 5px;border-radius:999px;background:#d9dee4;color:#65717d}
.other-team-ghost-title{font-size:11px;font-weight:850;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:3px}.other-team-ghost-time{font-size:10px;color:#77828e;margin-top:1px}
.employee-dropzone:has(.other-team-ghost-card){background-image:linear-gradient(rgba(151,160,171,.035),rgba(151,160,171,.035))}

/* V18.3 - gebruikersbeveiliging/herstel */
.security-recovery-panel{border-color:#f2c7c7;background:linear-gradient(180deg,#fff 0%,#fffafa 100%)}
.security-status-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px;margin:14px 0 18px}
.security-status-grid>div{border:1px solid #dfe6ee;border-radius:12px;padding:12px;background:#fff;min-width:0}
.security-status-grid small{display:block;color:#708096;margin-bottom:4px}
.security-status-grid strong{display:block;overflow-wrap:anywhere}
@media(max-width:980px){.security-status-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:600px){.security-status-grid{grid-template-columns:1fr}.security-recovery-panel .form-grid{grid-template-columns:1fr}}

/* V19 · live teams, veldportal en veilige roosterverwijdering */
.team-checkbox-grid.loading{opacity:.55;pointer-events:none}.team-live-help{display:block;margin-top:8px}.empty-team-grid{padding:18px;border:1px dashed #cbd5e1;border-radius:12px;color:#64748b}.roster-delete-form{margin-top:16px;padding-top:14px;border-top:1px solid #e2e8f0;display:flex;align-items:center;gap:12px;flex-wrap:wrap}.roster-delete-form small{color:#64748b;max-width:420px}
.mobile-selfservice-wrap{padding-bottom:90px}.mobile-panel{background:#fff;border:1px solid #dbe4ee;border-radius:16px;padding:16px;margin:12px 0;box-shadow:0 5px 18px rgba(15,36,60,.05)}.mobile-panel h2{margin:0 0 5px;font-size:20px}.mobile-panel p{margin:0 0 14px;color:#64748b}.mobile-panel-head{display:flex;justify-content:space-between;gap:12px}.mobile-form{display:grid;gap:12px}.mobile-form label{display:grid;gap:5px;font-weight:700;color:#26364b}.mobile-form input,.mobile-form select{width:100%;padding:12px;border:1px solid #cbd6e2;border-radius:10px;background:#fff;font:inherit}.mobile-form small,.mobile-muted{color:#6b7f95;font-size:12px}.mobile-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.mobile-primary{border:0;border-radius:10px;background:#2f9fe3;color:#fff;font-weight:800;padding:12px 14px;cursor:pointer}.mobile-primary.compact{padding:9px 12px}.mobile-mini{border:1px solid #cbd6e2;background:#fff;border-radius:9px;padding:8px 10px;font-weight:700;cursor:pointer}.mobile-mini.danger{color:#b42318;border-color:#f1b8b4}.mobile-alert{padding:12px 14px;border-radius:12px;margin:12px 0;font-weight:700}.mobile-alert.error{background:#fee4e2;color:#912018}.mobile-alert.success{background:#e8f8ef;color:#12683a}.mobile-request-row,.mobile-open-card,.mobile-clock-card{display:flex;gap:12px;justify-content:space-between;align-items:flex-start;padding:13px 0;border-top:1px solid #edf1f5}.mobile-request-row:first-of-type,.mobile-open-card:first-of-type,.mobile-clock-card:first-of-type{border-top:0}.mobile-request-row>div,.mobile-clock-card>div:first-child{display:grid;gap:3px}.mobile-request-row span,.mobile-request-row small,.mobile-clock-card span,.mobile-clock-card small{color:#66788b}.mobile-open-card .mobile-shift-main{flex:1}.mobile-open-actions{display:flex;align-items:center}.application-status{font-weight:800;color:#8a5b00!important}.clock-status{min-width:105px;display:grid;gap:3px;text-align:right}.mobile-clock-actions{min-width:100px}.mobile-clock-card.today{background:#f6fbff;margin:0 -8px;padding-left:8px;padding-right:8px;border-radius:10px}.mobile-extra{width:100%;margin-top:8px}.mobile-extra summary{cursor:pointer;font-weight:700}.mobile-form.inline{margin-top:10px}.mobile-bottom-four{grid-template-columns:repeat(4,1fr)!important}.field-request-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}.request-review-card{padding:14px 0;border-top:1px solid #edf1f5;display:grid;gap:12px}.request-review-card:first-of-type{border-top:0}.request-review-card>div:first-child{display:grid;gap:4px}.request-review-card span,.request-review-card small{color:#66788b}.request-review-actions{display:grid;gap:8px}.request-review-actions form{display:flex;gap:8px}.request-review-actions input{min-width:0;flex:1}.request-review-actions.horizontal{display:flex;flex-wrap:wrap}.request-review-actions.horizontal form{flex:1}.request-review-actions.horizontal input{min-width:120px}
@media(max-width:900px){.field-request-grid{grid-template-columns:1fr}.mobile-open-card,.mobile-clock-card{flex-wrap:wrap}.mobile-clock-actions{width:100%}.mobile-clock-actions form,.mobile-clock-actions button{width:100%}.clock-status{text-align:left;min-width:0}.mobile-form-grid{grid-template-columns:1fr 1fr}}
@media(max-width:480px){.mobile-form-grid{grid-template-columns:1fr}.mobile-bottom-four a{font-size:12px;padding-inline:4px}}
.mobile-response-row{margin-top:8px;padding-top:8px;border-top:1px solid #edf1f5;display:grid;gap:6px}.mobile-response-row form{display:flex;gap:6px;flex-wrap:wrap}.mobile-mini.accept{color:#12683a;border-color:#9ed4b7;background:#f0fbf5}

/* V20 - compact gegroepeerd hoofdmenu */
.grouped-nav{overflow:visible!important;flex-wrap:nowrap!important;gap:4px!important}
.nav-group{position:relative;flex:0 0 auto}
.nav-group>summary{list-style:none;cursor:pointer;padding:10px 12px;border-radius:10px;color:#526177;font-weight:800;font-size:.88rem;display:flex;align-items:center;gap:5px;white-space:nowrap}
.nav-group>summary::-webkit-details-marker{display:none}
.nav-group>summary:hover,.nav-group>summary.active,.nav-group[open]>summary{background:#eaf5fc;color:var(--primary-dark)}
.nav-group-menu{position:absolute;top:calc(100% + 7px);left:0;z-index:2100;min-width:220px;background:#fff;border:1px solid #d8e1ec;border-radius:14px;box-shadow:0 15px 40px rgba(19,37,62,.17);padding:7px;display:flex;flex-direction:column;gap:2px}
.nav-group-menu a{display:block!important;padding:10px 11px!important;border-radius:9px!important;white-space:nowrap}
.nav-group-menu a.active{background:#eaf5fc!important;color:var(--primary-dark)!important}
@media(max-width:1180px){.global-links>a,.nav-group>summary{padding-left:9px;padding-right:9px;font-size:.82rem}.global-brand span strong{font-size:.95rem}}
@media(max-width:760px){.nav-group-menu{position:static;box-shadow:none;border:0;padding:4px 0}}

/* V20 - functies versus competenties */
.function-chip{background:#e8f2ff!important;border-color:#bdd7f5!important;color:#1d5d8d!important}
.training-chip{background:#edf9f0!important;border-color:#c6e8cf!important;color:#267341!important}
.template-card-requirements.function-req{color:#275c88}
.template-card-requirements.training-req{color:#2d7446}
.catalog-explainer{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.catalog-explainer>div{border:1px solid #dde5ef;border-radius:13px;padding:14px;background:#f9fbfd}
.catalog-explainer strong{display:block;margin-bottom:5px}.catalog-explainer p{margin:0;color:#66768b;font-size:.9rem;line-height:1.45}
.inline-category-form{display:flex;align-items:center;gap:8px}.inline-category-form select{min-width:210px}
.role-catalog-table code{font-size:.82rem;background:#f2f5f8;border-radius:6px;padding:3px 6px}
@media(max-width:900px){.catalog-explainer{grid-template-columns:1fr}}

/* V20.1 · duidelijke meerdagenselectie + open-dienst verwijderknop */
.multi-day-fieldset{background:#f8fbfe;border-color:#c9dceb;padding:14px 16px}
.weekday-quick-actions{display:flex;flex-wrap:wrap;gap:7px;margin:2px 0 10px}
.weekday-date-checks{display:grid;grid-template-columns:repeat(7,minmax(64px,1fr));gap:8px;width:100%}
.weekday-date-checks label{min-width:0}
.weekday-date-checks span{width:100%;height:auto;min-height:58px;border-radius:11px;display:flex;flex-direction:column;gap:2px;align-items:center;justify-content:center;padding:7px 4px;box-sizing:border-box}
.weekday-date-checks span strong{font-size:.78rem;line-height:1}
.weekday-date-checks span small{font-size:.64rem;font-weight:700;color:#7b8898;white-space:nowrap}
.weekday-date-checks input:checked + span small{color:#397da5}
.open-mini{padding-right:38px!important}
.open-delete-form{position:absolute!important;top:5px;right:5px;z-index:8;display:block!important;margin:0!important}
.open-delete-form .mini-delete-btn{width:27px;height:27px;border-radius:9px;box-shadow:0 1px 4px rgba(62,25,25,.08)}
.view-week .open-mini{padding-right:36px!important}
.view-week .open-delete-form{top:4px;right:4px}
.view-week .open-delete-form .mini-delete-btn{width:25px;height:25px;font-size:.92rem}
@media(max-width:820px){.weekday-date-checks{grid-template-columns:repeat(4,1fr)}}

/* V20.2 · nieuwe open-dienstkaart + altijd zichtbare meerdagenselectie */
.service-day-selector{
  border:2px solid #8fc9ec;
  border-radius:16px;
  padding:14px;
  background:linear-gradient(180deg,#f5fbff 0%,#eef8fe 100%);
  box-shadow:0 4px 14px rgba(38,126,174,.08);
  margin-bottom:2px;
}
.service-day-selector-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;margin-bottom:12px}
.service-day-selector-head>div:first-child{display:flex;flex-direction:column;gap:3px}
.service-day-selector-head strong{font-size:1rem;color:#18344f}
.service-day-selector-head small{color:#687b8f;font-size:.78rem;line-height:1.35}
.service-day-selector .weekday-quick-actions{margin:0;justify-content:flex-end}
.service-day-buttons{display:grid;grid-template-columns:repeat(7,minmax(72px,1fr));gap:8px}
.service-day-button{position:relative;display:block;min-width:0}
.service-day-button input{position:absolute;opacity:0;pointer-events:none}
.service-day-button span{
  min-height:76px;
  border:1px solid #cbd9e7;
  border-radius:12px;
  background:#fff;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:3px;
  cursor:pointer;
  user-select:none;
  transition:.12s ease;
}
.service-day-button span strong{font-size:.84rem;line-height:1;color:#31465c}
.service-day-button span small{font-size:.72rem;font-weight:800;color:#718196}
.service-day-button span em{font-size:.63rem;font-style:normal;color:#8a98a8;opacity:0}
.service-day-button:hover span{border-color:#6cb5df;background:#f9fdff}
.service-day-button input:checked + span{background:#dff3ff;border-color:#2f9fe3;box-shadow:inset 0 0 0 1px #2f9fe3;color:#0b6da8}
.service-day-button input:checked + span strong,.service-day-button input:checked + span small{color:#0b6da8}
.service-day-button input:checked + span em{opacity:1;color:#0b78b5;font-weight:850}

/* Open dienst: alles blijft binnen de kaart. */
.open-mini.open-service-card{
  display:block!important;
  position:relative;
  min-height:94px!important;
  padding:10px 10px 9px 18px!important;
  border-radius:13px!important;
  overflow:hidden;
  box-sizing:border-box;
}
.open-mini.open-service-card::before{left:7px;top:10px;bottom:10px;width:5px}
.open-service-head{display:flex;align-items:baseline;gap:8px;min-width:0;padding-right:30px;margin-bottom:10px}
.open-service-head .compact-title{flex:1;min-width:0;max-width:none!important;font-size:.78rem;font-weight:850;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.open-service-head .compact-time{flex:0 0 auto;font-size:.72rem;white-space:nowrap;color:#718197}
.open-service-footer{display:flex;align-items:center;justify-content:space-between;gap:8px;min-width:0}
.open-service-meta{display:flex;align-items:center;gap:6px;min-width:0;flex:1}
.open-service-card .planning-priority-badge.mini{margin:0;max-width:96px;overflow:hidden;text-overflow:ellipsis}
.open-service-card .mini-detail-btn{width:26px;height:26px;flex:0 0 26px;font-size:.78rem;border-radius:8px}
.open-service-card .mini-action-btn{width:26px;height:26px;flex:0 0 26px;font-size:.75rem;border-radius:8px;padding:0}
.open-service-card .coverage-count{
  position:static!important;
  flex:0 0 auto;
  min-width:46px!important;
  padding:7px 8px!important;
  font-size:.72rem!important;
  line-height:1!important;
  margin:0!important;
}
.open-service-card .open-delete-form{position:absolute!important;top:7px!important;right:7px!important;z-index:8;margin:0!important}
.open-service-card .open-delete-form .mini-delete-btn{width:26px!important;height:26px!important;border-radius:8px!important;background:#fff2f2!important;border:1px solid #ffd2d2!important;box-shadow:none!important}
.view-week .open-mini.open-service-card{padding:9px 9px 8px 17px!important;min-height:88px!important}
.view-week .open-service-head{gap:6px;margin-bottom:8px;padding-right:28px}
.view-week .open-service-head .compact-title{font-size:.72rem}
.view-week .open-service-head .compact-time{font-size:.68rem}
.view-week .open-service-card .mini-action-btn{display:none!important}
.view-week .open-service-card .coverage-count{min-width:42px!important;padding:6px 7px!important;font-size:.68rem!important}
.view-week .open-service-card .planning-priority-badge.mini{font-size:.65rem!important;padding:3px 6px!important}

@media(max-width:900px){
  .service-day-selector-head{flex-direction:column}
  .service-day-selector .weekday-quick-actions{justify-content:flex-start}
  .service-day-buttons{grid-template-columns:repeat(4,1fr)}
}
@media(max-width:560px){.service-day-buttons{grid-template-columns:repeat(2,1fr)}}


/* V20.3 · bestaande dienst op meerdere dagen inplannen */
.edit-service-day-selector{margin-bottom:14px}
.edit-service-day-selector .service-day-button.is-current span{background:#eaf7ef;border-color:#72c394;box-shadow:inset 0 0 0 1px #72c394;cursor:default}
.edit-service-day-selector .service-day-button.is-current span strong,.edit-service-day-selector .service-day-button.is-current span small,.edit-service-day-selector .service-day-button.is-current span em{color:#1d7041}
.edit-service-day-selector .service-day-button.is-current span em{opacity:1;font-weight:850}
.edit-day-copy-note{margin-top:11px;padding:10px 12px;border-radius:10px;background:#fff;border:1px solid #d6e3ee;color:#5f7185;font-size:.78rem;line-height:1.4}
.edit-day-copy-note strong{color:#29445e}

.open-service-edit-link{color:inherit;text-decoration:none;display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.open-service-edit-link:hover{text-decoration:underline;text-underline-offset:2px}


/* V20.4 · cross-team/rooster ghost duidelijker zichtbaar */
.other-team-ghost-card{opacity:.94;background:repeating-linear-gradient(135deg,#e6eaee 0,#e6eaee 8px,#dce2e7 8px,#dce2e7 16px);border-color:#8d99a6;color:#4e5a67;min-height:42px}
.proposal-roster-page .other-team-ghost-card{min-height:34px;padding:5px 7px;background:linear-gradient(135deg,#eef1f4,#e3e7eb);border:1px dashed #aab3bc;box-shadow:none;opacity:.78}
.proposal-roster-page .other-team-ghost-top b{background:#d7dde3;font-size:7px}.proposal-roster-page .other-team-ghost-title{font-size:10px;margin-top:1px}.proposal-roster-page .other-team-ghost-time{font-size:9px}
.identity-combined-badge{display:inline-flex;margin-left:4px;padding:1px 5px;border-radius:999px;background:#e7eef5;color:#56677b;font-size:8px;font-weight:800;vertical-align:1px}
.other-team-ghost-card.proposal-ghost{opacity:.86}
.employee-dropzone:has(.other-team-ghost-card){background:#f5f7f9!important}

/* V20.16 · ultracompact rooster met details bij aanwijzen */
.layout-shell.sidebar-collapsed{grid-template-columns:42px minmax(0,1fr)}
.left-shell.collapsed{width:42px;min-height:54px}
.left-shell.collapsed .left-shell-head{padding:7px 4px}
.left-shell.collapsed .left-shell-toggle{width:32px;height:38px;min-height:38px;border-radius:9px;padding:0}
.left-shell.collapsed .left-shell-toggle-icon{font-size:1rem}

.view-week .employee-label,
.proposal-roster-page .proposal-employee-label{min-height:38px!important;padding:4px 6px}
.view-week .employee-dropzone,
.view-week .total-cell-employee,
.proposal-roster-page .proposal-preview-dropzone{min-height:38px!important;padding:2px!important}
.view-week .employee-label .avatar,
.proposal-roster-page .proposal-employee-label .avatar{width:25px;height:25px;font-size:.62rem}
.view-week .employee-name,.proposal-roster-page .employee-name{font-size:.67rem}
.view-week .employee-meta,.proposal-roster-page .employee-meta{font-size:.54rem;margin-top:1px}
.employment-type-badge{display:inline-flex;padding:1px 4px;border-radius:999px;background:#e8f3fa;color:#27688d;font-size:.5rem;font-weight:900}
.employment-type-badge.type-zzp{background:#fff2dc;color:#916018}

.view-week .assigned-card.compact-card,
.proposal-roster-page .assigned-card.compact-card,
.proposal-roster-page .proposal-preview-card,
.other-team-ghost-card{
  min-height:24px!important;
  height:24px;
  padding:3px 5px 3px 9px!important;
  margin:1px 0!important;
  border-radius:6px!important;
  display:block;
  overflow:visible;
}
.view-week .assigned-card.compact-card::before,
.proposal-roster-page .assigned-card.compact-card::before{left:3px;top:3px;bottom:3px;width:3px}
.view-week .compact-card .compact-title,
.proposal-roster-page .compact-title,
.other-team-ghost-title{font-size:.59rem!important;line-height:17px!important;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin:0}
.view-week .compact-card .assigned-card-subrow,
.view-week .compact-card .shift-rate-chip,
.view-week .compact-card .proposal-inline-actions,
.view-week .compact-card .card-delete-form,
.proposal-roster-page .compact-time,
.proposal-roster-page .proposal-preview-card-top,
.proposal-roster-page .proposal-preview-type,
.other-team-ghost-top,
.other-team-ghost-time{display:none!important}
.proposal-roster-page .proposal-preview-actions{position:absolute;z-index:15;right:2px;top:25px;display:none;padding:3px;border:1px solid #d3dee7;border-radius:7px;background:#fff;box-shadow:0 5px 16px rgba(24,43,65,.16)}
.proposal-roster-page .proposal-preview-card:hover .proposal-preview-actions{display:flex}
.proposal-roster-page .proposal-preview-card{position:relative;padding-right:23px!important}
.proposal-roster-page .proposal-preview-card::after{content:'⋯';position:absolute;right:5px;top:1px;color:#5b7188;font-weight:900}

.other-team-ghost-card,
.proposal-roster-page .other-team-ghost-card,
.other-team-ghost-card.proposal-ghost{
  filter:none;
  opacity:1;
  color:#435366;
  background:color-mix(in srgb,var(--shift-color,#9aa6b2) 20%,white)!important;
  border:1px dashed color-mix(in srgb,var(--shift-color,#9aa6b2) 58%,#8894a0)!important;
  border-left:4px solid color-mix(in srgb,var(--shift-color,#9aa6b2) 72%,white)!important;
}
.other-team-ghost-card .other-team-ghost-title::before{content:'↗ ';font-weight:900;color:#6e7b89}
.employee-dropzone:has(.other-team-ghost-card){background:#fff!important}

/* V20.16.1 · titel + tijd zichtbaar, overige kaartinformatie via hover */
.assigned-card.compact-card,.view-week .assigned-card.compact-card,.proposal-roster-page .assigned-card.compact-card,.proposal-roster-page .proposal-preview-card,.other-team-ghost-card,.proposal-roster-page .other-team-ghost-card{
  min-height:31px!important;height:31px!important;padding:2px 5px 2px 9px!important
}
.assigned-card .compact-title,.view-week .assigned-card .compact-title,.proposal-roster-page .compact-title,.other-team-ghost-title{font-size:.58rem!important;line-height:14px!important}
.view-week .compact-card .compact-time,.proposal-roster-page .compact-time,.other-team-ghost-time{
  display:block!important;margin:0!important;font-size:.49rem!important;line-height:10px!important;color:#66788a!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important
}
.view-week .compact-card .assigned-card-subrow{display:block!important;margin:0!important}
.view-week .compact-card .assigned-card-icons{display:none!important}
.view-week .compact-card:hover .assigned-card-icons,.view-week .compact-card:focus-within .assigned-card-icons{display:flex!important}
.other-team-ghost-time{padding-left:1px}
.proposal-roster-page .proposal-preview-actions{top:32px!important}
.view-week .assigned-card.compact-card:hover .assigned-card-subrow,.view-week .assigned-card.compact-card:focus-within .assigned-card-subrow{top:32px!important}
.view-week .assigned-card.compact-card:hover .card-delete-form,.view-week .assigned-card.compact-card:focus-within .card-delete-form{top:35px!important}

.availability-chip.compact-status,.view-week .availability-chip.compact-status,.proposal-roster-page .availability-chip.compact-status{
  display:block!important;width:100%!important;min-height:15px!important;height:15px!important;margin:1px 0 0!important;padding:1px 5px!important;border-radius:5px!important;font-size:.49rem!important;line-height:13px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;box-sizing:border-box!important
}
.availability-chip.compact-status strong{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}

/* Gekoppeld loondienstprofiel: ZZP-vak blijft leeg maar is niet planbaar. */
.employee-dropzone.identity-time-blocked{cursor:not-allowed!important;background:repeating-linear-gradient(135deg,#fbfcfd 0,#fbfcfd 7px,#f2f5f7 7px,#f2f5f7 14px)!important}
.employee-dropzone.identity-time-blocked.dragover-template,.employee-dropzone.identity-time-blocked.proposal-dragover,.employee-dropzone.identity-time-blocked.preview-dragover{outline:none!important;box-shadow:none!important}

/* Andere-afdeling-kaarten moeten muis-events ontvangen voor de informatielaag. */
.other-team-ghost-card,.proposal-roster-page .other-team-ghost-card{pointer-events:auto!important;cursor:help!important}

/* Alleen de werkelijk bezette uren van het gekoppelde loondienstprofiel. */
.identity-time-window{display:block;width:100%;height:15px;min-height:15px;margin:1px 0;padding:1px 5px;box-sizing:border-box;border:1px dashed #aeb9c4;border-radius:5px;background:repeating-linear-gradient(135deg,#f2f5f7 0,#f2f5f7 5px,#e8edf1 5px,#e8edf1 10px);color:#687685;font-size:.48rem;font-weight:800;line-height:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;cursor:help}
.identity-time-window.proposal-window{border-color:#c9ad71;background:repeating-linear-gradient(135deg,#fffaf0 0,#fffaf0 5px,#f7ecd3 5px,#f7ecd3 10px);color:#85651e}

.employee-availability-actions{display:flex;align-items:center;gap:7px;flex-wrap:wrap}
.employee-availability-actions .tool-btn,.employee-availability-actions .primary-soft-btn{min-height:34px;padding:0 10px;font-size:.67rem;text-decoration:none}

/* Andere afdelingen: herkenbare echte dienstkleur, alleen duidelijk lichter. */
.other-team-ghost-card,.proposal-roster-page .other-team-ghost-card,.other-team-ghost-card.proposal-ghost{
  background:color-mix(in srgb,var(--shift-color,#9aa6b2) 32%,white)!important;
  border-color:color-mix(in srgb,var(--shift-color,#9aa6b2) 68%,#a8b1ba)!important;
  border-left-color:var(--shift-color,#9aa6b2)!important
}

/* Open diensten: dezelfde compacte titel/tijd-opbouw met details bij hover. */
.view-week .open-mini.open-service-card{position:relative;display:block!important;min-height:32px!important;height:32px!important;margin:1px 0!important;padding:2px 25px 2px 9px!important;border-radius:6px!important;overflow:visible!important}
.view-week .open-mini.open-service-card::before{left:3px!important;top:3px!important;bottom:3px!important;width:3px!important}
.view-week .open-service-card .compact-title{font-size:.58rem!important;line-height:14px!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important}
.view-week .open-service-card .compact-time{display:block!important;margin:0!important;font-size:.49rem!important;line-height:10px!important;color:#66788a!important}
.view-week .open-service-card .open-service-footer,.view-week .open-service-card .open-delete-form,.view-week .open-service-card .bulk-service-check{display:none!important}
.view-week .open-service-card::after{content:'⋯';position:absolute;right:6px;top:5px;color:#5d7184;font-weight:900}
.view-week .open-service-card:hover .open-service-footer,.view-week .open-service-card:focus-within .open-service-footer{display:flex!important;position:absolute;z-index:24;left:2px;right:2px;top:33px;padding:4px;border:1px solid #d4dee7;border-radius:7px;background:#fff;box-shadow:0 6px 18px rgba(24,43,65,.16)}
.view-week .open-service-card:hover .open-delete-form,.view-week .open-service-card:focus-within .open-delete-form{display:block!important;position:absolute;z-index:26;right:4px;top:36px}
.view-week .open-service-card:hover .bulk-service-check,.view-week .open-service-card:focus-within .bulk-service-check{display:block!important}

.roster-hover-tooltip{position:fixed;z-index:5000;display:none;pointer-events:none;max-width:min(380px,calc(100vw - 28px));padding:10px 12px;border-radius:10px;background:#0e1520;color:#fff;box-shadow:0 12px 32px rgba(8,18,30,.3);font-size:.72rem;font-weight:650;line-height:1.45;white-space:pre-line}
.roster-hover-tooltip.visible{display:block}
.view-week .assigned-card.compact-card:hover .assigned-card-subrow,
.view-week .assigned-card.compact-card:focus-within .assigned-card-subrow{display:flex!important;position:absolute;z-index:20;left:3px;right:3px;top:25px;padding:4px 6px;border:1px solid #d4dee7;border-radius:7px;background:#fff;box-shadow:0 6px 18px rgba(24,43,65,.16)}
.view-week .assigned-card.compact-card:hover .card-delete-form,
.view-week .assigned-card.compact-card:focus-within .card-delete-form{display:block!important;position:absolute;z-index:22;right:4px;top:28px}
.other-team-ghost-card{opacity:1!important}


/* V20.5 · compacte dienstbewerking, herhaling en voorkeur */
.repeat-until-strip{display:flex;justify-content:space-between;align-items:center;gap:16px;padding:10px 12px;border:1px solid #d7e4ee;border-radius:12px;background:#fbfdff}
.repeat-until-strip>div{display:flex;flex-direction:column;gap:2px}.repeat-until-strip small{color:#708196}.repeat-until-strip label{min-width:230px;margin:0}.repeat-until-strip input{margin-top:4px}
.planning-preference-row{margin:12px 0;padding:12px;border:1px solid #dbe5ee;border-radius:12px;background:#f8fbfd}.planning-preference-row label{display:grid;gap:6px}.planning-preference-row select{max-width:320px}
.service-edit-overlay{position:fixed;inset:0;z-index:1200;background:rgba(20,34,50,.42);backdrop-filter:blur(2px);display:flex;align-items:center;justify-content:center;padding:18px}
.service-edit-dialog{width:min(1060px,96vw);max-height:94vh;overflow:auto;background:#fff;border-radius:20px;box-shadow:0 24px 70px rgba(16,34,54,.28);border:1px solid #d7e1ea}
.service-edit-head{position:sticky;top:0;z-index:4;background:#fff;border-bottom:1px solid #e4ebf1;padding:16px 18px;display:flex;justify-content:space-between;align-items:flex-start;gap:16px}.service-edit-head h2{margin:2px 0 2px;font-size:1.35rem}.service-edit-head p{margin:0;color:#708196;font-size:.82rem}.service-edit-close{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;border:1px solid #d8e1e9;color:#33465a;text-decoration:none;background:#f8fafc;font-weight:900}
.service-edit-form{padding:14px 18px 18px;display:grid;gap:12px}.service-edit-form label{display:grid;gap:5px;font-size:.78rem;font-weight:800;color:#31465a}.service-edit-form input,.service-edit-form select,.service-edit-form textarea{width:100%;box-sizing:border-box;border:1px solid #cfdbe6;border-radius:9px;padding:9px 10px;background:#fff;font:inherit}.service-edit-form textarea{resize:vertical}
.compact-day-selector{border:1px solid #b8d8ea;background:#f4fbff;border-radius:14px;padding:11px}.compact-day-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start;margin-bottom:8px}.compact-day-head>div:first-child{display:flex;flex-direction:column;gap:2px}.compact-day-head small{font-size:.72rem;color:#6c7e90}.compact-day-buttons{display:grid;grid-template-columns:repeat(7,1fr);gap:6px}.compact-day-button{position:relative}.compact-day-button input{position:absolute;opacity:0}.compact-day-button span{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:48px;border:1px solid #cbd8e3;border-radius:9px;background:#fff;cursor:pointer}.compact-day-button strong{font-size:.75rem}.compact-day-button small{font-size:.66rem;color:#78899a}.compact-day-button input:checked+span{background:#dff3ff;border-color:#2f9fe3;color:#086da7}.compact-day-button.is-current span{background:#e7f6ed;border-color:#76c391;color:#1c7040;cursor:default}.repeat-until-inline{display:flex;align-items:end;gap:14px;margin-top:9px;padding-top:9px;border-top:1px solid #d8e6ef}.repeat-until-inline label{min-width:220px}.repeat-until-inline small{font-size:.7rem;color:#6f8091;max-width:560px;padding-bottom:7px}
.service-edit-section{display:grid;gap:10px;padding:12px;border:1px solid #e0e7ee;border-radius:13px;background:#fff}.service-edit-grid{display:grid;gap:9px}.service-edit-grid.four{grid-template-columns:repeat(4,1fr)}.service-edit-grid.three{grid-template-columns:repeat(3,1fr)}.service-edit-grid .span-2{grid-column:span 2}
.service-edit-details{border:1px solid #e0e7ee;border-radius:12px;background:#fbfcfe;overflow:hidden}.service-edit-details summary{cursor:pointer;padding:11px 13px;font-weight:850;color:#263b50;display:flex;justify-content:space-between;gap:12px}.service-edit-details summary span{font-size:.72rem;font-weight:600;color:#8090a0}.service-edit-details[open] summary{border-bottom:1px solid #e4eaf0;background:#f6f9fb}.service-edit-details>div,.service-edit-details>label{margin:12px}.compact-custom-fields{margin:12px}.compact-attachments{max-height:150px;overflow:auto}
.service-edit-actions{position:sticky;bottom:-18px;z-index:3;margin:2px -18px -18px;padding:12px 18px;background:rgba(255,255,255,.96);border-top:1px solid #e3e9ef;display:flex;justify-content:flex-end;gap:9px;backdrop-filter:blur(5px)}
@media(max-width:900px){.service-edit-grid.four{grid-template-columns:repeat(2,1fr)}.service-edit-grid.three{grid-template-columns:repeat(2,1fr)}.compact-day-buttons{grid-template-columns:repeat(4,1fr)}.compact-day-head,.repeat-until-inline,.repeat-until-strip{flex-direction:column;align-items:stretch}.repeat-until-strip label,.repeat-until-inline label{min-width:0}}
@media(max-width:560px){.service-edit-overlay{padding:0}.service-edit-dialog{width:100vw;max-height:100vh;height:100vh;border-radius:0}.service-edit-grid.four,.service-edit-grid.three{grid-template-columns:1fr}.service-edit-grid .span-2{grid-column:auto}.compact-day-buttons{grid-template-columns:repeat(2,1fr)}}


/* V20.6 · compacte medewerkerinstellingen + hoverinformatie */
.linked-personnel-table{min-width:1120px}
.team-count-chip{display:inline-flex;align-items:center;gap:5px;padding:5px 9px;border-radius:999px;background:#edf5fb;border:1px solid #d3e6f2;color:#2d6488;font-size:.72rem;font-weight:900;cursor:help}
.planning-settings-backdrop{padding:12px}
.planning-settings-modal{width:min(760px,calc(100vw - 24px));max-height:min(84vh,760px);padding:0;overflow:hidden;display:flex;flex-direction:column}
.planning-settings-head{flex:0 0 auto;margin:0;padding:13px 15px;border-bottom:1px solid #e1e8ee;background:#fff}
.planning-settings-head h3{font-size:1.05rem}
.planning-settings-head small{font-size:.74rem}
.planning-settings-form{min-height:0;display:flex;flex:1 1 auto;flex-direction:column}
.planning-settings-scroll{min-height:0;overflow:auto;padding:12px 14px;display:grid;gap:10px;overscroll-behavior:contain}
.planning-person-summary{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:10px;padding:10px;border-radius:12px;border:1px solid #dbe5ed;background:#f8fbfd}
.planning-person-summary>div{min-width:0}
.settings-kicker{display:block;font-size:.68rem;text-transform:uppercase;letter-spacing:.04em;color:#718196;font-weight:900;margin-bottom:6px}
.compact-chip-row{display:flex;flex-wrap:wrap;gap:5px;max-height:72px;overflow:auto}
.compact-chip-row .competency-chip{font-size:.68rem;padding:4px 7px}
.planning-settings-section{border:1px solid #dbe4ec;border-radius:12px;padding:10px;background:#fff}
.planning-settings-section-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;margin-bottom:9px}
.planning-settings-section-head strong{display:block;font-size:.82rem}
.planning-settings-section-head small{display:block;color:var(--muted);font-size:.68rem;line-height:1.35;margin-top:2px}
.planning-preference-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
.planning-preference-grid label{font-size:.72rem;gap:4px}
.planning-preference-grid select{min-height:36px;border-radius:9px;padding:0 9px;font-size:.76rem}
.planner-rule-note{display:flex;align-items:flex-start;gap:8px;margin-top:8px;padding:7px 9px;border-radius:9px;background:#f1f7fb;color:#50677d;font-size:.68rem;line-height:1.35}
.planner-rule-note strong{white-space:nowrap;color:#294b68}
.compact-team-fieldset{margin:0;padding:9px 10px}
.planning-team-help{font-size:.68rem;color:var(--muted);margin:-1px 0 7px}
.compact-team-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;max-height:150px;overflow:auto;padding-right:3px}
.compact-team-card{min-width:0;padding:7px 8px!important;align-items:center!important;position:relative}
.compact-team-card span{min-width:0}
.compact-team-card strong{font-size:.72rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.compact-team-card small{font-size:.62rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.compact-team-card:hover{border-color:#8fc8ea;background:#f2faff;box-shadow:0 3px 12px rgba(38,108,151,.08)}
.compact-toggle-row{padding:9px 10px}
.compact-toggle-row strong{font-size:.75rem}.compact-toggle-row small{font-size:.65rem}
.planning-settings-footer{flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 14px;border-top:1px solid #e1e8ee;background:#fff;box-shadow:0 -6px 16px rgba(20,40,60,.05)}
.planning-settings-footer span{font-size:.64rem;color:var(--muted);line-height:1.3}
.planning-settings-footer .primary-btn{min-width:112px;min-height:38px;padding:0 16px}
@media(max-width:780px){
  .planning-settings-backdrop{padding:6px;align-items:center}
  .planning-settings-modal{width:calc(100vw - 12px);max-height:92dvh;border-radius:14px}
  .planning-person-summary,.planning-preference-grid{grid-template-columns:1fr}
  .compact-team-grid{grid-template-columns:repeat(2,minmax(0,1fr));max-height:180px}
  .planning-settings-footer span{display:none}
}
@media(max-width:480px){
  .compact-team-grid{grid-template-columns:1fr}
  .planning-settings-scroll{padding:10px}
}

/* V20.7 · rustigere dienstkaarten + KM alleen op hover */
.assigned-card.compact-card{
  overflow:hidden;
  padding:8px 30px 8px 16px!important;
  min-height:78px;
  border:1px solid #cfdae6!important;
  border-left:1px solid #cfdae6!important;
  box-shadow:0 2px 7px rgba(35,55,80,.06);
  gap:3px!important;
}
.assigned-card.compact-card::before{left:6px;top:8px;bottom:8px;width:5px}
.assigned-card.band-day{background:linear-gradient(180deg,#f7fbff,#eef7fd)!important;border-color:#bdd7ea!important}
.assigned-card.band-afternoon{background:linear-gradient(180deg,#fffaf1,#fff3dc)!important;border-color:#efd5a5!important}
.assigned-card.band-night{background:linear-gradient(180deg,#f4f6fb,#e9eef8)!important;border-color:#bac8df!important}
.assigned-card .assigned-card-title-row{min-width:0;padding-right:2px}
.assigned-card .compact-title{
  max-width:100%!important;
  min-width:0;
  font-size:.80rem!important;
  line-height:1.15!important;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  font-weight:800;
}
.assigned-card .assigned-card-subrow{display:flex;align-items:center;justify-content:space-between;gap:6px;min-width:0;margin-top:1px}
.assigned-card .compact-time{font-size:.70rem!important;color:#64778e;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.assigned-card-icons{display:flex;align-items:center;gap:5px;flex:0 0 auto}
.card-info-icon,.travel-hover-icon{
  width:22px;height:22px;border-radius:7px;display:inline-flex;align-items:center;justify-content:center;
  border:1px solid #c9d8e7;background:rgba(255,255,255,.88);color:#2a6f9a;text-decoration:none;
  font-size:.69rem;font-weight:900;line-height:1;cursor:help;
}
.card-info-icon{cursor:pointer}
.card-info-icon:hover{background:#fff;border-color:#8db8d4}
.travel-hover-icon{font-size:.72rem;color:#355d4a;border-color:#c7dccf}
.assigned-card .shift-rate-chip{justify-self:start;max-width:100%;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:2px}
.assigned-card .proposal-inline-actions{margin-top:3px}
.view-week .assigned-card.compact-card{min-height:74px!important;padding:7px 28px 7px 15px!important}
.view-week .assigned-card .compact-title{font-size:.74rem!important}
.view-week .assigned-card .compact-time{font-size:.65rem!important}
.view-week .card-info-icon,.view-week .travel-hover-icon{width:20px;height:20px;font-size:.64rem}
.template-card-chip-row{display:flex;align-items:center;gap:5px;flex-wrap:wrap}
.template-km-chip{display:inline-flex;align-items:center;padding:2px 6px;border-radius:999px;border:1px solid #c7ddcf;background:#f0f8f3;color:#306248;font-size:9px;font-weight:800}
.toggle-card{display:flex!important;flex-direction:row!important;align-items:center!important;gap:10px;padding:10px 12px;border:1px solid #d7e2ec;border-radius:11px;background:#f8fbfd}
.toggle-card input{width:auto!important;min-height:0!important;margin:0!important}
.toggle-card span{display:flex;flex-direction:column;gap:2px}
.toggle-card strong{font-size:.82rem;color:#263b54}.toggle-card small{font-size:.70rem;color:#6f8093;font-weight:400;line-height:1.3}
.open-service-card.band-day{background:linear-gradient(180deg,#fbfdff,#f2f8fc)!important}
.open-service-card.band-afternoon{background:linear-gradient(180deg,#fffdf8,#fff6e7)!important}
.open-service-card.band-night{background:linear-gradient(180deg,#f8f9fc,#edf1f8)!important}
.proposal-preview-card.band-day{background:linear-gradient(180deg,#f7fbff,#eaf6fd)!important;border-color:#9fc9e4!important}
.proposal-preview-card.band-afternoon{background:linear-gradient(180deg,#fffaf0,#ffefd4)!important;border-color:#e7c37e!important}
.proposal-preview-card.band-night{background:linear-gradient(180deg,#f3f5fa,#e5ebf6)!important;border-color:#9cafcf!important}

/* V20.8 compact diensttemplate-editor + klikbare medewerkernaam */
.employee-name-link {
  display:block;
  color:inherit;
  text-decoration:none;
  border-radius:6px;
  outline-offset:2px;
}
.employee-name-link:hover {
  color:#1976a7;
  text-decoration:underline;
  text-underline-offset:2px;
}

.template-editor-backdrop { padding:12px; }
.template-editor-modal {
  width:min(860px, calc(100vw - 24px));
  max-height:min(86vh, 820px);
  padding:0;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  border-radius:16px;
}
.template-editor-head {
  flex:0 0 auto;
  margin:0;
  padding:13px 16px 10px;
  border-bottom:1px solid #e3e9ef;
  background:#fff;
}
.template-editor-head h3 { font-size:1.05rem; line-height:1.15; }
.template-editor-head small { display:block; margin-top:2px; color:var(--muted); font-size:.72rem; }
.template-editor-form { min-height:0; display:flex; flex-direction:column; flex:1 1 auto; }
.template-editor-scroll {
  min-height:0;
  overflow:auto;
  padding:11px 14px 12px;
  display:grid;
  gap:10px;
  overscroll-behavior:contain;
  background:#f7f9fb;
}
.template-editor-summary { display:flex; flex-wrap:wrap; gap:6px; }
.summary-pill {
  max-width:100%;
  padding:5px 8px;
  border:1px solid #dce5ec;
  border-radius:999px;
  background:#fff;
  color:#34455b;
  font-size:.66rem;
  font-weight:850;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.summary-pill.priority { background:#f8f3ff; border-color:#ded0f0; color:#6a4593; }
.summary-pill.ok { background:#eefaf3; border-color:#c7e8d3; color:#176842; }
.summary-pill.muted { background:#f2f4f6; color:#7a8490; }
.compact-sync-note {
  margin:0;
  padding:8px 10px;
  min-height:auto;
  display:flex;
  align-items:flex-start;
  gap:8px;
  border-radius:10px;
  font-size:.7rem;
  line-height:1.35;
}
.compact-sync-note strong { white-space:nowrap; }

.template-editor-section,
.template-editor-details {
  border:1px solid #dde5ec;
  border-radius:12px;
  background:#fff;
  overflow:hidden;
}
.template-editor-section { padding:10px; }
.template-editor-section-title {
  margin:0 0 8px;
  color:#26384f;
  font-size:.72rem;
  font-weight:950;
  text-transform:uppercase;
  letter-spacing:.035em;
}
.template-editor-grid {
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px 10px;
}
.template-editor-grid.three-col { grid-template-columns:repeat(3,minmax(0,1fr)); }
.template-editor-grid .span-2 { grid-column:span 2; }
.template-editor-modal label { gap:4px; font-size:.7rem; }
.template-editor-modal input,
.template-editor-modal select,
.template-editor-modal textarea { min-height:38px; padding:8px 10px; border-radius:9px; font-size:.82rem; }
.template-editor-modal input[type="color"] { padding:4px; min-height:38px; }
.compact-toggle-card { margin-top:8px; padding:8px 10px; min-height:auto; }
.compact-toggle-card span strong { font-size:.73rem; }
.compact-toggle-card span small { font-size:.62rem; line-height:1.3; }
.template-editor-details > summary {
  list-style:none;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  padding:9px 11px;
  cursor:pointer;
  color:#26384f;
  font-size:.74rem;
  font-weight:900;
  user-select:none;
}
.template-editor-details > summary::-webkit-details-marker { display:none; }
.template-editor-details > summary::after { content:'⌄'; color:#718095; font-size:.8rem; }
.template-editor-details[open] > summary::after { content:'⌃'; }
.template-editor-details > summary span {
  margin-left:auto;
  min-width:0;
  max-width:55%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:var(--muted);
  font-size:.62rem;
  font-weight:700;
}
.template-editor-detail-body { padding:0 10px 10px; }
.template-editor-details[open] > summary { border-bottom:1px solid #edf1f4; margin-bottom:9px; }
.template-description-compact { min-height:92px !important; max-height:170px; resize:vertical; }
.compact-custom-fields { padding:0; border:0; background:transparent; }

.template-editor-footer {
  flex:0 0 auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  padding:10px 14px;
  border-top:1px solid #e0e7ed;
  background:#fff;
  box-shadow:0 -5px 15px rgba(18,37,58,.05);
}
.template-editor-footer-note {
  min-width:0;
  max-width:62%;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  color:var(--muted);
  font-size:.63rem;
}
.template-editor-footer-actions { display:flex; gap:7px; flex:0 0 auto; }
.template-editor-footer .tool-btn,
.template-editor-footer .primary-btn { min-height:36px; padding:0 13px; }

@media (max-width: 760px) {
  .template-editor-backdrop { padding:5px; }
  .template-editor-modal { width:calc(100vw - 10px); max-height:94dvh; border-radius:13px; }
  .template-editor-grid.three-col,
  .template-editor-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .template-editor-grid.three-col .span-2 { grid-column:1/-1; }
  .template-editor-footer-note { display:none; }
  .template-editor-footer { justify-content:flex-end; }
}
@media (max-width: 520px) {
  .template-editor-grid.three-col,
  .template-editor-grid { grid-template-columns:1fr; }
  .template-editor-grid .span-2,
  .template-editor-grid.three-col .span-2 { grid-column:auto; }
  .compact-sync-note { display:block; }
  .compact-sync-note strong { display:block; margin-bottom:3px; }
  .template-editor-footer-actions { width:100%; }
  .template-editor-footer-actions > * { flex:1; }
}


/* V20.9 · onafhankelijk zijpaneel, compacte team-editor en duidelijker rooster */
@media (min-width:1181px) {
  .left-shell {
    position:sticky;
    top:8px;
    height:var(--left-shell-available-height, calc(100dvh - 16px));
    max-height:var(--left-shell-available-height, calc(100dvh - 16px));
    min-height:420px;
    display:flex;
    flex-direction:column;
    align-self:start;
  }
  .left-shell-head,.left-tabs { flex:0 0 auto; }
  .left-pane.active { display:flex; flex:1 1 auto; min-height:0; flex-direction:column; overflow:hidden; }
  .left-pane-actions { flex:0 0 auto; }
  .left-pane .template-list,.left-pane .team-list {
    flex:1 1 auto;
    min-height:0;
    overflow-y:auto;
    overscroll-behavior:contain;
    scrollbar-gutter:stable;
    padding-right:4px;
    padding-bottom:8px;
  }
  .left-pane .template-list::-webkit-scrollbar,.left-pane .team-list::-webkit-scrollbar { width:8px; }
  .left-pane .template-list::-webkit-scrollbar-thumb,.left-pane .team-list::-webkit-scrollbar-thumb { background:#c7d4df; border-radius:999px; }
}

/* Het rooster houdt bruikbare dagkolommen en laat alleen het rooster horizontaal scrollen. */
.roster-shell { min-width:0; background:#fff; }
.team-grid-wrap {
  overflow:auto;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
  border:1px solid #d8e2eb;
  border-radius:11px;
  background:#fff;
  box-shadow:0 2px 8px rgba(24,50,77,.035);
}
.view-week .team-roster-grid {
  min-width:1048px!important;
  grid-template-columns:minmax(150px,1.15fr) repeat(7,minmax(120px,1fr)) 58px!important;
}
.team-roster-grid > .left-header,
.team-roster-grid > .row-label,
.team-roster-grid > .employee-label {
  position:sticky;
  left:0;
  z-index:6;
  box-shadow:1px 0 0 #d7e1e9, 4px 0 8px rgba(26,48,70,.025);
}
.team-roster-grid > .left-header { z-index:8; background:#fbfcfe; }
.team-roster-grid > .row-label { background:#fbfcfe; }
.team-roster-grid > .employee-label { background:#fff; }
.team-roster-grid > .row-label-costs { background:#eff9f5!important; }
.day-head { background:#faf7fb; border-bottom-color:#d5dee8!important; }
.day-head.today { background:#f4effa; }
.schedule-cell { border-color:#dce4ec!important; }
.employee-dropzone { background:#fff; transition:background .12s ease, box-shadow .12s ease; }
.employee-dropzone:hover { background:#f8fbfd; box-shadow:inset 0 0 0 1px #d8eaf6; }
.open-row-cell { background:#fcfdfe; }
.roster-cost-cell { background:#f3fbf8!important; }
.other-team-ghost-card { opacity:.82; }
.assigned-card,.open-mini.open-service-card { box-shadow:0 2px 7px rgba(25,47,70,.055); }
.assigned-card:hover,.open-mini.open-service-card:hover { box-shadow:0 4px 12px rgba(25,47,70,.10); transform:translateY(-1px); }
.compact-title { line-height:1.15; }
.assigned-card .compact-title { white-space:normal; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.team-section-bar { position:relative; }

/* Team aanmaken/bewerken gebruikt dezelfde compacte editorlogica als diensttemplates. */
.team-editor-backdrop { padding:12px; }
.team-editor-modal {
  width:min(820px, calc(100vw - 24px));
  max-height:min(88dvh, 760px);
  padding:0;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  border-radius:16px;
}
.team-editor-head { flex:0 0 auto; margin:0; padding:13px 16px 10px; border-bottom:1px solid #e2e8ee; background:#fff; }
.team-editor-head h3 { margin:0; font-size:1.05rem; }
.team-editor-head small { display:block; margin-top:2px; color:var(--muted); font-size:.7rem; }
.team-editor-form { min-height:0; display:flex; flex:1 1 auto; flex-direction:column; }
.team-editor-scroll { min-height:0; overflow:auto; scrollbar-gutter:stable; padding:11px 13px 12px; display:grid; gap:9px; background:#f7f9fb; }
.team-editor-summary { display:flex; flex-wrap:wrap; gap:6px; }
.team-editor-section,.team-editor-details { border:1px solid #dce5ec; border-radius:12px; background:#fff; overflow:hidden; }
.team-editor-section { padding:10px; }
.team-editor-section-title { margin:0 0 8px; color:#26384f; font-size:.72rem; font-weight:950; text-transform:uppercase; letter-spacing:.035em; }
.team-editor-grid { display:grid; grid-template-columns:minmax(0,2fr) minmax(0,2fr) minmax(92px,.6fr); gap:9px; }
.team-editor-modal label { display:grid; gap:4px; font-size:.7rem; font-weight:800; color:#31465a; }
.team-editor-modal input[type="text"],.team-editor-modal input[type="color"] { width:100%; min-height:38px; border:1px solid #c7d5e1; border-radius:9px; padding:8px 10px; background:#fff; color:#183049; box-sizing:border-box; }
.team-editor-modal input[type="color"] { padding:4px; min-width:70px; }
.team-editor-details > summary { list-style:none; display:flex; align-items:center; gap:8px; padding:9px 11px; cursor:pointer; font-size:.74rem; font-weight:900; color:#26384f; }
.team-editor-details > summary::-webkit-details-marker { display:none; }
.team-editor-details > summary::after { content:'⌄'; margin-left:6px; color:#718095; }
.team-editor-details[open] > summary::after { content:'⌃'; }
.team-editor-details > summary span { margin-left:auto; max-width:60%; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:var(--muted); font-size:.63rem; font-weight:700; }
.team-editor-detail-body { padding:0 10px 10px; border-top:1px solid #edf1f4; }
.compact-hint { margin:8px 0; font-size:.65rem!important; line-height:1.35; }
.team-requirement-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; max-height:210px; overflow:auto; padding-right:3px; }
.team-requirement-grid label { display:flex!important; flex-direction:row!important; align-items:center; gap:8px!important; min-height:38px; padding:7px 9px; border:1px solid #e0e7ee; border-radius:9px; background:#fbfcfe; font-size:.69rem!important; }
.team-requirement-grid input { flex:0 0 auto; width:auto!important; }
.team-editor-footer { flex:0 0 auto; display:flex; justify-content:flex-end; gap:7px; padding:10px 13px; border-top:1px solid #dfe7ed; background:#fff; box-shadow:0 -4px 12px rgba(20,42,62,.04); }
.team-editor-footer .tool-btn,.team-editor-footer .primary-btn { min-height:36px; padding:0 13px; }

/* Template editor: alle basisvelden zichtbaar, duidelijk contrast en KM direct in de basis-grid. */
.template-editor-modal { width:min(980px, calc(100vw - 24px)); max-height:min(90dvh, 800px); }
.template-editor-scroll { scrollbar-gutter:stable; }
.template-editor-section { overflow:visible; }

/* Definitieve compacte roosterregels: bewust onder alle oudere versiestijlen. */
.layout-shell.sidebar-collapsed{grid-template-columns:42px minmax(0,1fr)!important}
.left-shell.collapsed{width:42px!important;min-height:54px!important}
.left-shell.collapsed .left-shell-head{padding:7px 4px!important}
.left-shell.collapsed .left-shell-toggle{min-width:0!important;width:32px!important;height:38px!important;min-height:38px!important;padding:0!important;border-radius:9px!important}

.view-week .employee-label,.proposal-roster-page .proposal-employee-label{min-height:38px!important;padding:4px 6px!important}
.view-week .employee-dropzone,.view-week .total-cell-employee,.proposal-roster-page .proposal-preview-dropzone{min-height:38px!important;padding:2px!important}
.assigned-card.compact-card,.view-week .assigned-card.compact-card,.proposal-roster-page .assigned-card.compact-card,.proposal-roster-page .proposal-preview-card,.other-team-ghost-card,.proposal-roster-page .other-team-ghost-card{
  min-height:24px!important;height:24px!important;padding:3px 5px 3px 9px!important;margin:1px 0!important;border-radius:6px!important;gap:0!important;overflow:visible!important
}
.assigned-card.compact-card::before,.view-week .assigned-card.compact-card::before,.proposal-roster-page .assigned-card.compact-card::before{left:3px!important;top:3px!important;bottom:3px!important;width:3px!important}
.assigned-card .compact-title,.view-week .assigned-card .compact-title,.proposal-roster-page .compact-title,.other-team-ghost-title{
  display:block!important;font-size:.59rem!important;line-height:17px!important;max-width:100%!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;margin:0!important
}
.view-week .compact-card .assigned-card-subrow,.view-week .compact-card .shift-rate-chip,.view-week .compact-card .proposal-inline-actions,.view-week .compact-card .card-delete-form,.proposal-roster-page .compact-time,.proposal-roster-page .proposal-preview-card-top,.proposal-roster-page .proposal-preview-type,.other-team-ghost-top,.other-team-ghost-time{display:none!important}
.other-team-ghost-card,.proposal-roster-page .other-team-ghost-card,.other-team-ghost-card.proposal-ghost{
  opacity:1!important;filter:none!important;color:#435366!important;
  background:color-mix(in srgb,var(--shift-color,#9aa6b2) 20%,white)!important;
  border:1px dashed color-mix(in srgb,var(--shift-color,#9aa6b2) 58%,#8894a0)!important;
  border-left:4px solid color-mix(in srgb,var(--shift-color,#9aa6b2) 72%,white)!important
}
.employee-dropzone:has(.other-team-ghost-card){background:#fff!important}
.template-editor-grid.four-col { grid-template-columns:repeat(4,minmax(0,1fr)); }
.template-editor-grid .span-2 { grid-column:span 2; }
.template-editor-modal input,.template-editor-modal select,.template-editor-modal textarea {
  width:100%;
  box-sizing:border-box;
  border:1px solid #c7d5e1;
  background:#fff;
  color:#17314a;
  box-shadow:inset 0 1px 1px rgba(30,55,80,.025);
}
.template-editor-modal input:focus,.template-editor-modal select:focus,.template-editor-modal textarea:focus { outline:2px solid #a8d8f2; outline-offset:1px; border-color:#62add6; }
.template-km-switch {
  display:flex!important;
  flex-direction:row!important;
  align-items:center;
  gap:9px!important;
  min-height:58px;
  padding:8px 10px;
  border:1px solid #b9ddc7;
  border-radius:10px;
  background:#f1faf5;
  cursor:pointer;
}
.template-km-switch input { width:18px!important; height:18px; min-height:0!important; flex:0 0 auto; accent-color:#178252; box-shadow:none!important; }
.template-km-switch span { display:grid; gap:2px; min-width:0; }
.template-km-switch strong { font-size:.72rem; color:#1d5139; }
.template-km-switch small { font-size:.61rem; color:#63766b; line-height:1.25; }
.template-description-compact { min-height:110px!important; max-height:220px; line-height:1.4; }
.template-editor-detail-body { overflow:visible; }

@media (max-width:900px) {
  .template-editor-grid.four-col { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .team-editor-grid { grid-template-columns:1fr 1fr; }
  .team-color-field { grid-column:1/-1; }
  .team-requirement-grid { grid-template-columns:1fr; }
}
@media (max-width:760px) {
  .team-editor-backdrop { padding:5px; }
  .team-editor-modal { width:calc(100vw - 10px); max-height:94dvh; }
  .team-editor-grid { grid-template-columns:1fr; }
  .template-editor-grid.four-col { grid-template-columns:1fr; }
  .template-editor-grid.four-col .span-2 { grid-column:auto; }
}


/* ===== V20.9.1 · sidebar clipping + muiswiel rooster fix ===== */

/* Linkerpaneel: kaarten mogen nooit meer worden samengedrukt door de flex-scrolllijst. */
@media (min-width:1181px) {
  .left-pane .template-list > .template-card,
  .left-pane .team-list > .team-list-item {
    flex: 0 0 auto;
  }

  .left-pane .template-list,
  .left-pane .team-list {
    align-content: flex-start;
    overscroll-behavior-y: contain;
    padding-bottom: 18px;
  }
}

/* Lange titels/eisen blijven zichtbaar; de kaart groeit in hoogte in plaats van tekst af te snijden. */
.template-card {
  height: auto !important;
  max-height: none !important;
  overflow: visible !important;
}
.template-card-main {
  min-width: 0;
  overflow: visible;
}
.template-card-title {
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  overflow-wrap: anywhere;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}
.template-card-requirements {
  white-space: normal !important;
  overflow: visible !important;
  text-overflow: clip !important;
  overflow-wrap: anywhere;
  display: block !important;
  line-height: 1.22 !important;
}
.template-card-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
  overflow: visible;
}

/* Hoofdrooster: horizontale scroll blijft lokaal, verticale wiel-scroll mag door naar de pagina. */
.team-grid-wrap {
  overscroll-behavior-x: contain !important;
  overscroll-behavior-y: auto !important;
  touch-action: pan-x pan-y;
}
.roster-shell,
.team-section {
  overscroll-behavior-y: auto;
}

/* Scrollbars duidelijker, maar niet nodig om het muiswiel te gebruiken. */
.team-grid-wrap::-webkit-scrollbar { height: 10px; width: 10px; }
.team-grid-wrap::-webkit-scrollbar-thumb {
  background: #bccbd7;
  border-radius: 999px;
  border: 2px solid #f7fafc;
}
.team-grid-wrap::-webkit-scrollbar-track { background: #f7fafc; }



/* ===== V20.9.2 · template-popup uitklappen zonder afsnijden ===== */
.template-editor-form { min-height:0; overflow:hidden; }
.template-editor-scroll {
  flex:1 1 auto !important;
  min-height:0 !important;
  display:flex !important;
  flex-direction:column;
  align-items:stretch;
  gap:10px;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  padding-bottom:20px;
  scroll-padding-bottom:28px;
}
.template-editor-scroll > * { flex:0 0 auto; min-height:max-content; }
.template-editor-details,
.template-editor-details[open] {
  flex:0 0 auto !important;
  height:auto !important;
  max-height:none !important;
  min-height:0 !important;
  overflow:visible !important;
}
.template-editor-details[open] > .template-editor-detail-body {
  height:auto !important;
  max-height:none !important;
  overflow:visible !important;
}
.template-editor-detail-body.template-editor-grid {
  display:grid !important;
}
.template-editor-detail-body label { min-width:0; }
.template-editor-modal textarea { overflow:auto; }

/* Houd een geopend blok netjes in beeld en voorkom dat de vaste footer velden bedekt. */
.template-editor-footer { position:relative; z-index:4; }
.template-editor-details:last-child { margin-bottom:8px; }


/* ===== V20.10 · Weekmatrix / samengevoegd planningsoverzicht ===== */
.weekmatrix-page{padding:12px;min-width:0;background:#f4f7fb;min-height:calc(100vh - 64px)}
.matrix-toolbar{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:10px 12px;position:sticky;top:58px;z-index:30}
.matrix-toolbar-left,.matrix-toolbar-right{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.matrix-view-switch{flex:none}.matrix-selection-summary{font-size:13px;color:#62748a;padding:7px 10px;background:#f2f6fa;border-radius:10px}.matrix-selection-summary strong{color:#16324f;font-size:15px}
.matrix-filter-card{padding:12px;margin-top:10px}.matrix-filter-head{display:flex;justify-content:space-between;gap:12px;align-items:center}.matrix-filter-head>div:first-child{display:flex;flex-direction:column;gap:2px}.matrix-filter-head small{color:#718196}.matrix-filter-actions{display:flex;gap:6px;flex-wrap:wrap}
.matrix-roster-groups{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:10px;margin-top:10px;max-height:320px;overflow:auto;padding-right:3px}.matrix-roster-group{border:1px solid #d8e2ec;border-radius:12px;background:#fbfdff;overflow:hidden}.matrix-roster-head{display:flex;align-items:center;gap:8px;padding:9px 10px;background:#f2f6fa;border-bottom:1px solid #e1e8ef;cursor:pointer}.matrix-roster-head small{margin-left:auto;color:#7b8999}.matrix-team-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;padding:8px}.matrix-team-option{display:flex;align-items:center;gap:7px;min-width:0;padding:7px 8px;border:1px solid #e2e8ef;border-radius:9px;background:#fff;cursor:pointer}.matrix-team-option:has(input:checked){border-color:#70b7e4;background:#edf8ff}.matrix-team-option>span:last-child{display:flex;flex-direction:column;min-width:0}.matrix-team-option strong,.matrix-team-option small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.matrix-team-option small{font-size:10px;color:#7d8b99}.matrix-team-dot{width:9px;height:24px;border-radius:99px;flex:none}
.matrix-filter-bottom{display:grid;grid-template-columns:minmax(180px,1.5fr) minmax(160px,1fr) minmax(160px,1fr) auto;gap:9px;align-items:end;margin-top:10px}.matrix-filter-bottom label{display:flex;flex-direction:column;gap:4px;font-weight:700;font-size:12px}.matrix-filter-bottom input,.matrix-filter-bottom select{height:39px;border:1px solid #cbd8e4;border-radius:9px;padding:0 10px;background:#fff;font:inherit}
.matrix-legend{display:flex;align-items:center;gap:16px;flex-wrap:wrap;margin-top:10px;padding:8px 12px;font-size:11px;color:#586b80}.matrix-legend small{margin-left:auto}.matrix-legend-swatch{width:22px;height:13px;border-radius:4px;display:inline-block;vertical-align:middle;margin-right:3px}.matrix-legend-swatch.selected{background:#cfeaff;border-left:5px solid #2f86c7}.matrix-legend-swatch.other{background:repeating-linear-gradient(135deg,#e4e4e4,#e4e4e4 5px,#f3f3f3 5px,#f3f3f3 10px);border-left:5px solid #999}.matrix-legend-swatch.leave{background:#ffe0a8}.matrix-conflict-dot{width:11px;height:11px;border-radius:50%;background:#df2638;display:inline-block}
.weekmatrix-shell{margin-top:10px;overflow:auto;max-height:calc(100vh - 210px);padding:0;position:relative}.weekmatrix-grid{display:grid;grid-template-columns:minmax(235px,1.45fr) repeat(7,minmax(132px,1fr)) minmax(92px,.65fr);min-width:1320px}.matrix-head-row{position:sticky;top:0;z-index:20;background:#f5f8fb;border-bottom:2px solid #c7d4e0}.matrix-employee-head,.matrix-day-head,.matrix-total-head{padding:9px 8px;font-size:12px;font-weight:800;color:#20364d;text-align:center;border-right:1px solid #d9e2ea}.matrix-employee-head{text-align:left;position:sticky;left:0;z-index:23;background:#f5f8fb}.matrix-day-head{display:flex;flex-direction:column;gap:1px}.matrix-day-head small{font-size:9px;color:#8492a0;font-weight:600}.matrix-day-head.is-today{background:#f0e8ff}.matrix-person-row{border-bottom:1px solid #dce5ed;min-height:70px}.matrix-person-row:hover>.matrix-day-cell,.matrix-person-row:hover>.matrix-employee-cell,.matrix-person-row:hover>.matrix-total-cell{box-shadow:inset 0 0 0 999px rgba(31,82,125,.018)}
.matrix-employee-cell{position:sticky;left:0;z-index:12;background:#fff;border-right:2px solid #c9d6e1;display:flex;align-items:center;gap:8px;padding:7px 9px;min-width:0}.matrix-employee-cell .employee-avatar{width:34px;height:34px;display:grid;place-items:center;border-radius:50%;background:#edf2f7;color:#496178;font-size:12px;font-weight:800;flex:none}.matrix-employee-copy{min-width:0;display:flex;flex-direction:column;gap:2px}.matrix-employee-copy a,.matrix-employee-copy strong{font-size:12px;font-weight:800;color:#21384f;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.matrix-employee-copy small{font-size:10px;color:#718196;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.matrix-day-cell{position:relative;border-right:1px solid #dce5ed;background:#fff;min-width:0;padding:4px;display:flex;flex-direction:column;gap:3px}.matrix-day-cell.is-today{background:#fcfaff}.matrix-day-cell.has-conflict{box-shadow:inset 0 0 0 2px #df2638}.matrix-shift-stack{display:flex;flex-direction:column;gap:3px;min-height:0;height:100%}.matrix-shift-block{--matrix-color:#2f86c7;display:flex;flex-direction:column;justify-content:center;min-height:58px;flex:1;padding:5px 6px 5px 8px;border-radius:8px;border:1px solid color-mix(in srgb,var(--matrix-color) 52%,#c8d3dc);border-left:6px solid var(--matrix-color);background:color-mix(in srgb,var(--matrix-color) 28%,white);color:#183247;text-decoration:none;overflow:hidden}.matrix-shift-stack.count-2 .matrix-shift-block,.matrix-shift-stack.count-3 .matrix-shift-block{min-height:32px;padding-top:3px;padding-bottom:3px}.matrix-shift-block:hover{filter:saturate(1.1);box-shadow:0 2px 7px rgba(36,62,84,.12)}.matrix-shift-team{font-size:11px;font-weight:900;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.matrix-shift-time{font-size:10px;color:#4d6275}.matrix-shift-title{font-size:9px;color:#5d7081;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.matrix-shift-block.is-other{background:repeating-linear-gradient(135deg,#e4e4e4,#e4e4e4 6px,#f4f4f4 6px,#f4f4f4 12px);border-color:#b4b4b4;border-left-color:#989898;color:#555;opacity:.78}.matrix-shift-block.is-other .matrix-shift-time,.matrix-shift-block.is-other .matrix-shift-title{color:#747474}
.matrix-leave-block{background:color-mix(in srgb,var(--leave-color,#ffe0a8) 75%,white);border:1px solid color-mix(in srgb,var(--leave-color,#ffe0a8) 80%,#a8894b);border-radius:6px;padding:3px 5px;font-size:9px;font-weight:800;color:#72591b;display:flex;justify-content:space-between;gap:5px}.matrix-leave-block small{font-size:8px;font-weight:600}.matrix-total-cell{border-left:1px solid #dce5ed;background:#fbfcfe;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:5px;font-size:10px}.matrix-total-cell strong{font-size:14px;color:#17364f}.matrix-total-cell small{color:#75879a}.matrix-total-cell span{font-size:8px;color:#75879a;margin-top:2px}.matrix-total-cell.tone-ok{background:#f0fbf5}.matrix-total-cell.tone-under{background:#fff9e8}.matrix-total-cell.tone-over{background:#fff0f1}.matrix-total-cell.tone-over strong{color:#bd2738}.matrix-empty-state{padding:50px;text-align:center;display:flex;flex-direction:column;gap:6px;color:#728295}
.weekmatrix-page.matrix-fullscreen{position:fixed;inset:0;z-index:1000;background:#f4f7fb;padding:8px;overflow:hidden}.weekmatrix-page.matrix-fullscreen .matrix-toolbar{top:0}.weekmatrix-page.matrix-fullscreen .weekmatrix-shell{max-height:calc(100vh - 145px)}body.matrix-fullscreen-active{overflow:hidden}
@media(max-width:1000px){.matrix-filter-bottom{grid-template-columns:1fr 1fr}.matrix-team-options{grid-template-columns:1fr}.matrix-toolbar{position:relative;top:0}.weekmatrix-shell{max-height:none}.matrix-legend small{width:100%;margin-left:0}}

.matrix-filter-card.is-collapsed{display:none}


/* ===== V20.11 · compacte matrixfilters + identity/roulatie UX ===== */
.matrix-compact-filters{margin-top:8px;padding:8px 10px;position:relative}
.matrix-filter-line{display:grid;grid-template-columns:auto minmax(140px,1.2fr) minmax(170px,1.4fr) 125px 135px 120px auto auto;gap:7px;align-items:end}
.matrix-filter-line>label{display:flex;flex-direction:column;gap:3px;min-width:0;font-size:10px;font-weight:800;color:#64768a}
.matrix-filter-line input[type="search"],.matrix-filter-line select{height:34px;border:1px solid #cbd8e4;border-radius:8px;background:#fff;padding:0 9px;font-size:11px;color:#20364d;min-width:0}
.matrix-team-picker-btn{height:34px;white-space:nowrap}.matrix-team-picker-btn strong{display:inline-grid;place-items:center;min-width:20px;height:20px;padding:0 5px;border-radius:99px;background:#dff2ff;color:#176a9c;margin-left:5px}
.matrix-selected-chips{display:flex;align-items:center;gap:4px;min-width:0;height:34px;overflow:hidden}.matrix-selected-chips span{--chip-color:#2f9fe3;display:inline-flex;align-items:center;gap:4px;max-width:120px;padding:5px 7px;border-radius:999px;background:color-mix(in srgb,var(--chip-color) 16%,white);border:1px solid color-mix(in srgb,var(--chip-color) 36%,#d7e0e8);font-size:9px;font-weight:800;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.matrix-selected-chips span:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--chip-color);flex:none}.matrix-selected-chips .more:before{display:none}
.matrix-attention-toggle{height:34px!important;flex-direction:row!important;align-items:center!important;gap:5px!important;padding:0 8px;border:1px solid #d9e2ea;border-radius:8px;background:#fff;white-space:nowrap}.matrix-attention-toggle input{margin:0}
.matrix-quick-stats{display:flex;gap:7px;align-items:center;margin-top:6px;font-size:9px;color:#687a8d}.matrix-quick-stats span{padding:3px 7px;border-radius:999px;background:#eef3f7}.matrix-quick-stats .stat-open{background:#fff4d8;color:#8c5b00}.matrix-quick-stats .stat-conflict{background:#ffe8ea;color:#b51d31}
.matrix-team-picker-backdrop{position:fixed;inset:0;z-index:1200;background:rgba(17,35,53,.38);display:grid;place-items:center;padding:18px}.matrix-team-picker-backdrop.is-hidden{display:none}.matrix-team-picker-dialog{width:min(780px,96vw);max-height:min(76vh,720px);display:flex;flex-direction:column;background:#fff;border-radius:16px;box-shadow:0 24px 70px rgba(23,45,65,.25);overflow:hidden}.matrix-team-picker-head{display:flex;justify-content:space-between;align-items:center;padding:13px 15px;border-bottom:1px solid #e2e8ee}.matrix-team-picker-head>div{display:flex;flex-direction:column}.matrix-team-picker-head small{font-size:10px;color:#748496}.matrix-team-picker-tools{display:flex;gap:6px;padding:8px 12px;background:#f7fafc;border-bottom:1px solid #e5ebf0}.matrix-roster-accordion{overflow:auto;padding:8px 10px;display:flex;flex-direction:column;gap:6px}.matrix-roster-compact{border:1px solid #dce5ed;border-radius:10px;background:#fbfdff;overflow:hidden}.matrix-roster-compact summary{display:flex;justify-content:space-between;align-items:center;padding:8px 10px;cursor:pointer;list-style:none}.matrix-roster-compact summary::-webkit-details-marker{display:none}.matrix-roster-compact summary small{font-size:9px;color:#7a8998}.matrix-team-compact-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;padding:7px;border-top:1px solid #e7edf2;background:#fff}.matrix-team-compact-list label{display:flex;align-items:center;gap:7px;min-width:0;padding:7px 8px;border:1px solid #e1e8ee;border-radius:8px;cursor:pointer}.matrix-team-compact-list label:has(input:checked){background:#eef8ff;border-color:#77b9e3}.matrix-team-compact-list label>span:last-child{min-width:0;display:flex;flex-direction:column}.matrix-team-compact-list strong,.matrix-team-compact-list small{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.matrix-team-compact-list strong{font-size:10px}.matrix-team-compact-list small{font-size:8px;color:#7a8998}.matrix-team-picker-footer{display:flex;justify-content:space-between;align-items:center;padding:10px 13px;border-top:1px solid #e1e8ef;background:#f8fafc;font-size:10px}
.matrix-person-row:has(.matrix-day-cell.has-conflict) .matrix-employee-cell{box-shadow:inset 4px 0 #df2638}
@media(max-width:1250px){.matrix-filter-line{grid-template-columns:auto minmax(130px,1fr) minmax(150px,1.3fr) 110px 120px auto auto}.matrix-selected-chips{display:none}}
@media(max-width:850px){.matrix-filter-line{display:flex;flex-wrap:wrap;align-items:end}.matrix-filter-line>label{min-width:140px;flex:1}.matrix-search-field{min-width:200px!important}.matrix-team-compact-list{grid-template-columns:1fr}}


/* ===== V20.12 · Weekmatrix sync status ===== */
.matrix-sync-status{
  display:inline-flex;align-items:center;gap:5px;padding:4px 9px;border-radius:999px;
  text-decoration:none;font-size:12px;font-weight:700;border:1px solid #d7e2ea;background:#f8fbfd;color:#526779;
}
.matrix-sync-status.ok{background:#eef9f2;border-color:#bfe3cb;color:#17633a}
.matrix-sync-status.warn{background:#fff8e8;border-color:#ead9aa;color:#7a5a14}
.matrix-sync-status.danger{background:#fff0f0;border-color:#efc4c4;color:#a02e2e}
.portal-context,.portal-panel{background:#fff;border:1px solid #dce4ee;border-radius:14px;padding:14px;margin:12px 0;box-shadow:0 2px 10px rgba(15,29,51,.06)}
.portal-context{display:flex;align-items:center;justify-content:space-between;gap:12px}.portal-context div{display:flex;flex-direction:column}.portal-context form{display:flex;gap:8px}.portal-context select,.portal-context button,.portal-calendar-form input,.calendar-feed-result input{min-height:40px;border:1px solid #bac7d6;border-radius:8px;padding:8px;background:#fff}.portal-context button,.mobile-primary{border:0;border-radius:8px;padding:10px 14px;background:#1565c0;color:#fff;text-decoration:none;display:inline-block;cursor:pointer}.portal-calendar-form{display:grid;grid-template-columns:1fr 1fr;gap:12px}.portal-calendar-form label,.calendar-feed-result label{display:flex;flex-direction:column;gap:5px}.portal-calendar-form button{grid-column:1/-1}.calendar-feed-result{display:flex;flex-direction:column;gap:10px;margin-top:12px}.shift-calendar-link{font-size:.78rem;color:#1565c0;text-decoration:none;margin-top:5px}.mobile-bottom-five{grid-template-columns:repeat(5,1fr)!important}.mobile-alert.danger{background:#ffe8e8;color:#8f1d1d;padding:10px;border-radius:8px}@media(max-width:520px){.portal-context{align-items:flex-start;flex-direction:column}.portal-context form{width:100%}.portal-context select{min-width:0;flex:1}.portal-calendar-form{grid-template-columns:1fr}}
.shift-quick-actions{display:flex;gap:14px;flex-wrap:wrap}.swap-shift-grid{display:grid;gap:10px}.swap-shift-option,.swap-candidate,.swap-request{display:flex;justify-content:space-between;gap:12px;padding:13px;border:1px solid #d9e2ec;border-radius:12px;background:#fff;text-decoration:none;color:#142033}.swap-shift-option>*,.swap-candidate>div>*,.swap-request>div>*{display:block;margin:2px 0}.swap-shift-option.selected{border-color:#1565c0;background:#edf5ff;box-shadow:0 0 0 2px rgba(21,101,192,.12)}.swap-candidate form,.swap-request form{display:flex;flex-direction:column;gap:8px;min-width:170px}.swap-candidate input{border:1px solid #bac7d6;border-radius:8px;padding:9px}.swap-candidate em,.swap-request em{color:#287244;font-size:.78rem;font-style:normal}.swap-request{margin:9px 0}@media(max-width:600px){.swap-candidate,.swap-request{flex-direction:column}.swap-candidate form,.swap-request form{width:100%;min-width:0}.swap-candidate button,.swap-request button{min-height:44px}}
.portal-home-body{background:#eef3f8;color:#122033;min-height:100vh;padding-bottom:78px}.portal-hero{background:linear-gradient(135deg,#0d1b31 0%,#173a61 62%,#0c6f78 100%);color:#fff;padding:20px max(18px,calc((100vw - 820px)/2)) 28px;border-radius:0 0 28px 28px;box-shadow:0 8px 28px rgba(10,27,49,.2)}.portal-hero-top{display:flex;align-items:flex-start;justify-content:space-between;gap:14px}.portal-eyebrow{font-size:.72rem;text-transform:uppercase;letter-spacing:.12em;color:#9fdae0}.portal-hero h1{font-size:clamp(1.55rem,6vw,2.2rem);margin:4px 0 0}.portal-hero .mobile-user-actions a{color:#fff;border-color:rgba(255,255,255,.3)}.portal-active-context{margin-top:20px;display:flex;justify-content:space-between;align-items:center;gap:14px;padding:14px 15px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);border-radius:15px;backdrop-filter:blur(8px)}.portal-active-context>div{display:flex;flex-direction:column}.portal-active-context small{color:#b9d8e5}.portal-active-context strong{font-size:1.12rem}.portal-active-context span{font-size:.82rem;color:#deedf4}.portal-active-context form{display:flex;gap:8px}.portal-active-context select,.portal-active-context button{min-height:42px;border-radius:10px;padding:8px 10px}.portal-active-context select{border:1px solid rgba(255,255,255,.4);background:#fff;color:#142033}.portal-active-context button{border:0;background:#24a3ad;color:#fff;font-weight:700}.portal-home-wrap{width:min(820px,calc(100% - 28px));margin:-10px auto 30px}.portal-action-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.portal-action{position:relative;min-height:112px;display:flex;flex-direction:column;align-items:flex-start;justify-content:center;padding:15px;background:#fff;border:1px solid #dce5ed;border-radius:16px;color:#142033;text-decoration:none;box-shadow:0 4px 14px rgba(19,40,66,.06);transition:transform .15s,box-shadow .15s}.portal-action:active{transform:scale(.98)}.portal-action.primary{background:linear-gradient(145deg,#1666ba,#1c7bd3);color:#fff;border:0}.portal-action.clock{background:linear-gradient(145deg,#08746f,#0b9990);color:#fff;border:0}.portal-action-icon{font-size:1.45rem;line-height:1;margin-bottom:9px}.portal-action strong{font-size:.98rem}.portal-action small{font-size:.74rem;margin-top:3px;color:#64758a}.portal-action.primary small,.portal-action.clock small{color:rgba(255,255,255,.8)}.portal-badge{position:absolute;top:10px;right:10px;display:grid;place-items:center;min-width:23px;height:23px;padding:0 6px;border-radius:20px;background:#e93e52;color:#fff;font-size:.72rem}.portal-badge.subtle{background:#315f85}.portal-upcoming{margin-top:17px;padding:17px;background:#fff;border:1px solid #dce5ed;border-radius:18px;box-shadow:0 4px 18px rgba(19,40,66,.06)}.portal-section-head{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:8px}.portal-section-head small{color:#66798e;text-transform:uppercase;letter-spacing:.08em;font-size:.67rem}.portal-section-head h2{margin:2px 0;font-size:1.2rem}.portal-section-head a{font-size:.8rem;color:#1266b1;text-decoration:none}.portal-upcoming-card{display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:12px;align-items:center;padding:13px 0;border-top:1px solid #e8edf2}.portal-upcoming-card time{display:flex;flex-direction:column;align-items:center;padding:7px 4px;border-radius:10px;background:#edf5fc;color:#135c9d}.portal-upcoming-card time strong{font-size:1.15rem}.portal-upcoming-card time span{font-size:.66rem;text-transform:uppercase}.portal-upcoming-card>div:nth-child(2){display:flex;flex-direction:column;min-width:0}.portal-upcoming-card>div:nth-child(2)>strong{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.portal-upcoming-card span,.portal-upcoming-card small{font-size:.76rem;color:#66778a;margin-top:3px}.portal-upcoming-actions{display:flex;flex-direction:column;gap:5px}.portal-upcoming-actions a{font-size:.72rem;color:#1266b1;text-decoration:none;padding:5px 7px;background:#edf5fc;border-radius:7px}.portal-empty-state{display:flex;flex-direction:column;align-items:center;text-align:center;padding:28px 10px;color:#64758a}.portal-bottom{grid-template-columns:repeat(5,1fr)!important}.portal-bottom a{position:relative}.portal-bottom b{position:absolute;top:3px;right:14%;background:#e93e52;color:#fff;border-radius:12px;min-width:17px;height:17px;font-size:.62rem;display:grid;place-items:center}@media(min-width:700px){.portal-action-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.portal-action{min-height:128px}}@media(max-width:480px){.portal-hero-top{flex-direction:column}.portal-hero .mobile-user-actions{align-self:flex-end;margin-top:-38px}.portal-active-context{align-items:flex-start;flex-direction:column}.portal-active-context form{width:100%}.portal-active-context select{flex:1;min-width:0}.portal-home-wrap{width:min(100% - 20px,820px)}.portal-upcoming-card{grid-template-columns:44px minmax(0,1fr)}.portal-upcoming-actions{grid-column:2;flex-direction:row}}
.prepublish-page{max-width:1180px;margin:0 auto;padding:22px}.prepublish-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:16px 0}.prepublish-kpi{display:flex;flex-direction:column;gap:4px;padding:18px;border:1px solid #dce4ee;border-radius:14px;background:#fff;box-shadow:0 3px 13px rgba(15,29,51,.06)}.prepublish-kpi strong{font-size:1.55rem}.prepublish-kpi small,.prepublish-issue small{color:#66778a}.prepublish-kpi.block{border-left:5px solid #d93939}.prepublish-kpi.warning{border-left:5px solid #e09b16}.prepublish-kpi.ok{border-left:5px solid #24945a}.prepublish-decision{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:16px}.prepublish-decision h2,.prepublish-decision p{margin:3px 0}.prepublish-issue-list{display:flex;flex-direction:column;gap:9px}.prepublish-issue{display:grid;grid-template-columns:105px minmax(0,1fr) auto;align-items:center;gap:14px;padding:13px;border:1px solid #dce4ee;border-radius:11px;background:#fff}.prepublish-issue.block{border-left:5px solid #d93939}.prepublish-issue.warning{border-left:5px solid #e09b16}.prepublish-severity{font-size:.72rem;font-weight:800;text-transform:uppercase;color:#6b2630}.prepublish-issue.warning .prepublish-severity{color:#845b0c}.prepublish-issue div{display:flex;flex-direction:column;gap:3px}.prepublish-issue p{margin:2px 0 0}.prepublish-all-clear{display:flex;flex-direction:column;align-items:center;padding:40px 15px;color:#217447}.small-btn{white-space:nowrap}@media(max-width:720px){.prepublish-page{padding:12px}.prepublish-summary{grid-template-columns:1fr}.prepublish-decision,.prepublish-issue{display:flex;flex-direction:column;align-items:flex-start}.prepublish-issue .tool-btn{width:100%;text-align:center}}
.personnel-quality-link{border-color:#77b99a;background:#effaf4;color:#176a48}.personnel-quality-metrics .metric-card{min-height:92px}.personnel-quality-metrics .ok-card{background:#eefaf3;border-color:#acd8bf}.personnel-quality-metrics .danger-card{background:#fff2f1;border-color:#efbbb6}.personnel-quality-metrics .warn-card{background:#fff8e8;border-color:#ead199}.section-heading-row{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:16px}.section-heading-row h2{margin:3px 0 0}.quality-table td small{display:block;color:#6d7b90;margin-top:3px}.quality-two-column{display:grid;grid-template-columns:1fr 1fr;gap:16px}.identity-quality-row{display:flex;gap:12px;align-items:center;padding:12px 0;border-top:1px solid #e5ebf2}.identity-link-symbol{display:grid;place-items:center;flex:0 0 30px;height:30px;border-radius:50%;background:#e8f7ef;color:#14724b;font-weight:800}.identity-quality-row small{display:block;color:#6d7b90;margin-top:4px}.quality-warning-box,.quality-ok-box{display:flex;flex-direction:column;gap:4px;border-radius:10px;padding:12px;margin-top:14px}.quality-warning-box{background:#fff4e2;color:#85550b}.quality-ok-box{background:#eaf8f0;color:#176a48}.quality-all-clear{background:#eefaf3;border-color:#acd8bf}.quality-all-clear strong{color:#176a48;font-size:18px}@media(max-width:900px){.quality-two-column{grid-template-columns:1fr}.personnel-quality-page .admin-titlebar{align-items:flex-start}.personnel-quality-page .title-actions{width:100%}}
.team-manage-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(360px,1fr));gap:14px}.team-manage-card{border-top:4px solid var(--team-color)}.team-manage-head{display:flex;align-items:center;gap:11px}.team-manage-head>div{display:flex;flex-direction:column}.team-manage-head small{color:#718096;margin-top:3px}.team-manage-color{width:14px;height:38px;border-radius:8px;background:var(--team-color)}.team-manage-stats{display:grid;grid-template-columns:repeat(2,1fr);gap:7px;margin:15px 0}.team-manage-stats span{background:#f4f7fa;border-radius:8px;padding:8px;color:#607087;font-size:12px}.team-manage-stats b{color:#162c48}.team-manage-actions{display:flex;align-items:center;gap:7px;flex-wrap:wrap}.team-manage-actions form{margin-left:auto}.danger-outline-btn{border:1px solid #e3a4a4;background:#fff5f5;color:#b22b2b;border-radius:8px;padding:8px 11px;font-weight:700}.danger-outline-btn:disabled{opacity:.45;cursor:not-allowed}.team-edit-modal{width:min(720px,94vw);max-height:88vh;overflow:auto}.team-edit-form{display:grid;grid-template-columns:1fr 1fr;gap:13px;padding:16px}.team-edit-form label{display:flex;flex-direction:column;gap:5px;font-weight:700}.team-edit-form input,.team-edit-form select{padding:10px;border:1px solid #cfd9e5;border-radius:9px}.team-edit-form fieldset{grid-column:1/-1;border:1px solid #dbe4ed;border-radius:10px;padding:12px}.team-role-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;max-height:180px;overflow:auto}.team-role-options label{display:flex;flex-direction:row;align-items:center;font-weight:500;background:#f7f9fb;padding:7px;border-radius:7px}.team-edit-footer{grid-column:1/-1;display:flex;justify-content:flex-end;gap:8px}@media(max-width:700px){.team-manage-grid{grid-template-columns:1fr}.team-edit-form{grid-template-columns:1fr}.team-role-options{grid-template-columns:1fr}}
.pwa-setup-card{display:flex;align-items:center;gap:8px;flex-wrap:wrap;background:#eaf6ff;border:1px solid #9fd2f0;border-radius:14px;padding:12px;margin-bottom:14px}.pwa-setup-card>div{display:flex;flex-direction:column;flex:1;min-width:160px}.pwa-setup-card small{color:#5f7185;margin-top:2px}.pwa-setup-card button{border:1px solid #8dbeda;background:#fff;color:#174b70;border-radius:9px;padding:8px;font-weight:700}.pwa-setup-card p{flex-basis:100%;margin:2px 0;color:#52677b}.portal-pending{background:#fff;border:1px solid #dce5ee;border-radius:15px;padding:13px;margin-bottom:15px}.portal-pending-row{display:grid;grid-template-columns:88px 1fr auto;gap:10px;align-items:center;padding:11px 3px;border-top:1px solid #e7edf3;color:#162c48;text-decoration:none}.portal-pending-row>span{font-size:11px;font-weight:800;color:#a45b00;background:#fff3dc;border-radius:99px;padding:5px;text-align:center}.portal-pending-row div{display:flex;flex-direction:column}.portal-pending-row small{color:#6c7d90;margin-top:2px}.mobile-offline-banner{display:none;background:#fff0cc;color:#754d00;border-radius:9px;padding:8px 10px;margin-bottom:10px;font-weight:700}.is-offline .mobile-offline-banner{display:block}.mobile-offline{min-height:100vh;display:flex;flex-direction:column;justify-content:center;align-items:center;text-align:center;padding:28px;gap:12px}.mobile-offline img{width:92px;height:92px;border-radius:22px}.mobile-offline h1,.mobile-offline p{margin:0}.mobile-offline p{max-width:420px;color:#66788c}.mobile-offline a{color:#176a9a}@media(max-width:520px){.pwa-setup-card button{flex:1}.portal-pending-row{grid-template-columns:78px 1fr auto}}
.auth-recovery-link{display:block;text-align:center;margin-top:14px;color:#176a9a;font-weight:700}
.chat-admin{max-width:1050px;margin:0 auto;padding:22px}.chat-new-card{display:grid;grid-template-columns:minmax(240px,.8fr) minmax(420px,1.5fr);gap:20px;align-items:end;margin-bottom:15px}.chat-new-card h2,.chat-new-card p{margin:2px 0}.chat-new-card p{color:#697b8e}.chat-new-card form{display:grid;grid-template-columns:1.2fr 1.4fr auto;gap:9px;align-items:end}.chat-new-card label,.chat-compose label{display:flex;flex-direction:column;gap:5px;font-size:12px;font-weight:800}.chat-new-card input,.chat-new-card select,.chat-compose textarea{width:100%;box-sizing:border-box;border:1px solid #cbd8e4;border-radius:9px;padding:10px;background:#fff;font:inherit}.chat-thread-list{display:flex;flex-direction:column}.chat-thread-row{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:14px 10px;border-top:1px solid #e4ebf1;color:#172d47;text-decoration:none}.chat-thread-row.unread{background:#eef8ff;border-left:4px solid #2295d1}.chat-thread-row>div{display:flex;flex-direction:column;min-width:0;gap:3px}.chat-thread-row strong,.chat-thread-row span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-thread-row span,.chat-thread-row small{color:#697b8e}.chat-thread-row>b{flex:none;background:#db3850;color:#fff;border-radius:99px;padding:5px 8px;font-size:11px}.chat-conversation{padding:0;overflow:hidden}.chat-messages{display:flex;flex-direction:column;gap:9px;padding:18px;min-height:260px;max-height:58vh;overflow-y:auto;background:#f4f7fa}.chat-bubble{align-self:flex-start;max-width:min(72%,620px);padding:10px 12px;border-radius:5px 14px 14px 14px;background:#fff;border:1px solid #dce5ed;box-shadow:0 2px 7px rgba(20,43,67,.05)}.chat-bubble.mine{align-self:flex-end;background:#dff3ff;border-color:#9dd2ee;border-radius:14px 5px 14px 14px}.chat-bubble strong,.chat-bubble small{font-size:11px}.chat-bubble p{margin:5px 0;white-space:pre-wrap;overflow-wrap:anywhere}.chat-bubble small{color:#758598}.chat-compose{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:end;padding:14px;background:#fff;border-top:1px solid #dde6ee}.chat-compose label{min-width:0}.chat-compose textarea{resize:vertical;min-height:72px}.chat-page{padding-bottom:20px}.chat-page .chat-compose{position:sticky;bottom:0;border:1px solid #dce5ed;border-radius:14px;margin-top:10px;grid-template-columns:1fr}.chat-page .chat-compose button{border:0;background:#178fd0;color:#fff;border-radius:9px;padding:11px;font-weight:800}@media(max-width:760px){.chat-admin{padding:12px}.chat-new-card{grid-template-columns:1fr}.chat-new-card form{grid-template-columns:1fr}.chat-bubble{max-width:88%}.chat-compose{grid-template-columns:1fr}}
.chat-conversation-head{display:flex;align-items:center;gap:10px;padding:12px 15px;border-bottom:1px solid #dfe8ef;background:#fff}.chat-conversation-head>div{display:flex;flex-direction:column}.chat-conversation-head small{color:#718196}.chat-avatar{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;background:#173958;color:#fff;font-weight:900}.chat-empty{margin:auto;display:flex;flex-direction:column;align-items:center;gap:4px;color:#7a8999}.chat-empty>span{font-size:32px}.chat-empty strong{color:#42566a}.chat-compose.enhanced{position:relative;display:flex;flex-direction:column;align-items:stretch;gap:8px}.chat-compose.enhanced textarea{min-height:60px;max-height:150px;resize:vertical;border-radius:13px}.chat-compose-tools{display:flex;align-items:center;gap:7px}.chat-compose-tools .chat-tool{display:grid;place-items:center;width:38px;height:36px;min-width:38px;padding:0!important;border:1px solid #cad8e3!important;border-radius:9px!important;background:#f7fafc!important;color:#17314a!important;cursor:pointer}.chat-file input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}.chat-compose-tools>[data-file-summary]{font-size:11px;color:#68798b;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chat-compose-tools .chat-send{margin-left:auto;padding:9px 15px!important;border:0!important;border-radius:9px!important;background:#168fcf!important;color:#fff!important;font-weight:800;white-space:nowrap}.emoji-picker{position:absolute;left:13px;bottom:60px;z-index:4;display:grid;grid-template-columns:repeat(6,36px);gap:4px;padding:8px;background:#fff;border:1px solid #ccd9e3;border-radius:12px;box-shadow:0 8px 24px rgba(20,43,67,.18)}.emoji-picker[hidden]{display:none}.emoji-picker button{width:36px;height:34px;border:0;background:#f3f6f9;border-radius:7px;font-size:18px;cursor:pointer}.chat-bubble a{color:#096db1;text-decoration:underline;overflow-wrap:anywhere}.chat-attachments{display:flex;flex-direction:column;gap:5px;margin:7px 0}.chat-attachments a{display:flex;align-items:center;gap:6px;padding:7px 8px;border:1px solid rgba(56,111,145,.22);border-radius:8px;background:rgba(255,255,255,.72);text-decoration:none}.chat-attachments a span{font-weight:700;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.chat-attachments a small{margin-left:auto;white-space:nowrap}@media(max-width:520px){.chat-compose.enhanced{padding:10px}.emoji-picker{grid-template-columns:repeat(6,34px);left:8px}.chat-compose-tools .chat-send{padding:9px 11px!important}}
.readiness-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;margin-bottom:18px}.readiness-card{background:#fff;border:1px solid #dbe5f1;border-top:4px solid #e7a71a;border-radius:14px;padding:18px;display:grid;gap:7px;box-shadow:0 3px 12px rgba(18,41,70,.05)}.readiness-card.ok{border-top-color:#15985b}.readiness-card.bad{border-top-color:#db353d}.readiness-card span{font-size:12px;font-weight:800;text-transform:uppercase;color:#65758c}.readiness-card strong{font-size:18px;color:#13243d;overflow-wrap:anywhere}.readiness-card small{color:#64748b}.readiness-inline{display:flex;gap:12px;flex-wrap:wrap;margin:14px 0}.readiness-inline span{background:#f2f6fa;border-radius:10px;padding:11px 14px;color:#53657c}.readiness-inline b{color:#12243d}.readiness-warning{background:#fff6dc;border:1px solid #f0cf72;border-radius:10px;padding:12px;margin-top:10px}.error-log-list{max-height:280px;overflow:auto;display:grid;gap:6px}.error-log-list>code{display:block;background:#12243d;color:#e8f1fa;border-radius:6px;padding:8px;white-space:pre-wrap;overflow-wrap:anywhere}.launch-checklist{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:14px}.launch-checklist label{background:#f4f7fa;border:1px solid #dce5ef;border-radius:10px;padding:13px;font-weight:700}@media(max-width:950px){.readiness-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.readiness-grid,.launch-checklist{grid-template-columns:1fr}}