/* Modul zehnerstart — Startseiten-Boxen und Bereichsseiten.
 * Farben bewusst als halbtransparente Töne, damit helles und dunkles Doli-Theme passen. */

/* Kopf-Banner in einer Box */
.zs-bannercell { padding: 6px 8px !important; }
.zs-banner { border-left: 4px solid #5bc0de; background: rgba(91, 192, 222, .12); border-radius: 4px; padding: 7px 10px; line-height: 1.5; }
.zs-banner-warn { border-left-color: #f0ad4e; background: rgba(240, 173, 78, .14); }
.zs-banner-bad { border-left-color: #d9534f; background: rgba(217, 83, 79, .12); }

/* Abwesenheiten: Art-Etikett */
.zs-kind { display: inline-block; padding: 0 6px; border-radius: 3px; font-size: .9em; line-height: 1.6; color: #fff; }
.zs-kind.zs-k-leave { background: #3c9a5f; }
.zs-kind.zs-k-sick  { background: #c0504d; }
.zs-kind.zs-k-block { background: #8a8f98; }
.zs-kind.zs-k-other { background: #5b7fb5; }
.zs-kind.zs-pend { background: transparent !important; border: 1px dashed currentColor; color: inherit; }

/* Abwesenheiten: Mini-Zeitleiste, ein Kästchen je Tag */
.zs-tl { display: inline-flex; gap: 1px; vertical-align: middle; }
.zs-tl .zs-d { width: 8px; height: 14px; border-radius: 2px; background: rgba(128, 128, 128, .15); position: relative; }
.zs-tl .zs-d.zs-we { background: rgba(128, 128, 128, .30); }
.zs-tl .zs-d.zs-mon { margin-left: 3px; }
.zs-tl .zs-d.zs-on.zs-k-leave { background: #3c9a5f; }
.zs-tl .zs-d.zs-on.zs-k-sick  { background: #c0504d; }
.zs-tl .zs-d.zs-on.zs-k-block { background: #8a8f98; }
.zs-tl .zs-d.zs-on.zs-k-other { background: #5b7fb5; }
.zs-tl .zs-d.zs-on.zs-pend { background-image: repeating-linear-gradient(45deg, rgba(255,255,255,.55) 0 2px, transparent 2px 4px); }
.zs-tl.zs-scale .zs-d { background: transparent; height: 12px; }
.zs-tl.zs-scale .zs-d i { position: absolute; left: 0; bottom: 0; font-style: normal; font-size: 9px; line-height: 1; opacity: .6; white-space: nowrap; }
tr.zs-scalerow td { padding-top: 2px !important; padding-bottom: 0 !important; border-bottom: 0 !important; }

/* Gäste-Geburtstage: heute hervorheben */
tr.zs-today td { background: rgba(240, 173, 78, .16); }

/* Personal-Neuigkeiten */
td.zs-icon { width: 22px; padding-right: 0 !important; }
.zs-ico { font-size: 1.05em; }
tr.zs-action td:first-child { box-shadow: inset 3px 0 0 #f0ad4e; }
a.zs-newslink { color: inherit; }
a.zs-newslink:hover { text-decoration: underline; }
td.zs-newstext { line-height: 1.35; }

/* Bereichsseiten: Umschalter Startseite / Personal / Finanzen */
.zs-areanavrow { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin: -6px 0 12px; }
.zs-areanav { display: inline-flex; gap: 4px; }
.zs-areatab { padding: 4px 10px; border-radius: 14px; border: 1px solid rgba(128, 128, 128, .35); text-decoration: none !important; }
.zs-areatab.zs-active { background: rgba(128, 128, 128, .18); font-weight: bold; }