/* Planning v4 — basisstijl komt uit de evaluatietool. */
html,body{height:100%}
body.planning-page{overflow:hidden}
.planning-page header{
  position:relative;
  z-index:40;
}
.planning-page header nav{
  display:flex;
  gap:10px;
}
.planning-page header nav a{
  color:inherit;
  text-decoration:none;
}
.planning-main{
  max-width:none !important;
  width:100%;
  height:calc(100vh - 64px);
  margin:0 !important;
  padding:14px 16px 16px !important;
  display:flex;
  flex-direction:column;
  min-width:0;
}
.planning-toolbar{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  flex:0 0 auto;
  margin-bottom:12px;
}
.planning-toolbar h1{margin:0 0 3px}
.planning-shell{
  flex:1 1 auto;
  min-height:0;
  min-width:0;
  overflow:auto;
  background:#fff;
  border:1px solid #ddd;
  border-radius:10px;
  box-shadow:0 2px 10px rgba(0,0,0,.05);
}
.year-grid{
  --employee-width:190px;
  --week-width:235px;
  display:grid;
  grid-template-columns:var(--employee-width) repeat(var(--week-count),var(--week-width));
  width:max-content;
  min-width:100%;
  align-items:stretch;
}
.sticky-left{
  position:sticky;
  left:0;
  z-index:20;
}
.sticky-top{
  position:sticky;
  top:0;
  z-index:25;
}
.corner-cell{
  display:flex;
  align-items:center;
  padding:12px 14px;
  min-height:74px;
  background:#f6f6f6;
  border-right:1px solid #ddd;
  border-bottom:1px solid #ddd;
  z-index:35;
}
.week-head{
  min-height:74px;
  background:#fafafa;
  border-right:1px solid #ddd;
  border-bottom:1px solid #ddd;
  padding:8px 9px 6px;
}
.week-title{font-weight:700;font-size:13px}
.week-range{font-size:11px;color:#777;margin-top:1px}
.weekday-heads{
  display:grid;
  grid-template-columns:repeat(5,1fr);
  gap:2px;
  margin-top:8px;
  font-size:10px;
  color:#666;
}
.weekday-heads span{text-align:center}
.employee-cell{
  min-height:158px;
  padding:12px 14px;
  background:#fafafa;
  border-right:1px solid #ddd;
  border-bottom:1px solid #ddd;
  display:flex;
  align-items:flex-start;
}
.week-cell{
  min-height:158px;
  border-right:1px solid #ddd;
  border-bottom:1px solid #ddd;
  background:#fff;
}
.day-row{
  min-height:31px;
  display:grid;
  grid-template-columns:28px 1fr;
  border-bottom:1px solid #eee;
}
.day-row:last-child{border-bottom:0}
.day-label{
  display:flex;
  justify-content:center;
  align-items:flex-start;
  padding-top:7px;
  font-size:9px;
  color:#999;
  background:#fbfbfb;
  border-right:1px solid #eee;
}
.day-items{
  min-width:0;
  padding:3px 4px;
  position:relative;
}
.plan-cell.dragover .day-items{background:#fff7ef}
.plan-item{
  display:flex;
  align-items:center;
  gap:5px;
  min-height:24px;
  padding:3px 22px 3px 7px;
  margin-bottom:2px;
  border-left:3px solid #e96f00;
  border-radius:4px;
  background:#fff4e8;
  font-size:10px;
  line-height:1.15;
  position:relative;
  cursor:grab;
  user-select:none;
}
.plan-item.dragging{opacity:.45}
.plan-item-name{
  min-width:0;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
  font-weight:700;
}
.plan-item small{font-size:9px;color:#777;white-space:nowrap}
.delete-item{
  position:absolute;
  right:2px;
  top:1px;
  width:19px;
  height:19px;
  padding:0;
  border:0;
  background:transparent;
  color:#777;
  font-size:15px;
  line-height:18px;
}
.delete-item:hover{color:#b22;background:transparent}
.add-item{
  width:20px;
  height:20px;
  min-width:20px;
  padding:0;
  border:1px dashed #bbb;
  background:#fff;
  color:#888;
  border-radius:50%;
  font-size:14px;
  line-height:16px;
  display:none;
}
.day-row:hover .add-item{display:inline-block}
.empty-row{
  grid-column:1 / -1;
  padding:25px;
}
.modal{
  position:fixed;
  inset:0;
  display:grid;
  place-items:center;
  background:rgba(0,0,0,.35);
  z-index:100;
}
.modal[hidden]{display:none}
.modal-box{
  position:relative;
  width:min(480px,calc(100vw - 30px));
  background:#fff;
  border-radius:12px;
  padding:22px;
  box-shadow:0 20px 60px rgba(0,0,0,.25);
}
.modal-box h2{margin-top:0}
.modal-box label{display:block;margin:12px 0;font-weight:700}
.modal-box input,.modal-box select{width:100%}
.modal-close{
  position:absolute;
  right:10px;
  top:8px;
  background:transparent;
  color:#555;
  border:0;
  font-size:24px;
  padding:4px 8px;
}
.current-week{
  box-shadow:inset 0 3px 0 #e96f00;
}
@media(max-width:900px){
  .year-grid{--employee-width:155px;--week-width:215px}
  .planning-main{padding:10px !important}
}


/* v5 beheer + horizontaal scrollen */
.planning-shell{
  overflow-x:scroll !important;
  overflow-y:auto !important;
  scrollbar-gutter:stable;
  overscroll-behavior-x:contain;
}
.planning-shell::-webkit-scrollbar{height:14px;width:12px}
.planning-shell::-webkit-scrollbar-thumb{background:#b8bcc2;border-radius:8px;border:3px solid #f4f4f4}
.planning-shell::-webkit-scrollbar-track{background:#f4f4f4}
.employee-cell{flex-direction:column;gap:4px}
.employee-cell small{display:block;color:#777;font-size:11px;font-weight:400}
.beheer-main{max-width:1400px;margin:0 auto;padding:22px}
.beheer-tabs{display:flex;gap:8px;margin:14px 0 18px}
.beheer-tabs a{padding:9px 15px;border-radius:18px;text-decoration:none;background:#eee;color:#333;font-weight:700}
.beheer-tabs a.active{background:#e96f00;color:#fff}
.beheer-table{width:100%;border-collapse:collapse}
.beheer-table th,.beheer-table td{padding:10px;border-bottom:1px solid #eee;vertical-align:middle}
.beheer-row-form{display:grid;grid-template-columns:100px minmax(180px,260px) auto;gap:12px;align-items:center}
.toggle-label{display:flex;align-items:center;gap:7px}
.toggle-label input{width:auto}
.block{display:block;margin-top:3px;color:#777}
.inactive-row{opacity:.55}
.beheer-add-form{display:flex;gap:10px;max-width:650px;margin-bottom:18px}
.beheer-add-form input{flex:1}
.functie-sort-list{max-width:760px;border:1px solid #ddd;border-radius:10px;overflow:hidden}
.functie-sort-row{display:grid;grid-template-columns:38px 1fr 190px;align-items:center;gap:10px;padding:12px 14px;background:#fff;border-bottom:1px solid #eee;cursor:grab}
.functie-sort-row:last-child{border-bottom:0}
.functie-sort-row.dragging{opacity:.45;background:#fff4e8}
.drag-handle{font-size:20px;color:#999}
@media(max-width:800px){
  .beheer-row-form{grid-template-columns:1fr}
  .functie-sort-row{grid-template-columns:32px 1fr}
  .functie-sort-row .muted{grid-column:2}
}


/* v6 compact beheer - zelfde basis als evaluatiesysteem */
.compact-main{padding-top:12px !important}
.compact-title-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:5px}
.compact-title-row h1{margin:0}
.autosave-state{font-size:12px;color:#25823a;min-height:15px}
.autosave-state.error{color:#b02a2a}
.compact-tabs{margin:4px 0 8px}
.compact-tabs a{padding:6px 11px;border-radius:16px;font-size:13px}
.compact-card{padding:8px 10px !important;margin-bottom:8px !important}
.compact-table th,.compact-table td{padding:5px 7px !important;font-size:13px}
.compact-table input,.compact-table select{padding:5px 7px !important;min-height:30px}
.compact-table .block{font-size:10px;margin-top:0}
.compact-table input[type="checkbox"]{width:15px;height:15px;min-height:0}
.compact-add{display:grid;grid-template-columns:minmax(240px,520px) 32px;gap:6px;margin-bottom:7px}
.compact-add input{padding:5px 7px;min-height:30px}
.compact-add button{width:32px;height:30px;padding:0;border-radius:6px}
.compact-functions{max-width:760px}
.compact-functions .functie-sort-row{padding:6px 9px;min-height:35px;font-size:13px}
.beheer-table .customer-delete{width:24px;height:24px;padding:0;font-size:15px}
.planning-admin-page .beheer-main{padding:12px 16px}
.planning-admin-page .card h2{margin:0 0 6px}
.planning-admin-page p{margin:4px 0}


/* v7 - compacte Excel-achtige jaarplanning */
:root{
  --plan-grid:#202020;
  --plan-separator:#2e2e2e;
  --plan-cell:#fffef4;
}

/* beheer: normale checkbox, geen reuzenvinkjes */
.planning-admin-page .compact-table input[type="checkbox"],
.planning-admin-page input[type="checkbox"]{
  appearance:auto !important;
  -webkit-appearance:checkbox !important;
  width:14px !important;
  height:14px !important;
  min-width:14px !important;
  min-height:14px !important;
  padding:0 !important;
  margin:0 !important;
  transform:none !important;
  border-radius:0 !important;
  box-shadow:none !important;
  vertical-align:middle;
}

/* planning veel compacter */
.planning-page .planning-shell{
  border:1px solid var(--plan-grid);
  border-radius:0 !important;
}
.planning-page .planning-grid{
  font-size:11px !important;
  line-height:1.05 !important;
}
.planning-page .week-header,
.planning-page .day-header,
.planning-page .employee-cell,
.planning-page .day-cell{
  border-radius:0 !important;
}
.planning-page .week-header{
  min-height:25px !important;
  height:25px !important;
  padding:2px 4px !important;
  font-size:11px !important;
  font-weight:700;
  border-right:1px solid var(--plan-grid) !important;
  border-bottom:1px solid var(--plan-grid) !important;
}
.planning-page .employee-cell{
  padding:3px 7px !important;
  min-height:25px !important;
  font-size:11px !important;
  border-right:1px solid var(--plan-grid) !important;
  border-bottom:1px solid var(--plan-grid) !important;
}
.planning-page .employee-cell b{font-size:11px !important}
.planning-page .employee-cell small{font-size:9px !important;line-height:1 !important}
.planning-page .day-cell{
  min-height:21px !important;
  height:21px !important;
  padding:1px 3px !important;
  background:var(--plan-cell);
  border-right:1px solid var(--plan-grid) !important;
  border-bottom:1px solid #b9b9b9 !important;
  overflow:hidden;
}
.planning-page .planning-item{
  min-height:17px !important;
  height:17px !important;
  padding:1px 4px !important;
  margin:0 !important;
  border-radius:0 !important;
  font-size:10px !important;
  line-height:15px !important;
  box-shadow:none !important;
  border:0 !important;
  text-align:center;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

/* stevige zwarte scheiding tussen medewerkers */
.planning-page .employee-row{
  border-bottom:7px solid var(--plan-separator) !important;
}
.planning-page .employee-row:last-child{
  border-bottom-width:1px !important;
}

/* Functiekleuren: subtiele Excel-kleurvlakken.
   De class wordt hieronder via PHP op de medewerkerregel gezet. */
.planning-page .functie-kleur-0 .employee-cell{background:#f4c7b3 !important}
.planning-page .functie-kleur-1 .employee-cell{background:#c6e0b4 !important}
.planning-page .functie-kleur-2 .employee-cell{background:#b4c7e7 !important}
.planning-page .functie-kleur-3 .employee-cell{background:#ffe699 !important}
.planning-page .functie-kleur-4 .employee-cell{background:#d9e1f2 !important}
.planning-page .functie-kleur-5 .employee-cell{background:#e2f0d9 !important}
.planning-page .functie-kleur-6 .employee-cell{background:#f8cbad !important}
.planning-page .functie-kleur-7 .employee-cell{background:#d9d2e9 !important}


/* v8 - functie-kleur uit Beheer */
.planning-page .employee-row .employee-cell{
  background:var(--functie-kleur,#e2f0d9) !important;
}
.compact-functions .functie-sort-row{
  grid-template-columns:30px minmax(180px,1fr) 46px 150px !important;
}
.functie-color-wrap{
  width:32px;height:22px;display:block;
}
.functie-color{
  appearance:none;
  -webkit-appearance:none;
  width:32px !important;
  height:22px !important;
  padding:0 !important;
  border:1px solid #aaa !important;
  border-radius:3px !important;
  background:none !important;
  cursor:pointer;
}
.functie-color::-webkit-color-swatch-wrapper{padding:1px}
.functie-color::-webkit-color-swatch{border:0;border-radius:2px}
.functie-color::-moz-color-swatch{border:0;border-radius:2px}


/* v9 - functiesbeheer compact als tabel */
.functie-card{
  max-width:760px;
}
.functies-tablewrap{
  overflow:visible;
}
.functies-table{
  width:100%;
  table-layout:fixed;
}
.functies-table th,
.functies-table td{
  padding:5px 7px !important;
  height:34px !important;
}
.functies-table .drag-col{
  width:34px;
  text-align:center;
}
.functies-table .count-col{
  width:95px;
  text-align:center;
}
.functies-table .color-col{
  width:190px;
}
.functies-table .functie-sort-row{
  display:table-row !important;
  cursor:grab;
  background:#fff;
}
.functies-table .functie-sort-row.dragging{
  opacity:.45;
  background:#fff4e8;
}
.functies-table .drag-handle{
  font-size:17px;
  line-height:1;
  color:#999;
}
.functie-color-select{
  width:165px !important;
  min-width:165px !important;
  max-width:165px !important;
  height:29px !important;
  min-height:29px !important;
  padding:4px 28px 4px 28px !important;
  font-size:12px !important;
  background:
    linear-gradient(var(--selected-color),var(--selected-color)) 7px 50% / 13px 13px no-repeat,
    #fff !important;
}
.compact-functions,
.functie-sort-list{
  max-width:none !important;
  border:0 !important;
  border-radius:0 !important;
  overflow:visible !important;
}


/* v10 */
.beheer-title-left{
  display:flex;
  align-items:center;
  gap:14px;
}
.back-to-planning{
  color:#e96f00;
  text-decoration:none;
  font-size:13px;
  font-weight:700;
}
.back-to-planning:hover{text-decoration:underline}

.planning-nav a{
  text-decoration:none !important;
  cursor:pointer;
}

/* Functies: echte compacte tabel */
.functies-card{
  max-width:720px !important;
  padding:8px 10px !important;
}
.functies-compact-table{
  width:100%;
  border-collapse:collapse;
  table-layout:fixed;
  font-size:13px;
}
.functies-compact-table th,
.functies-compact-table td{
  padding:6px 8px !important;
  border-bottom:1px solid #e7e7e7;
  vertical-align:middle;
  height:36px;
}
.functies-compact-table th{
  text-align:left;
  font-size:12px;
}
.functies-compact-table .drag-col{
  width:34px;
  text-align:center;
}
.functies-compact-table .count-col{
  width:95px;
  text-align:center;
}
.functies-compact-table .color-col{
  width:170px;
}
.functies-compact-table .functie-sort-row{
  display:table-row !important;
  cursor:grab;
}
.functies-compact-table .functie-sort-row.dragging{
  opacity:.45;
  background:#fff4e8;
}
.functie-color-select{
  width:150px !important;
  max-width:150px !important;
  min-width:150px !important;
  height:30px !important;
  min-height:30px !important;
  padding:4px 8px !important;
  font-size:12px !important;
  border:1px solid #aaa !important;
  border-radius:5px !important;
  color:#222 !important;
}

/* hard guarantee for planning employee-cell colors */
.planning-page .employee-cell[style]{
  background-clip:padding-box !important;
}


/* v11 - functiespagina definitief strak uitgelijnd */
.planning-admin-page .functies-card{
  width:620px !important;
  max-width:calc(100vw - 32px) !important;
  margin:0 !important;
  padding:0 !important;
  border:1px solid #ddd !important;
  border-radius:7px !important;
  overflow:hidden !important;
}

.planning-admin-page .functies-compact-table{
  width:100% !important;
  table-layout:fixed !important;
  border-collapse:collapse !important;
  margin:0 !important;
}

.planning-admin-page .functies-compact-table col.drag-column{width:38px}
.planning-admin-page .functies-compact-table col.name-column{width:260px}
.planning-admin-page .functies-compact-table col.count-column{width:105px}
.planning-admin-page .functies-compact-table col.color-column{width:215px}

.planning-admin-page .functies-compact-table thead tr,
.planning-admin-page .functies-compact-table tbody tr{
  display:table-row !important;
}

.planning-admin-page .functies-compact-table th,
.planning-admin-page .functies-compact-table td{
  display:table-cell !important;
  box-sizing:border-box !important;
  height:38px !important;
  min-height:38px !important;
  padding:5px 8px !important;
  border:0 !important;
  border-bottom:1px solid #e5e5e5 !important;
  vertical-align:middle !important;
  line-height:1.15 !important;
}

.planning-admin-page .functies-compact-table tbody tr:last-child td{
  border-bottom:0 !important;
}

.planning-admin-page .functies-compact-table th{
  background:#f7f7f7 !important;
  font-size:11px !important;
  font-weight:700 !important;
  white-space:nowrap;
}

.planning-admin-page .functies-compact-table .drag-col{
  width:38px !important;
  text-align:center !important;
  padding-left:5px !important;
  padding-right:5px !important;
}

.planning-admin-page .functies-compact-table .functie-name-cell{
  width:260px !important;
  text-align:left !important;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

.planning-admin-page .functies-compact-table .count-col{
  width:105px !important;
  text-align:center !important;
}

.planning-admin-page .functies-compact-table .color-col{
  width:215px !important;
  text-align:left !important;
}

.planning-admin-page .functies-compact-table .drag-handle{
  display:inline-block !important;
  margin:0 !important;
  font-size:16px !important;
  color:#999 !important;
  line-height:1 !important;
}

.planning-admin-page .functies-compact-table .functie-color-select{
  display:block !important;
  box-sizing:border-box !important;
  width:170px !important;
  min-width:170px !important;
  max-width:170px !important;
  height:28px !important;
  min-height:28px !important;
  margin:0 !important;
  padding:3px 7px !important;
  font-size:11px !important;
  line-height:20px !important;
  border:1px solid #aaa !important;
  border-radius:4px !important;
}

@media (max-width:700px){
  .planning-admin-page .functies-card{
    width:100% !important;
    overflow-x:auto !important;
  }
  .planning-admin-page .functies-compact-table{
    min-width:620px !important;
  }
}


/* v12 - alleen bovenste navigatie gebruiken */
.back-to-planning{display:none !important}
.beheer-title-left{display:contents !important}
.planning-nav{
  position:relative;
  z-index:1000;
  pointer-events:auto !important;
}
.planning-nav-link{
  position:relative;
  z-index:1001;
  pointer-events:auto !important;
  cursor:pointer !important;
}


/* v13 - Excel-achtige selectie/kopiëren */
.planning-page .plan-cell{
  cursor:cell;
}
.planning-page .plan-cell.cell-selected{
  outline:2px solid #e96f00 !important;
  outline-offset:-2px;
  background:#fff8ef !important;
}
.planning-page .plan-cell.cell-selected .day-items{
  background:rgba(233,111,0,.035);
}
.planning-page.copied-feedback::after{
  content:'Gekopieerd';
  position:fixed;
  right:18px;
  bottom:18px;
  z-index:9999;
  background:#2d2d2d;
  color:#fff;
  padding:7px 11px;
  border-radius:5px;
  font-size:12px;
}


/* v15 - klantblok direct selecteerbaar */
.planning-page .plan-item.item-selected{
  outline:2px solid #e96f00 !important;
  outline-offset:-1px;
  box-shadow:0 0 0 1px #fff inset !important;
}
.planning-page .plan-item{
  cursor:pointer !important;
}


/* v16 - duidelijke Excel-selectie */
.planning-page .plan-item.item-selected{
  background:#cfe2f3 !important;
  color:#111 !important;
  outline:2px solid #4a78a8 !important;
  outline-offset:-1px !important;
  box-shadow:none !important;
}
.planning-page .plan-cell.cell-selected{
  background:#fff2cc !important;
  outline:2px solid #e0a000 !important;
  outline-offset:-2px !important;
}
.planning-page .plan-cell.cell-selected .day-items{
  background:transparent !important;
}


/* v17 - planningtitel uitsluitend in bovenbalk */
.planning-page .planning-main{
  padding-top:6px !important;
}
.planning-page .page-intro:empty,
.planning-page .planning-header:empty,
.planning-page .planning-title-row:empty{
  display:none !important;
}


/* v18 - geen plusknoppen; dubbelklik of typen */
.planning-page .add-item{display:none !important}

.customer-search-wrap{position:relative}
.customer-search-results,
.quick-customer-results{
  background:#fff;
  border:1px solid #cfcfcf;
  box-shadow:0 6px 18px rgba(0,0,0,.14);
  max-height:220px;
  overflow:auto;
  z-index:10050;
}
.customer-search-results{
  position:absolute;
  left:0;right:0;top:100%;
}
.customer-search-option{
  display:block;
  width:100%;
  border:0;
  border-bottom:1px solid #eee;
  border-radius:0;
  background:#fff;
  color:#222;
  text-align:left;
  padding:7px 9px;
  font-size:13px;
  font-weight:400;
}
.customer-search-option:hover,
.customer-search-option.active{
  background:#fff2e5;
  color:#111;
}

.quick-customer-picker{
  position:fixed;
  z-index:10040;
  background:#fff;
  border:1px solid #bbb;
  box-shadow:0 8px 22px rgba(0,0,0,.18);
  padding:5px;
}
.quick-customer-picker input{
  width:100%;
  height:30px;
  min-height:30px;
  padding:5px 7px;
  margin:0 0 4px;
  border:1px solid #aaa;
  border-radius:3px;
  font-size:13px;
}
.quick-customer-results{
  border:0;
  box-shadow:none;
  max-height:180px;
}


/* v19 - VHM logo + planningtitel links in bovenbalk */
header{
  display:flex !important;
  align-items:center !important;
}
header > b{
  display:none !important;
}
.planning-topbar-left{
  display:flex;
  align-items:center;
  margin-right:auto;
}
.planning-brand{
  display:flex;
  align-items:center;
  gap:11px;
  color:inherit !important;
  text-decoration:none !important;
  font-weight:700;
  white-space:nowrap;
}
.planning-logo{
  display:block;
  width:auto;
  height:30px;
  max-width:150px;
  object-fit:contain;
}
.planning-brand span{
  font-size:15px;
  font-weight:700;
}
.planning-nav{
  margin-left:auto !important;
  display:flex;
  align-items:center;
  gap:8px;
}


/* v20 - header zoals VHM/evaluatie: logo echt links, titel er direct naast */
body > header,
.planning-page > header,
.planning-admin-page > header{
  box-sizing:border-box !important;
  width:100% !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  min-height:58px !important;
  padding:6px 16px 6px 8px !important;
  gap:0 !important;
}

header > b{display:none !important}

.planning-brand-wrap{
  display:flex !important;
  align-items:center !important;
  margin:0 auto 0 0 !important;
  padding:0 !important;
}

.planning-brand{
  display:flex !important;
  align-items:center !important;
  gap:16px !important;
  margin:0 !important;
  padding:0 !important;
  text-decoration:none !important;
  color:inherit !important;
}

.planning-logo{
  display:block !important;
  height:42px !important;
  width:auto !important;
  max-width:190px !important;
  margin:0 !important;
  padding:0 !important;
  object-fit:contain !important;
}

.planning-brand-title{
  display:block !important;
  font-size:21px !important;
  line-height:1 !important;
  font-weight:700 !important;
  white-space:nowrap !important;
}

.planning-nav{
  display:flex !important;
  align-items:center !important;
  margin:0 0 0 auto !important;
  padding:0 !important;
}

.planning-page .planning-subtitle,
.planning-page .sub-title,
.planning-page .subtitle{
  display:none !important;
}


/* v21 - echte VHM Audit PNG uit evaluatiesysteem */
body > header,
.planning-page > header,
.planning-admin-page > header{
  padding-left:10px !important;
}
.planning-logo{
  height:38px !important;
  width:auto !important;
  max-width:150px !important;
  object-fit:contain !important;
}
.planning-brand-title{
  font-size:22px !important;
  font-weight:700 !important;
}
.planning-main{
  padding-top:5px !important;
}

/* v22 - één header/logo, evaluatie-achtige titel */
body > header,
.planning-page > header,
.planning-admin-page > header{
  display:block !important;
  min-height:0 !important;
  padding:10px 18px !important;
}
.planning-header-inner{
  width:100% !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:20px !important;
}
.planning-brand{
  display:flex !important;
  align-items:center !important;
  gap:22px !important;
  text-decoration:none !important;
  color:inherit !important;
  margin:0 !important;
}
.planning-logo{
  display:block !important;
  height:52px !important;
  width:auto !important;
  max-width:210px !important;
  object-fit:contain !important;
  margin:0 !important;
}
.planning-title{
  display:block !important;
  font-size:27px !important;
  line-height:1 !important;
  font-weight:800 !important;
  letter-spacing:-.3px !important;
  white-space:nowrap !important;
}
.planning-nav{margin-left:auto !important}
.planning-brand-wrap,.planning-topbar-left{display:none !important}


/* v23 - exact één logo via evaluation-base.css header::before */
.planning-header-inner,
.planning-brand,
.planning-brand-wrap,
.planning-topbar-left,
.planning-logo,
.planning-title,
.planning-brand-title{
  display:none !important;
}

body.planning-page > header,
body.planning-admin-page > header{
  display:flex !important;
  justify-content:space-between !important;
  align-items:center !important;
  min-height:92px !important;
  position:relative !important;
  padding:
    10px
    max(20px,calc((100% - 1080px)/2))
    10px
    max(238px,calc((100% - 1080px)/2 + 214px)) !important;
  background:linear-gradient(135deg,#fff,#fff4e6) !important;
  border-bottom:1px solid var(--line) !important;
}

body.planning-page > header::before,
body.planning-admin-page > header::before{
  content:"" !important;
  display:block !important;
  position:absolute !important;
  left:max(24px,calc((100% - 1080px)/2)) !important;
  top:50% !important;
  width:190px !important;
  height:62px !important;
  transform:translateY(-50%) !important;
  background:url("../images/logo-vhm-audit.png") left center/contain no-repeat !important;
}

body.planning-page > header > b,
body.planning-admin-page > header > b{
  display:block !important;
  font-size:28px !important;
  line-height:1.1 !important;
  font-weight:800 !important;
  margin:0 !important;
  white-space:nowrap !important;
}

body.planning-page > header .planning-nav,
body.planning-admin-page > header .planning-nav{
  display:flex !important;
  align-items:center !important;
  gap:18px !important;
  margin-left:auto !important;
}

@media(max-width:700px){
  body.planning-page > header,
  body.planning-admin-page > header{
    min-height:122px !important;
    padding:82px 17px 18px !important;
  }
  body.planning-page > header::before,
  body.planning-admin-page > header::before{
    left:17px !important;
    top:18px !important;
    width:145px !important;
    height:50px !important;
    transform:none !important;
  }
  body.planning-page > header > b,
  body.planning-admin-page > header > b{
    font-size:22px !important;
  }
}


/* v24 - 4 uur = halve balk */
.planning-page .plan-item-full{
  width:100% !important;
}
.planning-page .plan-item-half{
  width:50% !important;
  min-width:50% !important;
  max-width:50% !important;
}

/* popup sluitknop altijd zichtbaar/klikbaar */
.modal-box .modal-close{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  position:absolute !important;
  top:8px !important;
  right:8px !important;
  width:28px !important;
  height:28px !important;
  padding:0 !important;
  z-index:5 !important;
  cursor:pointer !important;
  pointer-events:auto !important;
}


/* v25 - header exact links / midden / rechts */
body.planning-page > header,
body.planning-admin-page > header{
  position:relative !important;
  min-height:88px !important;
  padding:10px 18px !important;
  display:flex !important;
  align-items:center !important;
}

/* logo echt links, klein stukje uit de kant */
body.planning-page > header::before,
body.planning-admin-page > header::before{
  left:16px !important;
  top:50% !important;
  width:205px !important;
  height:66px !important;
  transform:translateY(-50%) !important;
  background:url("../images/logo-vhm-audit.png") left center/contain no-repeat !important;
}

/* titel exact midden van viewport */
body.planning-page > header > b,
body.planning-admin-page > header > b{
  position:absolute !important;
  left:50% !important;
  top:50% !important;
  transform:translate(-50%,-50%) !important;
  margin:0 !important;
  font-size:29px !important;
  font-weight:800 !important;
  white-space:nowrap !important;
}

/* acties helemaal rechts */
body.planning-page > header .planning-nav,
body.planning-admin-page > header .planning-nav{
  position:absolute !important;
  right:18px !important;
  top:50% !important;
  transform:translateY(-50%) !important;
  margin:0 !important;
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
}

/* 4-uursblokken naast elkaar */
.planning-page .day-items{
  display:flex !important;
  flex-wrap:wrap !important;
  align-items:flex-start !important;
  gap:2px !important;
}
.planning-page .plan-item-full{
  flex:0 0 100% !important;
  width:100% !important;
  max-width:100% !important;
}
.planning-page .plan-item-half{
  flex:0 0 calc(50% - 1px) !important;
  width:calc(50% - 1px) !important;
  min-width:0 !important;
  max-width:calc(50% - 1px) !important;
}

/* definitieve planning */
.planning-page .plan-item.plan-item-final{
  background:#2f6b3b !important;
  color:#fff !important;
  border-left-color:#214d2a !important;
}
.planning-page .plan-item.plan-item-final small,
.planning-page .plan-item.plan-item-final .delete-item{
  color:#fff !important;
}

/* knop definitief maken */
.planning-action-btn{
  border:0 !important;
  border-radius:16px !important;
  background:#2f6b3b !important;
  color:#fff !important;
  font-weight:700 !important;
  font-size:12px !important;
  padding:7px 12px !important;
  cursor:pointer !important;
}
.planning-action-btn:disabled{
  opacity:.35 !important;
  cursor:default !important;
}

@media(max-width:900px){
  body.planning-page > header > b,
  body.planning-admin-page > header > b{
    font-size:22px !important;
  }
  body.planning-page > header::before,
  body.planning-admin-page > header::before{
    width:155px !important;
  }
}


/* v26 - statusknoppen tussen logo en gecentreerde planningtitel */
body.planning-page > header .planning-nav{
  position:static !important;
  transform:none !important;
  width:100% !important;
  margin:0 !important;
  display:block !important;
}
body.planning-page > header .planning-status-actions{
  position:absolute !important;
  left:235px !important;
  top:50% !important;
  transform:translateY(-50%) !important;
  display:flex !important;
  gap:7px !important;
  align-items:center !important;
}
body.planning-page > header .planning-nav > .planning-nav-link{
  position:absolute !important;
  right:18px !important;
  top:50% !important;
  transform:translateY(-50%) !important;
}
.planning-concept-btn{
  background:#ececec !important;
  color:#222 !important;
  border:1px solid #cfcfcf !important;
}
.planning-concept-btn:not(:disabled):hover{
  background:#ddd !important;
}


/* v27 - statusknoppen onder de header, links onder het logo */
body.planning-page > header .planning-status-actions{
  display:none !important;
}
.planning-statusbar{
  box-sizing:border-box !important;
  width:100% !important;
  min-height:43px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:8px !important;
  padding:6px 16px !important;
  background:#fff !important;
  border-bottom:1px solid #d8d8d8 !important;
}
.planning-status-btn{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  min-height:31px !important;
  border-radius:5px !important;
  padding:6px 13px !important;
  font-size:12px !important;
  line-height:1 !important;
  font-weight:700 !important;
  cursor:pointer !important;
  opacity:1 !important;
}
.planning-final-btn{
  background:#2f6b3b !important;
  border:1px solid #214d2a !important;
  color:#fff !important;
}
.planning-concept-btn{
  background:#ef7d00 !important;
  border:1px solid #d66f00 !important;
  color:#fff !important;
}
.planning-status-btn:disabled{
  opacity:.55 !important;
  cursor:default !important;
}
.planning-final-btn:not(:disabled):hover{
  background:#255830 !important;
}
.planning-concept-btn:not(:disabled):hover{
  background:#d97000 !important;
}


/* v29 - Ctrl/Cmd+klik multiselect */
.planning-page .plan-item.item-selected{
  background:#cfe2f3 !important;
  outline:2px solid #4a78a8 !important;
  outline-offset:-1px !important;
}


/* v31 - login */
.planning-login-page{
  min-height:100vh;
  margin:0;
  display:grid;
  place-items:center;
  background:#f6f6f6;
}
.login-shell{
  width:min(420px,calc(100vw - 30px));
}
.login-logo{
  width:190px;
  height:64px;
  margin:0 auto 14px;
  background:url("../images/logo-vhm-audit.png") center/contain no-repeat;
}
.login-card{
  background:#fff;
  border:1px solid #ddd;
  border-radius:9px;
  padding:22px;
  box-shadow:0 6px 24px rgba(0,0,0,.08);
}
.login-card h1{
  margin:0 0 6px;
  font-size:24px;
}
.login-card p{
  margin:0 0 16px;
  color:#666;
}
.login-card label{
  display:block;
  font-weight:700;
}
.login-card input{
  width:100%;
  margin-top:5px;
  box-sizing:border-box;
}
.login-card button{
  margin-top:12px;
}
.login-error{
  margin:0 0 12px;
  padding:8px 10px;
  background:#fbe9e9;
  color:#922;
  border-radius:5px;
  font-size:13px;
}
.planning-logout-link{
  opacity:.75;
  font-size:12px;
}

/* v32 - rechten uit planning_gebruikers */
.planning-readonly .delete-item{display:none !important}
.planning-readonly .plan-item{cursor:default !important}


/* v33 - actuele rechten zichtbaar en iedere request uit DB ververst */
.planning-user-info{
  font-size:11px;
  color:#777;
  white-space:nowrap;
}


/* v34 - Beheer en Uitloggen duidelijk apart; tijdelijke gebruikersinfo weg */
.planning-user-info{
  display:none !important;
}
body.planning-page > header .planning-nav,
body.planning-admin-page > header .planning-nav{
  display:flex !important;
  align-items:center !important;
  gap:14px !important;
}
.planning-nav-link{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  text-decoration:none !important;
  white-space:nowrap !important;
}
.planning-logout-link{
  margin-left:6px !important;
  padding-left:14px !important;
  border-left:1px solid #d6d6d6 !important;
  opacity:.72 !important;
}
.planning-logout-link:hover{
  opacity:1 !important;
}


/* v35 - rechtsboven navigatie: links NIET meer over elkaar */
body.planning-page > header .planning-nav,
body.planning-admin-page > header .planning-nav{
  position:absolute !important;
  right:18px !important;
  top:50% !important;
  transform:translateY(-50%) !important;
  margin:0 !important;
  display:flex !important;
  flex-direction:row !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:16px !important;
  width:auto !important;
  white-space:nowrap !important;
}

body.planning-page > header .planning-nav > .planning-nav-link,
body.planning-admin-page > header .planning-nav > .planning-nav-link{
  position:static !important;
  left:auto !important;
  right:auto !important;
  top:auto !important;
  bottom:auto !important;
  transform:none !important;
  margin:0 !important;
  display:inline-flex !important;
  width:auto !important;
}

body.planning-page > header .planning-nav > .planning-logout-link,
body.planning-admin-page > header .planning-nav > .planning-logout-link{
  position:static !important;
  margin-left:0 !important;
  padding-left:16px !important;
  border-left:1px solid #d6d6d6 !important;
}


/* v36 - kijkrechten = uitsluitend kijken en scrollen */
.planning-readonly .plan-cell{
  cursor:default !important;
  user-select:text !important;
}
.planning-readonly .plan-item{
  cursor:default !important;
  pointer-events:none !important;
}
.planning-readonly .plan-cell.cell-selected,
.planning-readonly .plan-item.item-selected{
  outline:none !important;
  box-shadow:none !important;
}
.planning-readonly .planning-statusbar{
  display:none !important;
}
.planning-readonly .delete-item{
  display:none !important;
}


/* v37 - maandnavigatie, vaste eerste kolom en permanente horizontale scroll */
.planning-monthbar{
  box-sizing:border-box !important;
  display:flex !important;
  align-items:center !important;
  gap:4px !important;
  width:100% !important;
  padding:5px 16px !important;
  background:#fafafa !important;
  border-bottom:1px solid #d8d8d8 !important;
  position:relative !important;
  z-index:45 !important;
}
.month-jump{
  min-width:45px !important;
  height:27px !important;
  padding:4px 8px !important;
  border:1px solid #d4d4d4 !important;
  border-radius:4px !important;
  background:#fff !important;
  color:#333 !important;
  font-size:11px !important;
  font-weight:700 !important;
  cursor:pointer !important;
}
.month-jump:hover{
  background:#fff4e8 !important;
  border-color:#e96f00 !important;
}
.month-jump.active{
  background:#e96f00 !important;
  border-color:#e96f00 !important;
  color:#fff !important;
}

/* eerste kolom altijd zichtbaar */
.planning-page .corner-cell.sticky-left,
.planning-page .employee-cell.sticky-left{
  position:sticky !important;
  left:0 !important;
  z-index:32 !important;
  background-clip:padding-box !important;
}
.planning-page .corner-cell.sticky-left{
  z-index:55 !important;
}

/* weekkop boven de cellen, maar onder de vaste hoek */
.planning-page .week-head.sticky-top{
  z-index:42 !important;
}

/* iets extra ruimte onderaan voor de vaste schuifbalk */
.planning-page .planning-main{
  padding-bottom:22px !important;
}

/* permanente horizontale schuifbalk onderin scherm */
.planning-bottom-scroll{
  position:fixed !important;
  left:0 !important;
  right:0 !important;
  bottom:0 !important;
  height:17px !important;
  overflow-x:scroll !important;
  overflow-y:hidden !important;
  background:#f2f2f2 !important;
  border-top:1px solid #cfcfcf !important;
  z-index:500 !important;
  scrollbar-width:auto !important;
}
.planning-bottom-scroll-inner{
  height:1px !important;
}
.planning-bottom-scroll::-webkit-scrollbar{
  height:16px !important;
}
.planning-bottom-scroll::-webkit-scrollbar-thumb{
  background:#9fa4a8 !important;
  border:3px solid #f2f2f2 !important;
  border-radius:8px !important;
}
.planning-bottom-scroll::-webkit-scrollbar-track{
  background:#f2f2f2 !important;
}

/* scrollbar in rooster zelf blijft ook beschikbaar */
.planning-shell{
  overflow-x:auto !important;
  overscroll-behavior-x:contain !important;
}


/* v38 - maanden op dezelfde regel als Definitief/Concept en exact gecentreerd */
.planning-statusbar{
  position:relative !important;
  min-height:43px !important;
  padding:6px 16px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
}
.planning-statusbar .planning-monthbar{
  position:absolute !important;
  left:50% !important;
  top:50% !important;
  transform:translate(-50%,-50%) !important;
  width:auto !important;
  padding:0 !important;
  margin:0 !important;
  border:0 !important;
  background:transparent !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:4px !important;
  z-index:2 !important;
}
.planning-statusbar .month-jump{
  flex:0 0 auto !important;
}


/* v40 - beheer Opties */
.opties-card{
  max-width:980px !important;
}
.opties-grid{
  display:grid !important;
  grid-template-columns:minmax(330px,430px) minmax(360px,470px) !important;
  gap:20px !important;
  align-items:start !important;
}
.opties-grid h2{
  margin:0 0 7px !important;
  font-size:15px !important;
}
.optie-add{
  grid-template-columns:1fr 32px !important;
}
.opties-table,
.month-pref-table{
  width:100% !important;
}
.opties-table .small-col{
  width:58px !important;
  text-align:center !important;
}
.opties-table .delete-col{
  width:34px !important;
  text-align:center !important;
}
.month-pref-table td:first-child{
  width:145px !important;
  white-space:nowrap !important;
}
.month-pref-table select{
  width:180px !important;
  min-width:180px !important;
}
@media(max-width:900px){
  .opties-grid{grid-template-columns:1fr !important}
}

/* v44 - Verdeling klanten */
.verdeling-card{width:100% !important;max-width:none !important}
.verdeling-toolbar{display:flex;align-items:center;gap:12px;margin-bottom:7px}
.verdeling-toolbar button{padding:6px 10px;font-size:12px}
.verdeling-wrap{width:100%;overflow:auto;border:1px solid #ddd}
.verdeling-table{width:max-content !important;min-width:1450px !important;table-layout:fixed}
.verdeling-table th,.verdeling-table td{padding:3px 4px !important;height:30px !important;white-space:nowrap}
.verdeling-table th:nth-child(1),.verdeling-table td:nth-child(1){width:120px}
.verdeling-table th:nth-child(2),.verdeling-table td:nth-child(2){width:300px}
.verdeling-table th:nth-child(3),.verdeling-table td:nth-child(3){width:145px}
.verdeling-table th:nth-child(4),.verdeling-table td:nth-child(4),
.verdeling-table th:nth-child(5),.verdeling-table td:nth-child(5),
.verdeling-table th:nth-child(6),.verdeling-table td:nth-child(6),
.verdeling-table th:nth-child(7),.verdeling-table td:nth-child(7){width:110px}
.verdeling-table th:nth-child(8),.verdeling-table td:nth-child(8){width:95px}
.verdeling-table th:nth-child(9),.verdeling-table td:nth-child(9){width:48px;text-align:center}
.verdeling-table th:nth-child(10),.verdeling-table td:nth-child(10){width:34px;text-align:center}
.verdeling-table input{width:100% !important;box-sizing:border-box;height:25px !important;padding:4px 5px !important;font-size:11px !important}
.verdeling-table input[type="checkbox"]{width:14px !important;height:14px !important}
.verdeling-table .kv-budget{text-align:right}

/* v45 - dropdowns bij Verdeling klanten */
.verdeling-table select{
  width:100% !important;
  min-width:0 !important;
  box-sizing:border-box !important;
  height:25px !important;
  padding:3px 5px !important;
  font-size:11px !important;
}

/* v46 - afgeleid projectjaar */
.verdeling-table th:nth-child(3),.verdeling-table td:nth-child(3){width:55px !important;text-align:center}
.verdeling-table .kv-jaar{font-weight:600;background:#f7f7f7}


/* v47 - compacte projectnummers en budgetopmaak */
.verdeling-table th:nth-child(1),
.verdeling-table td:nth-child(1){
  width:96px !important;
}
.verdeling-table .kv-projectnummer{
  font-family:inherit !important;
  padding-left:3px !important;
  padding-right:3px !important;
}
.verdeling-table .kv-budget{
  text-align:right !important;
}


/* v48 - type kolom + Excel-achtige filters */
.verdeling-table th:nth-child(3),
.verdeling-table td:nth-child(3){width:52px !important;text-align:center}
.verdeling-table th:nth-child(4),
.verdeling-table td:nth-child(4){width:48px !important;text-align:center}
.verdeling-table .kv-type,
.verdeling-table .kv-jaar{
  background:#f7f7f7;
  font-weight:600;
}
.verdeling-table .filter-row th{
  padding:2px 3px !important;
  background:#f2f2f2 !important;
  border-top:1px solid #ddd !important;
}
.verdeling-table .filter-row input,
.verdeling-table .filter-row select{
  width:100% !important;
  height:23px !important;
  min-height:23px !important;
  padding:2px 4px !important;
  font-size:10px !important;
  box-sizing:border-box !important;
}
.verdeling-table th.sortable{
  cursor:pointer !important;
  user-select:none !important;
  position:relative !important;
  padding-right:15px !important;
}
.verdeling-table th.sortable.sort-asc::after{
  content:"▲";
  position:absolute;
  right:4px;
  font-size:8px;
}
.verdeling-table th.sortable.sort-desc::after{
  content:"▼";
  position:absolute;
  right:4px;
  font-size:8px;
}
.filter-clear{
  width:22px !important;
  height:22px !important;
  padding:0 !important;
  border:1px solid #ccc !important;
  background:#fff !important;
  color:#666 !important;
  border-radius:3px !important;
  cursor:pointer !important;
}


/* v49 - veldbreedte volgt inhoud (+2px) */
.verdeling-table tbody input:not([type="checkbox"]),
.verdeling-table tbody select{
  width:auto !important;
  max-width:none !important;
  min-width:28px !important;
}
.verdeling-table td{
  overflow:visible !important;
}


/* v50 - vaste, rustige kolombreedtes Verdeling klanten */
.verdeling-table{
  table-layout:fixed !important;
  width:max-content !important;
  min-width:0 !important;
}

/* 1 Projectnr. */
.verdeling-table th:nth-child(1),
.verdeling-table td:nth-child(1){
  width:108px !important;
  min-width:108px !important;
  max-width:108px !important;
}

/* 2 Projectomschrijving */
.verdeling-table th:nth-child(2),
.verdeling-table td:nth-child(2){
  width:285px !important;
  min-width:285px !important;
  max-width:285px !important;
}

/* 3 Jaar */
.verdeling-table th:nth-child(3),
.verdeling-table td:nth-child(3){
  width:58px !important;
  min-width:58px !important;
  max-width:58px !important;
  text-align:center !important;
}

/* 4 Type */
.verdeling-table th:nth-child(4),
.verdeling-table td:nth-child(4){
  width:52px !important;
  min-width:52px !important;
  max-width:52px !important;
  text-align:center !important;
}

/* 5 Zoeknaam */
.verdeling-table th:nth-child(5),
.verdeling-table td:nth-child(5){
  width:140px !important;
  min-width:140px !important;
  max-width:140px !important;
}

/* 6 Accountant */
.verdeling-table th:nth-child(6),
.verdeling-table td:nth-child(6){
  width:105px !important;
  min-width:105px !important;
  max-width:105px !important;
}

/* 7 Manager */
.verdeling-table th:nth-child(7),
.verdeling-table td:nth-child(7){
  width:95px !important;
  min-width:95px !important;
  max-width:95px !important;
}

/* 8 Controleleider */
.verdeling-table th:nth-child(8),
.verdeling-table td:nth-child(8){
  width:120px !important;
  min-width:120px !important;
  max-width:120px !important;
}

/* 9 Assistent */
.verdeling-table th:nth-child(9),
.verdeling-table td:nth-child(9){
  width:105px !important;
  min-width:105px !important;
  max-width:105px !important;
}

/* 10 Budget */
.verdeling-table th:nth-child(10),
.verdeling-table td:nth-child(10){
  width:92px !important;
  min-width:92px !important;
  max-width:92px !important;
}

/* 11 Actief */
.verdeling-table th:nth-child(11),
.verdeling-table td:nth-child(11){
  width:52px !important;
  min-width:52px !important;
  max-width:52px !important;
  text-align:center !important;
}

/* 12 verwijderen */
.verdeling-table th:nth-child(12),
.verdeling-table td:nth-child(12){
  width:34px !important;
  min-width:34px !important;
  max-width:34px !important;
  text-align:center !important;
}

/* Alle velden vullen hun kolom exact; dus overal gelijk per categorie */
.verdeling-table tbody input:not([type="checkbox"]),
.verdeling-table tbody select,
.verdeling-table .filter-row input,
.verdeling-table .filter-row select{
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  box-sizing:border-box !important;
}

/* Projectomschrijving mag visueel wat ruimer lezen */
.verdeling-table .kv-projectomschrijving{
  padding-left:6px !important;
  padding-right:6px !important;
}

/* Projectnummer juist compact */
.verdeling-table .kv-projectnummer{
  padding-left:4px !important;
  padding-right:4px !important;
  font-size:10px !important;
}


/* v54 - Verdeling per functie */
.functie-verdeling-card{
  width:100% !important;
  max-width:none !important;
}
.functie-verdeling-head{
  display:flex !important;
  align-items:flex-start !important;
  justify-content:space-between !important;
  gap:20px !important;
  margin-bottom:12px !important;
}
.functie-verdeling-head h2{
  margin:0 0 3px !important;
  font-size:17px !important;
}
.functie-verdeling-total{
  white-space:nowrap !important;
  padding:7px 10px !important;
  border:1px solid #ddd !important;
  border-radius:5px !important;
  background:#fafafa !important;
  font-size:12px !important;
}
.functie-verdeling-total b{
  margin-left:5px !important;
  font-size:14px !important;
}
.functie-verdeling-grid{
  display:grid !important;
  grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  gap:14px !important;
  align-items:start !important;
}
.functie-omzet-panel{
  min-width:0 !important;
  border:1px solid #ddd !important;
  background:#fff !important;
  border-radius:6px !important;
  overflow:hidden !important;
}
.functie-omzet-panel h3{
  margin:0 !important;
  padding:7px 9px !important;
  background:#f6f6f6 !important;
  border-bottom:1px solid #ddd !important;
  font-size:13px !important;
}
.functie-omzet-table{
  width:100% !important;
  border-collapse:collapse !important;
  font-size:11px !important;
}
.functie-omzet-table th,
.functie-omzet-table td{
  padding:5px 7px !important;
  border-bottom:1px solid #ececec !important;
  text-align:left !important;
  white-space:nowrap !important;
}
.functie-omzet-table tbody tr:last-child td{
  border-bottom:0 !important;
}
.functie-omzet-table .num{
  text-align:right !important;
}
.functie-omzet-table tbody tr:hover{
  background:#fff8f0 !important;
}
@media(max-width:1000px){
  .functie-verdeling-grid{
    grid-template-columns:1fr !important;
  }
}


/* v55 - meer ruimte tussen header en beheer */
.planning-admin-page .beheer-main{
  margin-top:16px !important;
}


/* v57 - managerdrempel */
.manager-threshold-setting{
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
  padding:7px 8px !important;
  margin-bottom:10px !important;
  border:1px solid #ddd !important;
  border-radius:6px !important;
  background:#fafafa !important;
  font-size:11px !important;
}
.manager-threshold-input{
  display:flex !important;
  align-items:center !important;
  gap:3px !important;
}
.manager-threshold-input input{
  width:92px !important;
  box-sizing:border-box !important;
}
.verdeling-table td.manager-required-cell{
  background:#fff2cc !important;
}
.verdeling-table td.manager-required-cell .kv-manager{
  background:#fff2cc !important;
  border-color:#e6c84f !important;
}


/* v58 - subopties binnen Beheer > Opties */
.opties-card{
  max-width:980px !important;
}
.optie-subtabs{
  display:flex !important;
  align-items:center !important;
  gap:5px !important;
  margin-bottom:10px !important;
  padding-bottom:7px !important;
  border-bottom:1px solid #ddd !important;
}
.optie-subtabs a{
  display:inline-flex !important;
  align-items:center !important;
  min-height:28px !important;
  padding:4px 10px !important;
  border:1px solid #d6d6d6 !important;
  border-radius:4px !important;
  background:#fff !important;
  color:#333 !important;
  text-decoration:none !important;
  font-size:11px !important;
  font-weight:700 !important;
}
.optie-subtabs a.active{
  background:#e96f00 !important;
  border-color:#e96f00 !important;
  color:#fff !important;
}
.optie-subpanel{
  max-width:520px !important;
}
.optie-subpanel h2{
  margin:0 0 8px !important;
  font-size:15px !important;
}
.manager-subpanel{
  max-width:300px !important;
}
.manager-subpanel .manager-threshold-setting{
  display:block !important;
  margin:0 !important;
  padding:8px !important;
}
.manager-threshold-input input{
  width:105px !important;
  text-align:right !important;
}


/* v59 - manager inzet */
.verdeling-table td.manager-required-cell,
.verdeling-table td.manager-required-cell .kv-manager{
  background:#fff2cc !important;
}
.verdeling-table td.manager-manual-cell,
.verdeling-table td.manager-manual-cell .kv-manager{
  background:#f4cccc !important;
}
.verdeling-table .manager-inzet-cell{
  width:52px !important;
  min-width:52px !important;
  max-width:52px !important;
  text-align:center !important;
}
.verdeling-table .manager-inzet-cell input[type="checkbox"]{
  width:14px !important;
  height:14px !important;
  margin:0 auto !important;
}

/* Vanaf Manager schuiven de kolomnummers 1 positie op door Inzet */
.verdeling-table th:nth-child(8),
.verdeling-table td:nth-child(8){
  width:52px !important;
  min-width:52px !important;
  max-width:52px !important;
  text-align:center !important;
}
.verdeling-table th:nth-child(9),
.verdeling-table td:nth-child(9){
  width:120px !important;
  min-width:120px !important;
  max-width:120px !important;
}
.verdeling-table th:nth-child(10),
.verdeling-table td:nth-child(10){
  width:105px !important;
  min-width:105px !important;
  max-width:105px !important;
}
.verdeling-table th:nth-child(11),
.verdeling-table td:nth-child(11){
  width:92px !important;
  min-width:92px !important;
  max-width:92px !important;
}
.verdeling-table th:nth-child(12),
.verdeling-table td:nth-child(12){
  width:52px !important;
  min-width:52px !important;
  max-width:52px !important;
  text-align:center !important;
}
.verdeling-table th:nth-child(13),
.verdeling-table td:nth-child(13){
  width:34px !important;
  min-width:34px !important;
  max-width:34px !important;
  text-align:center !important;
}

/* v64 - Dashboards */
.dashboard-card{max-width:none!important}
.dashboard-subtabs{margin-bottom:10px!important}
.dashboard-placeholder{display:inline-flex;align-items:center;min-height:28px;padding:4px 10px;border:1px solid #ddd;border-radius:4px;background:#f5f5f5;color:#aaa;font-size:11px;font-weight:700}
.dashboard-panel h2{margin:0 0 2px!important;font-size:15px!important}
.dashboard-note{margin-bottom:8px!important}
.dashboard-tablewrap{max-height:calc(100vh - 230px);overflow:auto!important}
.dashboard-planning-table{width:auto!important;min-width:100%!important}
.dashboard-planning-table th,.dashboard-planning-table td{white-space:nowrap!important}
.dashboard-planning-table th:first-child,.dashboard-planning-table td:first-child{min-width:180px!important}
.dashboard-planning-table th:nth-child(2),.dashboard-planning-table td:nth-child(2){min-width:120px!important}
.dashboard-planning-table .num{text-align:right!important;min-width:72px!important}


/* v66 - Functies onder Opties + uurtarieven + dashboard euro's */
.functies-subpanel{
  max-width:760px !important;
}
.functies-compact-table .rate-col{
  width:115px !important;
  text-align:right !important;
}
.functie-rate-input{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:4px !important;
}
.functie-rate-input input{
  width:78px !important;
  height:25px !important;
  box-sizing:border-box !important;
  text-align:right !important;
  font-size:11px !important;
}
.dashboard-value-cell span,
.dashboard-value-cell b{
  display:block !important;
}
.dashboard-value-cell small{
  display:block !important;
  margin-top:1px !important;
  font-size:9px !important;
  color:#666 !important;
  font-weight:400 !important;
}


/* v67 - dashboard vergelijkingen */
.dashboard-main-tabs,
.dashboard-compare-tabs{
  display:flex !important;
  align-items:center !important;
  gap:5px !important;
  flex-wrap:wrap !important;
}
.dashboard-main-tabs{
  margin-bottom:8px !important;
}
.dashboard-compare-tabs{
  margin-bottom:12px !important;
  padding-bottom:8px !important;
  border-bottom:1px solid #ddd !important;
}
.dashboard-main-tabs a,
.dashboard-compare-tabs a{
  display:inline-flex !important;
  align-items:center !important;
  min-height:28px !important;
  padding:4px 10px !important;
  border:1px solid #d6d6d6 !important;
  border-radius:4px !important;
  background:#fff !important;
  color:#333 !important;
  text-decoration:none !important;
  font-size:11px !important;
  font-weight:700 !important;
}
.dashboard-main-tabs a.active,
.dashboard-compare-tabs a.active{
  background:#e96f00 !important;
  border-color:#e96f00 !important;
  color:#fff !important;
}
.dashboard-comparison-table .num{
  text-align:right !important;
  min-width:105px !important;
}
.dashboard-positive{
  color:#2d6a35 !important;
}
.dashboard-negative{
  color:#a61b1b !important;
  font-weight:700 !important;
}
.dashboard-empty{
  max-width:650px !important;
  padding:18px !important;
  border:1px dashed #ccc !important;
  border-radius:6px !important;
  background:#fafafa !important;
}
.dashboard-empty h2{
  margin:0 0 7px !important;
}
.dashboard-empty p{
  margin:0 !important;
  line-height:1.45 !important;
}


/* v68 - budgetpercentages en fasevergelijking */
.opties-table .budget-pct-col{
  width:95px !important;
  text-align:right !important;
}
.budget-pct-input{
  display:flex !important;
  align-items:center !important;
  justify-content:flex-end !important;
  gap:3px !important;
}
.budget-pct-input input{
  width:62px !important;
  text-align:right !important;
}
.budget-pct-total-row td{
  background:#f7f7f7 !important;
  border-top:2px solid #ddd !important;
}
.budget-pct-ok{
  color:#2d6a35 !important;
  font-weight:700 !important;
}
.budget-pct-bad{
  color:#a61b1b !important;
  font-weight:700 !important;
}
.dashboard-warning{
  margin:8px 0 10px !important;
  padding:8px 10px !important;
  border:1px solid #e6c84f !important;
  background:#fff2cc !important;
  border-radius:5px !important;
  font-size:11px !important;
}
.dashboard-comparison-table thead tr:first-child th{
  text-align:center !important;
}
.dashboard-comparison-table th,
.dashboard-comparison-table td{
  min-width:92px !important;
}
.dashboard-comparison-table th:first-child,
.dashboard-comparison-table td:first-child{
  min-width:165px !important;
}
.dashboard-comparison-table th:nth-child(2),
.dashboard-comparison-table td:nth-child(2){
  min-width:115px !important;
}

/* v69 - volgorde opties */
.opties-table .option-order-col{width:68px!important;min-width:68px!important;max-width:68px!important;text-align:center!important}
.opties-table .option-order{width:48px!important;text-align:center!important}


/* v72 - compact Planning vs Budget */
.compact-dashboard-wrap{
  max-height:calc(100vh - 225px) !important;
  overflow:auto !important;
}
.dashboard-compact-comparison{
  width:max-content !important;
  min-width:100% !important;
  font-size:10px !important;
}
.dashboard-compact-comparison th,
.dashboard-compact-comparison td{
  padding:3px 5px !important;
  height:34px !important;
  vertical-align:middle !important;
  white-space:nowrap !important;
}
.dashboard-compact-comparison .sticky-dashboard-client{
  position:sticky !important;
  left:0 !important;
  z-index:3 !important;
  min-width:145px !important;
  max-width:145px !important;
  background:#fff !important;
}
.dashboard-compact-comparison thead .sticky-dashboard-client{
  z-index:5 !important;
  background:#f6f6f6 !important;
}
.dashboard-compact-comparison .cl-col{
  min-width:70px !important;
  max-width:85px !important;
}
.dashboard-compact-comparison .phase-col,
.dashboard-compact-comparison .phase-cell{
  min-width:105px !important;
  max-width:115px !important;
}
.dashboard-compact-comparison .total-col{
  min-width:115px !important;
  max-width:125px !important;
  position:sticky !important;
  right:0 !important;
  z-index:2 !important;
  background:#fafafa !important;
  border-left:2px solid #ddd !important;
}
.dashboard-compact-comparison thead .total-col{
  z-index:5 !important;
  background:#f0f0f0 !important;
}
.phase-money{
  display:flex !important;
  justify-content:flex-end !important;
  gap:3px !important;
  line-height:1.05 !important;
}
.phase-money b{
  font-size:10px !important;
}
.phase-money span{
  color:#777 !important;
  font-size:9px !important;
}
.phase-ratio{
  margin-top:2px !important;
  text-align:right !important;
  font-size:9px !important;
  font-weight:700 !important;
}
.phase-ratio.ratio-ok{
  color:#2d6a35 !important;
}
.phase-ratio.ratio-warning{
  color:#a66a00 !important;
}
.phase-ratio.ratio-over{
  color:#a61b1b !important;
}
.dashboard-compact-comparison tbody tr:hover td{
  background:#fff8f0 !important;
}
.dashboard-compact-comparison tbody tr:hover .sticky-dashboard-client,
.dashboard-compact-comparison tbody tr:hover .total-col{
  background:#fff8f0 !important;
}


/* v73 - compacter dashboard + drag sort opties + arceeropties */
.dashboard-compact-comparison{
  font-size:9px !important;
}
.dashboard-compact-comparison th,
.dashboard-compact-comparison td{
  padding:2px 4px !important;
  height:30px !important;
}
.dashboard-compact-comparison .cl-col{
  min-width:52px !important;
  max-width:60px !important;
}
.dashboard-compact-comparison .phase-col,
.dashboard-compact-comparison .phase-cell{
  min-width:96px !important;
  max-width:104px !important;
}
.phase-money b{font-size:9px !important}
.phase-money span{font-size:8px !important}
.phase-ratio{font-size:8px !important}

.opties-table .option-drag-col{
  width:34px !important;
  min-width:34px !important;
  max-width:34px !important;
  text-align:center !important;
}
.option-sort-row.dragging{opacity:.5}
.option-sort-row .drag-handle{cursor:grab !important}

.arceer-subpanel{max-width:420px !important}
.arceer-table{width:auto !important}
.arceer-table th,.arceer-table td{padding:5px 8px !important}
.arceer-input-wrap{display:flex;align-items:center;gap:4px}
.arceer-input-wrap input{width:68px !important;text-align:right !important}
.arceer-swatch{display:inline-block;width:16px;height:16px;border-radius:3px;margin-right:6px;vertical-align:middle;border:1px solid #bbb}
.arceer-swatch.arceer_groen{background:#d9ead3}
.arceer-swatch.arceer_geel{background:#fff2cc}
.arceer-swatch.arceer_oranje{background:#fce5cd}
.arceer-swatch.arceer_rood{background:#f4cccc}

.phase-ratio.ratio-green{color:#2d6a35 !important}
.phase-ratio.ratio-yellow{color:#8a7500 !important}
.phase-ratio.ratio-orange{color:#b05a00 !important}
.phase-ratio.ratio-red{color:#a61b1b !important}
.phase-ratio.ratio-none{color:#666 !important}

/* v74 - gegroepeerd dashboard */
.dashboard-grouped-comparison{width:max-content!important;min-width:100%!important;font-size:8px!important}
.dashboard-grouped-comparison th,.dashboard-grouped-comparison td{padding:2px 4px!important;height:27px!important;white-space:nowrap!important}
.dashboard-grouped-comparison .sticky-dashboard-client{position:sticky!important;left:0!important;z-index:4!important;min-width:120px!important;background:#fff!important}
.dashboard-grouped-comparison thead .sticky-dashboard-client{background:#f4f4f4!important}
.dashboard-grouped-comparison .cl-col{min-width:45px!important;max-width:52px!important}
.dashboard-grouped-comparison .phase-col{min-width:64px!important;max-width:74px!important}
.dashboard-grouped-comparison .total-col{min-width:70px!important;border-right:2px solid #bbb!important}
.dashboard-grouped-comparison .group-head{text-align:center!important;font-size:9px!important;font-weight:800!important;border-left:2px solid #bbb!important}
.dashboard-grouped-comparison .analysis-cell.ratio-green{background:#d9ead3!important}
.dashboard-grouped-comparison .analysis-cell.ratio-yellow{background:#fff2cc!important}
.dashboard-grouped-comparison .analysis-cell.ratio-orange{background:#fce5cd!important}
.dashboard-grouped-comparison .analysis-cell.ratio-red{background:#f4cccc!important}
.grouped-dashboard-wrap{overflow:auto!important;max-height:calc(100vh - 220px)!important}

/* v75 - verwijderknop opties altijd zichtbaar */
.opties-table .option-delete-col{
  width:38px!important;min-width:38px!important;max-width:38px!important;
  text-align:center!important;overflow:visible!important;
}
.opties-table .visible-delete-btn{
  display:inline-flex!important;align-items:center!important;justify-content:center!important;
  width:24px!important;height:24px!important;padding:0!important;margin:0 auto!important;
  border:1px solid #d6d6d6!important;border-radius:4px!important;
  background:#fff!important;color:#a61b1b!important;font-size:17px!important;
  line-height:1!important;font-weight:700!important;cursor:pointer!important;
  visibility:visible!important;opacity:1!important;
}
.opties-table .visible-delete-btn:hover{background:#fbe9e9!important;border-color:#d9a0a0!important}


/* v76 - dashboards vrijwel volledig scherm + compacter */
.dashboard-fullscreen-main{
  width:calc(100vw - 18px) !important;
  max-width:none !important;
  margin-left:9px !important;
  margin-right:9px !important;
  box-sizing:border-box !important;
}
.dashboard-fullscreen-main .dashboard-card{
  width:100% !important;
  max-width:none !important;
  box-sizing:border-box !important;
}
.dashboard-fullscreen-main .dashboard-panel{
  width:100% !important;
  max-width:none !important;
}
.dashboard-fullscreen-main .grouped-dashboard-wrap{
  width:100% !important;
  max-width:none !important;
  max-height:calc(100vh - 205px) !important;
}

/* nog kleinere dashboardtabel */
.dashboard-grouped-comparison{
  font-size:7.5px !important;
  line-height:1 !important;
}
.dashboard-grouped-comparison th,
.dashboard-grouped-comparison td{
  padding:1px 3px !important;
  height:23px !important;
  line-height:1.05 !important;
}
.dashboard-grouped-comparison tbody td{
  font-size:7.5px !important;
}
.dashboard-grouped-comparison tbody .sticky-dashboard-client{
  font-size:8px !important;
}
.dashboard-grouped-comparison .sticky-dashboard-client{
  min-width:108px !important;
  max-width:120px !important;
}
.dashboard-grouped-comparison .cl-col{
  min-width:36px !important;
  max-width:44px !important;
  width:40px !important;
}
.dashboard-grouped-comparison .phase-col{
  min-width:51px !important;
  max-width:62px !important;
  font-size:7px !important;
  font-weight:700 !important;
}
.dashboard-grouped-comparison .total-col{
  min-width:57px !important;
  max-width:66px !important;
}
.dashboard-grouped-comparison .group-head{
  font-size:11px !important;
  line-height:1.15 !important;
  padding:5px 3px !important;
  letter-spacing:.1px !important;
}
.dashboard-grouped-comparison thead tr:nth-child(2) th{
  font-size:7px !important;
  padding-top:2px !important;
  padding-bottom:2px !important;
}
.dashboard-panel > h2{
  font-size:14px !important;
  margin:0 0 6px !important;
}

/* Opties zonder Actief kolom */
.opties-table{
  width:auto !important;
}
.opties-table .option-delete-col{
  width:34px !important;
  min-width:34px !important;
  max-width:34px !important;
}

/* v78 - Klant en CL gelijk aan fase-subkoppen */
.dashboard-grouped-comparison thead .sticky-dashboard-client,
.dashboard-grouped-comparison thead .cl-col{
  font-size:7px !important;
  font-weight:700 !important;
  padding-top:2px !important;
  padding-bottom:2px !important;
}

/* v79 - Algemeen boven Klant/CL; Klant en CL op fasekopregel */
.dashboard-grouped-comparison .general-head{
  text-align:center !important;
}
.dashboard-grouped-comparison thead tr:nth-child(2) .sticky-dashboard-client,
.dashboard-grouped-comparison thead tr:nth-child(2) .cl-col{
  font-size:7px !important;
  padding-top:2px !important;
  padding-bottom:2px !important;
  height:23px !important;
  vertical-align:middle !important;
}


/* v80 - strakkere dashboardverdeling */
.dashboard-grouped-comparison{
  border-collapse:collapse !important;
}
.dashboard-grouped-comparison th,
.dashboard-grouped-comparison td{
  padding-left:2px !important;
  padding-right:2px !important;
}

/* Klant iets ruimer, CL smal */
.dashboard-grouped-comparison .sticky-dashboard-client{
  min-width:112px !important;
  max-width:124px !important;
  padding-left:6px !important;
}
.dashboard-grouped-comparison .cl-col{
  min-width:34px !important;
  max-width:40px !important;
  width:37px !important;
  padding-left:3px !important;
  padding-right:3px !important;
}

/* scheidingslijn na CL loopt volledig door */
.dashboard-grouped-comparison thead .cl-col,
.dashboard-grouped-comparison tbody .cl-col{
  border-right:2px solid #aaa !important;
}

/* eerste kolom van elk blok wat lucht aan de linkerkant */
.dashboard-grouped-comparison .group-start-cell{
  border-left:2px solid #aaa !important;
  padding-left:6px !important;
}

/* fasekolommen dichter op elkaar */
.dashboard-grouped-comparison .phase-col{
  min-width:46px !important;
  max-width:54px !important;
  width:50px !important;
}
.dashboard-grouped-comparison td.num{
  min-width:46px !important;
}
.dashboard-grouped-comparison .total-col{
  min-width:54px !important;
  max-width:60px !important;
}

/* analyseblok: echte cel-arcering volgens Arceeropties */
.dashboard-grouped-comparison .analysis-cell.ratio-green{
  background:#d9ead3 !important;
  color:#1f4f25 !important;
}
.dashboard-grouped-comparison .analysis-cell.ratio-yellow{
  background:#fff2cc !important;
  color:#725f00 !important;
}
.dashboard-grouped-comparison .analysis-cell.ratio-orange{
  background:#fce5cd !important;
  color:#8f4800 !important;
}
.dashboard-grouped-comparison .analysis-cell.ratio-red{
  background:#f4cccc !important;
  color:#8f1717 !important;
}
.dashboard-grouped-comparison .analysis-cell.ratio-none{
  background:#fff !important;
  color:#333 !important;
}


/* v81 - dashboard header, zebra en filters */
.dashboard-grouped-comparison .general-head{
  border-left:0 !important;
}
.dashboard-grouped-comparison thead .sticky-dashboard-client{
  background:#fff !important;
}
.dashboard-grouped-comparison .dashboard-subhead-row th{
  font-weight:800 !important;
}
.dashboard-grouped-comparison tbody tr:nth-child(even) td{
  background:#f7f7f7 !important;
}
.dashboard-grouped-comparison tbody tr:nth-child(even) .sticky-dashboard-client{
  background:#f7f7f7 !important;
}
.dashboard-grouped-comparison tbody tr:nth-child(odd) td{
  background:#fff !important;
}
.dashboard-grouped-comparison tbody tr:nth-child(odd) .sticky-dashboard-client{
  background:#fff !important;
}

/* Analyse-arcering moet zebra overschrijven */
.dashboard-grouped-comparison tbody td.analysis-cell.ratio-green{background:#d9ead3 !important}
.dashboard-grouped-comparison tbody td.analysis-cell.ratio-yellow{background:#fff2cc !important}
.dashboard-grouped-comparison tbody td.analysis-cell.ratio-orange{background:#fce5cd !important}
.dashboard-grouped-comparison tbody td.analysis-cell.ratio-red{background:#f4cccc !important}
.dashboard-grouped-comparison tbody td.analysis-cell.ratio-none{background:inherit !important}

.dashboard-filter-row th{
  padding:1px 2px !important;
  background:#f2f2f2 !important;
  height:22px !important;
}
.dashboard-filter{
  width:100% !important;
  min-width:0 !important;
  height:18px !important;
  padding:1px 2px !important;
  box-sizing:border-box !important;
  font-size:7px !important;
}
.dashboard-filter-clear-cell{
  width:24px !important;
  min-width:24px !important;
  max-width:24px !important;
  text-align:center !important;
  padding:0 !important;
}
.dashboard-filter-clear-cell .filter-clear{
  width:18px !important;
  height:18px !important;
  font-size:12px !important;
}


/* v82 - dashboard strakker, gelijkmatig verdeeld en compacte filters */
.dashboard-grouped-comparison{
  width:100% !important;
  min-width:100% !important;
  table-layout:fixed !important;
}

/* Klant / CL compact, rest gelijkmatig */
.dashboard-grouped-comparison .sticky-dashboard-client{
  width:145px !important;
  min-width:145px !important;
  max-width:145px !important;
}
.dashboard-grouped-comparison .cl-col{
  width:48px !important;
  min-width:48px !important;
  max-width:48px !important;
}

/* alle fase- en totaalkolommen dezelfde breedte */
.dashboard-grouped-comparison .phase-col,
.dashboard-grouped-comparison .total-col,
.dashboard-grouped-comparison tbody td.num{
  width:auto !important;
  min-width:0 !important;
  max-width:none !important;
}

/* bedragen en koppen centreren */
.dashboard-grouped-comparison th.num,
.dashboard-grouped-comparison td.num{
  text-align:center !important;
}
.dashboard-grouped-comparison .phase-col,
.dashboard-grouped-comparison .total-col{
  text-align:center !important;
}

/* geen extra breedte/padding bij totaal */
.dashboard-grouped-comparison .total-col{
  border-right:2px solid #bbb !important;
  padding-left:2px !important;
  padding-right:2px !important;
}

/* eerste kolom van blok alleen subtiele scheiding */
.dashboard-grouped-comparison .group-start-cell{
  border-left:2px solid #aaa !important;
  padding-left:2px !important;
}

/* compacte filterregel, gelijk aan Verdeling klanten */
.dashboard-filter-row th{
  height:20px !important;
  padding:1px 2px !important;
  background:#f2f2f2 !important;
}
.dashboard-filter{
  width:100% !important;
  height:18px !important;
  min-height:18px !important;
  padding:1px 3px !important;
  border:1px solid #d0d0d0 !important;
  border-radius:3px !important;
  box-sizing:border-box !important;
  font-size:7px !important;
  line-height:1 !important;
}
.dashboard-filter::placeholder{
  font-size:7px !important;
}
.dashboard-filter-clear-cell{
  width:22px !important;
  min-width:22px !important;
  max-width:22px !important;
}
.dashboard-filter-clear-cell .filter-clear{
  width:18px !important;
  height:18px !important;
  min-height:18px !important;
  padding:0 !important;
  border-radius:3px !important;
  font-size:11px !important;
}

/* fasekopregel nog compacter */
.dashboard-grouped-comparison .dashboard-subhead-row th{
  height:19px !important;
  padding:1px 2px !important;
  font-size:7px !important;
  text-align:center !important;
}

/* groepskoppen duidelijk maar niet hoog */
.dashboard-grouped-comparison .group-head{
  height:22px !important;
  padding:2px 3px !important;
  font-size:10px !important;
}

/* cellen compacter */
.dashboard-grouped-comparison tbody td{
  height:22px !important;
  padding:1px 2px !important;
  font-size:7.5px !important;
}

/* v83 - klantkolom op inhoud */
.dashboard-grouped-comparison .sticky-dashboard-client{
  width:1% !important;
  min-width:0 !important;
  max-width:none !important;
  white-space:nowrap !important;
  padding-left:6px !important;
  padding-right:8px !important;
}


/* v84 - klantkolom werkelijk op inhoud afgestemd */
.dashboard-grouped-comparison .sticky-dashboard-client{
  width:var(--dashboard-klant-width) !important;
  min-width:var(--dashboard-klant-width) !important;
  max-width:var(--dashboard-klant-width) !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
  padding-left:6px !important;
  padding-right:8px !important;
}
.dashboard-grouped-comparison .cl-col{
  width:44px !important;
  min-width:44px !important;
  max-width:44px !important;
}


/* v85 - dashboard vult volledige breedte */
.grouped-dashboard-wrap{
  width:100% !important;
  max-width:none !important;
  overflow:auto !important;
}
.dashboard-grouped-comparison{
  width:100% !important;
  min-width:100% !important;
  max-width:none !important;
  table-layout:fixed !important;
}

/* Algemeen blijft compact; de overige kolommen delen de rest van de breedte */
.dashboard-grouped-comparison .sticky-dashboard-client{
  width:var(--dashboard-klant-width) !important;
  min-width:var(--dashboard-klant-width) !important;
  max-width:var(--dashboard-klant-width) !important;
}
.dashboard-grouped-comparison .cl-col{
  width:44px !important;
  min-width:44px !important;
  max-width:44px !important;
}

/* alle overige kolommen gelijkmatig de resterende ruimte geven */
.dashboard-grouped-comparison .phase-col,
.dashboard-grouped-comparison .total-col,
.dashboard-grouped-comparison tbody td.num{
  width:auto !important;
  min-width:0 !important;
  max-width:none !important;
}

/* iets ruimere spreiding zodat rechter witruimte verdwijnt */
.dashboard-grouped-comparison th.num,
.dashboard-grouped-comparison td.num{
  padding-left:4px !important;
  padding-right:4px !important;
}


/* v86 - resetfilters zonder extra tabelkolom */
.dashboard-filter-clear-cell{
  display:none !important;
}
.dashboard-client-filter-wrap{
  display:flex !important;
  align-items:center !important;
  gap:2px !important;
  width:100% !important;
}
.dashboard-client-filter-wrap .dashboard-filter{
  flex:1 1 auto !important;
  min-width:0 !important;
}
.dashboard-inline-clear{
  flex:0 0 18px !important;
  width:18px !important;
  height:18px !important;
  min-width:18px !important;
  min-height:18px !important;
  padding:0 !important;
  margin:0 !important;
  font-size:11px !important;
  line-height:1 !important;
}

/* volledige breedte nu zonder technische eindkolom */
.dashboard-grouped-comparison{
  width:100% !important;
  min-width:100% !important;
}

/* v88 - kolombreedtes dashboard verfijnd */
.dashboard-grouped-comparison .sticky-dashboard-client{
  width:165px !important;
  min-width:165px !important;
  max-width:165px !important;
}
.dashboard-grouped-comparison .cl-col{
  width:34px !important;
  min-width:34px !important;
  max-width:34px !important;
  padding-left:2px !important;
  padding-right:2px !important;
}
.dashboard-grouped-comparison .phase-col,
.dashboard-grouped-comparison .total-col,
.dashboard-grouped-comparison tbody td.num{
  min-width:0 !important;
  max-width:none !important;
}
.dashboard-grouped-comparison th.num,
.dashboard-grouped-comparison td.num{
  padding-left:2px !important;
  padding-right:2px !important;
}

/* v92 - Analyse klant */
.client-analysis-toolbar{display:flex;align-items:center;gap:8px;margin:8px 0}
.client-analysis-toolbar label{font-size:10px;font-weight:700}
.client-analysis-toolbar select{margin-left:5px;min-width:220px;height:26px;font-size:10px}
.client-analysis{width:100%;font-size:8px}
.client-analysis-title,.client-section-title{background:#333;color:#fff;text-align:center;font-weight:800;padding:4px 6px;margin-top:7px}
.client-analysis-title{font-size:11px}
.client-meta{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));border:1px solid #ccc}
.client-meta>div{padding:5px 6px;border-right:1px solid #ddd;background:#fafafa}
.client-meta b,.client-meta span{display:block}
.client-meta span{margin-top:2px}
.client-kpis{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:8px 0}
.client-kpi{border:1px solid #bbb;text-align:center;padding:6px;background:#fafafa}
.client-kpi b{display:block;text-transform:uppercase;font-size:8px}
.client-kpi strong{display:block;font-size:16px;margin:3px 0}
.client-kpi span{font-size:8px}
.client-phase-table{width:100%;border-collapse:collapse;table-layout:fixed}
.client-phase-table th,.client-phase-table td{border:1px solid #bbb;padding:3px;text-align:center}
.client-phase-table th{background:#ed6b21;color:#fff;font-weight:800}
.client-phase-table th:first-child,.client-phase-table td:first-child{text-align:left;width:14%}
.client-phase-table .client-total td{font-weight:800;background:#e7e7e7}
.client-phase-table .client-budget td{font-weight:700}
.client-empty{border:1px solid #ccc;padding:8px;background:#fafafa;color:#666}

/* v93 - Analyse klant uitgebreid */
.client-future-table{
  width:100%;
  border-collapse:collapse;
  table-layout:fixed;
  font-size:8px;
}
.client-future-table th,
.client-future-table td{
  border:1px solid #bbb;
  padding:3px 5px;
}
.client-future-table th{
  background:#ed6b21;
  color:#fff;
  font-weight:800;
}
.client-future-table .num{text-align:right}
.client-future-table .client-total td{
  background:#e7e7e7;
  font-weight:800;
}
.client-empty-row{
  text-align:center;
  color:#666;
  padding:8px !important;
}
.client-phase-table .client-analysis-row td{
  background:#f7f7f7;
  font-weight:700;
}
.client-phase-table .client-difference td{
  background:#fafafa;
  font-weight:700;
}
.client-phase-table .client-difference td.negative{
  color:#a61b1b;
  background:#f4cccc;
}


/* v94 - uniforme typografie binnen Analyse klant
   Dashboard-/analyseknoppen bewust ongemoeid gelaten. */
.client-analysis{
  font-size:12px !important;
}
.client-analysis table,
.client-analysis table th,
.client-analysis table td,
.client-phase-table,
.client-phase-table th,
.client-phase-table td,
.client-future-table,
.client-future-table th,
.client-future-table td{
  font-size:12px !important;
  line-height:1.2 !important;
}
.client-phase-table th,
.client-phase-table td,
.client-future-table th,
.client-future-table td{
  padding:4px 6px !important;
}
.client-meta,
.client-meta b,
.client-meta span{
  font-size:12px !important;
}
.client-kpi b,
.client-kpi span{
  font-size:12px !important;
}
.client-kpi strong{
  font-size:18px !important;
}
.client-section-title{
  font-size:12px !important;
}
.client-empty,
.client-empty-row{
  font-size:12px !important;
}

/* v95 - Analyse medewerker */
.employee-analysis-toolbar{display:flex;align-items:center;gap:8px;margin:8px 0}
.employee-analysis-toolbar label{font-size:10px;font-weight:700}
.employee-analysis-toolbar select{margin-left:5px;min-width:220px;height:26px;font-size:10px}
.employee-analysis{width:100%}
.employee-analysis-title{background:#333;color:#fff;text-align:center;font-size:12px;font-weight:800;padding:5px 6px}
.employee-meta{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));border:1px solid #ccc;margin-bottom:8px;font-size:12px}
.employee-meta>div{padding:5px 7px;border-right:1px solid #ddd;background:#fafafa}
.employee-meta b,.employee-meta span{display:block}
.employee-meta span{margin-top:2px}
.employee-analysis-table{width:100%;border-collapse:collapse;font-size:12px}
.employee-analysis-table th,.employee-analysis-table td{border:1px solid #c9c9c9;padding:4px 6px}
.employee-analysis-table th{background:#ed6b21;color:#fff;font-weight:800;text-align:center;white-space:nowrap}
.employee-analysis-table th:first-child,.employee-analysis-table td:first-child{text-align:left;min-width:180px}
.employee-analysis-table td.num{text-align:right;white-space:nowrap}
.employee-analysis-table tbody tr:nth-child(even) td{background:#f3f3f3}
.employee-analysis-table .employee-total-row td{background:#e3e3e3!important;font-weight:800}

/* v96 - selectie direct naast Analyse 4 */
.dashboard-main-tabs{display:flex;align-items:center;gap:6px;flex-wrap:wrap}
.dashboard-inline-select{
  height:28px;min-width:180px;max-width:280px;
  padding:3px 28px 3px 9px;border:1px solid #cfcfcf;border-radius:14px;
  background:#fff;font-size:11px;font-weight:600;color:#222
}


/* v97 - compacte dropdowns naast analyseknoppen */
.dashboard-inline-select{
  height:35px !important;
  min-width:0 !important;
  width:auto !important;
  max-width:260px !important;
  padding:4px 28px 4px 12px !important;
  border:1px solid #d3d3d3 !important;
  border-radius:6px !important;
  background:#fff !important;
  font-size:12px !important;
  font-weight:700 !important;
  color:#222 !important;
  line-height:1 !important;
}

/* zwarte titelbalken analyse klant/medewerker vervallen */
.client-analysis-title,
.employee-analysis-title{
  display:none !important;
}


/* v98 - dropdown exact dezelfde hoogte als analyseknoppen */
.dashboard-inline-select{
  box-sizing:border-box !important;
  height:35px !important;
  min-height:35px !important;
  max-height:35px !important;
  margin:0 !important;
  padding:0 28px 0 10px !important;
  font-size:10px !important;
  line-height:33px !important;
  vertical-align:middle !important;
}

/* v99 - Analyse klant passend zonder horizontale scrollbar */
.client-analysis .tablewrap{width:100%!important;max-width:100%!important;overflow-x:visible!important}
.client-phase-table,.client-future-table{width:100%!important;max-width:100%!important;table-layout:fixed!important}
.client-phase-table th,.client-phase-table td,.client-future-table th,.client-future-table td{min-width:0!important;max-width:none!important;white-space:normal!important;overflow-wrap:anywhere!important}

/* v99 - Drukanalyse */
.pressure-analysis{width:100%;font-size:11px}
.pressure-period{display:flex;justify-content:center;align-items:center;gap:12px;margin:5px 0 8px;font-size:11px}
.pressure-section-title,.pressure-chart-title{background:#333;color:#fff;text-align:center;font-weight:800;padding:4px 6px}
.pressure-table-wrap{width:100%;overflow-x:auto;margin-bottom:10px}
.pressure-table{width:100%;min-width:1180px;border-collapse:collapse;table-layout:fixed;font-size:10px}
.pressure-table th,.pressure-table td{border:1px solid #c8c8c8;padding:3px 4px;vertical-align:top}
.pressure-table th{background:#ed6b21;color:#fff;text-align:center;font-weight:800}
.pressure-table .pressure-name-col{width:120px}
.pressure-table td:first-child{background:#f4f4f4}
.pressure-date{font-size:9px}
.pressure-clients{line-height:1.2}
.pressure-chart-block{margin:10px 0 16px;border:1px solid #ccc}
.pressure-chart{width:100%;min-height:290px;background:#fff}
.pressure-grid{stroke:#d3d3d3;stroke-width:1}
.pressure-axis,.pressure-x,.pressure-legend{font-size:9px;fill:#444}

/* v100 - beide drukgrafieken naast elkaar onderaan */
.pressure-charts-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(0,1fr);
  gap:12px;
  width:100%;
  margin-top:12px;
}
.pressure-charts-row .pressure-chart-block{
  min-width:0;
  margin:0 0 16px;
}
.pressure-charts-row .pressure-chart{
  min-width:0;
}
@media (max-width:900px){
  .pressure-charts-row{grid-template-columns:1fr}
}

/* v102 - dashboardmodule binnen viewport houden */
.dashboard-fullscreen-main{
  width:calc(100% - 20px) !important;
  max-width:calc(100% - 20px) !important;
  margin-left:10px !important;
  margin-right:10px !important;
  box-sizing:border-box !important;
}
.dashboard-fullscreen-main .dashboard-card{
  width:100% !important;
  max-width:100% !important;
  box-sizing:border-box !important;
  overflow:hidden !important;
}
.dashboard-fullscreen-main .dashboard-panel{
  width:100% !important;
  max-width:100% !important;
  box-sizing:border-box !important;
}
.grouped-dashboard-wrap{
  width:100% !important;
  max-width:100% !important;
  overflow-x:hidden !important;
}
.dashboard-grouped-comparison{
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  table-layout:fixed !important;
}

/* v103 - Analyse planning: alleen interne verticale scrollbar */
body:has(.dashboard-fullscreen-main){
  overflow-y:hidden !important;
}

.dashboard-fullscreen-main{
  height:calc(100vh - 105px) !important;
  max-height:calc(100vh - 105px) !important;
  min-height:0 !important;
  overflow:hidden !important;
}

.dashboard-fullscreen-main .dashboard-card{
  height:100% !important;
  max-height:100% !important;
  min-height:0 !important;
  overflow:hidden !important;
  display:flex !important;
  flex-direction:column !important;
}

.dashboard-fullscreen-main .dashboard-panel{
  flex:1 1 auto !important;
  min-height:0 !important;
  max-height:100% !important;
  overflow:hidden !important;
}

.grouped-dashboard-wrap{
  height:calc(100vh - 205px) !important;
  max-height:calc(100vh - 205px) !important;
  min-height:0 !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
}


/* v104 - interne scrollbar volledig zichtbaar tot onderaan */
.dashboard-fullscreen-main{
  height:calc(100vh - 118px) !important;
  max-height:calc(100vh - 118px) !important;
  padding-bottom:8px !important;
}

.dashboard-fullscreen-main .dashboard-card{
  height:100% !important;
  max-height:100% !important;
  padding-bottom:6px !important;
  box-sizing:border-box !important;
}

.dashboard-fullscreen-main .dashboard-panel{
  min-height:0 !important;
  padding-bottom:4px !important;
  box-sizing:border-box !important;
}

.grouped-dashboard-wrap{
  height:calc(100vh - 228px) !important;
  max-height:calc(100vh - 228px) !important;
  padding-bottom:6px !important;
  box-sizing:border-box !important;
  overflow-y:scroll !important;
  scrollbar-gutter:stable !important;
}


/* v105 - extra ademruimte onder laatste rij Analyse planning */
.grouped-dashboard-wrap{
  height:calc(100vh - 240px) !important;
  max-height:calc(100vh - 240px) !important;
  padding-bottom:18px !important;
  scroll-padding-bottom:18px !important;
  box-sizing:border-box !important;
}

/* echte ruimte ná de tabel, zodat laatste rij niet tegen de onderrand staat */
.grouped-dashboard-wrap::after{
  content:"";
  display:block;
  height:16px;
  min-height:16px;
  width:100%;
}


/* v106 - scrollbar fysiek los van de onderrand */
.dashboard-fullscreen-main .dashboard-panel{
  padding-bottom:22px !important;
  box-sizing:border-box !important;
}

.grouped-dashboard-wrap{
  height:calc(100vh - 258px) !important;
  max-height:calc(100vh - 258px) !important;
  padding-bottom:0 !important;
  margin-bottom:18px !important;
  overflow-y:scroll !important;
  overflow-x:hidden !important;
  box-sizing:border-box !important;
}

/* eerdere kunstmatige eindruimte niet meer gebruiken */
.grouped-dashboard-wrap::after{
  content:none !important;
  display:none !important;
}


/* v107 - correcte flexhoogte: geen verborgen laatste klanten */
body:has(.dashboard-fullscreen-main){
  overflow:hidden !important;
}

.dashboard-fullscreen-main{
  height:calc(100vh - 112px) !important;
  max-height:calc(100vh - 112px) !important;
  min-height:0 !important;
  padding-bottom:0 !important;
  overflow:hidden !important;
  display:block !important;
}

.dashboard-fullscreen-main .dashboard-card{
  height:100% !important;
  max-height:100% !important;
  min-height:0 !important;
  padding-bottom:0 !important;
  overflow:hidden !important;
  display:flex !important;
  flex-direction:column !important;
  box-sizing:border-box !important;
}

/* knoppenrijen nemen alleen hun eigen hoogte in */
.dashboard-fullscreen-main .dashboard-main-tabs,
.dashboard-fullscreen-main .dashboard-compare-tabs{
  flex:0 0 auto !important;
}

/* panel vult exact de resterende hoogte */
.dashboard-fullscreen-main .dashboard-panel{
  flex:1 1 0 !important;
  min-height:0 !important;
  height:auto !important;
  max-height:none !important;
  padding-bottom:0 !important;
  overflow:hidden !important;
  display:flex !important;
  flex-direction:column !important;
  box-sizing:border-box !important;
}

/* alleen dit element scrollt; hoogte komt van flex, niet van calc() */
.dashboard-fullscreen-main .grouped-dashboard-wrap{
  flex:1 1 0 !important;
  min-height:0 !important;
  height:auto !important;
  max-height:none !important;
  margin-bottom:0 !important;
  padding-bottom:0 !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  scrollbar-gutter:stable !important;
  box-sizing:border-box !important;
}

/* oude kunstmatige eindruimte definitief uit */
.dashboard-fullscreen-main .grouped-dashboard-wrap::after{
  content:none !important;
  display:none !important;
}


/* =========================================================
   v108 - ROBUUSTE DASHBOARDHOOGTE
   Geen geneste verticale scrollcontainers meer.
   De normale browserpagina verzorgt het verticale scrollen.
   ========================================================= */

html,
body,
body:has(.dashboard-fullscreen-main){
  height:auto !important;
  min-height:100% !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
}

/* Dashboard mag gewoon meegroeien met de inhoud */
.dashboard-fullscreen-main{
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  overflow:visible !important;
  padding-bottom:24px !important;
}

.dashboard-fullscreen-main .dashboard-card{
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  overflow:visible !important;
  display:block !important;
  padding-bottom:18px !important;
}

.dashboard-fullscreen-main .dashboard-panel{
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  overflow:visible !important;
  display:block !important;
  padding-bottom:18px !important;
}

/* Geen interne verticale scrollbar meer */
.dashboard-fullscreen-main .grouped-dashboard-wrap{
  display:block !important;
  height:auto !important;
  min-height:0 !important;
  max-height:none !important;
  overflow-x:hidden !important;
  overflow-y:visible !important;
  margin-bottom:24px !important;
  padding-bottom:0 !important;
}

/* Ook generieke dashboard wrappers mogen niet knippen */
.dashboard-fullscreen-main .dashboard-tablewrap,
.dashboard-fullscreen-main .tablewrap{
  max-height:none !important;
}

/* Analyse-planning tabel blijft volledig binnen de beschikbare breedte */
.dashboard-grouped-comparison{
  width:100% !important;
  min-width:0 !important;
  max-width:100% !important;
  table-layout:fixed !important;
}

/* Kopregels blijven zichtbaar tijdens normaal pagina-scrollen */
.dashboard-grouped-comparison thead tr:first-child th{
  position:sticky !important;
  top:0 !important;
  z-index:20 !important;
}
.dashboard-grouped-comparison thead tr.dashboard-subhead-row th{
  position:sticky !important;
  top:22px !important;
  z-index:19 !important;
}
.dashboard-grouped-comparison thead tr.dashboard-filter-row th{
  position:sticky !important;
  top:43px !important;
  z-index:18 !important;
}

/* achtergrond expliciet zetten zodat onderliggende regels niet doorschijnen */
.dashboard-grouped-comparison thead tr:first-child th{
  background:#fff !important;
}
.dashboard-grouped-comparison thead tr.dashboard-subhead-row th,
.dashboard-grouped-comparison thead tr.dashboard-filter-row th{
  background:#f4f4f4 !important;
}
.hours-import-summary{margin:10px 0 8px;padding:10px 12px;border:1px solid #d8e4ee;border-radius:6px;background:#f6f9fc}
.uren-koppeling-panel .compact-title-row{align-items:flex-start;gap:16px}
.uren-koppeling-panel .compact-title-row h2{margin-bottom:4px}
.uren-koppeling-panel .compact-title-row p{margin:0;max-width:760px}
.uren-koppeling-table select{min-width:190px}
.uren-koppeling-table th:nth-child(n+3),.uren-koppeling-table td:nth-child(n+3){text-align:right}
.client-project-linkage{margin:7px 0 9px;color:#53606c;font-size:13px}
.actual-matrix-table{width:100%;table-layout:fixed;font-size:12px}
.actual-matrix-title{width:100%;box-sizing:border-box;padding:7px 10px;background:#303030;color:#fff;text-align:center;font-size:12px;font-weight:700}
.actual-matrix-table thead th{background:#ed6b23;color:#fff;text-align:center}
.actual-matrix-table tbody tr:nth-child(even){background:#f0f0f0}
.actual-matrix-table tbody tr.client-total{background:#d9d9d9;font-weight:700;border-top:1px solid #333}
.actual-unlinked-warning{padding:7px 9px;background:#fff2cc;color:#725f00;font-size:12px;font-weight:700}
.unmatched-customer-summary{display:flex;gap:10px;margin:12px 0}
.unmatched-customer-summary>div{min-width:150px;padding:10px 12px;border:1px solid #d8e0e6;border-radius:6px;background:#f7f9fb}
.unmatched-customer-summary b,.unmatched-customer-summary span{display:block}
.unmatched-customer-summary b{font-size:18px}.unmatched-customer-summary span{color:#66727c;font-size:12px}
.klanten-zonder-zoekcode-table .num{text-align:right}
.unmatched-fullscreen-main{width:calc(100vw - 18px)!important;max-width:none!important;margin-left:9px!important;margin-right:9px!important;box-sizing:border-box!important}
.unmatched-fullscreen-main .opties-card,.unmatched-fullscreen-main .klanten-zonder-zoekcode-panel{width:100%!important;max-width:none!important;box-sizing:border-box!important}
.unmatched-fullscreen-main .tablewrap{width:100%!important;max-width:none!important;overflow-x:auto!important}
.klanten-zonder-zoekcode-table{width:100%!important;table-layout:fixed!important}
.klanten-zonder-zoekcode-table th:nth-child(1){width:26%}.klanten-zonder-zoekcode-table th:nth-child(2){width:16%}
.klanten-zonder-zoekcode-table th:nth-child(3){width:22%}.klanten-zonder-zoekcode-table th:nth-child(4){width:6%}
.klanten-zonder-zoekcode-table th:nth-child(5){width:6%}.klanten-zonder-zoekcode-table th:nth-child(6){width:6%}
.klanten-zonder-zoekcode-table th:nth-child(7){width:7%}.klanten-zonder-zoekcode-table th:nth-child(8){width:8%}
.klanten-zonder-zoekcode-table th:nth-child(9){width:3%}
.klanten-zonder-zoekcode-table td{white-space:normal!important;overflow-wrap:anywhere!important}
.unmatched-customer-tools{margin:4px 0 10px}.unmatched-customer-tools input{width:min(520px,100%)!important;height:34px!important;box-sizing:border-box!important}
.unmatched-customer-delete{width:25px!important;height:25px!important;padding:0!important;color:#a61b1b!important;font-size:18px!important;font-weight:700!important}
.unmatched-zoeknaam-editor{display:flex;align-items:center;gap:4px}.unmatched-zoeknaam-editor input{width:100%!important;min-width:0!important;height:27px!important;box-sizing:border-box!important}
.unmatched-zoeknaam-save{flex:0 0 27px;width:27px!important;height:27px!important;padding:0!important;color:#246b2c!important;font-weight:800!important}
.deviating-project-year{color:#c40000!important;font-weight:800!important}
.current-year-panel p{max-width:720px;color:#59636d}.current-year-select{display:block;margin-top:7px;min-width:140px;height:34px}
.analysis-customer-picker{position:relative;display:inline-block;margin-left:8px;vertical-align:middle;font-size:11px}
.analysis-customer-picker summary{list-style:none;min-width:210px;padding:7px 28px 7px 10px;border:1px solid #aeb7bf;border-radius:4px;background:#fff;cursor:pointer;position:relative}
.analysis-customer-picker summary::-webkit-details-marker{display:none}.analysis-customer-picker summary:after{content:'▾';position:absolute;right:9px;color:#555}
.analysis-customer-picker[open] summary:after{content:'▴'}
.analysis-customer-options{position:absolute;z-index:50;top:calc(100% + 2px);left:0;min-width:100%;max-height:280px;overflow:auto;border:1px solid #aeb7bf;border-radius:4px;background:#fff;box-shadow:0 5px 16px #0002}
.analysis-customer-options a{display:block;padding:7px 10px;color:#222;text-decoration:none;white-space:nowrap}.analysis-customer-options a:hover,.analysis-customer-options a.selected{background:#eef3f7}
.dashboard-main-tabs .analysis-customer-options a{
  display:block!important;min-height:0!important;padding:7px 10px!important;
  border:0!important;border-radius:0!important;background:#fff!important;
  color:#222!important;font-size:11px!important;font-weight:400!important;
}
.dashboard-main-tabs .analysis-customer-options a:hover,
.dashboard-main-tabs .analysis-customer-options a.selected{background:#eef3f7!important;color:#222!important}
.plan-item.plan-item-locked{cursor:not-allowed!important;filter:saturate(.55);opacity:.72}
.plan-item.plan-item-locked:after{content:'🔒';margin-left:3px;font-size:9px}
.verdeling-subtabs{margin-bottom:10px}

/* v123 - één scrollcontainer voor de jaarplanning */
body.planning-page{
  display:flex!important;
  flex-direction:column!important;
  height:100vh!important;
  height:100dvh!important;
  overflow:hidden!important;
}
body.planning-page>header,
body.planning-page>.planning-statusbar{flex:0 0 auto!important}
.planning-page .planning-main{
  flex:1 1 auto!important;
  height:auto!important;
  min-height:0!important;
  box-sizing:border-box!important;
  padding-bottom:6px!important;
  overflow:hidden!important;
}
.planning-page .planning-shell{
  flex:1 1 auto!important;
  min-height:0!important;
  overflow:auto!important;
  scrollbar-gutter:auto!important;
}
.planning-page .planning-bottom-scroll{display:none!important}

/* v124 - compacter jaaroverzicht met behoud van leesbare klantblokken */
.planning-page .year-grid{--employee-width:118px!important;--week-width:150px!important}
.planning-page .corner-cell,.planning-page .week-head{min-height:44px!important;height:44px!important;box-sizing:border-box!important}
.planning-page .corner-cell{padding:6px 8px!important}
.planning-page .week-head{padding:5px 7px!important;text-align:center!important}
.planning-page .week-title{font-size:12px!important;line-height:1.1!important}
.planning-page .week-range{font-size:10px!important;margin-top:3px!important;color:#626b73!important}
.planning-page .weekday-heads,.planning-page .day-label{display:none!important}
.planning-page .week-cell,.planning-page .employee-cell{min-height:135px!important}
.planning-page .day-row{grid-template-columns:minmax(0,1fr)!important;min-height:27px!important}
.planning-page .day-items{padding:2px 5px!important;min-height:27px!important;box-sizing:border-box!important}
.planning-page .employee-cell{padding:6px 7px!important;gap:3px!important;overflow:hidden!important}
.planning-page .employee-cell b{font-size:11px!important;line-height:1.15!important;white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;max-width:100%!important}
.planning-page .employee-cell small{font-size:8px!important;line-height:1.1!important;max-width:100%!important;overflow-wrap:anywhere!important}
.planning-page .plan-item{min-height:21px!important;padding:2px 20px 2px 5px!important;margin-bottom:1px!important;font-size:10px!important}
@media(max-width:900px){.planning-page .year-grid{--employee-width:105px!important;--week-width:150px!important}}

/* v125 - doorlopende scheiding tussen medewerkers */
.planning-page .employee-cell,
.planning-page .week-cell{
  border-bottom:2px solid var(--plan-separator)!important;
  box-sizing:border-box!important;
}

/* v128 - Voortgang klanten */
.progress-page{height:100vh;overflow:hidden;background:#f4f5f7}
.progress-main{height:calc(100vh - 108px);width:100vw!important;max-width:none!important;margin:0!important;padding:8px 10px 10px!important;box-sizing:border-box}
.progress-card{height:100%;width:100%!important;max-width:none!important;display:flex;flex-direction:column;min-height:0;background:#fff;border:1px solid #d6d9dc;box-shadow:0 2px 8px #0000000d;box-sizing:border-box}
.progress-page .progress-table-wrap{width:100%!important;max-width:none!important}
.progress-toolbar{display:flex;align-items:center;gap:18px;min-height:54px;padding:7px 10px;border-bottom:1px solid #d6d9dc;box-sizing:border-box}
.progress-toolbar>div:first-child{margin-right:auto}.progress-toolbar h1{margin:0;font-size:16px}.progress-toolbar span{font-size:11px;color:#69737d}
.progress-toolbar label{display:flex;align-items:center;gap:7px;font-size:11px;font-weight:700}.progress-toolbar input[type=search]{width:310px;height:30px;padding:4px 8px}
.progress-toolbar select{height:30px;min-width:145px;padding:3px 7px}
.progress-year-tabs{display:flex!important;gap:5px!important;margin:0!important}.progress-year-tabs a{display:inline-flex;align-items:center;justify-content:center;min-width:58px;height:30px;padding:0 9px;border:1px solid #cbd0d5;border-radius:4px;background:#fff;color:#30363b;text-decoration:none;font-size:11px;font-weight:800}.progress-year-tabs a.active{border-color:#e96f00;background:#e96f00;color:#fff}
.progress-clear-filters{height:30px;padding:4px 10px;border:1px solid #cbd0d5;border-radius:4px;background:#fff;color:#394149;font-size:11px;font-weight:700}
.progress-table-wrap{flex:1 1 auto;min-height:0;overflow:auto}
.progress-table{border-collapse:separate;border-spacing:0;width:max-content;min-width:100%;font-size:10px;color:#202428}
.progress-table th,.progress-table td{height:29px;padding:2px 4px;border-right:1px solid #c8cdd1;border-bottom:1px solid #d9dde0;box-sizing:border-box;white-space:nowrap}
.progress-table thead th{position:sticky;z-index:20;text-align:center;font-weight:800}
.progress-group-row th{top:0;height:27px;background:#e96f00;color:#fff;border-bottom:1px solid #b44f00;z-index:40!important}
.progress-header-row th{top:27px;height:48px;max-width:135px;white-space:normal;line-height:1.08;background:#f07828;color:#fff}
.progress-filter-row th{top:75px;height:28px;padding:2px 3px;background:#eef0f2;color:#333;z-index:21}
.progress-column-filter{width:100%;height:22px;min-width:0;padding:2px 4px;border:1px solid #c8cdd1;background:#fff;font-size:9px;box-sizing:border-box}
.progress-header-row .sortable{cursor:pointer;padding-right:13px!important;position:sticky}.progress-header-row .sortable.sort-asc:after{content:'▲';margin-left:4px;font-size:7px}.progress-header-row .sortable.sort-desc:after{content:'▼';margin-left:4px;font-size:7px}
.progress-group-row .progress-group-client-en-opdrachtacceptatie{background:#e96f00}
.progress-group-row .progress-group-planning{background:#d95d13}.progress-group-row .progress-group-interim{background:#e96f00}
.progress-group-row .progress-group-ejc{background:#d95d13}.progress-group-row .progress-group-afronding{background:#e96f00}.progress-group-row .progress-group-controle{background:#d95d13}
.progress-table tbody tr:nth-child(even) td{background:#f7f8f9}.progress-table tbody tr:hover td{background:#fff6ed}
.progress-table td:nth-child(1),.progress-header-row th:nth-child(1){min-width:180px;width:180px;max-width:180px}
.progress-table td:nth-child(2),.progress-header-row th:nth-child(2),.progress-table td:nth-child(3),.progress-header-row th:nth-child(3),.progress-table td:nth-child(4),.progress-header-row th:nth-child(4){min-width:82px;width:82px;max-width:82px}
.progress-table td:nth-child(5),.progress-header-row th:nth-child(5){min-width:90px;width:90px;text-align:right}
.progress-table td:nth-child(n+6){min-width:116px}.progress-table td:nth-child(8),.progress-table td:nth-child(9),.progress-table td:nth-child(10){min-width:165px}
.progress-table .progress-sticky-client{position:sticky;left:0;z-index:10;background:#fff!important;overflow:hidden;text-overflow:ellipsis}
.progress-table .progress-header-row th:nth-child(1){position:sticky;left:0;z-index:45!important;background:#e96f00!important;color:#fff!important}
.progress-table .progress-filter-row th:nth-child(1){position:sticky;left:0;z-index:44!important}
.progress-input{display:block;width:100%;height:24px;min-width:108px;padding:2px 5px;border:1px solid transparent;background:transparent;font:inherit;box-sizing:border-box}
.progress-checkbox{width:15px!important;min-width:15px!important;height:15px!important;margin:0 auto!important}.progress-select{padding-right:18px!important}
.progress-input:hover{border-color:#c6cbd0;background:#fff}.progress-input:focus{border-color:#e96f00;background:#fff;outline:0;box-shadow:0 0 0 1px #e96f0030}
.progress-input:disabled{color:#333;opacity:1}.progress-budget{font-variant-numeric:tabular-nums}
.progress-score{position:relative;text-align:center;font-weight:800;overflow:hidden}.progress-score span{position:relative;z-index:2}.progress-score i{position:absolute;left:5px;right:5px;bottom:3px;height:4px;background:linear-gradient(90deg,#55a868 var(--score),#e2e5e8 var(--score));border-radius:3px}
.progress-page .autosave-state.error{color:#b42318}.progress-page .planning-nav{gap:7px!important}
.progress-row-closed td{color:#69737d}.progress-row-closed .progress-sticky-client{background:#eceff1!important}.progress-sticky-client small{display:block;margin-top:2px;color:#a23b31;font-size:8px;font-weight:800;text-transform:uppercase}

/* v133 - beheerbare voortgangsvelden en dropdownlijsten */
.voortgang-config-panel .compact-title-row p,.voortgang-dropdown-panel .compact-title-row p{margin:3px 0 10px;max-width:900px;color:#66717a}
.progress-config-table{width:100%;table-layout:fixed}.progress-config-table th:nth-child(1){width:34px}.progress-config-table th:nth-child(2){width:25%}.progress-config-table th:nth-child(3){width:22%}.progress-config-table th:nth-child(4){width:18%}.progress-config-table th:nth-child(5){width:25%}.progress-config-table th:nth-child(6){width:36px}
.progress-config-table input,.progress-config-table select{width:100%;box-sizing:border-box}.progress-field-row{cursor:grab}.progress-field-row.dragging{opacity:.45}
.progress-dropdown-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:10px;margin-top:12px}.progress-dropdown-card{padding:10px;border:1px solid #d6dadd;border-radius:6px;background:#fafbfc}.progress-dropdown-card>div{display:flex;gap:6px}.progress-dropdown-name{flex:1;font-weight:700}.progress-dropdown-values{display:block;width:100%;margin:7px 0;box-sizing:border-box;resize:vertical}.progress-dropdown-save{min-width:90px}
.progress-dropdown-card>.progress-dropdown-colors{display:grid;gap:3px;margin:0 0 8px}.progress-dropdown-colors label{display:flex;align-items:center;justify-content:space-between;gap:8px;min-height:27px;padding:2px 5px;border:1px solid #e0e3e5;border-radius:4px;background:#fff}.progress-dropdown-colors span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.progress-dropdown-colors input[type=color]{flex:0 0 34px;width:34px;height:23px;padding:1px;border:1px solid #c8cdd1;border-radius:4px;background:#fff}
.progress-dropdown-option-list{display:grid!important;gap:4px!important;margin:8px 0!important}.progress-dropdown-option-row{display:grid!important;grid-template-columns:minmax(120px,1fr) 112px 25px!important;gap:5px!important;align-items:center!important}.progress-dropdown-option-name{width:100%!important;min-width:0!important;height:28px!important;box-sizing:border-box!important}.progress-dropdown-swatches{display:flex!important;gap:3px!important}.progress-dropdown-swatch{position:relative!important;width:20px!important;height:20px!important;padding:0!important;border:1px solid #9fa7ae!important;border-radius:4px!important}.progress-dropdown-swatch.active{outline:2px solid #e96f00!important;outline-offset:1px!important}.progress-dropdown-swatch.active:after{content:'✓';position:absolute;inset:0;display:grid;place-items:center;color:#222;font-size:10px;font-weight:900;text-shadow:0 1px #fff}.progress-dropdown-swatch[data-color="#343a40"].active:after{color:#fff;text-shadow:none}.progress-dropdown-option-remove{width:25px!important;height:25px!important;padding:0!important}.progress-dropdown-option-add{height:28px!important;margin:0!important;padding:3px 8px!important;border:1px solid #c8cdd1!important;border-radius:4px!important;background:#fff!important;color:#333!important}.progress-dropdown-option-add:hover{border-color:#e96f00!important}

/* v134 - uniforme compacte typografie in alle beheeronderdelen */
.planning-admin-page .beheer-main,
.planning-admin-page .beheer-main *,
.planning-admin-page .beheer-main input,
.planning-admin-page .beheer-main select,
.planning-admin-page .beheer-main textarea,
.planning-admin-page .beheer-main button,
.planning-admin-page .beheer-main label,
.planning-admin-page .beheer-main p,
.planning-admin-page .beheer-main span,
.planning-admin-page .beheer-main a,
.planning-admin-page .beheer-main th,
.planning-admin-page .beheer-main td{font-size:10px!important}
.planning-admin-page .beheer-main h1,
.planning-admin-page .beheer-main h2,
.planning-admin-page .beheer-main h3,
.planning-admin-page .beheer-main .compact-title-row h2,
.planning-admin-page .beheer-main .optie-subpanel h2{font-size:12px!important;line-height:1.2!important}
.planning-admin-page .opties-card{width:100%!important;max-width:none!important;box-sizing:border-box!important}
.planning-admin-page .optie-subtabs{width:100%!important;max-width:none!important;flex-wrap:nowrap!important;overflow-x:auto!important;overflow-y:hidden!important;box-sizing:border-box!important}
.planning-admin-page .optie-subtabs a{flex:0 0 auto!important;width:auto!important;min-width:0!important;max-width:none!important;white-space:nowrap!important;font-size:10px!important;padding:4px 8px!important}
.planning-admin-page .voortgang-config-panel,.planning-admin-page .voortgang-dropdown-panel{width:100%!important;max-width:none!important}

/* v135 - voortgangsbeheer volledig breed en vaste categorie-/dropdownselecties */
.planning-admin-page .voortgang-beheer-fullscreen-main{width:100%!important;max-width:none!important;margin-left:0!important;margin-right:0!important;box-sizing:border-box!important}
.planning-admin-page .voortgang-beheer-fullscreen-main .opties-card,.planning-admin-page .voortgang-beheer-fullscreen-main .optie-subpanel,.planning-admin-page .voortgang-beheer-fullscreen-main .tablewrap{width:100%!important;max-width:none!important;box-sizing:border-box!important}
.planning-admin-page .voortgang-beheer-fullscreen-main .progress-config-table{min-width:900px!important}
.planning-admin-page .progress-field-add{grid-template-columns:minmax(260px,520px) minmax(180px,280px) 32px!important;max-width:850px!important}
.planning-admin-page .progress-field-add select{width:100%!important;min-height:30px!important;box-sizing:border-box!important}

/* v136 - meerkeuzefilters in Voortgang */
.progress-multifilter-button{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:4px!important;width:100%!important;height:22px!important;min-width:0!important;padding:1px 4px!important;border:1px solid #c8cdd1!important;border-radius:3px!important;background:#fff!important;color:#4b535a!important;font-size:9px!important;font-weight:600!important;white-space:nowrap!important;overflow:hidden!important}
.progress-multifilter-button span{overflow:hidden;text-overflow:ellipsis}.progress-multifilter-button i{font-style:normal;font-size:8px}.progress-multifilter-button.active{border-color:#e96f00!important;background:#fff2e8!important;color:#a64000!important}
.progress-multifilter-menu{position:fixed;z-index:1000;max-width:320px;max-height:360px;padding:6px;border:1px solid #bbc1c6;border-radius:5px;background:#fff;box-shadow:0 8px 24px #0003;box-sizing:border-box;font-size:10px}
.progress-multifilter-actions{display:grid;grid-template-columns:auto minmax(110px,1fr);gap:5px;padding-bottom:5px;border-bottom:1px solid #e0e3e5}.progress-multifilter-actions button,.progress-multifilter-actions input{height:25px;padding:2px 6px;box-sizing:border-box;font-size:10px}.progress-multifilter-actions button{border:1px solid #c8cdd1;background:#f7f8f9;color:#333;border-radius:3px}.progress-multifilter-actions input{width:100%;border:1px solid #c8cdd1;border-radius:3px}
.progress-multifilter-list{max-height:290px;overflow:auto;padding-top:4px}.progress-multifilter-list label{display:flex;align-items:center;gap:6px;min-height:24px;padding:2px 4px;border-radius:3px;cursor:pointer;white-space:normal}.progress-multifilter-list label:hover{background:#fff2e8}.progress-multifilter-list input{flex:0 0 auto;width:14px;height:14px;margin:0}.progress-multifilter-list span{overflow-wrap:anywhere}
.progress-page .progress-table th,.progress-page .progress-table td{max-width:150px!important;overflow:hidden;text-overflow:ellipsis}
.progress-page .progress-table td:nth-child(n),.progress-page .progress-table .progress-header-row th:nth-child(n){min-width:58px;width:auto;max-width:150px}
.progress-page .progress-input{min-width:0!important;max-width:100%!important}

/* v137 - categoriegestuurde compacte voortgangsweergave */
.progress-viewbar{display:flex;align-items:center;gap:5px;min-height:38px;padding:5px 10px;border-bottom:1px solid #d6d9dc;background:#fafbfc;box-sizing:border-box;overflow-x:auto;white-space:nowrap}.progress-viewbar>b{margin-right:3px;font-size:10px}.progress-viewbar button{display:inline-flex;align-items:center;gap:5px;height:27px;padding:3px 8px;border:1px solid #c8cdd1;border-radius:4px;background:#fff;color:#394149;font-size:10px;font-weight:700}.progress-viewbar button small{color:#77818a;font-size:8px;font-weight:600}.progress-viewbar button.active{border-color:#e96f00;background:#e96f00;color:#fff}.progress-viewbar button.active small{color:#fff}.progress-viewbar .progress-category-toggle[data-category="Algemeen"]{cursor:default}.progress-incomplete-toggle{display:flex;align-items:center;gap:5px;margin-left:auto;padding-left:10px;font-size:10px;font-weight:700}.progress-incomplete-toggle input{width:14px;height:14px;margin:0}
.progress-table [hidden]{display:none!important}

/* v138 - Algemeen uitklapbaar, Zoeknaam altijd zichtbaar */
.progress-viewbar button small{display:none!important}
.progress-status-buttons{display:flex;align-items:center;justify-content:center;gap:2px;min-width:78px}.progress-status-buttons .progress-status-value{display:none!important}.progress-status-buttons button{display:inline-flex;align-items:center;justify-content:center;width:23px;height:22px;padding:0;border:1px solid #cbd0d4;border-radius:4px;background:#fff;color:#9aa2a9;font-size:14px;font-weight:800;line-height:1}.progress-status-buttons button[data-value="Open"].active{border-color:#77818a;background:#eef0f2;color:#4f5961}.progress-status-buttons button[data-value="Onderhanden"].active{border-color:#e18418;background:#fff0d9;color:#c26800}.progress-status-buttons button[data-value="Gereed"].active{border-color:#3d9460;background:#e3f4e9;color:#237443}.progress-status-buttons button:disabled{cursor:default;opacity:.75}.progress-status-buttons button:not(:disabled):hover{border-color:#e96f00}
.progress-viewbar .progress-category-toggle[data-category="Algemeen"]{cursor:pointer!important}
.progress-status-control{display:flex;align-items:center;justify-content:center}.progress-status-control .progress-status-value{display:none!important}.progress-status-trigger{display:inline-flex;align-items:center;justify-content:center;gap:2px;width:34px;height:23px;padding:1px 3px;border:1px solid currentColor;border-radius:5px;background:#fff;font-weight:800}.progress-status-trigger i{font-style:normal;font-size:7px}.progress-status-icon{display:flex;width:17px;height:17px}.progress-status-icon svg,.progress-status-menu svg{width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.progress-status-trigger[data-status="Open"]{color:#c9342f;background:#fdebea}.progress-status-trigger[data-status="Onderhanden"]{color:#b66a00;background:#fff1ce}.progress-status-trigger[data-status="Closed"]{color:#247644;background:#e3f4e9}.progress-status-trigger:disabled{cursor:default;opacity:.78}.progress-status-menu{position:fixed;z-index:1002;width:158px;padding:4px;border:1px solid #bbc1c6;border-radius:6px;background:#fff;box-shadow:0 8px 24px #0003}.progress-status-menu button{display:flex;align-items:center;gap:8px;width:100%;height:31px;padding:4px 7px;border:0;border-radius:4px;background:#fff;color:#333;text-align:left;font-size:10px}.progress-status-menu button:hover{background:#f1f3f4}.progress-status-menu button span{display:flex;width:18px;height:18px}.progress-status-menu button[data-status="Open"] span{color:#c9342f}.progress-status-menu button[data-status="Onderhanden"] span{color:#b66a00}.progress-status-menu button[data-status="Closed"] span{color:#247644}
.progress-status-trigger{width:84px!important;height:22px!important;padding:1px 5px!important;border:1px solid currentColor!important;border-radius:6px!important;font-size:10px!important;font-weight:700!important;line-height:1!important}.progress-status-trigger .progress-status-icon{display:block!important;width:auto!important;height:auto!important;min-width:0!important}.progress-status-trigger i{margin-left:auto!important}.progress-status-menu{width:126px!important}.progress-status-menu button{height:27px!important;border:1px solid transparent!important;border-radius:5px!important;font-size:10px!important;font-weight:700!important}.progress-status-menu button[data-status="Open"]{color:#c9342f}.progress-status-menu button[data-status="Onderhanden"]{color:#a85f00}.progress-status-menu button[data-status="Closed"]{color:#247644}

/* v144 - alle lege voortgangscellen visueel Onderhanden */
.progress-table td[data-progress-field]{position:relative}.progress-empty-default{position:absolute;left:50%;top:50%;z-index:3;transform:translate(-50%,-50%);width:84px;height:22px;padding:1px 5px;border:1px solid #fff3cd;border-radius:6px;background:#fff3cd;color:#30363b;font-size:10px;font-weight:700;line-height:1}.progress-empty-default:disabled{cursor:default;opacity:.8}.progress-table td[data-has-value="1"]>.progress-empty-default,.progress-table td.editing-empty>.progress-empty-default{display:none!important}.progress-table td[data-has-value="0"]>.progress-input,.progress-table td[data-has-value="0"]>.progress-checkbox{opacity:.12}.progress-table td.editing-empty>.progress-input,.progress-table td.editing-empty>.progress-checkbox{opacity:1}

/* v145 - filterregels Fase en Type */
.progress-view-controls{flex:0 0 auto;border-bottom:1px solid #d6d9dc;background:#fafbfc}.progress-view-controls .progress-viewbar{min-height:32px;padding:3px 10px;border-bottom:1px solid #e3e5e7}.progress-view-controls .progress-viewbar:last-child{border-bottom:0}.progress-view-controls .progress-viewbar>b{flex:0 0 62px;width:62px;margin:0}.progress-view-controls .progress-viewbar button{height:25px;padding:2px 8px}.progress-typebar{overflow-x:auto}.progress-no-filter-values{color:#7a838b;font-size:10px;font-style:italic}

/* v152 - inhoudsgestuurde kolommen en verplichte toelichting bij Nee */
.progress-page .progress-table{width:max-content!important;min-width:0!important;table-layout:auto!important}.progress-page .progress-table th,.progress-page .progress-table td{box-sizing:border-box!important}
.progress-nee-popup{position:fixed;inset:0;z-index:2000;display:flex;align-items:center;justify-content:center;padding:20px;background:#0006}.progress-nee-popup[hidden]{display:none}.progress-nee-dialog{width:min(440px,calc(100vw - 40px));padding:16px;border-radius:8px;background:#fff;box-shadow:0 12px 40px #0005}.progress-nee-dialog h2{margin:0 0 5px;font-size:12px}.progress-nee-dialog p{margin:0 0 10px;font-size:10px;color:#5b646c}.progress-nee-dialog textarea{display:block;width:100%;height:110px;padding:8px;border:1px solid #bfc5ca;border-radius:5px;box-sizing:border-box;resize:vertical;font:10px Arial,sans-serif}.progress-nee-error{display:block;min-height:17px;padding-top:3px;color:#b42318;font-size:10px}.progress-nee-dialog>div{display:flex;justify-content:flex-end;gap:6px}.progress-nee-dialog button{height:28px;padding:3px 10px;border:1px solid #c6cbd0;border-radius:4px;background:#fff;font-size:10px;font-weight:700}.progress-nee-dialog button.primary{border-color:#e96f00;background:#e96f00;color:#fff}

/* v153 - echte standaardoptie Onderhanden in iedere dropdown */
.progress-table td[data-has-value="0"]>.progress-select{opacity:1!important}

/* v154 - compacte inhoudsmeting en consequente kolomscheiding */
.progress-page .progress-table th,.progress-page .progress-table td{border-right:1px solid #a9b0b6!important}.progress-page .progress-header-row th{overflow-wrap:anywhere!important}.progress-page .progress-select{width:100%!important;min-width:0!important}

/* v155 - harde berekende kolombreedtes en Nederlandse woordafbreking */
.progress-page .progress-table{table-layout:fixed!important}.progress-page .progress-table col{box-sizing:border-box}.progress-page .progress-header-row th{hyphens:auto!important;-webkit-hyphens:auto!important;word-break:normal!important;overflow-wrap:normal!important}

/* v157 - instelbare verplichte toelichtingen per dropdownoptie */
.progress-dropdown-option-row{grid-template-columns:minmax(105px,1fr) 112px 82px 25px!important}.progress-dropdown-note-label{display:flex!important;align-items:center!important;gap:4px!important;margin:0!important;font-size:9px!important;white-space:nowrap}.progress-dropdown-note-label input{width:14px!important;height:14px!important;margin:0!important}.progress-nee-dialog>label{display:grid;gap:4px;margin:0 0 9px;font-size:10px;font-weight:700}.progress-nee-dialog .progress-note-status{width:100%;height:30px;padding:3px 7px;border:1px solid #bfc5ca;border-radius:5px;background:#fff;font-size:10px}

/* v158 - compact vinkvak zonder tekst */
.progress-dropdown-option-row{grid-template-columns:minmax(105px,1fr) 112px 20px 25px!important}.progress-dropdown-note-label{justify-content:center!important;width:20px!important}

/* v159 - zichtbare annulering en betrouwbare toelichting-prefill */
.progress-nee-dialog button[data-action="cancel"]{border-color:#9da5ac!important;background:#fff!important;color:#30363b!important;box-shadow:none!important}.progress-nee-dialog button[data-action="save"]{color:#fff!important}.progress-nee-dialog button{opacity:1!important;visibility:visible!important}

/* v161 - Review-actie, deadline en mailbevestiging */
.progress-review-mail{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin:2px 0 8px;padding:9px;border:1px solid #d9dde0;border-radius:6px;background:#f7f8f9}.progress-review-mail[hidden]{display:none}.progress-review-mail label{display:grid;gap:4px;margin:0;font-size:10px;font-weight:700}.progress-review-mail input[type=date],.progress-review-mail select{width:100%;height:29px;padding:3px 6px;border:1px solid #bfc5ca;border-radius:4px;background:#fff;box-sizing:border-box;font-size:10px}.progress-review-send{display:flex!important;align-items:center!important;gap:5px!important;grid-column:1/-1}.progress-review-send input{width:14px;height:14px;margin:0}.progress-review-user{grid-column:1/-1}.progress-review-user:disabled{opacity:.55}
.progress-config-table th:nth-child(1){width:34px}.progress-config-table th:nth-child(2){width:22%}.progress-config-table th:nth-child(3){width:18%}.progress-config-table th:nth-child(4){width:16%}.progress-config-table th:nth-child(5){width:23%}.progress-config-table th:nth-child(6){width:90px}.progress-config-table th:nth-child(7){width:36px}.progress-field-action{display:block;width:15px!important;height:15px!important;margin:auto!important}

/* v164 - Analyse voortgang */
.progress-analysis-dashboard{display:grid;gap:14px;padding-top:8px;font-size:10px}.progress-analysis-title{display:flex;align-items:center;justify-content:space-between;gap:16px}.progress-analysis-title h2{margin:0 0 3px;font-size:18px}.progress-analysis-title p{margin:0;color:#6a6a6a}.progress-analysis-title .primary{padding:8px 13px;text-decoration:none;border-radius:5px}.progress-kpi-grid{display:grid;grid-template-columns:repeat(4,minmax(160px,1fr));gap:10px}.progress-kpi{position:relative;overflow:hidden;min-height:92px;padding:12px 14px;border:1px solid #ddd;border-radius:8px;background:#fff;box-shadow:0 2px 8px #0000000c}.progress-kpi:before{content:"";position:absolute;inset:0 auto 0 0;width:5px}.progress-kpi span{display:block;font-size:11px;font-weight:700;color:#555}.progress-kpi b{display:block;margin:4px 0 2px;font-size:25px;line-height:1.1;color:#222}.progress-kpi small{color:#777}.progress-kpi-green:before{background:#2e9d62}.progress-kpi-yellow:before{background:#e3aa19}.progress-kpi-red:before,.progress-kpi-alert:before{background:#d4483f}.progress-kpi-alert{background:#fff8f7}.progress-analysis-grid{display:grid;gap:12px}.progress-analysis-top{grid-template-columns:minmax(230px,.72fr) repeat(2,minmax(300px,1fr))}.progress-analysis-middle{grid-template-columns:minmax(440px,1.35fr) minmax(340px,.85fr)}.progress-analysis-bottom{grid-template-columns:1.2fr .8fr}.progress-chart-card{min-width:0;padding:13px;border:1px solid #ddd;border-radius:8px;background:#fff;box-shadow:0 2px 8px #0000000a}.progress-chart-card h3{margin:0 0 10px;font-size:12px}.progress-chart-card>p{margin:-6px 0 10px}.progress-donut-wrap{display:flex;align-items:center;justify-content:center;gap:20px;min-height:190px}.progress-donut{display:grid;place-items:center;width:150px;height:150px;border-radius:50%;background:conic-gradient(#2e9d62 0 calc(var(--closed)*1%),#e3aa19 calc(var(--closed)*1%) calc((var(--closed) + var(--under))*1%),#d4483f calc((var(--closed) + var(--under))*1%) 100%)}.progress-donut:before{content:"";grid-area:1/1;width:98px;height:98px;border-radius:50%;background:#fff}.progress-donut>div{position:relative;grid-area:1/1;text-align:center}.progress-donut b{display:block;font-size:20px}.progress-donut span{color:#777}.progress-legend{display:grid;gap:9px}.progress-legend span{display:grid;grid-template-columns:10px 1fr auto;align-items:center;gap:6px;min-width:110px}.progress-legend i{width:9px;height:9px;border-radius:2px}.green{background:#2e9d62}.yellow{background:#e3aa19}.red{background:#d4483f}.progress-stacked-list{display:grid;gap:11px;max-height:225px;overflow:auto;padding-right:3px}.progress-stack-row>div:first-child{display:flex;justify-content:space-between;gap:8px;margin-bottom:3px}.progress-stack-row span{color:#666}.progress-stack{display:flex;overflow:hidden;height:12px;border-radius:6px;background:#eee}.progress-stack i{display:block;height:100%}.progress-client-bars{display:grid;gap:5px;max-height:360px;overflow:auto;padding-right:4px}.progress-client-row{display:grid;grid-template-columns:minmax(120px,190px) 1fr 38px;align-items:center;gap:8px;min-height:19px}.progress-client-row>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.progress-client-row>div,.progress-user-bars>div>div{overflow:hidden;height:10px;border-radius:5px;background:#eee}.progress-client-row i,.progress-user-bars i{display:block;height:100%;min-width:2px;border-radius:5px;background:linear-gradient(90deg,#ef7b25,#2e9d62)}.progress-client-row>b{text-align:right}.progress-field-list{display:grid;gap:1px;max-height:360px;overflow:auto}.progress-field-row{display:grid!important;grid-template-columns:minmax(130px,1fr) 42px;gap:2px 8px;padding:6px 4px!important;border-bottom:1px solid #eee}.progress-field-row>div{display:grid}.progress-field-row span,.progress-field-row small{color:#777;font-weight:400}.progress-field-row strong{grid-row:1/3;grid-column:2;text-align:right;font-size:12px}.progress-deadline-list{display:grid;gap:5px;max-height:300px;overflow:auto}.progress-deadline-row{display:grid;grid-template-columns:1fr 76px 80px;align-items:center;gap:8px;padding:7px 8px;border-left:4px solid #bbb;background:#f7f7f7;border-radius:4px}.progress-deadline-row>div{display:grid}.progress-deadline-row span{color:#666}.progress-deadline-row strong,.progress-deadline-row small{text-align:right}.progress-deadline-row.overdue{border-color:#d4483f;background:#fff0ef}.progress-deadline-row.soon{border-color:#e3aa19;background:#fff9e8}.progress-user-bars{display:grid;gap:9px}.progress-user-bars>div{display:grid;grid-template-columns:minmax(90px,135px) 1fr 25px auto;align-items:center;gap:7px}.progress-user-bars em{color:#c43b34;font-style:normal;font-weight:700}.progress-user-bars i{background:#ef7b25}@media(max-width:1100px){.progress-analysis-top{grid-template-columns:1fr 1fr}.progress-analysis-top .progress-chart-card:first-child{grid-column:1/-1}.progress-kpi-grid{grid-template-columns:repeat(2,1fr)}}

/* v166 - compacte hoofdnavigatie */
body.planning-page > header .planning-nav,body.planning-admin-page > header .planning-nav{gap:7px!important}
body.planning-page > header .planning-nav > .planning-nav-link,body.planning-admin-page > header .planning-nav > .planning-nav-link{min-height:29px!important;padding:5px 11px!important;border:1px solid #c9c9c9!important;border-radius:5px!important;background:#fff!important;color:#303030!important;font-size:10px!important;font-weight:700!important;line-height:1!important;box-shadow:0 1px 2px #0000000a!important;opacity:1!important;transition:background .14s ease,border-color .14s ease,color .14s ease,transform .14s ease!important}
body.planning-page > header .planning-nav > .planning-nav-link:hover,body.planning-admin-page > header .planning-nav > .planning-nav-link:hover{border-color:#ef6c00!important;background:#fff7f0!important;color:#d85f00!important;transform:translateY(-1px)!important}
body.planning-page > header .planning-nav > .planning-logout-link,body.planning-admin-page > header .planning-nav > .planning-logout-link{margin-left:3px!important;padding-left:11px!important;border-left:1px solid #c9c9c9!important;background:#f1f1f1!important;color:#555!important}
body.planning-page > header .planning-nav > .planning-logout-link:hover,body.planning-admin-page > header .planning-nav > .planning-logout-link:hover{border-color:#555!important;background:#444!important;color:#fff!important}

/* v167 - duidelijk herkenbare menuknoppen */
body.planning-page > header .planning-nav > .planning-nav-link,
body.planning-admin-page > header .planning-nav > .planning-nav-link{
  min-width:82px!important;
  min-height:31px!important;
  padding:7px 13px!important;
  border:1px solid #cf5d00!important;
  border-radius:4px!important;
  background:#ef6c00!important;
  color:#fff!important;
  box-shadow:0 2px 0 #b94f00,0 2px 5px #0000001f!important;
  letter-spacing:.1px!important;
}
body.planning-page > header .planning-nav > .planning-nav-link:hover,
body.planning-admin-page > header .planning-nav > .planning-nav-link:hover{
  border-color:#b94f00!important;
  background:#d96000!important;
  color:#fff!important;
  transform:translateY(-1px)!important;
  box-shadow:0 3px 0 #a94700,0 3px 7px #00000024!important;
}
body.planning-page > header .planning-nav > .planning-nav-link:active,
body.planning-admin-page > header .planning-nav > .planning-nav-link:active{
  transform:translateY(1px)!important;
  box-shadow:0 1px 0 #a94700!important;
}
body.planning-page > header .planning-nav > .planning-logout-link,
body.planning-admin-page > header .planning-nav > .planning-logout-link{
  min-width:82px!important;
  margin-left:5px!important;
  border-color:#3f4549!important;
  background:#545b60!important;
  color:#fff!important;
  box-shadow:0 2px 0 #34393d,0 2px 5px #0000001f!important;
}
body.planning-page > header .planning-nav > .planning-logout-link:hover,
body.planning-admin-page > header .planning-nav > .planning-logout-link:hover{
  border-color:#282c2f!important;
  background:#3d4347!important;
  color:#fff!important;
  box-shadow:0 3px 0 #282c2f,0 3px 7px #00000024!important;
}

/* v168 - afgerond menu met gearceerde actieve knop */
body.planning-page > header .planning-nav > .planning-nav-link,
body.planning-admin-page > header .planning-nav > .planning-nav-link{border-radius:9px!important}
body.planning-page > header .planning-nav > .planning-nav-link.active,
body.planning-admin-page > header .planning-nav > .planning-nav-link.active{
  border-color:#9f4300!important;
  background:repeating-linear-gradient(135deg,#c95500 0,#c95500 6px,#e76a0a 6px,#e76a0a 12px)!important;
  color:#fff!important;
  box-shadow:inset 0 0 0 1px #ffffff2e,0 2px 0 #8f3b00,0 2px 5px #00000022!important;
  cursor:default!important;
}
body.planning-page > header .planning-nav > .planning-logout-link,
body.planning-admin-page > header .planning-nav > .planning-logout-link{border-radius:9px!important}

/* v169 - tijdelijk wachtwoordbeheer tot Microsoft SSO */
.employee-password-btn{min-width:82px;height:28px;padding:4px 9px;border:1px solid #d26008;border-radius:6px;background:#fff7ef;color:#c85600;font-size:10px;font-weight:700;cursor:pointer}.employee-password-btn:hover{background:#ef6c00;color:#fff}.employee-password-btn:disabled{opacity:.45;cursor:default}.password-modal{position:fixed;z-index:100000;inset:0;display:grid;place-items:center;padding:20px;background:#0008}.password-modal[hidden]{display:none}.password-dialog{width:min(390px,calc(100vw - 30px));display:grid;gap:10px;padding:18px;border-radius:10px;background:#fff;box-shadow:0 15px 50px #0006}.password-dialog h2{margin:0;font-size:15px}.password-dialog p{margin:-5px 0 2px;font-weight:700;color:#ef6c00}.password-dialog label{display:grid;gap:4px;font-size:10px;font-weight:700}.password-dialog input{height:34px;padding:6px 9px;border:1px solid #bfc3c6;border-radius:6px;font-size:12px}.password-dialog small{color:#666}.password-dialog>div{display:flex;justify-content:flex-end;gap:8px;margin-top:3px}.password-dialog button{min-width:85px;height:31px;border:1px solid #bbb;border-radius:7px}.password-error{min-height:15px;color:#c62828;font-weight:700}