:root { --blau: #1a4f8b; --rot: #c0392b; --grau: #f4f5f7; }
* { box-sizing: border-box; }
body { margin: 0; font-family: system-ui, 'Segoe UI', sans-serif; background: var(--grau); color: #222; }
.kopfleiste { display: flex; justify-content: space-between; align-items: center;
  background: var(--blau); color: #fff; padding: 0.6rem 1rem; }
.kopfleiste .marke { font-weight: 700; }
.kopfleiste a { color: #fff; margin-right: 1rem; text-decoration: none; }
.kopfleiste form.inline, form.inline { display: inline; }
main { padding: 1rem; max-width: 1500px; margin: 0 auto; }
h1 { font-size: 1.3rem; }
.karte { background: #fff; border-radius: 8px; padding: 1rem; margin-bottom: 1rem;
  box-shadow: 0 1px 3px rgba(0,0,0,0.08); }
.karte.schmal { max-width: 320px; }
label { display: block; margin-bottom: 0.7rem; }
input, select, button { font: inherit; padding: 0.45rem 0.6rem; border: 1px solid #ccc; border-radius: 6px; }
button { background: var(--blau); color: #fff; border: none; cursor: pointer; }
.fehler { color: var(--rot); font-weight: 600; }
.meldung { color: #1e7a34; font-weight: 600; }
.hinweis { color: #666; }
table { border-collapse: collapse; width: 100%; margin-bottom: 0.8rem; }
th, td { text-align: left; padding: 0.35rem 0.5rem; border-bottom: 1px solid #e5e5e5; }

/* Plantafel */
#tafel { background: #fff; border-radius: 8px; }
.vis-time-axis .vis-grid.vis-saturday,
.vis-time-axis .vis-grid.vis-sunday { background: #ececec; }
.vis-item { border-radius: 5px; font-size: 0.92rem; font-weight: 600; border-width: 0; color: #1f2937; }
.vis-item .vis-item-content { padding: 2px 7px; }
.vis-item.einsatz-sonder { background: rgba(95,102,114,0.18); border-left: 4px solid #5f6672; }
.vis-item.abwesenheit { color: #222; font-weight: 700;
  background: repeating-linear-gradient(45deg, #ddd, #ddd 7px, #f7f7f7 7px, #f7f7f7 14px); }
.vis-item.farbe-0 { background: rgba(26,79,139,0.18); border-left: 4px solid #1a4f8b; }
.vis-item.farbe-1 { background: rgba(192,57,43,0.18); border-left: 4px solid #c0392b; }
.vis-item.farbe-2 { background: rgba(30,122,52,0.18); border-left: 4px solid #1e7a34; }
.vis-item.farbe-3 { background: rgba(178,106,0,0.18); border-left: 4px solid #b26a00; }
.vis-item.farbe-4 { background: rgba(106,61,154,0.18); border-left: 4px solid #6a3d9a; }
.vis-item.farbe-5 { background: rgba(0,112,122,0.18); border-left: 4px solid #00707a; }
.vis-item.farbe-6 { background: rgba(136,78,160,0.18); border-left: 4px solid #884ea0; }
.vis-item.farbe-7 { background: rgba(93,64,55,0.18); border-left: 4px solid #5d4037; }
div.vis-tooltip { background: #1f2937; color: #fff; border: none; border-radius: 6px;
  padding: 6px 10px; font-family: inherit; font-size: 0.85rem;
  box-shadow: 0 4px 14px rgba(0,0,0,0.3); }

button.gefahr { background: var(--rot); }

@media (max-width: 700px) {
  main { padding: 0.5rem; }
  .kopfleiste { flex-wrap: wrap; }
}
input.klein { width: 5.5rem; }
.vis-label.gruppe-hilfsmittel { color: #555; font-style: italic; background: #f3f4f6; }
dialog { border: none; border-radius: 10px; padding: 0; max-width: 480px; width: 92%;
  box-shadow: 0 10px 40px rgba(0,0,0,0.25); }
dialog::backdrop { background: rgba(0,0,0,0.35); }
.dialog-inhalt { padding: 1rem 1.2rem; }
.dialog-inhalt .zeile { display: flex; gap: 0.8rem; align-items: center; margin-bottom: 0.7rem; }
.dialog-inhalt fieldset { border: 1px solid #ddd; border-radius: 6px; margin-bottom: 0.7rem; }
.kaestchen { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 0.2rem; }
.kaestchen label { margin: 0; font-size: 0.9rem; }
.vis-item.abwesenheit.abw-urlaub { color: #6b3f00;
  background: repeating-linear-gradient(45deg, #f6bd77, #f6bd77 7px, #fdf3e5 7px, #fdf3e5 14px); }
.vis-item.abwesenheit.abw-krank { color: #741c10;
  background: repeating-linear-gradient(45deg, #f0958a, #f0958a 7px, #fdeae7 7px, #fdeae7 14px); }
.vis-time-axis .vis-text.vis-major { font-weight: 700; font-size: 1.02rem; color: #1f2937; }
.vis-labelset .vis-label .vis-inner { font-weight: 700; }