/* ============ Tagesansicht mit einer Spalte je Mitarbeiter (js/47-tagesspalten.js) ============
   Links die Stunden, je Person eine Spalte, die Termine als Blöcke in der Farbe der Person.
   Ab vier Personen rollt das Raster zur Seite (jede Spalte mindestens 92 px), die Stunden bleiben stehen.
   Nur Farben aus dem Design (`var(--…)`), Hover nur am Rechner. */
.tb-label.ts-label{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;}
.ts-schalter{display:inline-flex;gap:4px;padding:2px;border-radius:var(--r-feld,10px);border:1px solid var(--line);background:var(--surface);}
.ts-art{display:inline-flex;align-items:center;gap:5px;min-height:28px;padding:0 10px;border:0;border-radius:var(--r-klein,6px);
  background:transparent;color:var(--ink-soft);font:inherit;font-size:12px;font-weight:600;cursor:pointer;}
.ts-art-z{display:inline-flex;}
.ts-art-z svg{width:14px;height:14px;}
.ts-art.on{background:var(--ink);color:var(--ground);}
@media (hover:hover) and (pointer:fine){ .ts-art:not(.on):hover{background:var(--accent-soft);color:var(--accent-deep);} }

.ts{--ts-gutter:34px;--ts-spalte:92px;margin-top:8px;}
.ts-rahmen{overflow-x:auto;overscroll-behavior-x:contain;border:1px solid var(--line);border-radius:var(--r-karte,14px);background:var(--surface);}
.ts-innen{min-width:calc(var(--ts-gutter) + var(--ts-n) * var(--ts-spalte));}
.ts-reihe{display:grid;grid-template-columns:var(--ts-gutter) repeat(var(--ts-n), minmax(var(--ts-spalte), 1fr));}
.ts-kopfreihe{border-bottom:1px solid var(--line);}
.ts-ecke{position:sticky;left:0;z-index:3;background:var(--surface);}
.ts-person{display:grid;justify-items:center;gap:1px;padding:8px 4px 7px;min-width:0;text-align:center;border-left:1px solid var(--line);
  border-top:3px solid var(--line);border-top-color:var(--pc, var(--accent));}
.ts-person .pe-punkt{margin-bottom:3px;}
.ts-person b{max-width:100%;font-size:12.5px;font-weight:650;color:var(--ink);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.ts-person span{max-width:100%;font-size:11px;color:var(--ink-soft);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.ts-person.zu span{color:var(--ink);font-weight:600;}
.ts-koerper{position:relative;}
.ts-stunden{position:sticky;left:0;z-index:2;background:var(--surface);}
.ts-stunden span{position:absolute;left:0;right:0;padding-right:5px;transform:translateY(-6px);text-align:right;font-size:10.5px;font-weight:600;
  color:var(--ink-soft);font-variant-numeric:tabular-nums;}
.ts-stunden span:first-child{transform:none;}
.ts-spalte{position:relative;min-width:0;border-left:1px solid var(--line);
  background-image:repeating-linear-gradient(to bottom, transparent 0, transparent 47px, var(--line) 47px, var(--line) 48px);}
.ts-spalte.tippbar{cursor:cell;}
.ts-aus{position:absolute;left:0;right:0;pointer-events:none;background:var(--accent-soft);opacity:.55;}
.ts-spalte.zu .ts-aus{opacity:.8;}

.ts-termin,.ts-fenster{position:absolute;display:flex;flex-direction:column;gap:1px;box-sizing:border-box;margin:0;padding:3px 6px 3px 8px;overflow:hidden;
  text-align:left;font:inherit;color:var(--ink);border-radius:var(--r-klein,6px);border:1px solid var(--line);cursor:pointer;
  -webkit-tap-highlight-color:transparent;touch-action:manipulation;}
.ts-termin{background:var(--surface);background:color-mix(in srgb, var(--pc, var(--accent)) 17%, var(--surface));
  border-color:var(--line);border-color:color-mix(in srgb, var(--pc, var(--accent)) 50%, var(--line));
  box-shadow:inset 3px 0 0 var(--pc, var(--accent));}
.ts-termin.is-open{border-color:var(--wait);}
.ts-termin.is-done{border-color:var(--ok);}
.ts-termin:active,.ts-fenster:active{transform:scale(.985);}
.ts-t-zeit{font-size:11px;font-weight:700;line-height:1.2;font-variant-numeric:tabular-nums;}
.ts-t-name{font-size:12px;font-weight:600;line-height:1.25;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.ts-t-leistung{font-size:11px;line-height:1.25;color:var(--ink-soft);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.ts-t-marke{position:absolute;top:4px;right:4px;width:7px;height:7px;border-radius:50%;background:var(--ok);}
.ts-t-marke.offen{background:var(--wait);}
.ts-fenster{left:2px;right:2px;background:var(--ok-soft);border-color:var(--ok);}
.ts-fenster:disabled{opacity:.5;cursor:default;}
@media (hover:hover) and (pointer:fine){
  .ts-termin:hover{border-color:var(--pc, var(--accent));}
}

.ts-jetzt{position:absolute;left:var(--ts-gutter);right:0;height:0;border-top:2px solid var(--danger);pointer-events:none;z-index:1;}
.ts-jetzt i{position:absolute;left:-4px;top:-5px;width:8px;height:8px;border-radius:50%;background:var(--danger);}
.ts-fuss{margin:8px 2px 0;font-size:12px;color:var(--ink-soft);}
