/*
Teamplan, V0.1 - 2026
(c) 2026 copyright by Frank Schwarz
Alle Rechte vorbehalten, Frank Schwarz; fs@csskoeln.de
$Id: fsv-kalenderblatt.css 1 17.10.2026 @fs$
Aus der FSV (fsv/assets/css/kalenderblatt.css) unveraendert uebernommen (Entscheidung 17.10.2026: Oberflaeche strikt wie FSV).
Aenderungen nur in teamplan.css.
*/
/*
*****************************************************************************
FSV - Fahrschulverwaltung, V0.4 - 2026
(c) 2026 copyright by Frank Schwarz
Alle Rechte vorbehalten, Frank Schwarz; fs@csskoeln.de
*****************************************************************************
$Id: kalenderblatt.css 1 07.10.2026 @fs$
*****************************************************************************
Gemeinsamer Baustein "Kalenderblatt" (kern/fsv/includes/funk-kalenderblatt.php, kern/fsv/html/kalenderblatt.html): Monatsblatt für Kalender und später
Dienstplan. Nach Vorgabe:
  - Blatt als CSS-Grid: Spalte der Kalenderwoche (gedreht) und sieben Tage, der SONNTAG halb so breit (Einträge dort brechen um). Spalten
    minmax(0, ...) - kein waagrechter Scrollbalken, auch nicht auf dem iPad hochkant.
  - Alle Tage eines Blatts gleich groß: gleich breite Spalten (nur der Sonntag halb so breit) und gleich hohe Wochen (grid-auto-rows: 1fr).
    Keine eigenen Größen je Seite.
  - Tag = Kästchen mit Tageskopf (Zahl, Marke) und Liste; heute blau umrandet, Samstag und Sonntag leicht getönt, Nachbarmonat blass,
    Feiertag gestrichelt. Farbige Linie unter dem Tageskopf: kb-status-gut (grün), -luecke (rot), -zu (grau).
  - Sonntage und Feiertage in roter Schrift (Wochentag und Tageszahl).
  - Einträge als kleine Chips; für Termine tragen sie die Farbe der Art (k-art-* aus kalender.css, dort nur als Variablen).
Lesbarkeit: dunkle Schrift auf hellem Grund.
*/

