/* uitvoerplanning.css — wat eigen is aan de uitvoerkant van het planscherm
   (wireframe v4, UP3 · 05-08). De schil (tweeluik, werkvoorraad-kolom,
   popup, concept-strook, kaartvak) komt uit planning-schil.css; hier staat
   het bord zelf: ploegen gegroepeerd per discipline, hele dagen in plaats
   van uren, de m²-vulling per dag, "＋ X m² vrij" bij een dag waar nog een
   klus bij past, en de bruine arcering van een dag waarop het materiaal
   nog niet binnen is. Alleen tokens. */

/* de module-wortel: dezelfde volle-schermschil als de verkoopplanning,
   maar met een breder bord (ploegen × dagen vraagt kolombreedte) */
.up-schil { display: flex; flex-direction: column; height: 100%; min-height: 0; }

/* ---- lijst: statusmerken en type-chip ---- */
.up-merk { font-size: .6rem; font-weight: 800; border-radius: 5px; padding: 1px 7px; white-space: nowrap; }
.up-merk--ok { background: var(--c-ink); color: #fff; }
.up-merk--toez { border: 1px solid var(--c-groen); color: var(--c-groen-d); }
.up-merk--blok { border: 1px solid var(--c-rood); color: var(--c-rood); }
.up-tchip { font-size: .62rem; font-weight: 700; border: var(--lijndikte) solid var(--c-lijn-2);
  border-radius: 4px; padding: 0 5px; color: var(--c-ink-3); }
.vp-item.is-blok { opacity: .62; }

/* ---- werkstrook ---- */
.up-nu--blok { background: var(--c-paneel); }
.up-nogdagen { font-size: .72rem; font-weight: 700; color: var(--c-groen-d); }
.up-schakel { display: flex; align-items: center; gap: 6px; font-size: .7rem; font-weight: 700; color: var(--c-ink-2); }
.up-schakel input { accent-color: var(--c-groen); }

/* ---- het bord: ploeg × dag ---- */
.up-bord { padding-top: 12px; }
.up-rooster td.up-cel { height: 58px; }
.up-ploegkop { width: 190px; }
.up-ploeg { padding: 6px 10px; background: var(--c-paneel-2); vertical-align: top; }
.up-ploeg b { font-size: .76rem; display: block; }
.up-ploeg small { font-size: .62rem; color: var(--c-ink-3); }
.up-groep td { background: var(--c-paneel); border: var(--lijndikte) solid var(--c-lijn); padding: 0; }
.up-groepknop { width: 100%; text-align: left; background: none; border: 0; font-family: inherit;
  font-size: .76rem; font-weight: 700; color: var(--c-ink); padding: 7px 11px; cursor: pointer; }
.up-groepknop small { color: var(--c-ink-3); font-weight: 400; }
.up-vrij { cursor: pointer; }
.up-vrij:hover { background: var(--c-groen-t); }
.up-tip { cursor: pointer; background: var(--c-groen-t); box-shadow: inset 0 0 0 2px var(--c-groen); }
.up-tipsub { position: absolute; bottom: 3px; left: 6px; font-size: .6rem; font-weight: 700; color: var(--c-groen-d); }
.up-mis { background: repeating-linear-gradient(45deg, #fff, #fff 4px, var(--c-paneel-2) 4px, var(--c-paneel-2) 8px); }
/* materiaal nog niet binnen én "voorraad hard" aan: deze dag kan niet */
.up-voorraaddicht { cursor: not-allowed;
  background: repeating-linear-gradient(-45deg, #fff, #fff 3px, var(--c-amber-t) 3px, var(--c-amber-t) 6px); }

.up-blok { display: block; width: calc(100% - 4px); margin: 2px; padding: 3px 7px; text-align: left;
  font-size: .68rem; font-weight: 700; background: var(--c-paneel); color: var(--c-ink);
  border: 0; border-left: 3px solid var(--c-lijn-2); border-radius: 4px; font-family: inherit; cursor: pointer; }
.up-blok small { display: block; font-size: .6rem; font-weight: 400; color: var(--c-ink-2); }
.up-blok.is-concept { background: var(--c-groen-t); border-left-color: var(--c-groen); color: var(--c-groen-d); }
.up-blok__notitie { color: var(--c-groen-d); }
.up-concept { display: block; margin: 2px; padding: 3px 7px; font-size: .68rem; font-weight: 700;
  background: var(--c-groen-t); border: 2px dashed var(--c-groen); border-radius: 4px;
  color: var(--c-groen-d); cursor: pointer; }
.up-concept small { display: block; font-size: .6rem; font-weight: 400; color: var(--c-ink-2); }
.up-vul { display: block; font-size: .58rem; color: var(--c-ink-3); padding: 0 7px 2px; }
/* UP6: de reistijd van een ploegdag staat onder de vulling, in dezelfde
   stille toon — informatie, geen alarm */
.up-route { display: block; font-size: .56rem; color: var(--c-ink-3); padding: 0 7px 3px; }
.up-weekkm { display: block; font-size: .58rem; color: var(--c-ink-3); margin-top: 2px; }
.up-ruimte { position: absolute; bottom: 3px; right: 7px; font-size: .58rem; font-weight: 800; color: var(--c-groen-d); }
.up-redenlabel input { border-color: var(--c-amber); }
.up-knipwarn { font-size: .68rem; font-weight: 700; color: var(--c-amber);
  border: 1px solid var(--c-amber); border-radius: 5px; padding: 1px 8px; }

@media (max-width: 1100px) {
  .up-ploegkop { width: 130px; }
}