:root { --sonntag: #C62828; }

.kb-blatt { display: grid; grid-template-columns: 2.4rem repeat(6, minmax(0, 1fr)) minmax(0, .5fr); grid-template-rows: auto; grid-auto-rows: 1fr; gap: 6px; }
.kb-wt { padding: 0 0 2px; text-align: center; font-size: 14px; font-weight: 700; color: var(--text); }
.kb-wt abbr { text-decoration: none; cursor: default; }
.kb-kw { display: flex; flex-direction: column; align-items: center; gap: 8px; padding-top: 6px; border-right: 1px solid var(--linie); color: var(--text); font-size: 12px; font-variant-numeric: tabular-nums; }
.kb-kw > span { writing-mode: vertical-rl; transform: rotate(180deg); white-space: nowrap; }
.kb-tag { display: flex; flex-direction: column; min-width: 0; min-height: 112px; padding: 6px; background: var(--flaeche); border: 1px solid var(--linie); border-radius: 10px; font-size: 12px; color: var(--text); overflow-wrap: break-word; }
.kb-tag.kb-sa { background: #FBFBFD; }
.kb-tag.kb-so { background: var(--hintergrund); }
.kb-tag.kb-fremd { background: #F1F2F5; opacity: .8; }
.kb-tag.kb-feiertag { border-style: dashed; border-color: #8A90A2; }
.kb-tag.kb-heute { border: 2px solid var(--haupt); padding: 5px; }
.kb-tag-kopf { display: flex; flex-wrap: wrap; align-items: center; gap: 3px 5px; padding-bottom: 4px; margin-bottom: 5px; border-bottom: 3px solid transparent; }
.kb-status-gut .kb-tag-kopf { border-bottom-color: var(--erfolg); }
.kb-status-luecke .kb-tag-kopf { border-bottom-color: var(--fehler); }
.kb-status-zu .kb-tag-kopf { border-bottom-color: #B8BCC6; }
.kb-nr { margin-right: auto; font-family: var(--schrift-titel); font-size: 14px; line-height: 20px; font-weight: 700; color: var(--text); text-decoration: none; }
a.kb-nr:hover, a.kb-nr:focus-visible { color: var(--haupt); text-decoration: underline; }
.kb-heute .kb-nr { color: var(--haupt); }
/* Der ganze Tag ist anklickbar, nicht nur die Zahl: die Fläche des Links reicht über die Zelle (Termine und Pillen liegen darüber und bleiben eigene Ziele). */
.kb-tag { position: relative; }
a.kb-nr::after { content: ''; position: absolute; inset: 0; border-radius: 10px; }
.kb-tag-kopf > *:not(.kb-nr), .kb-liste { position: relative; z-index: 1; }
.kb-liste { pointer-events: none; }
.kb-liste > * { pointer-events: auto; }
.kb-tag:has(a.kb-nr):hover { border-color: var(--haupt); }
.kb-heute-wort { padding: 1px 6px; border-radius: 999px; background: var(--haupt); color: #FFFFFF; font-size: 12px; font-weight: 700; }
.kb-feiertag-marke { display: inline-flex; align-items: center; gap: 4px; max-width: 100%; min-width: 0; padding: 1px 6px; border: 1px solid var(--linie); border-radius: 999px; background: #F1F2F5; color: var(--text); font-size: 12px; font-weight: 600; }
.kb-feiertag-marke > span { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.kb-liste { flex: 1; display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.kb-chip { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-start; gap: 0 3px; min-width: 0; padding: 2px 5px; border: 1px solid var(--linie); border-left: 3px solid var(--k-rand, var(--linie-stark)); border-radius: 5px; background: var(--k-flaeche, var(--flaeche)); color: var(--text); font-size: 12px; font-weight: 600; line-height: 1.3; text-decoration: none; }
a.kb-chip:hover, a.kb-chip:focus-visible { border-color: var(--haupt); box-shadow: 0 1px 4px rgba(0, 14, 112, .18); }
.kb-chip-zeit { font-weight: 700; font-variant-numeric: tabular-nums; }
.kb-chip .k-marke { font-size: 11px; margin-left: 2px; }
.kb-chip.kb-s-abgesagt, .kb-chip.kb-s-nicht_erschienen { opacity: .65; text-decoration: line-through; }
.kb-chip.kb-s-abgesagt { border-style: dashed; background: var(--flaeche); }
.kb-chip.kb-s-offen { box-shadow: inset 0 0 0 2px #E0A800; }
.kb-mehr { align-self: flex-start; padding: 1px 2px; font-size: 12px; font-weight: 700; color: var(--haupt); text-decoration: none; }
.kb-mehr:hover { text-decoration: underline; }
.kb-anzahl { min-width: 1.5em; padding: 0 5px; border-radius: 999px; background: var(--haupt-hell); color: var(--haupt); font-size: 12px; font-weight: 700; text-align: center; }
.kb-verborgen { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.kb-aus { display: none; }
.kb-wt.kb-so, .kb-tag.kb-so .kb-nr, .kb-tag.kb-feiertag .kb-nr { color: var(--sonntag); }

@media (max-width: 1000px) {
    .kb-blatt { grid-template-columns: 1.6rem repeat(6, minmax(0, 1fr)) minmax(0, .5fr); gap: 4px; }
    .kb-tag { padding: 4px; min-height: 96px; }
    .kb-tag.kb-heute { padding: 3px; }
    .kb-tag.kb-so .kb-nr { font-size: 11px; }
    .kb-tag.kb-so { padding: 4px 3px; }
}
