/* ═══════════════════════════════════════════════════════════════════════════
   calendar.css — SEMPERconnect Kalender-Modul

   Zum Anhängen an core/shell.css.

   Stilprinzipien:
   - Nutzt bestehende CSS-Variablen: --surface, --surface-2, --border,
     --text, --muted, --primary, --primary-contrast, --danger, --success
   - Nutzt bestehende .btn, .form-control Klassen
   - Dark-Theme via body.dark-theme UND body.theme-dark (beide Varianten
     werden im Projekt verwendet)
   - --cal-ev-color Custom-Property wird pro Event in JS gesetzt
   ═══════════════════════════════════════════════════════════════════════════ */

/* ──────────────────────────────────────────────────────────────────────────
   0. LOKALE VARIABLEN
   Sprint C: Farb-Tokens (--cal-surface, --cal-text, --cal-primary,
   --cal-border-color, --cal-today-bg, ...) kommen aus modules/_tokens.css
   und folgen automatisch dem Theme. Hier nur noch Calendar-spezifische
   Geometrie + Effekte.
   ────────────────────────────────────────────────────────────────────────── */
:root{
  --cal-ev-shadow: 0 1px 3px rgba(0,0,0,.06), 0 1px 1px rgba(0,0,0,.04);
}
/* Theme-spezifische Anpassungen, die nur den Calendar betreffen */
[data-theme="dark"],
body.dark-theme,
body.theme-dark{
  --cal-today-bg:  rgba(27, 117, 153, 0.14);
  --cal-ev-shadow: 0 1px 2px rgba(0,0,0,.35), 0 1px 1px rgba(0,0,0,.25);
}
[data-theme="pink"]{
  --cal-today-bg:  rgba(217, 70, 130, 0.08);
}
[data-theme="gray"]{
  --cal-today-bg:  rgba(107, 114, 128, 0.10);
}

.cal-root{
  --cal-hour-height:    56px;
  --cal-day-min-width:  120px;
  --cal-tech-min-width: 180px;
  color: var(--cal-text);
  display:flex;flex-direction:column;flex:1 1 0%;min-height:0;
  width:100%;background:var(--cal-surface);overflow:hidden;
}

/* ──────────────────────────────────────────────────────────────────────────
   1. ROOT + TOPBAR
   ────────────────────────────────────────────────────────────────────────── */
.cal-topbar{
  display:flex; align-items:center; gap:12px;
  padding:10px 14px;
  border-bottom:1px solid var(--cal-border-color);
  background: var(--cal-surface);
  flex-wrap:wrap;
}
.cal-topbar-nav{ display:flex; align-items:center; gap:6px; }
.cal-topbar-views{
  display:flex; gap:2px;
  background: var(--cal-surface-2);
  padding:2px;
  border-radius:8px;
}
.cal-topbar-actions{
  display:flex; align-items:center; gap:8px;
  margin-left:auto;
}
.cal-title{
  font-weight:600; font-size:1.05rem;
  margin: 0 10px;
  color: var(--cal-text);
  min-width:180px;
}
.cal-view-btn{
  border:none; background:transparent;
  padding:6px 12px;
  font-size:0.875rem;
  color:var(--cal-muted);
  border-radius:6px;
  cursor:pointer;
  transition: background .15s, color .15s;
}
.cal-view-btn:hover{ background: var(--cal-surface); color: var(--cal-text); }
.cal-view-btn.cal-view-btn-active,
.cal-view-btn[aria-pressed="true"]{
  background: var(--cal-surface);
  color: var(--cal-primary);
  box-shadow: 0 1px 2px rgba(0,0,0,.06);
}
.cal-view-switcher{ display:flex; }

.cal-body{ flex:1; overflow:auto; min-height:0; position:relative; }

/* ──────────────────────────────────────────────────────────────────────────
   2. WEEK / DAY VIEW (Google-Calendar-artig)
   ────────────────────────────────────────────────────────────────────────── */
.cal-week, .cal-day{
  display:flex; flex-direction:column;
}
/* Desktop/Tablet: 720px Mindestbreite verhindert zu enge Spalten.
   Auf Mobile (≤768px) wird stattdessen eine Agenda-Ansicht
   eingeblendet (siehe Mobile-Sektion + JS-Auto-Switch). */
@media (min-width: 769px){
  .cal-week, .cal-day{ min-width:720px; }
}
.cal-week-hdr{
  display:grid;
  grid-template-columns: 60px repeat(7, minmax(var(--cal-day-min-width), 1fr));
  border-bottom:1px solid var(--cal-border-color);
  position:sticky; top:0;
  background: var(--cal-surface);
  z-index:5;
}
.cal-week-corner{
  border-right:1px solid var(--cal-border-color);
}
.cal-week-dcol{
  padding:8px 10px;
  text-align:center;
  border-right:1px solid var(--cal-border-color);
  border-right-color: var(--cal-border-color);
  font-size:0.875rem;
  color: var(--cal-muted);
}
.cal-week-dcol.cal-today{
  background: var(--cal-today-bg);
  color: var(--cal-primary);
  font-weight:600;
}
.cal-dow-short{ font-size:0.7rem; letter-spacing:.02em; text-transform:uppercase; }
.cal-dow-num{ font-size:1.25rem; font-weight:600; margin-top:2px; color: var(--cal-text); }
.cal-week-dcol.cal-today .cal-dow-num{ color: var(--cal-primary); }

.cal-week-grid, .cal-day-grid{
  display:grid;
  grid-template-columns: 60px repeat(7, minmax(var(--cal-day-min-width), 1fr));
  position:relative;
}
.cal-day-grid{ grid-template-columns: 60px 1fr; }

.cal-hour-col{
  display:flex; flex-direction:column;
  border-right:1px solid var(--cal-border-color);
  background: var(--cal-surface);
}
.cal-hour-cell{
  height: var(--cal-hour-height);
  border-bottom:1px solid var(--cal-border-color);
  position:relative;
}
.cal-hour-lbl{
  position:absolute; top:-8px; right:6px;
  font-size:0.7rem;
  color: var(--cal-muted);
  background: var(--cal-surface);
  padding: 0 3px;
}
.cal-hour-cell:first-child .cal-hour-lbl{ top: 2px; }

.cal-day-col, .cal-day-col-single{
  position:relative;
  border-right:1px solid var(--cal-border-color);
  min-height: calc(var(--cal-hour-height) * 14);
  background: var(--cal-surface);
}
.cal-day-col.cal-today,
.cal-day-col-single.cal-today{
  background: var(--cal-today-bg);
}

.cal-hour-slot{
  height: var(--cal-hour-height);
  border-bottom:1px solid var(--cal-border-color);
  cursor: pointer;
  transition: background .12s;
}
.cal-hour-slot:hover{
  background: rgba(27, 117, 153, 0.04);
}
body.dark-theme .cal-hour-slot:hover,
body.theme-dark .cal-hour-slot:hover{
  background: rgba(27, 117, 153, 0.12);
}

/* All-day Strip für Day-View */
.cal-allday-strip{
  min-height: 28px;
  padding: 4px 8px;
  border-bottom:1px solid var(--cal-border-color);
  background: var(--cal-surface-2);
  display:flex; flex-wrap:wrap; gap:4px;
}
.cal-allday-ev{
  display:inline-flex; align-items:center;
  padding:3px 8px;
  border-radius:4px;
  font-size:0.8rem;
  cursor:pointer;
  background: var(--cal-ev-color, var(--cal-primary));
  color:#fff;
  border-left: 3px solid rgba(0,0,0,.2);
  max-width: 280px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}

/* ──────────────────────────────────────────────────────────────────────────
   3. EVENT-CARDS (positioniert per inline style mit top/height %)
   ────────────────────────────────────────────────────────────────────────── */
.cal-event{
  position:absolute;
  left:3px; right:3px;
  background: var(--cal-ev-color, var(--cal-primary));
  color:#fff;
  border-radius:8px;
  padding:6px 10px 7px;
  font-size:0.8rem;
  box-shadow: 0 2px 6px rgba(0,0,0,.15), inset 0 1px 0 rgba(255,255,255,.15);
  cursor:pointer;
  overflow:hidden;
  border-left: 4px solid rgba(0,0,0,.2);
  z-index:2;
  transition: transform .1s, box-shadow .15s;
}
.cal-event:hover{
  transform: translateY(-1px) scale(1.01);
  z-index:3;
  box-shadow: 0 4px 14px rgba(0,0,0,.18), 0 1px 3px rgba(0,0,0,.1), inset 0 1px 0 rgba(255,255,255,.2);
}
.cal-event.cal-ev-active{
  box-shadow: 0 0 0 2px #fff, 0 0 0 5px var(--cal-ev-color, var(--cal-primary)), 0 4px 16px rgba(0,0,0,.2);
  z-index: 4;
  animation: cal-ev-active-glow 2s ease-in-out infinite;
}
@keyframes cal-ev-active-glow{
  0%,100%{box-shadow: 0 0 0 2px #fff, 0 0 0 5px var(--cal-ev-color), 0 4px 16px rgba(0,0,0,.2);}
  50%{box-shadow: 0 0 0 2px #fff, 0 0 0 7px var(--cal-ev-color), 0 4px 20px rgba(0,0,0,.3);}
}
.cal-event.cal-ev-done{
  opacity: 0.65;
  background: var(--cal-ev-color, var(--cal-primary));
  filter:saturate(.7);
}
.cal-event.cal-ev-done .cal-ev-title{
  text-decoration: line-through;
  text-decoration-color: rgba(255,255,255,.5);
}
.cal-event.cal-ev-cancelled{
  opacity: 0.4;
  background: var(--cal-muted) !important;
  text-decoration: line-through;
  filter:grayscale(.8);
}
.cal-event.cal-ev-collision{
  box-shadow: 0 0 0 2px var(--cal-collision), var(--cal-ev-shadow);
}
.cal-ev-time{
  font-size:0.72rem; opacity:.95;
  font-weight:600;
  letter-spacing:.02em;
}
.cal-ev-title{
  font-weight:700;
  font-size:0.82rem;
  line-height:1.3;
  overflow:hidden; text-overflow:ellipsis;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
  text-shadow:0 1px 2px rgba(0,0,0,.1);
}
.cal-ev-meta{
  font-size:0.7rem; opacity:.85;
  margin-top:2px;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.cal-ev-loc{
  font-size:0.7rem; opacity:.85;
  margin-top:2px;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.cal-ev-loc i{margin-right:3px;font-size:0.6rem;}

/* Fahrzeit-Puffer VOR dem Termin */
.cal-event-buffer{
  position:absolute;
  left:3px; right:3px;
  background: repeating-linear-gradient(
    -45deg,
    rgba(27,117,153,0.12),
    rgba(27,117,153,0.12) 4px,
    rgba(27,117,153,0.04) 4px,
    rgba(27,117,153,0.04) 8px
  );
  border-radius: 6px 6px 0 0;
  border:1px solid rgba(27,117,153,0.1);
  border-bottom:none;
  pointer-events:none;
  z-index:1;
}
.cal-event-buffer::after{
  content:'🚗';position:absolute;top:2px;right:4px;
  font-size:9px;opacity:.4;
}
/* Puffer NACH dem Termin (Nachbereitung) */
.cal-event-buffer-after{
  position:absolute;
  left:3px; right:3px;
  background: repeating-linear-gradient(
    45deg,
    rgba(245,158,11,0.10),
    rgba(245,158,11,0.10) 4px,
    rgba(245,158,11,0.03) 4px,
    rgba(245,158,11,0.03) 8px
  );
  border-radius: 0 0 6px 6px;
  border:1px solid rgba(245,158,11,0.1);
  border-top:none;
  pointer-events:none;
  z-index:1;
}
.cal-event-buffer-after::after{
  content:'📋';position:absolute;bottom:2px;right:4px;
  font-size:9px;opacity:.4;
}
body.dark-theme .cal-event-buffer,
body.theme-dark .cal-event-buffer{
  background: repeating-linear-gradient(
    -45deg,
    rgba(255,255,255,0.08),
    rgba(255,255,255,0.08) 5px,
    rgba(255,255,255,0.03) 5px,
    rgba(255,255,255,0.03) 10px
  );
}

.cal-coll-icon{
  position:absolute; top:2px; right:3px;
  color: var(--cal-collision);
  background: #fff;
  border-radius:50%;
  font-size:0.72rem;
  width:14px; height:14px;
  display:flex; align-items:center; justify-content:center;
}

/* ──────────────────────────────────────────────────────────────────────────
   4. MONTH VIEW
   ────────────────────────────────────────────────────────────────────────── */
.cal-month{
  display:flex; flex-direction:column;
  height:100%;
}
.cal-month-hdr{
  display:grid;
  grid-template-columns: repeat(7, 1fr);
  border-bottom:1px solid var(--cal-border-color);
}
.cal-month-dow{
  padding:8px 4px;
  text-align:center;
  font-size:0.7rem;
  font-weight:600;
  text-transform:uppercase;
  letter-spacing:.04em;
  color: var(--cal-muted);
  border-right:1px solid var(--cal-border-color);
}
.cal-month-dow:last-child{ border-right:none; }

.cal-month-grid{
  display:grid;
  grid-template-columns: repeat(7, 1fr);
  flex:1;
  min-height: 500px;
}
.cal-month-cell{
  border-right:1px solid var(--cal-border-color);
  border-bottom:1px solid var(--cal-border-color);
  padding:4px;
  min-height: 90px;
  background: var(--cal-surface);
  display:flex; flex-direction:column; gap:2px;
  cursor:pointer;
  transition: background .12s;
  position: relative;
}
.cal-month-cell:hover{ background: var(--cal-surface-2); }
.cal-month-cell.cal-today{
  background: var(--cal-today-bg);
}
.cal-month-cell.cal-other-month{
  background: var(--cal-surface-2);
  opacity: 0.55;
}
.cal-month-num{
  font-size:0.85rem;
  font-weight:500;
  color: var(--cal-text);
  padding:2px 4px;
  align-self:flex-start;
}
.cal-month-cell.cal-today .cal-month-num{
  background: var(--cal-primary);
  color: var(--cal-primary-contrast, #fff);
  border-radius:50%;
  width: 22px; height: 22px;
  display:flex; align-items:center; justify-content:center;
  padding:0;
}
.cal-month-ev{
  background: var(--cal-ev-color, var(--cal-primary));
  color:#fff;
  border-radius:3px;
  padding:2px 5px;
  font-size:0.72rem;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
  cursor:pointer;
  border-left: 2px solid rgba(0,0,0,.2);
}
.cal-month-ev-t{ opacity:.85; font-weight:500; margin-right:3px; }
.cal-month-more{
  font-size:0.7rem;
  color: var(--cal-muted);
  padding:1px 4px;
  cursor:pointer;
}
.cal-month-more:hover{ color: var(--cal-primary); }

/* ──────────────────────────────────────────────────────────────────────────
   5. AGENDA VIEW
   ────────────────────────────────────────────────────────────────────────── */
.cal-agenda{
  padding: 12px;
  max-width: 900px;
  margin: 0 auto;
}
.cal-agenda-day{
  margin-bottom: 16px;
}
.cal-agenda-day > h4{
  font-size: 0.9rem;
  font-weight: 600;
  color: var(--cal-muted);
  margin: 0 0 8px 0;
  padding: 4px 6px;
  border-bottom:1px solid var(--cal-border-color);
}
.cal-agenda-row{
  display:grid;
  grid-template-columns: 90px 4px 1fr;
  gap: 10px;
  padding: 8px 6px;
  margin-bottom: 4px;
  border-radius: 6px;
  cursor:pointer;
  transition: background .12s;
}
.cal-agenda-row:hover{ background: var(--cal-surface-2); }
.cal-agenda-time{
  font-size:0.8rem;
  color: var(--cal-muted);
  font-variant-numeric: tabular-nums;
  padding-top:1px;
}
.cal-agenda-bar{
  background: var(--cal-ev-color, var(--cal-primary));
  border-radius: 2px;
}
.cal-agenda-content{ min-width:0; }
.cal-agenda-title{
  font-weight:600;
  color: var(--cal-text);
  font-size:0.9rem;
}
.cal-agenda-svc{
  font-size:0.78rem;
  color: var(--cal-muted);
  margin-top:1px;
}
.cal-agenda-loc{
  font-size:0.78rem;
  color: var(--cal-muted);
  margin-top:1px;
}

/* ──────────────────────────────────────────────────────────────────────────
   6. DETAIL MODAL
   ────────────────────────────────────────────────────────────────────────── */
.cal-detail-overlay,
.cal-editor-overlay,
.cal-picker-overlay{
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.42);
  display:flex; align-items:center; justify-content:center;
  z-index: 9500;
  animation: cal-fade-in .12s ease-out;
  padding: 16px;
}
@keyframes cal-fade-in{
  from{ opacity: 0; }
  to{   opacity: 1; }
}

.cal-detail-modal{
  background: var(--cal-surface);
  border-radius: 12px;
  width: 100%; max-width: 560px;
  max-height: 90vh;
  display:flex; flex-direction:column;
  box-shadow: 0 20px 50px rgba(0,0,0,.25);
  overflow:hidden;
  border-top: 4px solid var(--cal-ev-color, var(--cal-primary));
  animation: cal-slide-up .18s ease-out;
}
@keyframes cal-slide-up{
  from{ transform: translateY(10px); opacity: 0.6; }
  to{   transform: translateY(0);    opacity: 1; }
}

.cal-detail-hdr{
  display:flex; align-items:center; gap:12px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--cal-border-color);
}
.cal-detail-title{
  flex: 1;
  font-size:1.1rem; font-weight:600;
  color: var(--cal-text);
  overflow:hidden; text-overflow:ellipsis;
}
.cal-detail-close{
  border:none; background:transparent;
  width:32px; height:32px;
  border-radius:6px;
  color: var(--cal-muted);
  cursor:pointer;
  display:flex; align-items:center; justify-content:center;
  transition: background .12s, color .12s;
}
.cal-detail-close:hover{
  background: var(--cal-surface-2);
  color: var(--cal-text);
}

.cal-detail-body{
  padding: 14px 16px;
  overflow-y:auto;
  flex:1;
}
.cal-detail-row{
  display:flex; align-items:center; gap: 8px;
  padding: 6px 0;
  font-size: 0.9rem;
  color: var(--cal-text);
}
.cal-detail-row > i{
  width:16px; text-align:center;
  color: var(--cal-muted);
  flex-shrink: 0;
}
.cal-detail-desc{
  padding: 8px 10px;
  margin-top: 8px;
  background: var(--cal-surface-2);
  border-radius:6px;
  font-size: 0.88rem;
  line-height: 1.45;
  white-space: pre-wrap;
  color: var(--cal-text);
}
.cal-detail-buffer{
  margin-top: 8px;
  padding: 6px 10px;
  background: var(--cal-surface-2);
  border-left: 3px solid var(--cal-muted);
  border-radius: 4px;
  font-size: 0.8rem;
  color: var(--cal-muted);
}
.cal-detail-buffer > i{ margin-right:6px; }

/* Audit-Trail: erstellt-von / bearbeitet-von im Detail-Modal */
.cal-detail-audit{
  margin-top: 12px;
  padding: 8px 10px;
  background: var(--cal-surface-2);
  border-radius: 6px;
  font-size: 0.74rem;
  color: var(--cal-muted);
  border-left: 3px solid var(--cal-border-color);
  display: flex;
  flex-direction: column;
  gap: 4px;
}
.cal-detail-audit-row{
  display: flex; align-items: center; gap: 6px;
  line-height: 1.5;
}
.cal-detail-audit-row > i{
  font-size: 0.72rem;
  color: var(--cal-primary);
  width: 14px;
  text-align: center;
  flex-shrink: 0;
}
.cal-detail-audit-row strong{
  color: var(--cal-text);
  font-weight: 600;
}

.cal-detail-footer{
  display:flex; gap:8px;
  padding: 12px 16px;
  border-top: 1px solid var(--cal-border-color);
  background: var(--cal-surface-2);
  flex-wrap:wrap;
}

.cal-maps-link{
  display:inline-flex; align-items:center; gap:4px;
  margin-left: 6px;
  padding: 2px 8px;
  background: var(--cal-primary);
  color: var(--cal-primary-contrast, #fff) !important;
  text-decoration: none;
  border-radius: 4px;
  font-size: 0.78rem;
}
.cal-maps-link:hover{ opacity: 0.88; }

.cal-work-running{
  display:inline-flex; align-items:center; gap:6px;
  padding: 4px 10px;
  background: rgba(224, 83, 83, 0.1);
  color: var(--cal-collision);
  border-radius: 4px;
  font-size: 0.82rem;
  font-weight: 500;
}
.cal-work-done{
  display:inline-flex; align-items:center; gap:6px;
  padding: 4px 10px;
  background: rgba(76, 175, 80, 0.1);
  color: var(--success, #4caf50);
  border-radius: 4px;
  font-size: 0.82rem;
}

/* ──────────────────────────────────────────────────────────────────────────
   7. EDITOR MODAL + PICKER
   ────────────────────────────────────────────────────────────────────────── */
.cal-editor-modal{
  background: var(--cal-surface);
  border-radius: 16px;
  width: 100%; max-width: 900px;
  max-height: 92vh;
  display:flex; flex-direction:column;
  border-top:4px solid var(--cal-primary);
  box-shadow: 0 20px 50px rgba(0,0,0,.25);
  overflow:hidden;
  animation: cal-slide-up .18s ease-out;
}
.cal-editor-hdr{
  display:flex; align-items:center; gap: 12px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--cal-border-color);
}
.cal-editor-title{
  flex:1;
  font-size: 1.1rem;
  font-weight: 600;
  color: var(--cal-text);
}
.cal-editor-body{
  padding: 14px 16px;
  overflow-y: auto;
  flex: 1;
}
.cal-editor-footer{
  display:flex; align-items:center; gap:8px;
  justify-content: space-between;
  padding: 12px 16px;
  border-top: 1px solid var(--cal-border-color);
  background: var(--cal-surface-2);
}
.cal-editor-footer-right{
  display:flex; gap:8px;
  margin-left: auto;
}

.cal-form-row{
  display:flex; gap: 10px;
  align-items: flex-end;
}
.cal-form-row > .form-group{
  flex: 1;
  margin-bottom: 12px;
}
.cal-form-row-tight{
  gap: 6px;
  align-items: center;
}
.cal-form-row-tight > .form-group{ margin-bottom: 0; }
.cal-form-grow{ flex-grow: 3; }

.cal-time-input{ max-width: 110px; }
.cal-narrow-input{ max-width: 90px; }
.cal-color-input{
  max-width: 60px;
  height: 36px;
  padding: 2px;
  cursor: pointer;
}

.cal-checkbox{
  display:inline-flex; align-items:center; gap:6px;
  font-size: 0.88rem;
  color: var(--cal-text);
  cursor:pointer;
  user-select:none;
  margin: 0;
}
.cal-checkbox > input{ margin: 0; }

.cal-duration-display{
  display:inline-flex; align-items:center; gap:4px;
  padding: 4px 10px;
  background: var(--cal-surface-2);
  color: var(--cal-muted);
  border-radius: 4px;
  font-size: 0.82rem;
  margin-left: auto;
}

.cal-picker-field{
  display:flex; align-items:center; gap: 8px;
  padding: 7px 10px;
  background: var(--cal-surface-2);
  border: 1px solid var(--cal-border-color);
  border-radius: 6px;
  min-height: 36px;
}
.cal-picker-field-value{
  flex: 1;
  font-size: 0.88rem;
  color: var(--cal-text);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.cal-picker-field-actions{
  display:flex; gap: 4px;
  align-items:center;
  flex-shrink: 0;
}
.cal-inline-pick,
.cal-inline-clear{
  border:none; background:transparent;
  width: 26px; height: 26px;
  border-radius: 4px;
  color: var(--cal-muted);
  cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center;
  font-size: 0.82rem;
  transition: background .12s, color .12s;
}
.cal-inline-pick:hover{ background: var(--cal-surface); color: var(--cal-primary); }
.cal-inline-clear:hover{ background: rgba(224, 83, 83, 0.12); color: var(--cal-collision); }

.cal-muted{ color: var(--cal-muted); font-style: italic; }

/* Kollisions-Hinweis im Editor */
.cal-coll-area{ margin-top: 6px; }
.cal-coll-hard{
  padding: 8px 12px;
  background: rgba(224, 83, 83, 0.1);
  color: var(--cal-collision);
  border-left: 3px solid var(--cal-collision);
  border-radius: 4px;
  font-size: 0.85rem;
  margin-bottom: 6px;
}
.cal-coll-soft{
  padding: 8px 12px;
  background: rgba(255, 170, 0, 0.1);
  color: #c07900;
  border-left: 3px solid #e0a040;
  border-radius: 4px;
  font-size: 0.85rem;
}
.cal-coll-hard > i,
.cal-coll-soft > i{ margin-right: 6px; }

/* Picker-Popup (Property, Contact) */
.cal-picker-modal{
  background: var(--cal-surface);
  border-radius: 12px;
  width: 100%; max-width: 560px;
  max-height: 80vh;
  display:flex; flex-direction:column;
  box-shadow: 0 20px 50px rgba(0,0,0,.25);
  overflow:hidden;
  animation: cal-slide-up .18s ease-out;
}
.cal-picker-hdr{
  display:flex; align-items:center; gap:10px;
  padding: 12px 14px;
  border-bottom: 1px solid var(--cal-border-color);
}
.cal-picker-title{
  flex:1; font-size: 1rem; font-weight: 600; color: var(--cal-text);
}
.cal-picker-search{
  flex: 1;
}
.cal-picker-list{
  overflow-y: auto;
  max-height: 60vh;
  padding: 4px;
}
.cal-picker-row{
  display:flex; align-items:center; gap: 10px;
  padding: 10px 12px;
  border-radius: 6px;
  cursor:pointer;
  transition: background .12s;
  border-bottom: 1px solid var(--cal-border-color);
}
.cal-picker-row:last-child{ border-bottom: none; }
.cal-picker-row:hover{ background: var(--cal-surface-2); }
.cal-picker-row-main{ flex:1; min-width:0; }
.cal-picker-row-title{
  font-size: 0.92rem;
  font-weight: 500;
  color: var(--cal-text);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.cal-picker-row-sub{
  font-size: 0.78rem;
  color: var(--cal-muted);
  margin-top:1px;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.cal-picker-row-tag{
  font-size: 0.72rem;
  color: var(--cal-muted);
  background: var(--cal-surface-2);
  padding: 2px 8px;
  border-radius: 10px;
  flex-shrink: 0;
}
.cal-picker-empty{
  padding: 20px;
  text-align: center;
  color: var(--cal-muted);
  font-size: 0.88rem;
}
.cal-picker-footer{
  display:flex; gap:8px; justify-content: flex-end;
  padding: 12px 14px;
  border-top: 1px solid var(--cal-border-color);
  background: var(--cal-surface-2);
}
.cal-quick-modal{ max-width: 520px; }
.cal-quick-body{ padding: 14px; overflow-y: auto; }

/* ──────────────────────────────────────────────────────────────────────────
   8. DISPO-BOARD (Wochenboard mit Technikerspalten)
   ────────────────────────────────────────────────────────────────────────── */
.cal-dispo{
  display:flex; flex-direction:column;
  min-width: 100%;
}
.cal-dispo-toolbar{
  display:flex; align-items:center; gap: 10px;
  padding: 8px 14px;
  border-bottom: 1px solid var(--cal-border-color);
  background: var(--cal-surface-2);
  flex-wrap: wrap;
}
.cal-dispo-filter-lbl{
  font-size: 0.78rem;
  color: var(--cal-muted);
  font-weight: 500;
}
.cal-dispo-filter{
  display:flex; gap: 4px;
  flex-wrap: wrap;
}
.cal-tech-chip{
  display:inline-flex; align-items:center; gap: 4px;
  padding: 3px 10px;
  border-radius: 14px;
  font-size: 0.78rem;
  background: var(--cal-surface);
  color: var(--cal-muted);
  cursor: pointer;
  border: 1px solid var(--cal-border-color);
  transition: background .12s, color .12s, border-color .12s;
  user-select: none;
}
.cal-tech-chip:hover{ background: var(--cal-surface-2); }
.cal-tech-chip.active,
.cal-tech-chip[aria-pressed="true"]{
  background: var(--cal-primary);
  color: var(--cal-primary-contrast, #fff);
  border-color: var(--cal-primary);
}
.cal-tech-chip-all{
  font-weight: 600;
}
.cal-tech-count{
  font-size: 0.72rem;
  opacity: 0.8;
  margin-left: 4px;
}
.cal-badge{
  display:inline-flex; align-items:center; justify-content:center;
  min-width: 18px; height: 18px;
  padding: 0 5px;
  background: var(--cal-collision);
  color:#fff;
  font-size: 0.7rem;
  font-weight:600;
  border-radius: 9px;
  margin-left: 4px;
}
.cal-btn-icon{
  border:none; background:transparent;
  width: 30px; height: 30px;
  border-radius:6px;
  color: var(--cal-muted);
  cursor:pointer;
  display:inline-flex; align-items:center; justify-content:center;
  transition: background .12s, color .12s;
}
.cal-btn-icon:hover{
  background: var(--cal-surface);
  color: var(--cal-primary);
}

.cal-dispo-grid{
  display:grid;
  grid-template-columns: 260px 1fr;
  min-height: 70vh;
}
.cal-dispo-hdr-row{
  display: contents;
}
.cal-dispo-unassigned-hdr{
  padding: 10px 12px;
  border-bottom: 1px solid var(--cal-border-color);
  border-right: 2px solid var(--cal-border-color);
  background: var(--cal-surface-2);
  font-weight: 600;
  font-size: 0.88rem;
  display:flex; align-items:center; gap:6px;
  position: sticky; top: 0; z-index: 4;
}
.cal-dispo-week-cols{
  border-bottom: 1px solid var(--cal-border-color);
  position: sticky; top: 0; z-index: 4;
  background: var(--cal-surface);
}
.cal-dispo-hour-hdr{
  display:none; /* integriert in Body */
}
.cal-dispo-day-cols{
  display:grid;
  grid-template-columns: repeat(7, minmax(var(--cal-tech-min-width), 1fr));
}
.cal-dispo-day{
  border-right: 1px solid var(--cal-border-color);
}
.cal-dispo-day-hdr{
  padding: 6px 10px;
  text-align:center;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--cal-muted);
  border-bottom: 1px solid var(--cal-border-color);
  background: var(--cal-surface-2);
}
.cal-dispo-day-hdr.cal-today{
  color: var(--cal-primary);
  background: var(--cal-today-bg);
}
.cal-dispo-tech-row{
  display:grid;
  grid-template-columns: var(--cal-dispo-tech-columns, repeat(1, 1fr));
}
.cal-dispo-tech-hdr{
  padding: 4px 6px;
  font-size: 0.72rem;
  text-align:center;
  color: var(--cal-text);
  border-right: 1px solid var(--cal-border-color);
  background: var(--cal-surface);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.cal-dispo-tech-hdr:last-child{ border-right:none; }

.cal-dispo-body-row{
  display:contents;
}
.cal-dispo-unassigned{
  border-right: 2px solid var(--cal-border-color);
  padding: 8px;
  overflow-y: auto;
  background: var(--cal-surface);
  min-height: 100%;
  max-height: 80vh;
  display:flex; flex-direction:column; gap:6px;
}
.cal-unassigned-card{
  padding: 8px 10px;
  background: var(--cal-surface-2);
  border-left: 3px solid var(--cal-ev-color, var(--cal-primary));
  border-radius: 4px;
  cursor: grab;
  transition: box-shadow .12s, transform .08s;
}
.cal-unassigned-card:hover{
  box-shadow: 0 2px 6px rgba(0,0,0,.08);
}
.cal-unassigned-card:active{ cursor: grabbing; }
.cal-unassigned-card.cal-dragging{ opacity: 0.4; }
.cal-unassigned-title{
  font-weight:600;
  font-size: 0.85rem;
  color: var(--cal-text);
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap;
}
.cal-unassigned-svc,
.cal-unassigned-prop,
.cal-unassigned-when,
.cal-unassigned-parties{
  font-size: 0.72rem;
  color: var(--cal-muted);
  margin-top: 1px;
}
.cal-unassigned-prop > i,
.cal-unassigned-when > i,
.cal-unassigned-svc > i,
.cal-unassigned-parties > i{ margin-right: 4px; width: 10px; }

.cal-dispo-columns{
  display:grid;
  grid-template-columns: 50px 1fr;
  position: relative;
  overflow-x: auto;
}
.cal-dispo-hour-col{
  background: var(--cal-surface);
  border-right: 1px solid var(--cal-border-color);
}
.cal-dispo-hour-cell{
  height: var(--cal-hour-height);
  border-bottom: 1px solid var(--cal-border-color);
  position: relative;
  font-size: 0.7rem;
  color: var(--cal-muted);
  padding: 2px 4px;
  text-align: right;
}
.cal-dispo-tech-col{
  border-right: 1px solid var(--cal-border-color);
  position: relative;
  min-height: calc(var(--cal-hour-height) * 13);
}
.cal-dispo-tech-col.cal-today{ background: var(--cal-today-bg); }
.cal-dispo-slot{
  height: var(--cal-hour-height);
  border-bottom: 1px solid var(--cal-border-color);
  position: relative;
  cursor: pointer;
}
.cal-dispo-slot:hover{ background: rgba(27, 117, 153, 0.04); }
body.dark-theme .cal-dispo-slot:hover,
body.theme-dark .cal-dispo-slot:hover{ background: rgba(27, 117, 153, 0.1); }

.cal-dispo-ev{
  position: absolute;
  left: 2px; right: 2px;
  background: var(--cal-ev-color, var(--cal-primary));
  color: #fff;
  border-radius: 4px;
  padding: 3px 6px 4px;
  font-size: 0.72rem;
  box-shadow: var(--cal-ev-shadow);
  cursor: grab;
  overflow:hidden;
  border-left: 3px solid rgba(0,0,0,.25);
  z-index:2;
}
.cal-dispo-ev:active{ cursor: grabbing; }
.cal-dispo-ev.cal-dragging{ opacity: 0.4; }
.cal-dispo-ev.cal-ev-collision{
  box-shadow: 0 0 0 2px var(--cal-collision), var(--cal-ev-shadow);
}

/* Drop target highlight */
.cal-drop-target{
  background: rgba(27, 117, 153, 0.12) !important;
  outline: 2px dashed var(--cal-primary);
  outline-offset: -2px;
}
body.dark-theme .cal-drop-target,
body.theme-dark .cal-drop-target{
  background: rgba(27, 117, 153, 0.2) !important;
}

.cal-dispo-empty{
  padding: 40px 20px;
  text-align: center;
  color: var(--cal-muted);
  font-size: 0.88rem;
  grid-column: 1 / -1;
}

/* ──────────────────────────────────────────────────────────────────────────
   9. LOADING / ERROR / EMPTY STATES
   ────────────────────────────────────────────────────────────────────────── */
/* Sprint C: Loading/Error/Empty an Dashboard-Pattern angeglichen
   (gleiche Spacing-/Icon-Werte wie .rp-* und .sc-empty/.sc-loading) */
.cal-loading{
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 40px 20px;
  text-align: center;
  color: var(--cal-muted);
  gap: 8px;
  font-size: 13px;
}
.cal-loading > i{ font-size: 14px; color: var(--cal-primary); }
.cal-error{
  padding: 20px;
  margin: 14px;
  background: var(--error-bg, rgba(239,68,68,.10));
  color: var(--cal-collision);
  border-left: 3px solid var(--cal-collision);
  border-radius: 4px;
  font-size: 13px;
}
.cal-empty{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 48px 20px;
  text-align: center;
  color: var(--cal-muted);
  font-size: 14px;
}
.cal-empty > i{
  font-size: 36px;
  margin-bottom: 12px;
  display: block;
  opacity: 0.3;
}
.cal-empty > p{
  font-size: 12.5px;
  max-width: 320px;
  line-height: 1.45;
  margin: 0;
}

/* ──────────────────────────────────────────────────────────────────────────
   10. RESPONSIVE / MOBILE / TOUCH
   ────────────────────────────────────────────────────────────────────────── */
/* Sprint G.1: Sektionen 10/10b/10c/Touch/Tap-Feedback wurden ausgelagert
   nach modules/calendar/calendar-mobile.css. Datei wird in admin.php nach
   calendar.css geladen. Trennung schafft 280 LoC weniger in dieser Datei
   und gruppiert alle Mobile-Anpassungen logisch zusammen. */

/* ──────────────────────────────────────────────────────────────────────────
   11. DARK-THEME FEINANPASSUNGEN — selektoren erweitert um data-theme
   ────────────────────────────────────────────────────────────────────────── */
[data-theme="dark"] .cal-event,
[data-theme="dark"] .cal-dispo-ev,
[data-theme="dark"] .cal-unassigned-card,
[data-theme="dark"] .cal-allday-ev,
[data-theme="dark"] .cal-month-ev,
body.dark-theme .cal-event,
body.theme-dark .cal-event,
body.dark-theme .cal-dispo-ev,
body.theme-dark .cal-dispo-ev,
body.dark-theme .cal-unassigned-card,
body.theme-dark .cal-unassigned-card,
body.dark-theme .cal-allday-ev,
body.theme-dark .cal-allday-ev,
body.dark-theme .cal-month-ev,
body.theme-dark .cal-month-ev{
  border-left-color: rgba(255,255,255,.18);
}

body.dark-theme .cal-month-cell.cal-other-month,
body.theme-dark .cal-month-cell.cal-other-month{
  background: rgba(255,255,255,0.02);
}

body.dark-theme .cal-coll-icon,
body.theme-dark .cal-coll-icon{
  background: var(--cal-surface);
}

body.dark-theme .cal-coll-soft,
body.theme-dark .cal-coll-soft{
  background: rgba(255, 170, 0, 0.14);
  color: #ffc774;
}

/* Datum/Zeit Inputs lesbar im Dark-Theme */
body.dark-theme input[type="date"],
body.dark-theme input[type="time"],
body.theme-dark input[type="date"],
body.theme-dark input[type="time"]{
  color-scheme: dark;
}

/* ──────────────────────────────────────────────────────────────────────────
   12. UTILITIES (Cursor, Visibility-Hints)
   ────────────────────────────────────────────────────────────────────────── */
.cal-dispo-ev[draggable="true"],
.cal-unassigned-card[draggable="true"]{ cursor: grab; }
.cal-dispo-ev[draggable="true"]:active,
.cal-unassigned-card[draggable="true"]:active{ cursor: grabbing; }
/* ═══════════════════════════════════════════════════════════════════════════
   06b-calendar-additions.css — Team, Equipment, Urlaub, Learning

   Ans ENDE von 06-calendar.css anhängen. Nutzt vorhandene Variablen
   aus Abschnitt 0 von 06-calendar.css (--cal-primary, --cal-muted etc.).
   ═══════════════════════════════════════════════════════════════════════════ */

/* ──────────────────────────────────────────────────────────────────────────
   13. AVATAR-STACKS (Team-Anzeige in Events, Detail, Dispo)
   ────────────────────────────────────────────────────────────────────────── */
.cal-avatar-stack{
  display: inline-flex;
  align-items: center;
  vertical-align: middle;
}
.cal-avatar{
  width: 22px; height: 22px;
  border-radius: 50%;
  border: 2px solid var(--cal-surface);
  margin-left: -6px;
  background: var(--cal-primary);
  color: #fff;
  font-size: 0.68rem;
  font-weight: 600;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-size: cover;
  background-position: center;
  flex-shrink: 0;
  transition: transform .12s;
}
.cal-avatar:first-child{ margin-left: 0; }
.cal-avatar:hover{ transform: translateY(-1px) scale(1.08); z-index: 2; }
.cal-avatar-sm{ width: 18px; height: 18px; font-size: 0.6rem; }
.cal-avatar-lg{ width: 32px; height: 32px; font-size: 0.85rem; }
.cal-avatar-more{
  background: var(--cal-muted);
  font-size: 0.62rem;
}

/* Event-Card: Team-Icon + Stack */
.cal-ev-team{
  position: absolute;
  bottom: 2px; right: 3px;
  display: inline-flex;
  align-items: center;
  gap: 2px;
}
.cal-ev-team-icon{
  font-size: 0.64rem;
  opacity: 0.85;
  margin-right: 1px;
}

/* ──────────────────────────────────────────────────────────────────────────
   14. EQUIPMENT-BADGE (auf Event-Card, klein)
   ────────────────────────────────────────────────────────────────────────── */
.cal-ev-eq{
  position: absolute;
  top: 2px; right: 3px;
  display: inline-flex;
  align-items: center;
  gap: 2px;
  font-size: 0.62rem;
  opacity: 0.9;
  padding: 0 4px;
  border-radius: 8px;
  background: rgba(255,255,255,0.18);
}
.cal-ev-eq.cal-ev-eq-ok  { background: rgba(76,175,80,0.32); }
.cal-ev-eq.cal-ev-eq-warn{ background: rgba(255,170,0,0.32); }

/* ──────────────────────────────────────────────────────────────────────────
   15. DETAIL-MODAL: TEAM-SEKTION
   ────────────────────────────────────────────────────────────────────────── */
.cal-detail-section{
  margin-top: 14px;
  padding-top: 10px;
  border-top: 1px solid var(--cal-border-color);
}
.cal-detail-section-hdr{
  display: flex; align-items: center; gap: 8px;
  margin-bottom: 8px;
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--cal-text);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.cal-detail-section-hdr > i{
  color: var(--cal-muted);
  font-size: 0.78rem;
}
.cal-detail-section-summary{
  margin-left: auto;
  font-size: 0.75rem;
  font-weight: 500;
  color: var(--cal-muted);
  text-transform: none;
  letter-spacing: 0;
}

.cal-team-list{
  display: flex; flex-direction: column; gap: 6px;
}
.cal-team-member{
  display: flex; align-items: center; gap: 10px;
  padding: 6px 10px;
  background: var(--cal-surface-2);
  border-radius: 6px;
  border-left: 3px solid var(--cal-border-color);
  transition: border-color .15s, background .12s;
}
.cal-team-member.cal-team-self{
  border-left-color: var(--cal-primary);
  background: rgba(27, 117, 153, 0.06);
}
.cal-team-member.cal-team-active{ border-left-color: #4caf50; }
.cal-team-member.cal-team-done  { border-left-color: #2196f3; }

.cal-team-member-info{ flex: 1; min-width: 0; }
.cal-team-member-name{
  font-size: 0.88rem;
  font-weight: 500;
  color: var(--cal-text);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.cal-team-member-role{
  font-size: 0.72rem;
  color: var(--cal-muted);
}
.cal-team-role-lead{
  color: var(--cal-primary);
  font-weight: 600;
}
.cal-team-status{
  display: inline-flex;
  align-items: center;
  gap: 5px;
  font-size: 0.72rem;
  color: var(--cal-muted);
  flex-shrink: 0;
}
.cal-team-status-dot{
  width: 8px; height: 8px;
  border-radius: 50%;
  background: var(--cal-muted);
  flex-shrink: 0;
}
.cal-team-status-dot.cal-status-active{
  background: #4caf50;
  box-shadow: 0 0 0 3px rgba(76,175,80,0.2);
  animation: cal-pulse 1.8s ease-in-out infinite;
}
.cal-team-status-dot.cal-status-done{
  background: #2196f3;
}
@keyframes cal-pulse{
  0%, 100% { box-shadow: 0 0 0 3px rgba(76,175,80,0.2); }
  50%      { box-shadow: 0 0 0 6px rgba(76,175,80,0.05); }
}

/* ──────────────────────────────────────────────────────────────────────────
   16. DETAIL-MODAL: EQUIPMENT-SEKTION
   ────────────────────────────────────────────────────────────────────────── */
.cal-eq-list{
  display: flex; flex-direction: column; gap: 4px;
}
.cal-eq-item{
  display: flex; align-items: center; gap: 10px;
  padding: 6px 10px;
  background: var(--cal-surface-2);
  border-radius: 6px;
  cursor: pointer;
  transition: background .12s, opacity .15s;
  border: 1px solid transparent;
  user-select: none;
}
.cal-eq-item:hover{ background: var(--cal-surface); border-color: var(--cal-border-color); }
.cal-eq-item.cal-eq-checked{
  opacity: 0.65;
}
.cal-eq-item.cal-eq-checked .cal-eq-label{
  text-decoration: line-through;
  text-decoration-color: var(--cal-muted);
}

.cal-eq-checkbox{
  width: 20px; height: 20px;
  border: 2px solid var(--cal-muted);
  border-radius: 4px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: transparent;
  font-size: 0.75rem;
  flex-shrink: 0;
  transition: background .12s, border-color .12s, color .12s;
}
.cal-eq-item.cal-eq-checked .cal-eq-checkbox{
  background: #4caf50;
  border-color: #4caf50;
  color: #fff;
}
.cal-eq-icon{
  width: 18px;
  text-align: center;
  color: var(--cal-muted);
  flex-shrink: 0;
}
.cal-eq-item.cal-eq-checked .cal-eq-icon{ color: #4caf50; }
.cal-eq-label{
  flex: 1; min-width: 0;
  font-size: 0.88rem;
  color: var(--cal-text);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.cal-eq-qty{
  font-size: 0.72rem;
  color: var(--cal-muted);
  margin-left: 4px;
}
.cal-eq-required{
  font-size: 0.64rem;
  padding: 1px 6px;
  background: rgba(224, 83, 83, 0.12);
  color: var(--cal-collision);
  border-radius: 8px;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  font-weight: 600;
  flex-shrink: 0;
}
.cal-eq-remove{
  border: none; background: transparent;
  width: 22px; height: 22px;
  border-radius: 4px;
  color: var(--cal-muted);
  opacity: 0;
  cursor: pointer;
  transition: opacity .12s, color .12s, background .12s;
  flex-shrink: 0;
}
.cal-eq-item:hover .cal-eq-remove{ opacity: 1; }
.cal-eq-remove:hover{ color: var(--cal-collision); background: rgba(224,83,83,0.12); }

.cal-eq-ready-badge{
  display: inline-flex; align-items: center; gap: 5px;
  padding: 3px 10px;
  background: rgba(76,175,80,0.12);
  color: #4caf50;
  border-radius: 12px;
  font-size: 0.75rem;
  font-weight: 600;
}

.cal-eq-add-row{
  display: flex; gap: 6px;
  margin-top: 6px;
  align-items: center;
}
.cal-eq-add-input{
  flex: 1;
  position: relative;
}
.cal-eq-add-dropdown{
  position: absolute;
  top: 100%; left: 0; right: 0;
  background: var(--cal-surface);
  border: 1px solid var(--cal-border-color);
  border-radius: 6px;
  box-shadow: 0 6px 16px rgba(0,0,0,.1);
  max-height: 240px;
  overflow-y: auto;
  z-index: 10;
  margin-top: 2px;
}
.cal-eq-add-hit{
  padding: 7px 10px;
  cursor: pointer;
  display: flex; align-items: center; gap: 8px;
  border-bottom: 1px solid var(--cal-border-color);
  font-size: 0.84rem;
}
.cal-eq-add-hit:last-child{ border-bottom: none; }
.cal-eq-add-hit:hover,
.cal-eq-add-hit.cal-eq-hit-focus{ background: var(--cal-surface-2); }
.cal-eq-add-hit-icon{ width: 16px; color: var(--cal-muted); }
.cal-eq-add-hit-cat{ margin-left: auto; font-size: 0.68rem; color: var(--cal-muted); }

/* ──────────────────────────────────────────────────────────────────────────
   17. EDITOR — TEAM-MULTI-PICKER
   ────────────────────────────────────────────────────────────────────────── */
.cal-team-picker{
  background: var(--cal-surface-2);
  border: 1px solid var(--cal-border-color);
  border-radius: 6px;
  padding: 6px;
  min-height: 42px;
}
.cal-team-chips{
  display: flex; flex-wrap: wrap; gap: 4px;
  min-height: 28px;
  align-items: center;
}
.cal-team-chip{
  display: inline-flex; align-items: center; gap: 6px;
  padding: 3px 4px 3px 3px;
  background: var(--cal-surface);
  border: 1px solid var(--cal-border-color);
  border-radius: 14px;
  font-size: 0.82rem;
  color: var(--cal-text);
  animation: cal-chip-in .18s ease-out;
}
@keyframes cal-chip-in{
  from{ opacity: 0; transform: scale(0.8); }
  to  { opacity: 1; transform: scale(1); }
}
.cal-team-chip.cal-team-chip-lead{
  background: var(--cal-primary);
  color: #fff;
  border-color: var(--cal-primary);
}
.cal-team-chip-lead-crown{
  font-size: 0.68rem;
  opacity: 0.95;
}
.cal-team-chip .cal-avatar{ width: 20px; height: 20px; font-size: 0.62rem; }
.cal-team-chip-name{ max-width: 120px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cal-team-chip-actions{
  display: inline-flex; gap: 2px;
}
.cal-team-chip-btn{
  border: none; background: transparent;
  width: 20px; height: 20px;
  border-radius: 50%;
  cursor: pointer;
  color: inherit;
  opacity: 0.75;
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 0.68rem;
  transition: background .12s, opacity .12s;
}
.cal-team-chip-btn:hover{ background: rgba(0,0,0,0.1); opacity: 1; }
.cal-team-chip-lead .cal-team-chip-btn:hover{ background: rgba(255,255,255,0.2); }

.cal-team-add-row{
  display: flex; gap: 6px;
  margin-top: 6px;
  position: relative;
}
.cal-team-add-input{
  flex: 1;
  padding: 5px 10px;
  border: 1px solid var(--cal-border-color);
  border-radius: 6px;
  font-size: 0.85rem;
  background: var(--cal-surface);
  color: var(--cal-text);
}
.cal-team-add-input:focus{
  outline: 2px solid var(--cal-primary);
  outline-offset: -1px;
  border-color: var(--cal-primary);
}
.cal-team-add-dropdown{
  position: absolute;
  top: 100%; left: 0; right: 0;
  margin-top: 2px;
  background: var(--cal-surface);
  border: 1px solid var(--cal-border-color);
  border-radius: 6px;
  box-shadow: 0 6px 16px rgba(0,0,0,.1);
  max-height: 240px;
  overflow-y: auto;
  z-index: 10;
}
.cal-team-add-hit{
  padding: 7px 10px;
  cursor: pointer;
  display: flex; align-items: center; gap: 8px;
  font-size: 0.84rem;
  border-bottom: 1px solid var(--cal-border-color);
}
.cal-team-add-hit:last-child{ border-bottom: none; }
.cal-team-add-hit:hover,
.cal-team-add-hit.cal-team-hit-focus{ background: var(--cal-surface-2); }
.cal-team-add-hit.cal-team-hit-disabled{
  opacity: 0.4;
  cursor: not-allowed;
}

.cal-team-banner{
  margin-top: 6px;
  padding: 8px 12px;
  border-radius: 6px;
  font-size: 0.82rem;
  display: flex; align-items: center; gap: 8px;
}
.cal-team-banner-suggest{
  background: rgba(27, 117, 153, 0.08);
  color: var(--cal-primary);
  border-left: 3px solid var(--cal-primary);
}
.cal-team-banner-required{
  background: rgba(224,83,83,0.08);
  color: var(--cal-collision);
  border-left: 3px solid var(--cal-collision);
}
.cal-team-banner-solo{
  background: rgba(255,170,0,0.1);
  color: #c07900;
  border-left: 3px solid #e0a040;
}
.cal-team-banner > i{ flex-shrink: 0; }
.cal-team-banner-text{ flex: 1; }
.cal-team-banner-action{
  border: none; background: transparent;
  color: inherit;
  font-weight: 600;
  font-size: 0.8rem;
  cursor: pointer;
  padding: 3px 8px;
  border-radius: 4px;
  transition: background .12s;
}
.cal-team-banner-action:hover{ background: rgba(0,0,0,0.06); }
body.dark-theme .cal-team-banner-action:hover,
body.theme-dark .cal-team-banner-action:hover{ background: rgba(255,255,255,0.08); }

/* ──────────────────────────────────────────────────────────────────────────
   18. EDITOR — EQUIPMENT-SEKTION
   ────────────────────────────────────────────────────────────────────────── */
.cal-editor-eq-head{
  display: flex; align-items: center;
  margin-bottom: 6px;
  gap: 8px;
}
.cal-editor-eq-reseed{
  margin-left: auto;
  border: none; background: transparent;
  color: var(--cal-muted);
  font-size: 0.78rem;
  cursor: pointer;
  padding: 2px 6px;
  border-radius: 4px;
  display: inline-flex; align-items: center; gap: 4px;
  transition: background .12s, color .12s;
}
.cal-editor-eq-reseed:hover{ background: var(--cal-surface-2); color: var(--cal-primary); }

.cal-editor-eq-chips{
  display: flex; flex-wrap: wrap; gap: 4px;
  min-height: 32px;
  margin-bottom: 6px;
}
.cal-editor-eq-chip{
  display: inline-flex; align-items: center; gap: 5px;
  padding: 3px 4px 3px 8px;
  background: var(--cal-surface-2);
  border: 1px solid var(--cal-border-color);
  border-radius: 14px;
  font-size: 0.78rem;
  animation: cal-chip-in .18s ease-out;
}
.cal-editor-eq-chip.cal-eq-chip-required{
  border-color: rgba(224,83,83,0.4);
  background: rgba(224,83,83,0.06);
}
.cal-editor-eq-chip-icon{
  color: var(--cal-muted);
  font-size: 0.78rem;
}
.cal-editor-eq-chip-label{
  max-width: 200px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.cal-editor-eq-chip-qty{
  color: var(--cal-muted);
  font-size: 0.72rem;
}
.cal-editor-eq-chip-btn{
  border: none; background: transparent;
  width: 20px; height: 20px;
  border-radius: 50%;
  cursor: pointer;
  color: var(--cal-muted);
  display: inline-flex; align-items: center; justify-content: center;
  font-size: 0.68rem;
  opacity: 0.7;
  transition: background .12s, color .12s, opacity .12s;
}
.cal-editor-eq-chip-btn:hover{ background: rgba(0,0,0,0.08); color: var(--cal-collision); opacity: 1; }

/* ──────────────────────────────────────────────────────────────────────────
   19. URLAUBS-WARN-OVERLAY (sehr deutlich)
   ────────────────────────────────────────────────────────────────────────── */
.cal-urlaub-warn{
  margin-top: 10px;
  padding: 14px 16px;
  background: linear-gradient(180deg, rgba(224,83,83,0.12) 0%, rgba(224,83,83,0.06) 100%);
  border: 1px solid rgba(224,83,83,0.45);
  border-left: 4px solid var(--cal-collision);
  border-radius: 8px;
  animation: cal-urlaub-slide-in .24s ease-out;
}
@keyframes cal-urlaub-slide-in{
  from{ opacity: 0; transform: translateY(-4px); }
  to  { opacity: 1; transform: translateY(0); }
}
.cal-urlaub-warn-title{
  display: flex; align-items: center; gap: 8px;
  font-weight: 700;
  color: var(--cal-collision);
  font-size: 0.95rem;
  margin-bottom: 6px;
}
.cal-urlaub-warn-title > i{ font-size: 1.1rem; }
.cal-urlaub-warn-body{
  font-size: 0.86rem;
  color: var(--cal-text);
  margin-bottom: 8px;
  line-height: 1.4;
}
.cal-urlaub-warn-persons{
  font-size: 0.85rem;
  font-weight: 500;
  margin: 4px 0 8px 0;
  padding: 6px 10px;
  background: rgba(255,255,255,0.4);
  border-radius: 4px;
}
body.dark-theme .cal-urlaub-warn-persons,
body.theme-dark .cal-urlaub-warn-persons{
  background: rgba(0,0,0,0.25);
}
.cal-urlaub-warn-persons > i{ color: var(--cal-collision); margin-right: 5px; }
.cal-urlaub-warn-confirm{
  display: flex; align-items: center; gap: 8px;
  padding: 6px 0;
  cursor: pointer;
  user-select: none;
  font-size: 0.88rem;
  font-weight: 500;
  color: var(--cal-text);
}
.cal-urlaub-warn-confirm input[type="checkbox"]{
  width: 18px; height: 18px;
  cursor: pointer;
  accent-color: var(--cal-collision);
}

/* Save-Button Block-Zustand */
.btn.cal-save-blocked{
  opacity: 0.4;
  cursor: not-allowed;
  pointer-events: none;
}

/* ──────────────────────────────────────────────────────────────────────────
   20. LEARNING-KONFIDENZ-ANZEIGE
   ────────────────────────────────────────────────────────────────────────── */
.cal-duration-display{
  flex-direction: column;
  align-items: flex-start;
  gap: 2px;
  padding: 5px 10px;
}
.cal-duration-display-main{
  display: inline-flex; align-items: center; gap: 5px;
  font-size: 0.82rem;
  color: var(--cal-muted);
}
.cal-duration-source{
  display: inline-flex; align-items: center; gap: 4px;
  font-size: 0.68rem;
  color: var(--cal-muted);
  opacity: 0.85;
}
.cal-duration-source-learned{
  color: #4caf50;
  font-weight: 500;
}
.cal-duration-source-manual{ color: var(--cal-primary); }
.cal-duration-source-default{ font-style: italic; }
.cal-confidence-bar{
  display: inline-block;
  width: 40px;
  height: 4px;
  background: var(--cal-border-color);
  border-radius: 2px;
  overflow: hidden;
  vertical-align: middle;
}
.cal-confidence-bar-fill{
  height: 100%;
  background: linear-gradient(90deg, #e0a040 0%, #4caf50 100%);
  transition: width .4s ease-out;
}

/* ──────────────────────────────────────────────────────────────────────────
   21. DISPO-BOARD: MIRROR-EVENTS + URLAUBS-SCHRAFFUR
   (vorbereitet, wird in der Dispo-Tranche genutzt)
   ────────────────────────────────────────────────────────────────────────── */
.cal-dispo-ev.cal-ev-mirror{
  opacity: 0.55;
  border-style: dashed;
  border-width: 1px;
  cursor: default;
}
.cal-dispo-ev.cal-ev-mirror::after{
  content: "";
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(
    135deg,
    transparent 0 4px,
    rgba(255,255,255,0.08) 4px 8px
  );
  pointer-events: none;
}
.cal-mirror-icon{
  position: absolute;
  top: 2px; right: 3px;
  font-size: 0.68rem;
  opacity: 0.7;
}

.cal-urlaub-shade{
  position: absolute;
  inset: 0;
  background: repeating-linear-gradient(
    -45deg,
    rgba(224,83,83,0.16) 0 6px,
    rgba(224,83,83,0.06) 6px 12px
  );
  pointer-events: none;
  z-index: 1;
}
.cal-urlaub-label{
  position: absolute;
  top: 4px; left: 50%;
  transform: translateX(-50%);
  background: var(--cal-collision);
  color: #fff;
  padding: 2px 8px;
  border-radius: 10px;
  font-size: 0.68rem;
  font-weight: 600;
  pointer-events: none;
  z-index: 2;
  box-shadow: 0 1px 3px rgba(0,0,0,0.15);
}

/* Drop-Target über Urlaubs-Zelle wird rot */
.cal-urlaub-shade + .cal-dispo-slot.cal-drop-target,
.cal-dispo-tech-col.cal-has-urlaub .cal-drop-target{
  background: rgba(224,83,83,0.18) !important;
  outline-color: var(--cal-collision) !important;
}

/* ──────────────────────────────────────────────────────────────────────────
   22. SUGGEST-LOADER (Team-Auto-Vorschlag, Learning-Fetch)
   ────────────────────────────────────────────────────────────────────────── */
.cal-inline-spinner{
  display: inline-block;
  width: 12px; height: 12px;
  border: 2px solid var(--cal-border-color);
  border-top-color: var(--cal-primary);
  border-radius: 50%;
  animation: cal-spin 0.8s linear infinite;
  vertical-align: middle;
}
@keyframes cal-spin{
  to { transform: rotate(360deg); }
}

/* ──────────────────────────────────────────────────────────────────────────
   23. INDIVIDUELLER ARBEITSBEGINN/-ENDE (Detail-Modal, pro Team-Member)
   ────────────────────────────────────────────────────────────────────────── */
.cal-team-work-btn{
  border: none;
  padding: 4px 10px;
  border-radius: 6px;
  font-size: 0.78rem;
  cursor: pointer;
  font-weight: 500;
  display: inline-flex; align-items: center; gap: 5px;
  transition: background .15s, transform .08s;
}
.cal-team-work-btn-start{
  background: #4caf50;
  color: #fff;
}
.cal-team-work-btn-start:hover{ background: #43a047; transform: translateY(-1px); }
.cal-team-work-btn-end{
  background: var(--cal-collision);
  color: #fff;
}
.cal-team-work-btn-end:hover{ background: #c84848; transform: translateY(-1px); }

/* ──────────────────────────────────────────────────────────────────────────
   24. ACCESSIBILITY — Keyboard-Focus sichtbar
   ────────────────────────────────────────────────────────────────────────── */
.cal-team-chip-btn:focus-visible,
.cal-editor-eq-chip-btn:focus-visible,
.cal-team-add-hit:focus-visible,
.cal-eq-add-hit:focus-visible,
.cal-eq-item:focus-visible{
  outline: 2px solid var(--cal-primary);
  outline-offset: 2px;
}

/* ══════════════════════════════════════════════════════════════════════════
   ADMIN-MODULE (Matrix, Equipment, Services)
   ══════════════════════════════════════════════════════════════════════════ */

/* ──────────────────────────────────────────────────────────────────────────
   25. GEMEINSAME ADMIN-PATTERNS
   ────────────────────────────────────────────────────────────────────────── */
.cal-mx-root, .cal-eqadm-root, .cal-svc-root{
  padding: 0;
  max-width: none;
  margin: 0;
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
}
.cal-mx-toolbar, .cal-eqadm-toolbar{
  display: flex; align-items: center; gap: 10px;
  padding: 12px 16px;
  background: var(--cal-surface-2);
  border-bottom: 1px solid var(--cal-border-color);
  border-radius: 0;
  margin-bottom: 14px;
  flex-wrap: wrap;
}
.cal-mx-toolbar-lbl, .cal-eqadm-toolbar-lbl{
  font-size: 0.82rem;
  font-weight: 600;
  color: var(--cal-muted);
}
.cal-mx-toolbar-spacer{ flex: 1; }
.cal-mx-filter, .cal-eqadm-link-svc{
  min-width: 220px;
  max-width: 320px;
}
.cal-mx-btn{ flex-shrink: 0; }

.cal-mx-empty{
  padding: 48px 20px;
  text-align: center;
  color: var(--cal-muted);
  font-size: 0.95rem;
}
.cal-mx-empty > i{
  font-size: 2.4rem;
  margin-bottom: 12px;
  display: block;
  opacity: 0.35;
}

/* Gemeinsame Zeilen-Buttons */
.cal-mx-row-btn{
  border: 1px solid transparent;
  background: transparent;
  width: 30px; height: 30px;
  border-radius: 6px;
  color: var(--cal-muted);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.82rem;
  transition: background .12s, color .12s, border-color .12s;
}
.cal-mx-row-btn:hover{
  background: var(--cal-surface);
  color: var(--cal-primary);
  border-color: var(--cal-border-color);
}
.cal-mx-row-btn-primary{
  color: #fff !important;
  background: var(--cal-primary) !important;
  border-color: var(--cal-primary) !important;
}
.cal-mx-row-btn-primary:hover{ opacity: 0.9; }
.cal-mx-row-btn-danger:hover{
  background: rgba(224, 83, 83, 0.12);
  color: var(--cal-collision);
  border-color: transparent;
}
.cal-mx-row-btn[disabled]{ opacity: 0.35; cursor: not-allowed; }

.cal-mx-none{ color: var(--cal-muted); opacity: 0.6; }

/* ──────────────────────────────────────────────────────────────────────────
   26. MATRIX-ADMIN
   ────────────────────────────────────────────────────────────────────────── */
.cal-mx-stats{
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  margin-bottom: 14px;
}
.cal-mx-stat{
  background: var(--cal-surface);
  border: 1px solid var(--cal-border-color);
  border-radius: 8px;
  padding: 12px 14px;
  text-align: center;
}
.cal-mx-stat-val{
  font-size: 1.6rem;
  font-weight: 700;
  color: var(--cal-text);
  line-height: 1.1;
}
.cal-mx-stat-lbl{
  font-size: 0.72rem;
  color: var(--cal-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-top: 2px;
}

.cal-mx-table-wrap{
  background: var(--cal-surface);
  border: 1px solid var(--cal-border-color);
  border-radius: 8px;
  overflow-x: auto;
}
.cal-mx-table{
  width: 100%;
  border-collapse: collapse;
  font-size: 0.88rem;
}
.cal-mx-table thead th{
  background: var(--cal-surface-2);
  padding: 10px 12px;
  text-align: left;
  font-size: 0.75rem;
  font-weight: 600;
  color: var(--cal-muted);
  text-transform: uppercase;
  letter-spacing: 0.03em;
  border-bottom: 1px solid var(--cal-border-color);
  white-space: nowrap;
  position: sticky;
  top: 0;
  z-index: 2;
}
.cal-mx-sort{ cursor: pointer; user-select: none; }
.cal-mx-sort:hover{ color: var(--cal-primary); }
.cal-mx-sort.active{ color: var(--cal-primary); }
.cal-mx-th-actions{ width: 130px; text-align: right !important; }

.cal-mx-table tbody tr{
  border-bottom: 1px solid var(--cal-border-color);
  transition: background .12s;
}
.cal-mx-table tbody tr:hover{ background: var(--cal-surface-2); }
.cal-mx-table tbody tr:last-child{ border-bottom: none; }
.cal-mx-pending{
  background: rgba(255, 170, 0, 0.05);
}
.cal-mx-pending:hover{ background: rgba(255, 170, 0, 0.08); }
.cal-mx-pending td:first-child{
  border-left: 3px solid #e0a040;
}

.cal-mx-table td{
  padding: 8px 12px;
  vertical-align: middle;
}

.cal-mx-svc-dot{
  display: inline-block;
  width: 10px; height: 10px;
  border-radius: 50%;
  margin-right: 8px;
  vertical-align: middle;
}

.cal-mx-inline-edit{
  width: 70px;
  padding: 4px 6px;
  border: 1px solid var(--cal-border-color);
  border-radius: 4px;
  background: var(--cal-surface);
  color: var(--cal-text);
  font-size: 0.86rem;
  font-variant-numeric: tabular-nums;
  transition: border-color .12s, background .12s;
}
.cal-mx-inline-edit:focus{
  outline: none;
  border-color: var(--cal-primary);
  background: var(--cal-surface-2);
}

.cal-mx-learned strong{ color: var(--cal-text); }
.cal-mx-stddev{
  color: var(--cal-muted);
  font-size: 0.78rem;
  font-variant-numeric: tabular-nums;
}

.cal-mx-obs-btn{
  border: 1px solid var(--cal-border-color);
  background: var(--cal-surface);
  padding: 4px 10px;
  border-radius: 4px;
  font-size: 0.82rem;
  cursor: pointer;
  color: var(--cal-text);
  transition: background .12s, border-color .12s;
  display: inline-flex;
  align-items: center;
  gap: 5px;
}
.cal-mx-obs-btn:hover:not(:disabled){
  border-color: var(--cal-primary);
  color: var(--cal-primary);
}
.cal-mx-obs-btn:disabled{ opacity: 0.4; cursor: default; }
.cal-mx-obs-btn > i{ font-size: 0.7rem; opacity: 0.7; }

.cal-mx-conf-bar{
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 120px;
}
.cal-mx-conf-fill{
  height: 6px;
  background: linear-gradient(90deg, #e0a040 0%, #4caf50 100%);
  border-radius: 3px;
  transition: width .35s ease-out;
}
.cal-mx-conf-bar > div:first-child{
  position: relative;
  flex: 1;
  height: 6px;
  background: var(--cal-border-color);
  border-radius: 3px;
  overflow: hidden;
}
.cal-mx-conf-pct{
  font-size: 0.75rem;
  color: var(--cal-muted);
  font-variant-numeric: tabular-nums;
  min-width: 35px;
}

.cal-mx-td-actions{ text-align: right; white-space: nowrap; }
.cal-mx-td-actions > button{ margin-left: 4px; }

/* Observations-Drilldown */
.cal-mx-obs-summary{
  display: flex; justify-content: space-between; gap: 12px;
  padding: 10px 12px;
  background: var(--cal-surface-2);
  border-radius: 6px;
  margin-bottom: 10px;
  font-size: 0.85rem;
  color: var(--cal-text);
}
.cal-mx-obs-list{
  display: flex; flex-direction: column;
  max-height: 480px; overflow-y: auto;
}
.cal-mx-obs-row{
  display: grid;
  grid-template-columns: 130px 1fr 70px 1fr 32px;
  gap: 10px;
  align-items: center;
  padding: 6px 4px;
  border-bottom: 1px solid var(--cal-border-color);
  font-size: 0.82rem;
  transition: background .12s;
}
.cal-mx-obs-row:hover{ background: var(--cal-surface-2); }
.cal-mx-obs-row:last-child{ border-bottom: none; }
.cal-mx-obs-out{ opacity: 0.45; }
.cal-mx-obs-out .cal-mx-obs-val{ text-decoration: line-through; }
.cal-mx-obs-dt{ color: var(--cal-muted); font-variant-numeric: tabular-nums; }
.cal-mx-obs-bar-wrap{
  background: var(--cal-border-color);
  border-radius: 2px;
  height: 8px;
  overflow: hidden;
}
.cal-mx-obs-bar{
  background: var(--cal-primary);
  height: 100%;
  border-radius: 2px;
  transition: width .3s;
}
.cal-mx-obs-val{ font-variant-numeric: tabular-nums; text-align: right; }
.cal-mx-obs-evt{
  color: var(--cal-muted);
  font-size: 0.78rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* ──────────────────────────────────────────────────────────────────────────
   27. EQUIPMENT-ADMIN
   ────────────────────────────────────────────────────────────────────────── */
.cal-eqadm-tabs{
  display: flex;
  gap: 2px;
  margin-bottom: 14px;
  border-bottom: 2px solid var(--cal-border-color);
}
.cal-eqadm-tab{
  border: none;
  background: transparent;
  padding: 10px 18px;
  font-size: 0.88rem;
  color: var(--cal-muted);
  cursor: pointer;
  border-bottom: 3px solid transparent;
  margin-bottom: -2px;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  transition: color .12s, border-color .12s;
}
.cal-eqadm-tab:hover{ color: var(--cal-text); }
.cal-eqadm-tab.active{
  color: var(--cal-primary);
  border-bottom-color: var(--cal-primary);
}
.cal-eqadm-tab-count{
  font-size: 0.72rem;
  background: var(--cal-surface-2);
  padding: 1px 7px;
  border-radius: 10px;
  color: var(--cal-muted);
}
.cal-eqadm-tab.active .cal-eqadm-tab-count{
  background: rgba(27, 117, 153, 0.12);
  color: var(--cal-primary);
}

.cal-eqadm-search{
  min-width: 220px;
  max-width: 320px;
  flex-shrink: 0;
}
.cal-eqadm-toolbar-check{ font-size: 0.82rem; }

.cal-eqadm-catalog{
  display: flex; flex-direction: column; gap: 16px;
}
.cal-eqadm-cat-group{
  background: var(--cal-surface);
  border: 1px solid var(--cal-border-color);
  border-radius: 8px;
  overflow: hidden;
}
.cal-eqadm-cat-hdr{
  padding: 10px 14px;
  background: var(--cal-surface-2);
  border-bottom: 1px solid var(--cal-border-color);
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--cal-text);
  display: flex;
  align-items: center;
  gap: 8px;
}
.cal-eqadm-cat-hdr > i{ color: var(--cal-muted); }
.cal-eqadm-cat-count{
  margin-left: auto;
  font-size: 0.72rem;
  font-weight: 400;
  color: var(--cal-muted);
  background: var(--cal-surface);
  padding: 2px 8px;
  border-radius: 10px;
}
.cal-eqadm-cat-items{
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
  gap: 1px;
  background: var(--cal-border-color);
}

.cal-eqadm-item{
  display: flex; align-items: center; gap: 10px;
  padding: 10px 12px;
  background: var(--cal-surface);
  position: relative;
  transition: background .12s;
}
.cal-eqadm-item:hover{ background: var(--cal-surface-2); }
.cal-eqadm-item-inactive{ opacity: 0.55; }
.cal-eqadm-item-color{
  width: 4px; height: 28px;
  border-radius: 2px;
  flex-shrink: 0;
}
.cal-eqadm-item-icon{
  width: 24px; text-align: center;
  font-size: 1.05rem;
  color: var(--cal-muted);
  flex-shrink: 0;
}
.cal-eqadm-item-info{ flex: 1; min-width: 0; }
.cal-eqadm-item-label{
  font-weight: 500;
  font-size: 0.9rem;
  color: var(--cal-text);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.cal-eqadm-item-meta{
  display: flex;
  gap: 6px;
  margin-top: 2px;
  align-items: center;
  flex-wrap: wrap;
}
.cal-eqadm-item-tag{
  display: inline-flex;
  align-items: center;
  gap: 3px;
  font-size: 0.7rem;
  padding: 1px 6px;
  background: var(--cal-surface-2);
  color: var(--cal-muted);
  border-radius: 8px;
}
.cal-eqadm-item-tag > i{ font-size: 0.68rem; }
.cal-eqadm-item-inactive-tag{
  background: rgba(224, 83, 83, 0.1);
  color: var(--cal-collision);
}
.cal-eqadm-item-unit{
  font-size: 0.72rem;
  color: var(--cal-muted);
  font-variant-numeric: tabular-nums;
}

/* Tab 2: Zweispalten-Link-Layout */
.cal-eqadm-link-cols{
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 16px;
  min-height: 500px;
}
.cal-eqadm-link-col{
  background: var(--cal-surface);
  border: 1px solid var(--cal-border-color);
  border-radius: 8px;
  display: flex; flex-direction: column;
  overflow: hidden;
}
.cal-eqadm-link-col-hdr{
  padding: 10px 14px;
  background: var(--cal-surface-2);
  border-bottom: 1px solid var(--cal-border-color);
  font-size: 0.85rem;
  font-weight: 600;
  color: var(--cal-text);
  display: flex;
  align-items: center;
  gap: 8px;
}
.cal-eqadm-link-col-body{
  flex: 1;
  overflow-y: auto;
  max-height: 580px;
}
.cal-eqadm-empty-col{
  padding: 40px 20px;
  text-align: center;
  color: var(--cal-muted);
  font-size: 0.85rem;
}
.cal-eqadm-empty-col > i{
  font-size: 2rem;
  opacity: 0.35;
  display: block;
  margin-bottom: 10px;
}

.cal-eqadm-avail{
  display: flex; align-items: center; gap: 10px;
  padding: 8px 12px;
  border-bottom: 1px solid var(--cal-border-color);
  transition: background .12s;
}
.cal-eqadm-avail:last-child{ border-bottom: none; }
.cal-eqadm-avail:hover{ background: var(--cal-surface-2); }
.cal-eqadm-avail > i:first-child{ flex-shrink: 0; width: 20px; text-align: center; }
.cal-eqadm-avail-label{
  flex: 1;
  font-size: 0.88rem;
  color: var(--cal-text);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.cal-eqadm-avail-cat{
  font-size: 0.72rem;
  color: var(--cal-muted);
  font-style: italic;
}
.cal-eqadm-avail-add{
  border: 1px solid var(--cal-primary);
  background: transparent;
  color: var(--cal-primary);
  width: 26px; height: 26px;
  border-radius: 50%;
  cursor: pointer;
  font-size: 0.72rem;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  transition: background .12s, color .12s;
}
.cal-eqadm-avail-add:hover{
  background: var(--cal-primary);
  color: #fff;
}

.cal-eqadm-linked{
  display: flex; align-items: center; gap: 8px;
  padding: 8px 10px;
  border-bottom: 1px solid var(--cal-border-color);
  background: var(--cal-surface);
  transition: background .12s, transform .08s;
  cursor: grab;
}
.cal-eqadm-linked:last-child{ border-bottom: none; }
.cal-eqadm-linked:active{ cursor: grabbing; }
.cal-eqadm-linked.cal-dragging{
  opacity: 0.4;
  background: var(--cal-surface-2);
}
.cal-eqadm-linked.cal-eqadm-drop-before{
  border-top: 2px solid var(--cal-primary);
  margin-top: -1px;
}
.cal-eqadm-link-grip{
  color: var(--cal-muted);
  opacity: 0.45;
  font-size: 0.82rem;
  cursor: grab;
}
.cal-eqadm-linked-label{
  flex: 1;
  font-size: 0.86rem;
  color: var(--cal-text);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
  min-width: 80px;
}
.cal-eqadm-qty-input{
  width: 90px;
  padding: 3px 8px;
  border: 1px solid var(--cal-border-color);
  border-radius: 4px;
  font-size: 0.78rem;
  background: var(--cal-surface-2);
  color: var(--cal-text);
  flex-shrink: 0;
}
.cal-eqadm-qty-input:focus{
  outline: 1px solid var(--cal-primary);
  outline-offset: -1px;
  background: var(--cal-surface);
}
.cal-eqadm-req-toggle{
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 0.75rem;
  color: var(--cal-muted);
  cursor: pointer;
  user-select: none;
  padding: 0 4px;
  flex-shrink: 0;
}
.cal-eqadm-req-toggle > input:checked + span{
  color: var(--cal-collision);
  font-weight: 600;
}

.cal-eqadm-preview-wrap{
  margin-top: 10px;
  padding: 12px;
  background: var(--cal-surface-2);
  border-radius: 6px;
}
.cal-eqadm-preview-lbl{
  font-size: 0.72rem;
  color: var(--cal-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 6px;
}
.cal-eqadm-preview{
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 6px 12px;
  background: var(--cal-surface);
  border: 1px solid var(--cal-border-color);
  border-radius: 6px;
  font-size: 0.88rem;
  color: var(--cal-text);
}
.cal-eqadm-preview > i{ font-size: 1rem; }

/* ──────────────────────────────────────────────────────────────────────────
   28. SERVICES-ADMIN
   ────────────────────────────────────────────────────────────────────────── */
.cal-svc-grid{
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(320px, 1fr));
  gap: 12px;
  padding: 16px;
  flex: 1;
  overflow-y: auto;
  align-content: start;
}

.cal-svc-card{
  position: relative;
  background: var(--cal-surface);
  border: 1px solid var(--cal-border-color);
  border-radius: 10px;
  padding: 12px 14px 10px 18px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  transition: box-shadow .15s, transform .08s;
}
.cal-svc-card:hover{
  box-shadow: 0 3px 10px rgba(0,0,0,0.06);
}
.cal-svc-card-inactive{ opacity: 0.65; }
.cal-svc-card-color{
  position: absolute;
  left: 0; top: 0; bottom: 0;
  width: 4px;
  border-radius: 10px 0 0 10px;
}
.cal-svc-card-head{
  display: flex;
  flex-direction: column;
  gap: 3px;
}
.cal-svc-card-title{
  font-size: 1rem;
  font-weight: 600;
  color: var(--cal-text);
  line-height: 1.2;
}
.cal-svc-card-dur{
  font-size: 0.82rem;
  color: var(--cal-text);
  display: flex; align-items: center; gap: 4px;
}
.cal-svc-card-dur > i{ color: var(--cal-muted); font-size: 0.78rem; }

.cal-svc-card-badges{
  display: flex;
  gap: 5px;
  flex-wrap: wrap;
}
.cal-svc-badge{
  display: inline-flex;
  align-items: center;
  gap: 4px;
  font-size: 0.7rem;
  padding: 2px 8px;
  border-radius: 10px;
  font-weight: 500;
}
.cal-svc-badge-info{
  background: rgba(27, 117, 153, 0.1);
  color: var(--cal-primary);
}
.cal-svc-badge-req{
  background: rgba(224, 83, 83, 0.1);
  color: var(--cal-collision);
}
.cal-svc-badge-off{
  background: var(--cal-surface-2);
  color: var(--cal-muted);
}
.cal-svc-badge > i{ font-size: 0.68rem; }

.cal-svc-card-footer{
  display: flex;
  align-items: center;
  gap: 4px;
  border-top: 1px solid var(--cal-border-color);
  padding-top: 8px;
  margin-top: 2px;
}
.cal-svc-card-link{
  border: 1px solid var(--cal-border-color);
  background: transparent;
  padding: 4px 10px;
  border-radius: 6px;
  font-size: 0.78rem;
  color: var(--cal-muted);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  transition: background .12s, color .12s, border-color .12s;
}
.cal-svc-card-link:hover{
  color: var(--cal-primary);
  border-color: var(--cal-primary);
  background: rgba(27, 117, 153, 0.06);
}

/* Editor-Sektionen */
.cal-svc-section{
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--cal-border-color);
}
.cal-svc-section:first-of-type{
  border-top: none;
  margin-top: 8px;
  padding-top: 0;
}
.cal-svc-section-hdr{
  font-size: 0.78rem;
  font-weight: 600;
  color: var(--cal-muted);
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 8px;
  display: flex;
  align-items: center;
  gap: 6px;
}
.cal-svc-section-hdr > i{ color: var(--cal-muted); }
.cal-svc-photo-scope{
  padding: 6px 8px;
  background: var(--cal-surface-2);
  border-radius: 4px;
  transition: opacity .15s;
}
.cal-svc-link-eq{
  margin-right: auto;
}

/* ──────────────────────────────────────────────────────────────────────────
   29. ADMIN-MOBILE
   ────────────────────────────────────────────────────────────────────────── */
@media (max-width: 768px){
  .cal-mx-stats{
    grid-template-columns: repeat(2, 1fr);
  }
  .cal-mx-table-wrap{ font-size: 0.82rem; }
  .cal-mx-table th, .cal-mx-table td{ padding: 6px 8px; }
  .cal-mx-th-actions{ width: auto; }

  .cal-eqadm-link-cols{
    grid-template-columns: 1fr;
  }
  .cal-eqadm-cat-items{
    grid-template-columns: 1fr;
  }
  .cal-svc-grid{
    grid-template-columns: 1fr;
  }
  .cal-mx-obs-row{
    grid-template-columns: 1fr 60px 32px;
    row-gap: 4px;
  }
  .cal-mx-obs-dt, .cal-mx-obs-evt{
    grid-column: 1 / -1;
    font-size: 0.72rem;
  }
  .cal-mx-obs-bar-wrap{
    grid-column: 1;
  }
}

/* ══════════════════════════════════════════════════════════════════════════
   VIRTUAL LEAVE EVENTS IM NUTZER-KALENDER (Urlaub / Krank / ZTG)
   ══════════════════════════════════════════════════════════════════════════ */

/* Week-View: Allday-Row unterhalb des Headers, oberhalb des Stunden-Grids */
.cal-week-allday-row{
  display: grid;
  grid-template-columns: 60px repeat(7, minmax(var(--cal-day-min-width), 1fr));
  border-bottom: 1px solid var(--cal-border-color);
  background: var(--cal-surface);
  position: sticky;
  top: 57px;           /* knapp unter dem Header */
  z-index: 4;
  min-height: 28px;
}
.cal-week-allday-corner{
  border-right: 1px solid var(--cal-border-color);
  background: var(--cal-surface-2);
  font-size: 0.64rem;
  color: var(--cal-muted);
  display: flex;
  align-items: center;
  justify-content: center;
  letter-spacing: 0.03em;
  text-transform: uppercase;
}
.cal-week-allday-corner::before{
  content: "all-day";
}
.cal-week-allday-cell{
  border-right: 1px solid var(--cal-border-color);
  padding: 3px 4px;
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-height: 28px;
  overflow: hidden;
}

/* Allday-Leave-Pill (nicht klickbar, gestreifter Look) */
.cal-allday-ev.cal-allday-leave{
  cursor: default;
  opacity: 0.92;
  background-color: var(--cal-ev-color, #9aa0a6);
  background-image: repeating-linear-gradient(
    -45deg,
    transparent 0 4px,
    rgba(255,255,255,0.18) 4px 8px
  );
  border-left: 3px solid rgba(0,0,0,0.18);
  color: #fff;
  font-weight: 500;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cal-allday-ev.cal-allday-leave:hover{
  transform: none;  /* keine Hover-Animation für nicht-interaktive Elemente */
}

/* Month-View: Leave-Pill innerhalb der Zelle */
.cal-month-ev.cal-month-ev-leave{
  cursor: default;
  background-color: var(--cal-ev-color, #9aa0a6);
  background-image: repeating-linear-gradient(
    -45deg,
    transparent 0 3px,
    rgba(255,255,255,0.14) 3px 6px
  );
  border-left: 2px solid rgba(0,0,0,0.2);
  color: #fff;
  font-style: italic;
  font-weight: 500;
}

/* Agenda-View: Leave-Zeile gedämpft, nicht klickbar */
.cal-agenda-row.cal-agenda-row-leave{
  cursor: default;
  background: var(--cal-surface-2);
  opacity: 0.85;
}
.cal-agenda-row.cal-agenda-row-leave:hover{
  background: var(--cal-surface-2);
}
.cal-agenda-row.cal-agenda-row-leave .cal-agenda-time{
  color: var(--cal-ev-color, var(--cal-muted));
  font-size: 1.05rem;
}
.cal-agenda-row.cal-agenda-row-leave .cal-agenda-title{
  font-style: italic;
  color: var(--cal-text);
}

/* Self-Schraffur in Week/Day-Column
   (schwächer als Admin-Sicht, damit eigene Termine besser lesbar bleiben) */
.cal-urlaub-shade.cal-urlaub-shade-self{
  background: repeating-linear-gradient(
    -45deg,
    rgba(154,160,166,0.14) 0 5px,
    rgba(154,160,166,0.04) 5px 10px
  );
}
body.dark-theme .cal-urlaub-shade.cal-urlaub-shade-self,
body.theme-dark .cal-urlaub-shade.cal-urlaub-shade-self{
  background: repeating-linear-gradient(
    -45deg,
    rgba(255,255,255,0.08) 0 5px,
    rgba(255,255,255,0.02) 5px 10px
  );
}
.cal-urlaub-label.cal-urlaub-label-self{
  background: var(--cal-muted);
  opacity: 0.9;
  font-size: 0.66rem;
}

/* Day-View Anpassung: wenn leave aktiv ist, Column leicht bläulich-grau
   damit der User merkt: hier stimmt was nicht-normales */
.cal-day-col.cal-has-urlaub,
.cal-day-col-single.cal-has-urlaub{
  background: linear-gradient(180deg, var(--cal-surface-2) 0%, var(--cal-surface) 100%);
}

/* Mobile: Week-Allday-Row */
@media (max-width: 768px){
  .cal-week-allday-row{
    grid-template-columns: 42px repeat(7, minmax(60px, 1fr));
    top: 53px;
  }
  .cal-week-allday-corner{ font-size: 0.58rem; }
  .cal-week-allday-cell{ padding: 2px 2px; }
  .cal-allday-ev.cal-allday-leave{ font-size: 0.68rem; }
}

/* ══════════════════════════════════════════════════════════════════════════
   iCAL-ABONNEMENT-UI (calOpenSubscribe)
   ══════════════════════════════════════════════════════════════════════════ */

/* Topbar-Icon-Button (Zahnrad/RSS) */
.cal-btn-icon{
  width: 32px;
  height: 32px;
  border: 1px solid var(--cal-border-color);
  background: transparent;
  border-radius: 6px;
  color: var(--cal-muted);
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 0.88rem;
  transition: background .12s, color .12s, border-color .12s;
  flex-shrink: 0;
}
.cal-btn-icon:hover{
  color: var(--cal-primary);
  border-color: var(--cal-primary);
  background: rgba(27, 117, 153, 0.06);
}

/* Abo-Modal: Liste von Feeds */
.cal-sub-list{
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 14px;
}

.cal-sub-feed{
  background: var(--cal-surface-2);
  border: 1px solid var(--cal-border-color);
  border-radius: 8px;
  padding: 10px 12px;
  display: flex;
  flex-direction: column;
  gap: 8px;
  transition: border-color .12s;
}
.cal-sub-feed:hover{ border-color: var(--cal-primary); }

.cal-sub-feed-head{
  display: flex;
  align-items: center;
  gap: 8px;
}

.cal-sub-feed-label{
  flex: 1;
  border: 1px solid transparent;
  background: transparent;
  color: var(--cal-text);
  font-size: 0.95rem;
  font-weight: 600;
  padding: 4px 8px;
  border-radius: 4px;
  transition: border-color .12s, background .12s;
}
.cal-sub-feed-label:hover{
  background: var(--cal-surface);
}
.cal-sub-feed-label:focus{
  outline: none;
  border-color: var(--cal-primary);
  background: var(--cal-surface);
}

/* Frisch erzeugte URL anzeigen (einmalig) */
.cal-sub-url-row{
  display: flex;
  gap: 6px;
  align-items: stretch;
}
.cal-sub-url-input{
  flex: 1;
  padding: 6px 10px;
  border: 1px solid var(--cal-border-color);
  border-radius: 4px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 0.78rem;
  background: var(--cal-surface);
  color: var(--cal-text);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.cal-sub-url-input:focus{
  outline: 2px solid var(--cal-primary);
  outline-offset: -1px;
}
.cal-sub-url-note{
  font-size: 0.76rem;
  color: #c07900;
  background: rgba(255, 170, 0, 0.08);
  padding: 5px 8px;
  border-radius: 4px;
  border-left: 3px solid #e0a040;
  display: flex;
  align-items: center;
  gap: 6px;
}
.cal-sub-url-note > i{ flex-shrink: 0; }

/* Token-Info wenn URL nicht mehr verfügbar (existierendes Abo) */
.cal-sub-token-hidden{
  font-size: 0.78rem;
  color: var(--cal-muted);
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  padding: 5px 8px;
  background: var(--cal-surface);
  border-radius: 4px;
  display: flex;
  align-items: center;
  gap: 6px;
}

.cal-sub-feed-meta{
  font-size: 0.72rem;
  color: var(--cal-muted);
  font-variant-numeric: tabular-nums;
}

.cal-sub-actions{
  display: flex;
  justify-content: center;
  padding: 10px 0;
  border-top: 1px solid var(--cal-border-color);
  margin-top: 10px;
}

/* Einrichtungs-Hinweise */
.cal-sub-hint{
  margin-top: 12px;
  padding: 10px 12px;
  background: rgba(27, 117, 153, 0.06);
  border-left: 3px solid var(--cal-primary);
  border-radius: 4px;
  font-size: 0.82rem;
  color: var(--cal-text);
  line-height: 1.6;
}
.cal-sub-hint strong{ color: var(--cal-primary); }

/* Mobile: Abo-UI */
@media (max-width: 600px){
  .cal-sub-url-row{ flex-direction: column; }
  .cal-sub-url-input{ font-size: 0.72rem; }
  .cal-sub-url-row .btn{ width: 100%; }
}

/* ══════════════════════════════════════════════════════════════════════════
   CALL-AHEAD-FEATURE — Editor-Sektion, Detail-Banner, Fire-Modal, Event-Badge
   ══════════════════════════════════════════════════════════════════════════ */

/* ── Editor: Call-Ahead-Sektion ──────────────────────────────────────────── */
.cal-ed-callahead{
  background: var(--cal-surface);
  border: 1.5px solid var(--cal-border-color);
  border-radius: 10px;
  padding: 0;
  margin: 14px 0;
  overflow: hidden;
  transition: border-color .15s, background .15s;
}
.cal-ed-callahead:has(#cal-ed-ca-enable:checked),
.cal-ed-callahead.cal-ed-callahead-active{
  border-color: var(--cal-primary);
  background: linear-gradient(to bottom, rgba(27, 117, 153, 0.04), var(--cal-surface));
}

.cal-ed-callahead-toggle{
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  cursor: pointer;
  user-select: none;
  margin: 0;
}
.cal-ed-callahead-toggle input{ display: none; }
.cal-ed-callahead-toggle-visual{
  position: relative;
  flex-shrink: 0;
  width: 44px; height: 24px;
  background: var(--cal-surface-2);
  border: 1px solid var(--cal-border-color);
  border-radius: 12px;
  transition: background .15s, border-color .15s;
}
.cal-ed-callahead-toggle-visual::after{
  content: '';
  position: absolute;
  top: 2px; left: 3px;
  width: 18px; height: 18px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 1px 3px rgba(0,0,0,.2);
  transition: transform .15s;
}
.cal-ed-callahead-toggle input:checked + .cal-ed-callahead-toggle-visual{
  background: var(--cal-primary);
  border-color: var(--cal-primary);
}
.cal-ed-callahead-toggle input:checked + .cal-ed-callahead-toggle-visual::after{
  transform: translateX(18px);
}
.cal-ed-callahead-hdr{
  flex: 1;
  display: flex; align-items: center; gap: 10px;
}
.cal-ed-callahead-icon{
  width: 34px; height: 34px;
  border-radius: 8px;
  background: rgba(27, 117, 153, 0.1);
  color: var(--cal-primary);
  display: flex; align-items: center; justify-content: center;
  font-size: 0.95rem;
  flex-shrink: 0;
}
.cal-ed-callahead-label{
  font-weight: 600;
  font-size: 0.95rem;
  color: var(--cal-text);
}
.cal-ed-callahead-sub{
  font-size: 0.78rem;
  color: var(--cal-muted);
  margin-top: 1px;
}
.cal-ed-callahead-body{
  padding: 0 16px 16px;
  border-top: 1px solid var(--cal-border-color);
  animation: calCaSlideDown .2s ease-out;
}
@keyframes calCaSlideDown{
  from { opacity: 0; transform: translateY(-4px); }
  to   { opacity: 1; transform: translateY(0); }
}
.cal-ed-callahead-row{
  display: flex;
  align-items: center;
  gap: 12px;
  margin-top: 12px;
  flex-wrap: wrap;
}
.cal-ed-callahead-row-label{
  font-size: 0.82rem;
  color: var(--cal-muted);
  min-width: 100px;
  font-weight: 500;
}
.cal-ed-callahead-chips{
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.cal-ed-chip{
  background: var(--cal-surface-2);
  border: 1px solid var(--cal-border-color);
  color: var(--cal-text);
  padding: 7px 12px;
  border-radius: 20px;
  font-size: 0.82rem;
  font-family: inherit;
  cursor: pointer;
  display: inline-flex; align-items: center; gap: 6px;
  transition: background .12s, border-color .12s, color .12s, transform .08s;
}
.cal-ed-chip:hover{
  border-color: var(--cal-primary);
  color: var(--cal-primary);
}
.cal-ed-chip:active{ transform: scale(0.97); }
.cal-ed-chip.active{
  background: var(--cal-primary);
  border-color: var(--cal-primary);
  color: #fff;
  font-weight: 600;
}
.cal-ed-chip.active i{ color: #fff; }
.cal-ed-callahead-custom{
  display: flex; align-items: center; gap: 8px;
}
.cal-ed-callahead-custom input{
  width: 90px;
}
.cal-ed-callahead-unit{
  font-size: 0.85rem;
  color: var(--cal-muted);
}
.cal-ed-callahead-hint{
  font-size: 0.72rem;
  color: var(--cal-muted);
  margin-top: 4px;
  display: block;
}
.cal-ed-callahead-preview{
  margin-top: 12px;
  padding: 10px 12px;
  background: rgba(27, 117, 153, 0.08);
  border-left: 3px solid var(--cal-primary);
  border-radius: 4px;
  font-size: 0.85rem;
  color: var(--cal-text);
  display: flex; align-items: center; gap: 8px;
}
.cal-ed-callahead-preview i{
  color: var(--cal-primary);
}

/* ── Detail-Banner: Call-Ahead prominent oben im Event-Detail ────────────── */
.cal-detail-ca-banner{
  display: flex;
  gap: 12px;
  align-items: center;
  padding: 12px 14px;
  background: linear-gradient(135deg, rgba(27, 117, 153, 0.12), rgba(27, 117, 153, 0.04));
  border: 1px solid rgba(27, 117, 153, 0.3);
  border-radius: 10px;
  margin-bottom: 14px;
}
.cal-detail-ca-icon{
  flex-shrink: 0;
  width: 40px; height: 40px;
  border-radius: 10px;
  background: var(--cal-primary);
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.1rem;
  animation: calCaPulse 2s ease-in-out infinite;
}
@keyframes calCaPulse{
  0%, 100% { box-shadow: 0 0 0 0 rgba(27, 117, 153, 0.4); }
  50%      { box-shadow: 0 0 0 8px rgba(27, 117, 153, 0); }
}
.cal-detail-ca-body{
  flex: 1;
  min-width: 0;
}
.cal-detail-ca-title{
  font-weight: 700;
  font-size: 0.88rem;
  color: var(--cal-primary);
  text-transform: uppercase;
  letter-spacing: 0.5px;
}
.cal-detail-ca-mode{
  font-size: 1rem;
  color: var(--cal-text);
  margin-top: 2px;
  font-weight: 500;
}
.cal-detail-ca-note{
  margin-top: 4px;
  font-size: 0.8rem;
  color: var(--cal-muted);
}
.cal-detail-ca-actions{ flex-shrink: 0; }
.cal-detail-ca-phone{
  display: inline-flex; align-items: center; gap: 6px;
  padding: 10px 14px;
  background: var(--cal-primary);
  color: #fff;
  font-weight: 600;
  border-radius: 8px;
  text-decoration: none;
  font-size: 0.88rem;
  transition: background .1s, transform .08s;
}
.cal-detail-ca-phone:hover{ background: #165a75; color: #fff; }
.cal-detail-ca-phone:active{ transform: scale(0.97); }

/* ── Fire-Modal: ploppt auf wenn Reminder ausgelöst wird ─────────────────── */
.cal-ca-modal{
  position: fixed;
  inset: 0;
  background: rgba(0, 0, 0, 0.65);
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 10000;
  padding: 16px;
  animation: calCaFadeIn .18s ease-out;
}
@keyframes calCaFadeIn{
  from { opacity: 0; }
  to   { opacity: 1; }
}
.cal-ca-modal-inner{
  position: relative;
  background: var(--cal-surface);
  border-radius: 14px;
  padding: 24px;
  max-width: 420px;
  width: 100%;
  text-align: center;
  box-shadow: 0 20px 60px rgba(0, 0, 0, 0.3);
  animation: calCaSlideUp .22s ease-out;
}
@keyframes calCaSlideUp{
  from { opacity: 0; transform: translateY(12px) scale(0.96); }
  to   { opacity: 1; transform: translateY(0)    scale(1); }
}
.cal-ca-modal-icon{
  width: 64px; height: 64px;
  margin: 0 auto 12px;
  border-radius: 50%;
  background: var(--cal-primary);
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: 1.6rem;
  animation: calCaShake .5s ease-out;
}
@keyframes calCaShake{
  0%, 100% { transform: rotate(0deg); }
  20%      { transform: rotate(-12deg); }
  40%      { transform: rotate(10deg); }
  60%      { transform: rotate(-6deg); }
  80%      { transform: rotate(4deg); }
}
.cal-ca-modal-title{
  font-size: 0.85rem;
  color: var(--cal-primary);
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  margin-bottom: 6px;
}
.cal-ca-modal-event{
  font-size: 1.2rem;
  font-weight: 700;
  color: var(--cal-text);
  margin-bottom: 4px;
  line-height: 1.3;
}
.cal-ca-modal-meta{
  font-size: 0.88rem;
  color: var(--cal-muted);
  margin-bottom: 10px;
}
.cal-ca-modal-phone{
  font-size: 1.15rem;
  font-weight: 600;
  color: var(--cal-text);
  padding: 10px;
  background: var(--cal-surface-2);
  border-radius: 8px;
  margin: 10px 0;
  font-variant-numeric: tabular-nums;
}
.cal-ca-modal-note{
  font-size: 0.82rem;
  color: var(--cal-muted);
  margin: 8px 0 12px;
  padding: 8px 10px;
  background: rgba(255, 193, 7, 0.1);
  border-radius: 6px;
  text-align: left;
}
.cal-ca-modal-actions{
  display: flex;
  flex-direction: column;
  gap: 8px;
  margin-top: 16px;
}
.cal-ca-btn{
  padding: 12px 16px;
  border-radius: 8px;
  font-size: 0.95rem;
  font-weight: 600;
  cursor: pointer;
  border: 1px solid transparent;
  display: inline-flex; align-items: center; justify-content: center; gap: 8px;
  text-decoration: none;
  font-family: inherit;
  transition: background .12s, transform .08s;
}
.cal-ca-btn:active{ transform: scale(0.97); }
.cal-ca-btn-primary{
  background: var(--cal-primary);
  color: #fff;
  font-size: 1.05rem;
  padding: 14px 16px;
}
.cal-ca-btn-primary:hover{ background: #165a75; color: #fff; }
.cal-ca-btn-secondary{
  background: var(--cal-surface-2);
  color: var(--cal-text);
  border-color: var(--cal-border-color);
}
.cal-ca-btn-secondary:hover{ border-color: var(--cal-primary); color: var(--cal-primary); }
.cal-ca-btn-ghost{
  background: transparent;
  color: var(--cal-muted);
  border: none;
}
.cal-ca-btn-ghost:hover{ color: var(--cal-text); background: var(--cal-surface-2); }
.cal-ca-modal-close{
  position: absolute;
  top: 8px; right: 8px;
  width: 32px; height: 32px;
  border-radius: 50%;
  border: none;
  background: transparent;
  color: var(--cal-muted);
  cursor: pointer;
  font-size: 0.88rem;
  display: flex; align-items: center; justify-content: center;
}
.cal-ca-modal-close:hover{ background: var(--cal-surface-2); color: var(--cal-text); }

/* ── Event-Card Phone-Badge ──────────────────────────────────────────────── */
.cal-ev-ca-badge{
  position: absolute;
  top: 4px; right: 4px;
  width: 20px; height: 20px;
  border-radius: 50%;
  background: var(--cal-primary);
  color: #fff;
  display: flex; align-items: center; justify-content: center;
  font-size: 0.62rem;
  box-shadow: 0 1px 3px rgba(0,0,0,0.2);
  pointer-events: none;
}

/* ── Mobile ──────────────────────────────────────────────────────────────── */
@media (max-width: 600px){
  .cal-ed-callahead-row{
    flex-direction: column;
    align-items: stretch;
  }
  .cal-ed-callahead-row-label{
    min-width: 0;
    margin-bottom: 4px;
  }
  .cal-ed-chip{
    padding: 9px 14px;
    font-size: 0.88rem;
    min-height: 40px;
  }
  .cal-detail-ca-banner{
    flex-direction: column;
    align-items: flex-start;
    gap: 10px;
  }
  .cal-detail-ca-phone{
    width: 100%;
    justify-content: center;
    padding: 14px;
    font-size: 1rem;
  }
  .cal-ca-modal-inner{
    padding: 20px 18px;
  }
  .cal-ca-btn{
    padding: 14px 16px;
    min-height: 48px;
  }
}

/* ══════════════════════════════════════════════════════════════════════════
   MOBILE-UX — Gesten, FAB, Pull-to-Refresh, Touch-Targets
   Google-Calendar-Feeling auf Mobile
   ══════════════════════════════════════════════════════════════════════════ */

/* ── Pull-to-Refresh Indicator ───────────────────────────────────────────── */
.sd-pull-refresh-indicator{
  position: absolute;
  top: -50px;
  left: 50%;
  width: 40px;
  height: 40px;
  margin-left: -20px;
  border-radius: 50%;
  background: var(--cal-surface);
  box-shadow: 0 2px 8px rgba(0,0,0,0.15);
  display: flex;
  align-items: center;
  justify-content: center;
  color: var(--cal-muted);
  opacity: 0;
  pointer-events: none;
  z-index: 100;
  transition: opacity 0.15s;
}
.sd-pull-refresh-spinner{
  transition: transform 0.05s linear;
  display: flex; align-items: center; justify-content: center;
}
.sd-pull-ready{
  color: var(--cal-primary);
}
.sd-pull-refreshing .sd-pull-refresh-spinner{
  animation: sdPullSpin 0.8s linear infinite;
}
@keyframes sdPullSpin{
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}

/* ── Long-Press-Visual ───────────────────────────────────────────────────── */
.sd-longpress-active{
  animation: sdLongPressPulse 0.5s ease-out;
}
@keyframes sdLongPressPulse{
  0%   { box-shadow: inset 0 0 0 0 rgba(27, 117, 153, 0.0); }
  50%  { box-shadow: inset 0 0 0 60px rgba(27, 117, 153, 0.15); }
  100% { box-shadow: inset 0 0 0 0 rgba(27, 117, 153, 0.0); }
}

/* ── Swipe-Übergangs-Animationen ─────────────────────────────────────────── */
/* Die Seite schiebt weg in Swipe-Richtung, neue Woche/Tag kommt von der
   Gegenrichtung rein. Googles Subtile Slide-Animation nachgebaut. */
.cal-body{
  transition: transform 0.15s ease-out, opacity 0.15s ease-out;
  
}
.cal-body-sliding-left{
  transform: translateX(-20%);
  opacity: 0.3;
}
.cal-body-sliding-right{
  transform: translateX(20%);
  opacity: 0.3;
}
.cal-body-sliding-in-right{
  animation: calSlideInRight 0.18s ease-out;
}
.cal-body-sliding-in-left{
  animation: calSlideInLeft 0.18s ease-out;
}
@keyframes calSlideInRight{
  from { transform: translateX(20%); opacity: 0.3; }
  to   { transform: translateX(0);   opacity: 1; }
}
@keyframes calSlideInLeft{
  from { transform: translateX(-20%); opacity: 0.3; }
  to   { transform: translateX(0);    opacity: 1; }
}

/* ── FAB (Floating Action Button) ────────────────────────────────────────── */
.cal-fab{
  position: fixed;
  bottom: 80px;          /* über der Mobile-Nav */
  right: 20px;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: var(--cal-primary);
  color: #fff;
  border: none;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2), 0 2px 4px rgba(0, 0, 0, 0.15);
  cursor: pointer;
  font-size: 1.3rem;
  display: none;  /* nur Mobile */
  align-items: center;
  justify-content: center;
  z-index: 500;
  transition: transform 0.12s, box-shadow 0.12s, background 0.12s;
}
.cal-fab:hover,
.cal-fab:focus{
  background: #165a75;
  color: #fff;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.25), 0 3px 6px rgba(0, 0, 0, 0.2);
}
.cal-fab:active{
  transform: scale(0.94);
}

/* ── Mobile-spezifische Overrides ────────────────────────────────────────── */
@media (max-width: 768px){
  /* FAB sichtbar */
  .cal-fab{ display: flex; }

  /* Top-Bar Button „Neuer Termin" verstecken — der FAB ersetzt ihn */
  .cal-topbar-actions .btn-primary{ display: none; }

  /* Top-Bar kompakter */
  .cal-topbar{
    flex-wrap: wrap;
    gap: 6px;
    padding: 8px 10px;
  }
  .cal-title{
    font-size: 1rem;
    flex: 1 1 100%;
    order: 3;
    text-align: center;
    margin: 6px 0 0;
  }
  .cal-topbar-nav .btn{
    min-width: 40px;
    min-height: 40px;
    padding: 0 10px;
  }
  .cal-topbar-actions{
    margin-left: auto;
  }

  /* View-Switcher Scrollbar-frei horizontal scrollbar */
  .cal-topbar-views{
    overflow-x: auto;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    flex: 1 1 100%;
    order: 4;
    margin-top: 4px;
    padding-bottom: 2px;
  }
  .cal-topbar-views::-webkit-scrollbar{ display: none; }
  .cal-view-btn{
    flex-shrink: 0;
    min-height: 36px;
  }

  /* Event-Cards: größere Touch-Targets */
  .cal-event{
    min-height: 36px;
  }

  /* Icon-Buttons in Topbar größer für Touch */
  .cal-btn-icon{
    min-width: 40px;
    min-height: 40px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  /* Editor-Modal nimmt fast gesamten Screen */
  .cal-editor-modal{
    max-width: 100%;
    margin: 0;
    border-radius: 16px 16px 0 0;
    min-height: 80vh;
  }
  .cal-editor-overlay{
    align-items: flex-end;
  }

  /* Detail-Modal ebenso (für Event-Tap) */
  .cal-detail-modal{
    max-width: 100%;
    margin: 0;
    border-radius: 16px 16px 0 0;
    max-height: 92vh;
  }
  .cal-detail-overlay{
    align-items: flex-end;
  }

  /* Month-View Zellen höher für Touch */
  .cal-month-cell{
    min-height: 64px;
  }

  /* Agenda-Items mit mehr Padding für Fingerdruck */
  .cal-agenda-item{
    padding: 14px 12px;
    min-height: 56px;
  }

  /* Desktop-only: Hover-States nicht triggern auf Touch */
  .cal-event:hover{ transform: none; }

  /* Call-Ahead-Banner optimiert */
  .cal-detail-ca-banner{
    margin-bottom: 10px;
  }
  .cal-detail-ca-phone{
    padding: 14px 16px;
    font-size: 1rem;
    min-height: 48px;
  }
}

/* Tablet-Zwischenbreite: Kalender soll 2-Spaltig bleiben, aber Topbar breiter */
@media (min-width: 769px) and (max-width: 1024px){
  .cal-topbar{
    flex-wrap: wrap;
    gap: 10px;
  }
  .cal-fab{ display: none; }
}

/* Desktop ab 1025px: FAB nicht zeigen (Top-Bar-Button reicht) */
@media (min-width: 1025px){
  .cal-fab{ display: none; }
}

/* ── Safe-Area für iPhone Home-Indicator ─────────────────────────────────── */
@supports (padding-bottom: env(safe-area-inset-bottom)){
  .cal-fab{
    bottom: calc(80px + env(safe-area-inset-bottom));
  }
}

/* ══════════════════════════════════════════════════════════════════════════
   KALENDER-ZUGRIFFSRECHTE (Verwalter-UI)
   ══════════════════════════════════════════════════════════════════════════ */

.cal-csub-modal{
  max-width: 920px !important;
  width: 95vw;
  max-height: 86vh;
  display: flex;
  flex-direction: column;
}

.cal-csub-body{
  flex: 1;
  overflow-y: auto;
  padding: 0;
  display: flex;
  flex-direction: column;
}

/* Hinweis-Box oben */
.cal-csub-hint{
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 12px 16px;
  margin: 16px 20px 0;
  background: rgba(27, 117, 153, 0.08);
  border-left: 3px solid #1B7599;
  border-radius: 6px;
  font-size: 12px;
  color: var(--text);
  line-height: 1.5;
}
.cal-csub-hint i{
  color: #1B7599;
  margin-top: 2px;
  flex-shrink: 0;
}

/* 2-Spalten-Grid */
.cal-csub-grid{
  display: grid;
  grid-template-columns: 320px 1fr;
  gap: 16px;
  padding: 16px 20px;
  flex: 1;
  min-height: 0;
}

@media (max-width: 720px){
  .cal-csub-grid{
    grid-template-columns: 1fr;
  }
}

.cal-csub-viewers,
.cal-csub-targets{
  display: flex;
  flex-direction: column;
  background: var(--surface);
  border: 1px solid var(--border);
  border-radius: 10px;
  overflow: hidden;
  min-height: 300px;
}

.cal-csub-section-hdr{
  padding: 10px 14px;
  background: var(--white);
  border-bottom: 1px solid var(--border);
  font-size: 11px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.4px;
  color: var(--muted);
  display: flex;
  align-items: center;
  gap: 6px;
}
.cal-csub-section-hdr i{
  color: #1B7599;
}

.cal-csub-viewer-list{
  flex: 1;
  overflow-y: auto;
  padding: 6px;
}

.cal-csub-viewer-item{
  display: flex;
  align-items: center;
  gap: 10px;
  width: 100%;
  padding: 10px 12px;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.12s;
  text-align: left;
  margin-bottom: 4px;
  color: var(--text);
}
.cal-csub-viewer-item:hover{
  background: var(--white);
  border-color: var(--border);
}
.cal-csub-viewer-item.active{
  background: rgba(27, 117, 153, 0.1);
  border-color: #1B7599;
}
.cal-csub-viewer-item.active .cal-csub-viewer-name{
  color: #1B7599;
}

.cal-csub-viewer-avatar{
  width: 36px;
  height: 36px;
  min-width: 36px;
  border-radius: 50%;
  background: linear-gradient(135deg, #1B7599, #2a9bc9);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  font-weight: 700;
  flex-shrink: 0;
}

.cal-csub-viewer-info{
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.cal-csub-viewer-name{
  font-size: 13px;
  font-weight: 600;
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.cal-csub-viewer-meta{
  font-size: 11px;
}

.cal-csub-meta-mute{ color: var(--muted); }
.cal-csub-meta-count{
  color: #1B7599;
  font-weight: 600;
}

.cal-csub-viewer-item > i.fa-chevron-right{
  color: #1B7599;
  font-size: 12px;
  flex-shrink: 0;
}

/* Rechte Spalte: Targets */
.cal-csub-selected-viewer{
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 12px 16px;
  background: linear-gradient(180deg, rgba(27, 117, 153, 0.06) 0%, transparent 100%);
  border-bottom: 1px solid var(--border);
  font-size: 13px;
  color: var(--text);
  flex-wrap: wrap;
}
.cal-csub-selected-viewer strong{
  color: var(--text);
  font-weight: 700;
}
.cal-csub-count-badge{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 22px;
  padding: 2px 8px;
  background: #1B7599;
  color: #fff;
  border-radius: 10px;
  font-size: 12px;
  font-weight: 700;
}

.cal-csub-target-list{
  flex: 1;
  overflow-y: auto;
  padding: 6px;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.cal-csub-target-item{
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  background: transparent;
  border: 1px solid transparent;
  border-radius: 8px;
  cursor: pointer;
  transition: all 0.12s;
  min-height: 48px;
}
.cal-csub-target-item:hover{
  background: var(--white);
  border-color: var(--border);
}
.cal-csub-target-item.granted{
  background: rgba(34, 197, 94, 0.06);
  border-color: rgba(34, 197, 94, 0.2);
}

.cal-csub-cb{
  width: 18px;
  height: 18px;
  min-width: 18px;
  margin: 0;
  cursor: pointer;
  accent-color: #22c55e;
  flex-shrink: 0;
}

.cal-csub-target-avatar{
  width: 32px;
  height: 32px;
  min-width: 32px;
  border-radius: 50%;
  background: var(--bg);
  color: var(--muted);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 11px;
  font-weight: 700;
  flex-shrink: 0;
  border: 1px solid var(--border);
}
.cal-csub-target-item.granted .cal-csub-target-avatar{
  background: linear-gradient(135deg, #22c55e, #16a34a);
  color: #fff;
  border-color: #16a34a;
}

.cal-csub-target-name{
  flex: 1;
  font-size: 13px;
  font-weight: 500;
  color: var(--text);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.cal-csub-granted-badge{
  display: inline-flex;
  align-items: center;
  gap: 4px;
  padding: 2px 8px;
  background: rgba(34, 197, 94, 0.12);
  color: #16a34a;
  border-radius: 10px;
  font-size: 10px;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.3px;
  flex-shrink: 0;
}

/* Empty-State */
.cal-csub-empty{
  text-align: center;
  padding: 40px 20px;
  color: var(--muted);
}
.cal-csub-empty i{
  font-size: 40px;
  opacity: 0.4;
  margin-bottom: 12px;
  display: block;
}
.cal-csub-empty h3{
  margin: 0 0 8px;
  font-size: 16px;
  color: var(--text);
}
.cal-csub-empty p{
  margin: 0;
  font-size: 13px;
  max-width: 400px;
  margin: 0 auto;
  line-height: 1.5;
}

/* Footer mit Bulk-Actions */
.cal-csub-footer{
  padding: 12px 20px;
  border-top: 1px solid var(--border);
  background: var(--surface);
}

.cal-csub-bulk-actions{
  display: flex;
  gap: 8px;
  justify-content: flex-end;
  flex-wrap: wrap;
}

@media (max-width: 720px){
  .cal-csub-bulk-actions{
    justify-content: stretch;
  }
  .cal-csub-bulk-actions .btn{
    flex: 1;
  }
  .cal-csub-modal{
    max-height: 95vh;
  }
  .cal-csub-viewers,
  .cal-csub-targets{
    min-height: 200px;
  }
}

/* ══════════════════════════════════════════════════════════════════════════
   DRAG-TO-CREATE PREVIEW (Google-Calendar-Style)
   ══════════════════════════════════════════════════════════════════════════ */

.cal-drag-preview{
  position: absolute;
  left: 2px;
  right: 2px;
  background: linear-gradient(135deg, rgba(59, 130, 246, 0.7), rgba(37, 99, 235, 0.85));
  border: 2px dashed rgba(255, 255, 255, 0.8);
  border-radius: 6px;
  color: #fff;
  font-size: 11px;
  font-weight: 600;
  pointer-events: none;
  z-index: 50;
  box-shadow: 0 4px 12px rgba(37, 99, 235, 0.3);
  animation: cal-drag-preview-pulse 1.2s ease-in-out infinite;
  padding: 6px 8px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  min-height: 30px;
}

@keyframes cal-drag-preview-pulse{
  0%, 100% { opacity: 1; }
  50% { opacity: 0.85; }
}

.cal-drag-preview-time{
  width: 100%;
  line-height: 1.2;
}
.cal-drag-preview-range{
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.2px;
}
.cal-drag-preview-dur{
  font-size: 10px;
  opacity: 0.9;
  margin-top: 2px;
  font-weight: 500;
}

/* Während ein Drag läuft: Cursor anpassen auf Spalten */
.cal-day-col{
  user-select: none;
  -webkit-user-select: none;
}

/* Hint-Text bei leerem Kalender (Kurzhilfe) */
.cal-day-col:hover:not(.cal-has-urlaub)::after{
  /* Nur desktop */
}
@media (hover: hover){
  .cal-drag-hint-label{
    display: inline-block;
  }
}

/* ══════════════════════════════════════════════════════════════════════════
   PHASE 1: Neue Shell (FB/TT-Style) + Sidebar + Mini-Kalender
   ══════════════════════════════════════════════════════════════════════════ */

/* Title Row */
.cal-title-row{
  padding:12px 14px;border-bottom:1px solid var(--border);background:var(--surface);
  display:flex;gap:12px;align-items:center;flex-shrink:0;
}
.cal-title-h2{margin:0;font-size:18px;flex-shrink:0;}

/* Nav Row — reuses .lb-view-toggle, .lb-nav-btn etc. from logbook/timetrack */
.cal-nav-row{
  padding:10px 14px;border-bottom:1px solid var(--border);background:var(--bg);
  display:flex;gap:10px;align-items:center;flex-wrap:wrap;flex-shrink:0;
}

/* ── Cal-spezifische Nav-Buttons — größer + Liquid-Glass-SemperConnect ─────
   Override der lb-nav-btn nur INNERHALB cal-nav-row, damit Logbook/Timetrack
   ihre eigene Optik behalten. */
.cal-nav-row .lb-nav-btn{
  width:38px !important;
  height:38px !important;
  padding:0 !important;
  border:0 !important;
  border-radius:10px !important;
  display:inline-flex !important;
  align-items:center;
  justify-content:center;
  background:
    linear-gradient(180deg,
      rgba(255,255,255,.30) 0%,
      rgba(255,255,255,.08) 40%,
      rgba(255,255,255,.02) 100%),
    linear-gradient(180deg,#2a98c2 0%,#1B7599 100%) !important;
  color:#fff !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.55),
    inset 0 -1px 0 rgba(0,0,0,.10),
    0 2px 6px rgba(27,117,153,.30) !important;
  transition:transform .15s ease, box-shadow .15s ease, background .15s ease !important;
  cursor:pointer;
}
.cal-nav-row .lb-nav-btn:hover{
  transform:translateY(-1px);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.70),
    inset 0 -1px 0 rgba(0,0,0,.10),
    0 4px 14px rgba(27,117,153,.45) !important;
}
.cal-nav-row .lb-nav-btn:active{
  transform:translateY(0);
  box-shadow:
    inset 0 2px 4px rgba(0,0,0,.18),
    0 1px 3px rgba(27,117,153,.20) !important;
}
.cal-nav-row .lb-nav-btn i{
  font-size:15px !important;
  line-height:1;
  filter:drop-shadow(0 1px 1px rgba(0,0,0,.18));
}

/* Heute-Button im selben Stil, breiter + Label */
.cal-nav-row .lb-nav-today{
  height:38px !important;
  padding:0 16px !important;
  border:0 !important;
  border-radius:10px !important;
  font-weight:700 !important;
  font-size:12px !important;
  letter-spacing:.3px !important;
  background:
    linear-gradient(180deg,
      rgba(255,255,255,.30) 0%,
      rgba(255,255,255,.08) 40%,
      rgba(255,255,255,.02) 100%),
    linear-gradient(180deg,#2a98c2 0%,#1B7599 100%) !important;
  color:#fff !important;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.55),
    inset 0 -1px 0 rgba(0,0,0,.10),
    0 2px 6px rgba(27,117,153,.30) !important;
  text-shadow:0 1px 1px rgba(0,0,0,.18);
  transition:transform .15s ease, box-shadow .15s ease !important;
}
.cal-nav-row .lb-nav-today:hover{
  transform:translateY(-1px);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.70),
    0 4px 14px rgba(27,117,153,.45) !important;
}

/* Layout: Sidebar + Body */
.cal-layout{display:flex;flex:1;overflow:hidden;min-height:0;}
.cal-sidebar{
  width:220px;flex-shrink:0;border-right:1px solid var(--border);
  padding:12px;overflow-y:auto;background:var(--surface);
  display:flex;flex-direction:column;gap:12px;
  transition:width .2s ease;
  position:relative;min-height:0;
}
/* Collapse toggle — gleicher Look wie .verw-collapse-btn (Verwaltungs-Nav) */
.cal-sidebar-collapse{
  position:absolute;top:12px;right:12px;z-index:5;
  width:28px;height:28px;border-radius:6px;
  border:none;background:none;
  color:#1B7599;cursor:pointer;font-size:14px;
  display:flex;align-items:center;justify-content:center;
  padding:0;
  transition:all .15s;
}
.cal-sidebar-collapse:hover{background:rgba(27,117,153,.12);}
.cal-sidebar-collapse i{
  transition:transform .2s ease;
}
/* Collapsed */
.cal-sidebar.collapsed{width:42px;padding:8px 6px;overflow:hidden;}
.cal-sidebar.collapsed>*:not(.cal-sidebar-collapse){display:none;}
.cal-sidebar.collapsed .cal-sidebar-collapse{
  position:static;margin:0 auto;
}
.cal-sidebar.collapsed .cal-sidebar-collapse i{transform:rotate(180deg);}

/* ── MINI MONTH CALENDAR ─────────────────────────────────────────────── */
.cal-mini{user-select:none;}
.cal-mini-hdr{
  display:flex;align-items:center;justify-content:space-between;
  margin-bottom:8px;padding-right:36px;
}
.cal-mini-title{font-size:13px;font-weight:700;}
.cal-mini-nav{
  background:none;border:none;cursor:pointer;padding:4px 6px;
  border-radius:4px;color:var(--text);font-size:12px;
}
.cal-mini-nav:hover{background:var(--hover);}
.cal-mini-dow{
  display:grid;grid-template-columns:repeat(7,1fr);
  text-align:center;font-size:10px;font-weight:600;color:var(--muted);
  margin-bottom:4px;
}
.cal-mini-grid{
  display:grid;grid-template-columns:repeat(7,1fr);gap:1px;
}
.cal-mini-day{
  display:flex;align-items:center;justify-content:center;
  width:28px;height:28px;font-size:11px;border-radius:50%;
  cursor:pointer;transition:background .1s;
}
.cal-mini-day:hover{background:var(--hover);}
.cal-mini-other{visibility:hidden;}
.cal-mini-today{
  background:#1B7599;color:#fff;font-weight:700;
}
.cal-mini-today:hover{background:#15647f;}
.cal-mini-selected{
  outline:2px solid #1B7599;outline-offset:-2px;
}
.cal-mini-weekend{color:#c62828;}
.cal-mini-holiday{
  background:rgba(239,68,68,.08);
  position:relative;
}
.cal-mini-holiday::after{
  content:'';position:absolute;bottom:2px;left:50%;transform:translateX(-50%);
  width:4px;height:4px;border-radius:50%;background:#ef4444;
}

/* ── FILTER TOGGLES ──────────────────────────────────────────────────── */
.cal-filters{display:flex;flex-direction:column;gap:4px;}
.cal-filter-item{
  display:flex;align-items:center;gap:8px;
  font-size:12px;padding:6px 8px;border-radius:6px;cursor:pointer;
  transition:background .1s;
}
.cal-filter-item:hover{background:var(--hover);}
.cal-filter-item input{width:14px;height:14px;margin:0;}
.cal-filter-item i{font-size:11px;width:14px;text-align:center;}

/* ── SIDEBAR ACTIONS ─────────────────────────────────────────────────── */
.cal-sidebar-actions{
  display:flex;flex-direction:column;gap:4px;
  padding-top:8px;border-top:1px solid var(--border);
}
/* SemperConnect-Style: dezent-clean, brand-teal Akzent beim Hover statt
   schmuckloses background:none. */
.cal-sidebar-btn{
  display:flex;align-items:center;gap:8px;
  background:rgba(27,117,153,.04);
  border:1px solid rgba(27,117,153,.10);
  padding:7px 10px;border-radius:7px;
  font-size:11.5px;font-weight:600;color:#0f3a52;
  cursor:pointer;text-align:left;font-family:inherit;
  transition:background .14s ease, border-color .14s ease, transform .14s ease;
}
.cal-sidebar-btn:hover{
  background:rgba(27,117,153,.10);
  border-color:rgba(27,117,153,.30);
  transform:translateY(-1px);
}
.cal-sidebar-btn i{color:#1B7599;width:14px;text-align:center;font-size:12px;}

/* ── MOBILE: Sidebar-Drawer + kompakte Nav ────────────────────────────── */
@media (max-width:768px){
  /* Sidebar wird zum Slide-In-Drawer von links */
  .cal-sidebar{
    position:fixed;
    top:0;
    bottom:0;
    left:0;
    width:280px;
    max-width:85vw;
    z-index:1100;
    transform:translateX(-105%);
    transition:transform .26s cubic-bezier(.34,1.56,.64,1);
    box-shadow:6px 0 24px rgba(0,0,0,.18);
    border-right:1px solid var(--border);
    padding-top:max(16px, env(safe-area-inset-top, 0px));
  }
  .cal-sidebar.cal-drawer-open{
    transform:translateX(0);
  }
  /* Im Drawer-Modus den Collapse-Button ausblenden — stattdessen ein
     Schließen-X oben rechts via JS injiziert. */
  .cal-sidebar.cal-drawer-open .cal-sidebar-collapse{ display:none; }

  /* Backdrop */
  .cal-drawer-backdrop{
    position:fixed;inset:0;
    background:rgba(0,0,0,.42);
    z-index:1099;
    opacity:0;
    pointer-events:none;
    transition:opacity .22s ease;
  }
  .cal-drawer-backdrop.show{
    opacity:1;
    pointer-events:auto;
  }

  /* Hamburger-Button im Title-Row (nur Mobile) */
  .cal-mobile-menu-btn{
    display:inline-flex;
    align-items:center;justify-content:center;
    width:40px;height:40px;
    border-radius:10px;
    border:1px solid var(--border);
    background:var(--surface);
    color:var(--text);
    font-size:16px;
    cursor:pointer;
    margin-right:6px;
    -webkit-tap-highlight-color:transparent;
    transition:background .15s ease;
  }
  .cal-mobile-menu-btn:active{ background:var(--hover); transform:scale(.96); }

  .cal-title-row{padding:10px 12px;}
  .cal-title-h2{font-size:16px;}
  .cal-nav-row{padding:8px 10px;gap:6px;}
}
@media (min-width:769px){
  .cal-mobile-menu-btn{display:none !important;}
  .cal-drawer-backdrop{display:none;}
}
@media (max-width:1024px) and (min-width:769px){
  .cal-sidebar{width:180px;padding:8px;}
  .cal-mini-day{width:22px;height:22px;font-size:10px;}
}

/* ══════════════════════════════════════════════════════════════════════════
   PHASE 1b: Working Hours, 15min Grid, User Colors, Team Hatching
   ══════════════════════════════════════════════════════════════════════════ */

/* ── WORKING HOURS: gray out non-working time ──────────────────────────── */
.cal-hour-slot{position:relative;}
.cal-hour-slot.cal-nonwork{
  background:repeating-linear-gradient(
    -45deg,
    transparent, transparent 4px,
    rgba(0,0,0,.02) 4px, rgba(0,0,0,.02) 8px
  );
}
.cal-hour-slot.cal-nonwork::before{
  content:'';position:absolute;inset:0;
  background:var(--hover);opacity:.4;pointer-events:none;
}

/* ── 15-MIN GRID LINES in day/week columns ─────────────────────────────── */
.cal-hour-slot{
  border-bottom:1px solid var(--cal-border-color);
  position:relative;
}
.cal-hour-slot::after{
  content:'';position:absolute;left:0;right:0;
  top:50%;height:0;
  border-bottom:1px dashed rgba(0,0,0,.06);
  pointer-events:none;
}
/* Quarter lines (15 & 45 min marks) — subtle */
.cal-hour-slot .cal-q15,
.cal-hour-slot .cal-q45{
  position:absolute;left:0;right:0;height:0;
  border-bottom:1px dotted rgba(0,0,0,.03);pointer-events:none;
}
.cal-hour-slot .cal-q15{top:25%;}
.cal-hour-slot .cal-q45{top:75%;}

/* ── USER COLORS: event cards with user accent ─────────────────────────── */
.cal-event[data-user-color]{
  border-left:4px solid var(--cal-user-color,var(--cal-ev-color));
}
.cal-event .cal-ev-avatar{
  width:22px;height:22px;border-radius:50%;
  font-size:9px;font-weight:700;color:#fff;
  display:inline-flex;align-items:center;justify-content:center;
  flex-shrink:0;background:var(--cal-user-color,var(--cal-primary));
  margin-right:4px;vertical-align:middle;
}
.cal-event .cal-ev-avatar img{
  width:100%;height:100%;border-radius:50%;object-fit:cover;
}

/* ── TEAM EVENTS: hatched pattern with both user colors ────────────────── */
.cal-event.cal-team-event{
  background:repeating-linear-gradient(
    135deg,
    var(--cal-team-color1, #1B7599) 0px,
    var(--cal-team-color1, #1B7599) 6px,
    var(--cal-team-color2, #16a34a) 6px,
    var(--cal-team-color2, #16a34a) 12px
  );
  border-left:4px solid var(--cal-team-color1);
}
.cal-event.cal-team-event .cal-ev-title,
.cal-event.cal-team-event .cal-ev-time,
.cal-event.cal-team-event .cal-ev-meta,
.cal-event.cal-team-event .cal-ev-loc{
  background:rgba(255,255,255,.88);
  padding:1px 4px;border-radius:3px;
  display:inline-block;
}

/* ── DRAG PREVIEW: snap visual feedback ────────────────────────────────── */
.cal-drag-preview{
  position:absolute;left:2px;right:2px;
  background:rgba(27,117,153,.15);
  border:2px dashed #1B7599;
  border-radius:6px;
  pointer-events:none;
  z-index:100;
  transition:top .05s,height .05s; /* smooth snapping */
}
.cal-drag-preview-time{
  padding:4px 8px;font-size:11px;font-weight:600;
  color:#1B7599;white-space:nowrap;
}
.cal-drag-preview-range{font-weight:700;}
.cal-drag-preview-dur{font-weight:400;opacity:.7;}

/* ── SOURCE BADGES (Verwaltung vs. Selbst) ─────────────────────────────── */
/* ── Compact mobile event cards ────────────────────────────────────────── */
@media (max-width:768px){
  .cal-event .cal-ev-avatar{width:18px;height:18px;font-size:8px;}
  .cal-event .cal-ev-meta{display:none;}
  .cal-event .cal-ev-loc{font-size:10px;}
}

/* ══════════════════════════════════════════════════════════════════════════
   PHASE 1c: Editor Styling, Snap Grid, Collisions, Lunch Break
   ══════════════════════════════════════════════════════════════════════════ */

.cal-editor-hdr{
  background:linear-gradient(135deg,#f8fafc,#f1f5f9);
  padding:16px 20px;
}
.cal-editor-body{
  padding:0;
}

/* Sections with collapsible headers */
.cal-ed-section{
  border-bottom:1px solid var(--cal-border-color);
  padding:16px 20px;
}
.cal-ed-section:last-child{border-bottom:none;}
.cal-ed-section-hdr{
  display:flex;align-items:center;gap:8px;
  margin-bottom:12px;cursor:pointer;user-select:none;
}
.cal-ed-section-hdr i{
  width:28px;height:28px;border-radius:8px;
  display:flex;align-items:center;justify-content:center;
  font-size:12px;flex-shrink:0;
}
.cal-ed-section-hdr h4{
  margin:0;font-size:13px;font-weight:700;
  text-transform:uppercase;letter-spacing:.03em;
}
.cal-ed-section-hdr .cal-ed-chevron{
  margin-left:auto;font-size:10px;color:var(--cal-muted);
  transition:transform .2s;
}
.cal-ed-section.collapsed .cal-ed-section-body{display:none;}
.cal-ed-section.collapsed .cal-ed-chevron{transform:rotate(-90deg);}

/* Section color accents */
.cal-ed-sec-when i{background:rgba(27,117,153,.1);color:#1B7599;}
.cal-ed-sec-where i{background:rgba(239,68,68,.1);color:#ef4444;}
.cal-ed-sec-contact i{background:rgba(34,197,94,.1);color:#16a34a;}
.cal-ed-sec-details i{background:rgba(168,85,247,.1);color:#a855f7;}
.cal-ed-sec-notes i{background:rgba(245,158,11,.1);color:#f59e0b;}
.cal-ed-sec-files i{background:rgba(6,182,212,.1);color:#06b6d4;}

/* Form fields within editor */
.cal-ed-field{margin-bottom:10px;}
.cal-ed-field:last-child{margin-bottom:0;}
.cal-ed-label{
  display:block;font-size:11px;font-weight:600;
  color:var(--cal-muted);text-transform:uppercase;
  letter-spacing:.04em;margin-bottom:4px;
}
.cal-ed-input{
  width:100%;padding:10px 12px;
  border:1.5px solid var(--cal-border-color);border-radius:8px;
  font-size:14px;font-family:inherit;color:var(--cal-text);
  background:var(--cal-surface);
  transition:border-color .15s,box-shadow .15s;
  box-sizing:border-box;
}
.cal-ed-input:focus{
  outline:none;border-color:#1B7599;
  box-shadow:0 0 0 3px rgba(27,117,153,.12);
}
.cal-ed-input::placeholder{color:var(--cal-muted);opacity:.6;}
.cal-ed-input-sm{padding:8px 10px;font-size:13px;}
.cal-ed-select{
  appearance:none;
  background:var(--cal-surface) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6'%3E%3Cpath d='M0 0l5 6 5-6z' fill='%236b7680'/%3E%3C/svg%3E") no-repeat right 12px center;
  padding-right:32px;
}
.cal-ed-textarea{
  resize:vertical;min-height:60px;
  line-height:1.5;
}

/* Time picker row */
.cal-ed-time-row{
  display:flex;gap:8px;align-items:center;flex-wrap:wrap;
}
.cal-ed-time-row .cal-ed-field{margin-bottom:0;}
.cal-ed-time-sep{
  font-size:18px;font-weight:700;color:var(--cal-muted);
  padding:0 2px;align-self:flex-end;padding-bottom:10px;
}
.cal-ed-time-input{
  width:100px;text-align:center;font-weight:600;
  font-size:16px;letter-spacing:1px;font-family:monospace;
}
.cal-ed-date-input{width:140px;}
.cal-ed-allday-toggle{
  display:flex;align-items:center;gap:6px;
  font-size:12px;color:var(--cal-text);cursor:pointer;
  padding:6px 10px;background:var(--cal-surface-2);
  border-radius:6px;margin-left:auto;user-select:none;
}
.cal-ed-allday-toggle input{width:16px;height:16px;margin:0;}

/* Contact autocomplete */
.cal-ed-contact-search{position:relative;}
.cal-ed-contact-results{
  position:absolute;top:100%;left:0;right:0;z-index:100;
  background:var(--cal-surface);border:1.5px solid var(--cal-border-color);
  border-radius:0 0 8px 8px;box-shadow:0 4px 12px rgba(0,0,0,.12);
  max-height:200px;overflow-y:auto;
}
.cal-ed-contact-item{
  padding:8px 12px;display:flex;align-items:center;gap:8px;
  cursor:pointer;font-size:13px;transition:background .1s;
}
.cal-ed-contact-item:hover{background:var(--cal-surface-2);}
.cal-ed-contact-item .cal-ed-ci-avatar{
  width:28px;height:28px;border-radius:50%;
  background:var(--cal-primary);color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-size:10px;font-weight:700;flex-shrink:0;
}
.cal-ed-contact-item .cal-ed-ci-name{font-weight:600;}
.cal-ed-contact-item .cal-ed-ci-addr{
  font-size:11px;color:var(--cal-muted);margin-left:auto;
}

/* Color picker row */
.cal-ed-colors{
  display:flex;gap:6px;flex-wrap:wrap;
}
.cal-ed-color-dot{
  width:28px;height:28px;border-radius:50%;cursor:pointer;
  border:2px solid transparent;
  transition:border-color .1s,transform .1s;
}
.cal-ed-color-dot:hover{transform:scale(1.15);}
.cal-ed-color-dot.active{border-color:var(--cal-text);transform:scale(1.2);}

/* ── DRAG SNAP — True visual 15-min locking ────────────────────────────── */
.cal-drag-preview{
  position:absolute;left:2px;right:2px;
  background:rgba(27,117,153,.12);
  border:2px solid rgba(27,117,153,.6);
  border-radius:8px;
  pointer-events:none;z-index:100;
  backdrop-filter:blur(2px);
  /* KEY: stepped transition for snap feel */
  transition:top .08s cubic-bezier(.22,.68,0,1), height .08s cubic-bezier(.22,.68,0,1);
}
.cal-drag-preview-time{
  padding:6px 10px;font-size:12px;font-weight:600;
  color:#1B7599;white-space:nowrap;
  background:rgba(255,255,255,.9);border-radius:6px 6px 0 0;
}
.cal-drag-preview-range{font-weight:700;font-size:13px;}
.cal-drag-preview-dur{font-weight:400;opacity:.7;font-size:11px;}

/* ── COLLISION WARNINGS ────────────────────────────────────────────────── */
.cal-event.cal-collision{
  outline:3px solid #ef4444;
  outline-offset:-1px;
  animation:cal-collision-pulse 1.5s ease-in-out infinite;
}
@keyframes cal-collision-pulse{
  0%,100%{outline-color:rgba(239,68,68,.8);}
  50%{outline-color:rgba(239,68,68,.3);}
}
.cal-collision-badge{
  position:absolute;top:-6px;right:-6px;
  width:20px;height:20px;border-radius:50%;
  background:#ef4444;color:#fff;
  display:flex;align-items:center;justify-content:center;
  font-size:10px;font-weight:700;z-index:10;
  box-shadow:0 2px 4px rgba(239,68,68,.4);
}
/* Buffer overlap warning */
.cal-event.cal-buffer-overlap{
  outline:2px dashed #f59e0b;
  outline-offset:-1px;
}
.cal-buffer-overlap-indicator{
  position:absolute;top:-4px;left:4px;
  font-size:9px;color:#f59e0b;font-weight:700;
  background:var(--cal-surface);padding:0 4px;border-radius:3px;
  border:1px solid #f59e0b;z-index:10;
}

/* ── LUNCH BREAK INDICATOR ─────────────────────────────────────────────── */
.cal-lunch-break{
  position:absolute;left:0;right:0;z-index:5;
  background:repeating-linear-gradient(
    0deg,
    rgba(245,158,11,.06) 0px,
    rgba(245,158,11,.06) 2px,
    transparent 2px, transparent 4px
  );
  border-top:1px solid rgba(245,158,11,.15);
  border-bottom:1px solid rgba(245,158,11,.15);
  pointer-events:none;
}
.cal-lunch-label{
  position:absolute;right:4px;top:2px;
  font-size:9px;color:#d97706;font-weight:600;
  background:rgba(255,255,255,.8);padding:1px 5px;border-radius:3px;
}

/* ── MOBILE EDITOR — fullscreen slide-up ───────────────────────────────── */
@media (max-width:768px){
  .cal-editor-modal{
    max-width:100%;max-height:100%;
    border-radius:0;border-top:none;
    height:100vh;
    display:flex;flex-direction:column;
  }
  .cal-editor-overlay{
    padding:0;align-items:flex-end;
  }
  .cal-editor-modal .cal-editor-hdr{padding:14px 16px;}
  .cal-editor-modal .cal-editor-title{font-size:16px;}
  .cal-editor-body{flex:1;min-height:0;padding-bottom:12px;}
  .cal-ed-section{padding:12px 14px;}
  .cal-ed-time-row{flex-direction:column;align-items:stretch;gap:6px;}
  .cal-ed-time-sep{display:none;}
  .cal-ed-input{padding:12px 14px;font-size:16px;} /* prevent iOS zoom */
  /* Sections: Container kompakter */
  .cal-editor-modal .cal-ed-col-hdr{padding:10px 14px;font-size:13px;}
  .cal-editor-modal .form-group{margin-bottom:14px;}
  .cal-editor-modal .form-group > label{font-size:12px;margin-bottom:5px;}
  /* Editor-Spalten (Adressen, Termin, Details) auf Mobile untereinander */
  .cal-editor-modal .cal-ed-cols,
  .cal-editor-modal [class*="cal-ed-grid"]{display:flex;flex-direction:column;gap:0;}
  .cal-editor-modal .cal-ed-col{width:100%;max-width:100%;flex:1 1 auto;}
  /* Time-Picker Wheels: kompakter, weniger Höhe */
  .cal-editor-modal .cal-ed-time-cell{padding:6px 4px;font-size:18px;}
  .cal-editor-modal .cal-ed-time-row > div{flex:1;}
  /* FOOTER: alles auf eigene Zeilen, Speichern volle Breite + ganz oben (über reverse) */
  .cal-editor-footer{
    flex-direction:column-reverse;
    align-items:stretch;
    padding:12px 14px max(12px, var(--safe-bottom, 0px));
    gap:10px;
  }
  .cal-editor-footer-right{
    flex-direction:column-reverse;
    margin-left:0;
    gap:8px;
  }
  .cal-editor-footer-right > .btn{
    width:100%;
    justify-content:center;
    min-height:48px;
    font-size:15px;
  }
  /* Speichern als prominente primary action */
  .cal-editor-footer-right > .btn-primary,
  .cal-editor-footer-right > .btn[class*="success"]{
    font-weight:700;
    padding:14px 16px;
    box-shadow:0 2px 8px rgba(27,117,153,.2);
  }
  /* Löschen-Button: dezent unten als Text-Style — nicht als roter Knall */
  .cal-editor-footer > .btn-danger-outline,
  .cal-editor-footer > .btn[class*="danger"]{
    width:100%;
    justify-content:center;
    background:transparent;
    border:none;
    color:#9ca3af;
    font-size:13px;
    padding:8px;
    min-height:36px;
  }
  .cal-editor-footer > .btn-danger-outline:hover{
    color:#dc2626;
    background:rgba(220,38,38,.05);
  }
}

/* ── NOW-LINE: current time indicator ──────────────────────────────────── */
.cal-now-line{
  position:absolute;left:0;right:0;z-index:50;
  pointer-events:none;
  height:2px;background:var(--cal-now-line-color, #ef4444);
  box-shadow:0 0 4px var(--cal-now-line-glow, rgba(239,68,68,.4));
}
/* Now-Line passt sich an Theme an — fix bei Dark/Pink/Gray */
[data-theme="pink"] .cal-now-line { background:#d94682; box-shadow:0 0 4px rgba(217,70,130,.4); }
[data-theme="gray"] .cal-now-line { background:#475569; box-shadow:0 0 4px rgba(71,85,105,.4); }
/* Now-Line OHNE Punkte oben/unten — saubere flache Linie. */
.cal-now-label{
  position:absolute;left:-44px;top:-6px;
  font-size:10px;font-weight:700;color:#ef4444;
  font-family:monospace;
}

/* ── PAST EVENTS: dimmed but still readable ────────────────────────────── */
.cal-event.cal-ev-past{
  opacity:.55;
  filter:saturate(.5) brightness(.95);
}
.cal-event.cal-ev-past:hover{
  opacity:.8;
  filter:saturate(.8) brightness(1);
}
.cal-event.cal-ev-past .cal-ev-title{
  text-decoration:line-through;
  text-decoration-color:rgba(255,255,255,.3);
}
/* Past all-day events */
.cal-allday-ev.cal-ev-past{
  opacity:.4;filter:saturate(.3);
}

/* Past day columns (entire day in the past) */
.cal-day-col.cal-day-past{
  background:rgba(0,0,0,.015);
}

/* Today column highlight */
.cal-day-col.cal-day-today{
  background:rgba(27,117,153,.03);
}

/* ── NO LUNCH WARNING ──────────────────────────────────────────────────── */
.cal-lunch-warning{
  position:absolute;bottom:4px;right:4px;
  width:22px;height:22px;border-radius:50%;
  background:#fef3c7;border:1.5px solid #f59e0b;
  display:flex;align-items:center;justify-content:center;
  font-size:11px;z-index:5;cursor:help;
  animation:cal-collision-pulse 2s ease-in-out infinite;
}

/* ══════════════════════════════════════════════════════════════════════════
   EDITOR MODAL — SEMPERconnect Premium Style
   ══════════════════════════════════════════════════════════════════════════ */

/* ── Modal Container ───────────────────────────────────────────────────── */

/* ── Header — dark gradient like Watchdog panels ───────────────────────── */
.cal-editor-modal .cal-editor-hdr{
  background:linear-gradient(135deg,#1a1a2e,#0a2838);
  padding:20px 24px;border-bottom:none;
}
.cal-editor-modal .cal-editor-title{
  font-size:20px;font-weight:700;color:#fff;
}
.cal-editor-modal .cal-editor-hdr .cal-detail-close{
  color:rgba(255,255,255,.6);
}
.cal-editor-modal .cal-editor-hdr .cal-detail-close:hover{
  color:#fff;background:rgba(255,255,255,.12);
}

/* ── Body — generous padding ───────────────────────────────────────────── */
.cal-editor-modal .cal-editor-body{
  padding:24px 28px 20px;
}

/* ── ALL Labels ────────────────────────────────────────────────────────── */
.cal-editor-modal .form-group{margin-bottom:18px;}
.cal-editor-modal .form-group > label{
  display:flex;align-items:center;gap:6px;
  font-size:12px;font-weight:700;
  color:var(--cal-text);
  margin-bottom:6px;letter-spacing:.02em;
}

/* ── ALL Inputs ────────────────────────────────────────────────────────── */
.cal-editor-modal .form-control{
  width:100%;padding:12px 16px;
  border:2px solid var(--cal-border-color);border-radius:10px;
  font-size:15px;font-family:inherit;color:var(--cal-text);
  background:var(--cal-surface);box-sizing:border-box;
  transition:border-color .2s,box-shadow .2s;
  min-height:46px;
}
.cal-editor-modal .form-control:focus{
  outline:none;border-color:#1B7599;
  box-shadow:0 0 0 4px rgba(27,117,153,.12);
}
.cal-editor-modal .form-control::placeholder{color:var(--cal-muted);opacity:.5;}
.cal-editor-modal select.form-control{
  appearance:none;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='7'%3E%3Cpath d='M0 0l6 7 6-7z' fill='%236b7680'/%3E%3C/svg%3E");
  background-repeat:no-repeat;background-position:right 14px center;
  padding-right:36px;cursor:pointer;
}
.cal-editor-modal textarea.form-control{
  resize:vertical;min-height:80px;line-height:1.6;
}
.cal-editor-modal input[type="date"],
.cal-editor-modal input[type="time"]{
  font-family:'SF Mono',monospace;font-weight:600;letter-spacing:.5px;font-size:15px;
  padding-right:8px;
}
.cal-editor-modal input[type="number"]{text-align:center;font-weight:600;}

/* ── TITLE input — hero field ──────────────────────────────────────────── */
.cal-editor-modal #cal-ed-title{
  font-size:18px;font-weight:700;padding:14px 18px;
  border-radius:12px;border-width:2px;
  background:var(--cal-surface-2);min-height:52px;
}
.cal-editor-modal #cal-ed-title:focus{
  background:var(--cal-surface);
  border-color:#1B7599;box-shadow:0 0 0 4px rgba(27,117,153,.1);
}

/* ── Form rows ─────────────────────────────────────────────────────────── */
.cal-editor-modal .cal-form-row{
  display:flex;gap:14px;align-items:flex-end;
}
.cal-editor-modal .cal-form-row > .form-group{flex:1;margin-bottom:18px;}
.cal-editor-modal .cal-form-row-tight{
  gap:8px;align-items:center;margin-bottom:18px;
}
.cal-editor-modal .cal-form-row-tight > .form-group{margin-bottom:0;}
.cal-editor-modal .cal-time-input{max-width:120px;text-align:center;}
.cal-editor-modal .cal-narrow-input{max-width:100px;}

/* ── Duration display ──────────────────────────────────────────────────── */
.cal-editor-modal .cal-duration-display{
  display:inline-flex;flex-direction:column;gap:2px;
  padding:8px 14px;background:rgba(27,117,153,.06);
  border:1.5px solid rgba(27,117,153,.15);border-radius:10px;
}
.cal-editor-modal .cal-duration-display-main{
  font-size:15px;font-weight:700;color:#1B7599;
}
.cal-editor-modal .cal-duration-source{font-size:10px;color:var(--cal-muted);}

/* ── Checkbox — big touch ──────────────────────────────────────────────── */
.cal-editor-modal .cal-checkbox{
  display:inline-flex;align-items:center;gap:10px;
  padding:10px 14px;background:var(--cal-surface-2);
  border:1.5px solid var(--cal-border-color);
  border-radius:10px;cursor:pointer;font-size:14px;font-weight:500;
}
.cal-editor-modal .cal-checkbox:hover{border-color:#1B7599;}
.cal-editor-modal .cal-checkbox input{width:20px;height:20px;margin:0;}

/* ── Picker fields (Kontakt, Liegenschaft) ─────────────────────────────── */
.cal-editor-modal .cal-picker-field{
  display:flex;align-items:center;gap:10px;
  padding:12px 16px;border:2px solid var(--cal-border-color);
  border-radius:10px;background:var(--cal-surface);
  min-height:48px;cursor:pointer;transition:border-color .2s;
}
.cal-editor-modal .cal-picker-field:hover{border-color:#1B7599;}
.cal-editor-modal .cal-picker-field-value{flex:1;font-size:14px;}
.cal-editor-modal .cal-picker-field-value .cal-muted{color:var(--cal-muted);font-size:13px;}
.cal-editor-modal .cal-inline-pick{
  background:rgba(27,117,153,.08);border:none;
  width:36px;height:36px;border-radius:10px;
  color:#1B7599;cursor:pointer;font-size:14px;
  display:flex;align-items:center;justify-content:center;
}
.cal-editor-modal .cal-inline-pick:hover{background:rgba(27,117,153,.18);}

/* ── Team picker ───────────────────────────────────────────────────────── */
.cal-editor-modal .cal-team-picker{
  border:2px solid var(--cal-border-color);border-radius:10px;
  padding:10px 14px;background:var(--cal-surface);min-height:48px;
}

/* ── Section headers ───────────────────────────────────────────────────── */
.cal-editor-modal .cal-section-hdr{
  display:flex;align-items:center;gap:10px;
  margin-bottom:10px;
}
.cal-editor-modal .cal-section-hdr i{
  width:30px;height:30px;border-radius:8px;
  display:flex;align-items:center;justify-content:center;
  background:rgba(27,117,153,.08);color:#1B7599;font-size:13px;
}
.cal-editor-modal .cal-section-hdr span:not(.cal-section-hint){
  font-size:14px;font-weight:700;
}
.cal-editor-modal .cal-section-hint{
  font-weight:400;font-size:11px;color:var(--cal-muted);margin-left:auto;
}

/* ── Contacts + Files groups — card wrapper ─────────────────────────────── */
.cal-editor-modal .cal-ed-contacts-group,
.cal-editor-modal .cal-ed-files-group{
  background:var(--cal-surface-2);border-radius:12px;
  padding:18px 20px;margin-bottom:18px;
  border:1.5px solid var(--cal-border-color);
}
.cal-editor-modal .cal-ed-contacts-empty,
.cal-editor-modal .cal-ed-files-hint{
  font-size:12px;color:var(--cal-muted);padding:10px 0;
}

/* ── File drop zone ────────────────────────────────────────────────────── */
.cal-editor-modal .cal-ed-file-drop{
  border:2px dashed var(--cal-border-color);border-radius:12px;
  padding:24px;text-align:center;cursor:pointer;
  transition:border-color .2s,background .2s;margin-top:10px;
}
.cal-editor-modal .cal-ed-file-drop:hover{
  border-color:#1B7599;background:rgba(27,117,153,.03);
}
.cal-editor-modal .cal-ed-file-drop-inner{
  display:flex;flex-direction:column;align-items:center;gap:8px;
  color:var(--cal-muted);font-size:13px;
}
.cal-editor-modal .cal-ed-file-drop-inner i{font-size:28px;opacity:.25;}

/* ── Call-ahead toggle ─────────────────────────────────────────────────── */
.cal-editor-modal .cal-ed-callahead{
  border:2px solid var(--cal-border-color);border-radius:12px;
  padding:14px 18px;margin-bottom:18px;
  transition:border-color .2s,background .2s;
}
.cal-editor-modal .cal-ed-callahead:has(#cal-ed-ca-enable:checked){
  border-color:rgba(27,117,153,.4);background:rgba(27,117,153,.04);
}
.cal-editor-modal .cal-ed-callahead-toggle{
  display:flex;align-items:center;gap:14px;cursor:pointer;margin:0;
}
.cal-editor-modal .cal-ed-callahead-icon{
  width:40px;height:40px;border-radius:12px;
  background:rgba(27,117,153,.08);color:#1B7599;
  display:flex;align-items:center;justify-content:center;
  font-size:16px;flex-shrink:0;
}
.cal-editor-modal .cal-ed-callahead-label{font-weight:700;font-size:15px;}
.cal-editor-modal .cal-ed-callahead-sub{font-size:12px;color:var(--cal-muted);}

/* ── Color input ───────────────────────────────────────────────────────── */
.cal-editor-modal .cal-color-input{
  width:48px;height:48px;padding:3px;
  border-radius:12px;cursor:pointer;border-width:2px;
}

/* ── Collision area ────────────────────────────────────────────────────── */
.cal-editor-modal .cal-coll-area:not(:empty){
  background:#fef2f2;border:2px solid #fecaca;
  border-radius:12px;padding:14px 18px;margin-top:18px;
}

/* ── Footer ────────────────────────────────────────────────────────────── */
.cal-editor-modal .cal-editor-footer{
  padding:16px 24px;
  background:linear-gradient(180deg,var(--cal-surface-2),var(--cal-surface));
  border-top:1.5px solid var(--cal-border-color);
}
.cal-editor-modal .cal-editor-footer .btn{
  padding:12px 24px;font-size:15px;border-radius:10px;font-weight:600;
  min-height:46px;
}

/* ── MOBILE ────────────────────────────────────────────────────────────── */
@media (max-width:768px){
  .cal-editor-modal{
    max-width:100%;border-radius:20px 20px 0 0;
    max-height:96vh;border-top:none;
  }
  .cal-editor-overlay{align-items:flex-end;padding:0;}
  .cal-editor-modal .cal-editor-hdr{padding:18px 20px;}
  .cal-editor-modal .cal-editor-body{padding:18px 18px 14px;}
  .cal-editor-modal .form-control{padding:14px 16px;font-size:16px;min-height:50px;}
  .cal-editor-modal .cal-form-row{flex-direction:column;gap:0;}
  .cal-editor-modal .cal-form-row > .form-group{width:100%;}
  .cal-editor-modal .cal-time-input{max-width:100%;}
  .cal-editor-modal .cal-narrow-input{max-width:100%;}
  .cal-editor-modal #cal-ed-title{font-size:20px;min-height:56px;}
  .cal-editor-modal .cal-ed-callahead-sub{display:none;}
  .cal-editor-modal .cal-editor-footer{padding:14px 18px;}
  .cal-editor-modal .cal-editor-footer .btn{
    padding:14px 20px;font-size:16px;min-height:50px;width:100%;
  }
  .cal-editor-modal .cal-editor-footer-right{flex-direction:column;width:100%;gap:8px;}
}

/* ── Picker "Neu anlegen" button ───────────────────────────────────────── */
.cal-picker-create{
  display:flex;align-items:center;gap:10px;
  padding:14px 18px;cursor:pointer;
  color:#1B7599;font-weight:600;font-size:14px;
  border-top:1.5px solid var(--cal-border-color);
  transition:background .1s;
}
.cal-picker-create:hover{background:rgba(27,117,153,.06);}
.cal-picker-create i{
  width:28px;height:28px;border-radius:8px;
  background:rgba(27,117,153,.1);color:#1B7599;
  display:flex;align-items:center;justify-content:center;font-size:12px;
}
.cal-picker-footer{
  padding:12px 16px;border-top:1.5px solid var(--cal-border-color);
}

/* ── Calendar loading/error states ─────────────────────────────────────── */
.cal-loading,.cal-error{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  padding:40px 20px;text-align:center;color:var(--cal-muted);font-size:14px;
  min-height:200px;
}
.cal-error{color:var(--cal-text);}

/* ── Holiday allday events ─────────────────────────────────────────────── */
.cal-allday-holiday{
  background:rgba(156,163,175,.12);
  color:#6b7280;border:1px solid rgba(156,163,175,.25);
  font-weight:600;font-size:.72rem;
  border-radius:4px;padding:2px 6px;
}
.cal-allday-holiday i{margin-right:3px;font-size:.65rem;}

/* ══════════════════════════════════════════════════════════════════════════
   Kalender-Verwaltung — Admin Tabs + Cards
   ══════════════════════════════════════════════════════════════════════════ */
/* Tab-Bar: Scrollbar verstecken (overflow-x:auto bleibt für mobile-overflow) */
.cal-admin-tabs{scrollbar-width:none;-ms-overflow-style:none;}
.cal-admin-tabs::-webkit-scrollbar{display:none;width:0;height:0;}
.cal-admin-tab{
  padding:12px 18px;border:none;background:none;
  font-size:13px;font-weight:600;color:var(--muted);
  cursor:pointer;position:relative;white-space:nowrap;
  font-family:inherit;transition:color .15s;
  display:flex;align-items:center;gap:6px;
}
.cal-admin-tab:hover{color:var(--text);}
.cal-admin-tab.active{color:#1B7599;}
.cal-admin-tab.active::after{
  content:'';position:absolute;bottom:-2px;left:0;right:0;
  height:2px;background:#1B7599;border-radius:2px 2px 0 0;
}
.cal-admin-tab i{font-size:12px;}

.cal-admin-card{
  background:var(--surface);border:1.5px solid var(--border);
  border-radius:12px;overflow:hidden;
  transition:border-color .15s,box-shadow .15s;
}
.cal-admin-card:hover{
  border-color:rgba(27,117,153,.3);
  box-shadow:0 2px 8px rgba(0,0,0,.06);
}
.cal-admin-card-hdr{
  padding:12px 14px;font-weight:700;font-size:13px;
  background:var(--surface-2);border-bottom:1px solid var(--border);
  display:flex;align-items:center;gap:8px;
}
.cal-admin-card-hdr i{
  width:26px;height:26px;border-radius:6px;
  display:flex;align-items:center;justify-content:center;
  background:rgba(27,117,153,.08);color:#1B7599;font-size:11px;
}
.cal-admin-badge{
  display:inline-block;padding:2px 8px;
  background:var(--surface-2);border:1px solid var(--border);
  border-radius:4px;font-size:11px;font-weight:500;
  color:var(--muted);
}

@media (max-width:768px){
  .cal-admin-tab{padding:10px 12px;font-size:12px;}
  .cal-admin-tab i{display:none;}
}

/* ══════════════════════════════════════════════════════════════════════════
   Admin Views: Mode Toggle + Shared Timeline + Enhanced Dispo
   ══════════════════════════════════════════════════════════════════════════ */

/* Mode toggle */
.cal-dispo-mode-toggle{display:flex;gap:0;border:1.5px solid var(--border);border-radius:8px;overflow:hidden;margin-right:12px;}
.cal-mode-btn{
  padding:8px 14px;border:none;background:var(--surface);
  font-size:12px;font-weight:600;cursor:pointer;color:var(--muted);
  font-family:inherit;display:flex;align-items:center;gap:5px;
  transition:all .15s;
}
.cal-mode-btn:not(:last-child){border-right:1px solid var(--border);}
.cal-mode-btn.active{background:#1B7599;color:#fff;}
.cal-mode-btn:hover:not(.active){background:var(--hover);}

/* Enhanced tech chips with avatars */
.cal-tech-chip{
  display:inline-flex;align-items:center;gap:5px;
  padding:4px 10px 4px 4px;border-radius:20px;
  border:1.5px solid var(--border);background:var(--surface);
  font-size:11px;font-weight:500;cursor:pointer;
  transition:all .15s;font-family:inherit;color:var(--text);
}
.cal-tech-chip.active{border-color:var(--tech-color,#1B7599);background:rgba(27,117,153,.04);}
.cal-tech-chip:not(.active){opacity:.5;}
.cal-tech-chip:hover{opacity:1;}
.cal-tech-avatar{width:22px;height:22px;border-radius:50%;object-fit:cover;}
.cal-tech-ini{
  width:22px;height:22px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  font-size:9px;font-weight:700;color:#fff;
}
.cal-tech-name{max-width:80px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.cal-tech-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;}
.cal-tech-chip-all{padding:6px 12px;gap:6px;}
.cal-tech-chip-all i{font-size:10px;}

/* ── Shared Timeline (Google Calendar Style) ──────────────────────────── */
.cal-shared{overflow:auto;flex:1;}
.cal-shared-hdr{
  display:grid;grid-template-columns:50px repeat(7,1fr);
  border-bottom:2px solid var(--border);position:sticky;top:0;
  background:var(--surface);z-index:10;
}
.cal-shared-corner{border-right:1px solid var(--border);}
.cal-shared-day-hdr{
  text-align:center;padding:8px 4px;
  border-right:1px solid var(--border);
}
.cal-shared-day-hdr.cal-today{background:rgba(27,117,153,.04);}
.cal-shared-dow{font-size:11px;font-weight:600;color:var(--muted);text-transform:uppercase;}
.cal-shared-dom{font-size:18px;font-weight:700;}
.cal-today .cal-shared-dom{
  background:#1B7599;color:#fff;
  width:30px;height:30px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
}
.cal-shared-grid{
  display:grid;grid-template-columns:50px repeat(7,1fr);
}
.cal-shared-hours{border-right:1px solid var(--border);}
.cal-shared-hour-lbl{
  height:60px;display:flex;align-items:flex-start;
  justify-content:flex-end;padding:0 6px;
  font-size:10px;color:var(--muted);font-weight:500;
}
.cal-shared-day-col{
  position:relative;border-right:1px solid var(--border);
}
.cal-shared-slot{
  height:60px;border-bottom:1px solid rgba(0,0,0,.05);
}
/* Event card in shared view */
.cal-shared-ev{
  position:absolute;border-radius:6px;overflow:hidden;
  background:var(--cal-ev-color);color:#fff;
  padding:3px 6px;font-size:11px;cursor:pointer;
  box-shadow:0 1px 3px rgba(0,0,0,.15);
  border-left:3px solid rgba(0,0,0,.2);
  z-index:2;transition:transform .1s,z-index 0s;
}
.cal-shared-ev:hover{transform:scale(1.02);z-index:10;box-shadow:0 3px 10px rgba(0,0,0,.2);}
.cal-shared-ev-avatar{
  display:inline-flex;width:16px;height:16px;border-radius:50%;
  align-items:center;justify-content:center;
  font-size:7px;font-weight:700;color:#fff;
  vertical-align:middle;margin-right:2px;
  border:1px solid rgba(255,255,255,.4);
  position:relative;z-index:2;flex-shrink:0;
  position:relative;z-index:2;
}
.cal-shared-ev-time{font-size:10px;font-weight:600;opacity:.9;position:relative;z-index:2;}
.cal-shared-ev-title{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;position:relative;z-index:2;}
.cal-shared-ev-loc{font-size:9px;opacity:.7;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;position:relative;z-index:2;}
.cal-shared-ev-loc i{margin-right:2px;font-size:8px;}

@media (max-width:768px){
  .cal-shared-hdr,.cal-shared-grid{grid-template-columns:40px repeat(5,1fr);}
  .cal-shared-day-col:nth-child(n+7){display:none;}
  .cal-shared-day-hdr:nth-child(n+7){display:none;}
  .cal-dispo-mode-toggle{margin-right:0;}
  .cal-tech-name{display:none;}
}

/* ── Optgroup styling for service categories ───────────────────────────── */
.cal-editor-modal select.form-control optgroup{
  font-weight:700;font-style:normal;color:var(--text);
  padding:4px 0;
}
.cal-editor-modal select.form-control option{
  font-weight:400;padding:4px 8px;
}

/* ══════════════════════════════════════════════════════════════════════════
   Horizontal Dispo Timeline
   ══════════════════════════════════════════════════════════════════════════ */
.cal-h-day-header{
  padding:8px 12px;font-size:13px;background:var(--surface-2);
  border-bottom:1px solid var(--border);
}
.cal-h-day-header.cal-today{background:rgba(27,117,153,.06);border-left:3px solid #1B7599;}
.cal-h-container{border-bottom:2px solid var(--border);}
/* Row-Trennstrich NICHT als border-bottom auf .cal-h-row — sonst läuft er
   visuell auch durch den Tagsstreifen-Spalte (.cal-h-day-strip) und sieht
   aus wie ein "Schnitt" durchs Tagsband. Stattdessen pro Direkt-Kind (Label
   + Timeline), Tagsstreifen bleibt ungestört. */
.cal-h-row{
  display:flex;align-items:stretch;
  min-height:80px;
}
.cal-h-row > .cal-h-label,
.cal-h-row > .cal-h-timeline{
  border-bottom:1px solid rgba(0,0,0,.04);
}
.cal-h-header-row{min-height:24px;}
.cal-h-header-row > .cal-h-label,
.cal-h-header-row > .cal-h-timeline{
  border-bottom:1px solid var(--border);
}

/* ── PERIOD-LABEL + KW-BADGE in der Toolbar ───────────────────────────── */
.cal-period-label{
  font-size:21px;
  font-weight:800;
  flex:1;
  text-align:center;
  min-width:180px;
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:7px;
  letter-spacing:.2px;
}
.cal-period-title{
  line-height:1.1;
  color:var(--text,#0f172a);
}
.cal-kw-badge{
  display:inline-flex;
  align-items:center;
  gap:7px;
  padding:5px 14px;
  background:linear-gradient(135deg,#1B7599 0%,#2a98c2 50%,#1B7599 100%);
  color:#fff;
  font-size:11.5px;
  font-weight:700;
  letter-spacing:.7px;
  text-transform:uppercase;
  border-radius:999px;
  box-shadow:0 2px 8px rgba(27,117,153,.30),inset 0 1px 0 rgba(255,255,255,.25),inset 0 -1px 0 rgba(0,0,0,.10);
  text-shadow:0 1px 1px rgba(0,0,0,.18);
  white-space:nowrap;
  user-select:none;
  transition:transform .15s ease,box-shadow .15s ease;
}
.cal-kw-badge:hover{
  transform:translateY(-1px);
  box-shadow:0 4px 14px rgba(27,117,153,.42),inset 0 1px 0 rgba(255,255,255,.30),inset 0 -1px 0 rgba(0,0,0,.10);
}
.cal-kw-badge i{font-size:10px;opacity:.95;}

/* ── QUICK-SEARCH-BAR (C3a) ─────────────────────────────────────────────────
   Sitzt rechts in der Top-Nav. Liquid-Glass-Style passend zum Rest des
   Kalenders. Live-Dropdown unter dem Input mit Top-5-Treffern. */
.cal-quick-search-wrap{
  position:relative;
  display:flex;
  align-items:center;
  min-width:240px;
  max-width:340px;
}
.cal-quick-search-icon{
  position:absolute;
  left:10px;
  top:50%;
  transform:translateY(-50%);
  color:#1B7599;
  font-size:12px;
  pointer-events:none;
  z-index:2;
}
.cal-quick-search-input{
  width:100%;
  padding:7px 56px 7px 30px;
  border-radius:8px;
  border:0;
  font-size:12px;
  font-family:inherit;
  background:
    linear-gradient(180deg,
      rgba(255,255,255,.40) 0%,
      rgba(255,255,255,.14) 40%,
      rgba(255,255,255,.06) 100%),
    rgba(27,117,153,.08);
  color:var(--text,#0f172a);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.65),
    inset 0 0 0 1px rgba(27,117,153,.22),
    0 1px 3px rgba(27,117,153,.10);
  transition:box-shadow .18s ease, background .18s ease;
}
.cal-quick-search-input::placeholder{
  color:rgba(15,58,82,.55);
  font-style:italic;
}
.cal-quick-search-input:hover{
  background:
    linear-gradient(180deg,
      rgba(255,255,255,.50) 0%,
      rgba(255,255,255,.18) 40%,
      rgba(255,255,255,.08) 100%),
    rgba(27,117,153,.12);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.75),
    inset 0 0 0 1px rgba(27,117,153,.32),
    0 2px 6px rgba(27,117,153,.16);
}
.cal-quick-search-input:focus{
  outline:none;
  background:
    linear-gradient(180deg,
      rgba(255,255,255,.55) 0%,
      rgba(255,255,255,.20) 40%,
      rgba(255,255,255,.08) 100%),
    rgba(255,255,255,.85);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.85),
    inset 0 0 0 1px rgba(27,117,153,.55),
    0 4px 14px rgba(27,117,153,.22);
}
.cal-quick-search-kbd{
  position:absolute;
  right:8px;
  top:50%;
  transform:translateY(-50%);
  font-size:9px;
  font-family:system-ui,-apple-system,sans-serif;
  font-weight:600;
  color:#1B7599;
  background:rgba(27,117,153,.10);
  padding:2px 5px;
  border-radius:4px;
  border:1px solid rgba(27,117,153,.18);
  pointer-events:none;
  letter-spacing:.3px;
}
.cal-quick-search-input:focus ~ .cal-quick-search-kbd{
  opacity:.4;
}

/* ── DROPDOWN ────────────────────────────────────────────────────────────── */
.cal-quick-search-dropdown{
  position:absolute;
  top:calc(100% + 6px);
  left:0;
  right:0;
  z-index:100;
  background:rgba(255,255,255,.96);
  backdrop-filter:blur(18px) saturate(1.6);
  -webkit-backdrop-filter:blur(18px) saturate(1.6);
  border-radius:10px;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.65),
    inset 0 0 0 1px rgba(27,117,153,.18),
    0 12px 36px rgba(15,58,82,.20);
  max-height:420px;
  overflow-y:auto;
  padding:6px;
}
.cal-qs-section-title{
  font-size:9px;
  font-weight:700;
  color:#1B7599;
  text-transform:uppercase;
  letter-spacing:.6px;
  padding:6px 8px 4px;
  display:flex;
  align-items:center;
  gap:5px;
}
.cal-qs-section-title i{font-size:9px;opacity:.7;}
.cal-qs-item{
  display:flex;
  flex-direction:column;
  gap:2px;
  padding:7px 10px;
  border-radius:6px;
  cursor:pointer;
  font-size:11px;
  color:var(--text,#0f172a);
  transition:background .12s ease, transform .12s ease;
  margin-bottom:1px;
}
.cal-qs-item:hover{
  background:rgba(27,117,153,.08);
  transform:translateX(1px);
}
.cal-qs-item-icon{
  font-size:10px;
  color:#1B7599;
  flex-shrink:0;
}
.cal-qs-item-text{
  flex:1;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.cal-qs-event-row{
  display:flex;
  align-items:center;
  gap:6px;
}
.cal-qs-event-meta{
  font-size:10px;
  color:var(--cal-muted,#64748b);
  display:flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  margin-left:18px;
}
.cal-qs-event-meta i{font-size:8px;margin-right:2px;opacity:.8;}
.cal-qs-recent{
  display:flex;
  flex-direction:row;
  align-items:center;
  gap:8px;
  color:var(--cal-muted,#64748b);
  font-style:italic;
}
.cal-qs-more,
.cal-qs-extended{
  display:flex;
  flex-direction:row;
  align-items:center;
  gap:8px;
  color:#1B7599;
  font-weight:600;
  border-top:1px solid rgba(27,117,153,.10);
  margin-top:4px;
  padding-top:8px;
}
.cal-qs-extended{
  background:rgba(27,117,153,.06);
  border-radius:6px;
  margin-top:6px;
}
.cal-qs-extended:hover{
  background:rgba(27,117,153,.14);
}
.cal-qs-empty{
  padding:16px 12px;
  text-align:center;
  color:var(--cal-muted,#64748b);
  font-size:11px;
  font-style:italic;
}
.cal-qs-empty i{margin-right:4px;}
.cal-qs-footer{
  padding:6px 10px;
  font-size:9px;
  color:var(--cal-muted,#64748b);
  border-top:1px solid rgba(0,0,0,.05);
  margin-top:4px;
  display:flex;
  align-items:center;
  gap:5px;
  font-style:italic;
}

/* Mobile: Quick-Search nimmt vollere Breite, Kbd-Hint versteckt */
@media (max-width: 768px){
  .cal-quick-search-wrap{
    min-width:140px;
    max-width:200px;
  }
  .cal-quick-search-kbd{display:none;}
  .cal-quick-search-input{padding-right:12px;}
}

/* ── DEPARTMENT-FILTER (Sidebar) ────────────────────────────────────── */
.cal-dept-filter-section{
  margin-top:10px;
  padding:10px;
  background:rgba(27,117,153,.04);
  border-radius:10px;
  border:1px solid rgba(27,117,153,.12);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55);
}
.cal-dept-filter-title{
  display:flex;
  align-items:center;
  gap:6px;
  font-size:10px;
  font-weight:800;
  color:#1B7599;
  text-transform:uppercase;
  letter-spacing:.5px;
  margin-bottom:8px;
}
.cal-dept-filter-title > i{font-size:11px;}
.cal-dept-filter-clear{
  margin-left:auto;
  background:rgba(220,38,38,.08);
  border:1px solid rgba(220,38,38,.22);
  color:#dc2626;
  width:20px;
  height:20px;
  border-radius:6px;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0;
  font-size:9px;
  transition:background .14s ease, transform .14s ease;
}
.cal-dept-filter-clear:hover{
  background:rgba(220,38,38,.18);
  transform:scale(1.08);
}
.cal-dept-filter-chips{
  display:flex;
  flex-wrap:wrap;
  gap:5px;
}
.cal-dept-chip{
  display:inline-flex;
  align-items:center;
  gap:5px;
  padding:5px 9px;
  border-radius:999px;
  background:rgba(255,255,255,.85);
  border:1px solid rgba(27,117,153,.20);
  color:#1B7599;
  font-size:10.5px;
  font-weight:600;
  cursor:pointer;
  white-space:nowrap;
  transition:transform .14s ease, box-shadow .14s ease, background .14s ease;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.65);
}
.cal-dept-chip > i{font-size:9px;opacity:.7;}
.cal-dept-chip:hover{
  transform:translateY(-1px);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85), 0 2px 6px rgba(27,117,153,.20);
  border-color:rgba(27,117,153,.45);
}
.cal-dept-chip.active{
  background:
    linear-gradient(180deg,
      rgba(255,255,255,.30) 0%,
      transparent 60%),
    linear-gradient(180deg,#2a98c2 0%,#1B7599 100%);
  color:#fff;
  border-color:#1B7599;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.55),
    inset 0 -1px 0 rgba(0,0,0,.10),
    0 2px 8px rgba(27,117,153,.30);
  text-shadow:0 1px 1px rgba(0,0,0,.15);
}
.cal-dept-chip.active > i{opacity:.95;}
.cal-dept-chip-name{
  max-width:120px;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.cal-dept-chip-count{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:16px;
  padding:0 5px;
  height:14px;
  border-radius:999px;
  font-size:9px;
  font-weight:700;
  background:rgba(0,0,0,.10);
  color:inherit;
}
.cal-dept-chip.active .cal-dept-chip-count{
  background:rgba(255,255,255,.30);
  color:#fff;
}
/* Wenn Sidebar collapsed → Dept-Filter ausblenden */
.cal-sidebar.collapsed .cal-dept-filter-section,
.cal-sidebar.collapsed .cal-custom-groups-section{display:none;}

/* ── CUSTOM GROUPS ─────────────────────────────────────────────────── */
.cal-custom-groups-section{
  margin-top:8px;
  padding:10px;
  background:rgba(124,58,237,.04);
  border-radius:10px;
  border:1px solid rgba(124,58,237,.12);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55);
}
.cal-custom-groups-section .cal-dept-filter-title{
  color:#7c3aed;
}
.cal-custom-groups-add{
  margin-left:auto;
  background:#7c3aed;
  border:0;
  color:#fff;
  width:22px;
  height:22px;
  border-radius:6px;
  cursor:pointer;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0;
  font-size:11px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.30), 0 2px 5px rgba(124,58,237,.30);
  transition:transform .14s ease, box-shadow .14s ease;
}
.cal-custom-groups-add:hover{
  transform:scale(1.08);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.55), 0 4px 10px rgba(124,58,237,.45);
}
.cal-custom-chip{
  position:relative;
  padding-right:26px !important;
}
.cal-custom-chip-edit{
  position:absolute;
  right:5px;
  top:50%;
  transform:translateY(-50%);
  width:16px;
  height:16px;
  border-radius:4px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:8px;
  background:rgba(0,0,0,.10);
  color:rgba(0,0,0,.55);
  cursor:pointer;
  transition:background .12s ease;
}
.cal-custom-chip.active .cal-custom-chip-edit{
  background:rgba(255,255,255,.25);
  color:#fff;
}
.cal-custom-chip-edit:hover{
  background:rgba(0,0,0,.20);
}
.cal-custom-chip.active .cal-custom-chip-edit:hover{
  background:rgba(255,255,255,.40);
}

/* ── Custom-Group Editor Modal ──────────────────────────────────────── */
.cal-cg-field{margin-bottom:14px;}
.cal-cg-field > label{
  display:block;
  font-size:11px;
  font-weight:700;
  color:#1B7599;
  text-transform:uppercase;
  letter-spacing:.5px;
  margin-bottom:6px;
}
.cal-cg-count{font-weight:400;color:var(--cal-muted);text-transform:none;letter-spacing:0;}
.cal-cg-field input[type=text]{
  width:100%;
  padding:8px 10px;
  border:1px solid var(--border);
  border-radius:6px;
  font-size:13px;
  font-family:inherit;
  box-sizing:border-box;
}
.cal-cg-field input[type=text]:focus{
  outline:none;
  border-color:#1B7599;
  box-shadow:0 0 0 3px rgba(27,117,153,.12);
}
.cal-cg-color-row{
  display:flex;
  gap:8px;
}
.cal-cg-color-opt{
  width:30px;
  height:30px;
  border-radius:50%;
  border:0;
  cursor:pointer;
  position:relative;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.30), 0 1px 3px rgba(0,0,0,.18);
  transition:transform .14s ease;
}
.cal-cg-color-opt:hover{transform:scale(1.10);}
.cal-cg-color-opt.active::after{
  content:'';
  position:absolute;
  inset:-3px;
  border:2px solid var(--cal-primary,#1B7599);
  border-radius:50%;
}
.cal-cg-tech-list{
  max-height:280px;
  overflow-y:auto;
  border:1px solid var(--border);
  border-radius:8px;
  padding:4px;
  background:var(--bg);
}
.cal-cg-tech-row{
  display:flex;
  align-items:center;
  gap:10px;
  padding:7px 10px;
  border-radius:6px;
  cursor:pointer;
  transition:background .12s ease;
}
.cal-cg-tech-row:hover{background:rgba(27,117,153,.06);}
.cal-cg-tech-row input[type=checkbox]{width:16px;height:16px;cursor:pointer;}
.cal-cg-tech-avatar{
  width:26px;
  height:26px;
  border-radius:50%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  font-size:10px;
  font-weight:700;
  color:#fff;
  flex-shrink:0;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.30);
}
.cal-cg-tech-name{
  flex:1;
  font-size:12px;
  font-weight:600;
  color:var(--text);
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
.cal-cg-tech-dept{
  font-size:10px;
  color:var(--cal-muted);
  background:rgba(27,117,153,.08);
  padding:2px 7px;
  border-radius:999px;
}

/* ── Eigener Button für Erweiterte-Suche — neben Quick-Search ────────── */
.cal-search-advanced-btn{
  display:inline-flex;
  align-items:center;
  gap:6px;
  padding:7px 12px;
  border:0;
  border-radius:8px;
  font-size:11.5px;
  font-weight:700;
  letter-spacing:.3px;
  cursor:pointer;
  white-space:nowrap;
  background:
    linear-gradient(180deg,
      rgba(255,255,255,.20) 0%,
      transparent 60%),
    linear-gradient(180deg,#1f88af 0%,#1B7599 100%);
  color:#fff;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.40),
    inset 0 -1px 0 rgba(0,0,0,.10),
    0 2px 6px rgba(27,117,153,.30);
  text-shadow:0 1px 1px rgba(0,0,0,.18);
  transition:transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.cal-search-advanced-btn:hover{
  transform:translateY(-1px);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.55),
    inset 0 -1px 0 rgba(0,0,0,.10),
    0 4px 14px rgba(27,117,153,.45);
}
.cal-search-advanced-btn i{font-size:13px;}
@media (max-width: 768px){
  .cal-search-advanced-btn-label{display:none;}
  .cal-search-advanced-btn{padding:7px 10px;}
}

/* ── DAY-STRIP (Dispo) — vertikaler Tagesnamen-Streifen rechts neben den
   Tech-Labels. Pro Row eine 36px-Spalte mit Brand-Gradient. Über alle
   Rows wird ein Overlay (cal-h-day-vert-overlay) gelegt das den
   ausgeschriebenen Tagesnamen hochkant darstellt. */
/* Per-Row Strip: NUR Layout-Platz reservieren (36px Spalte). Kein
   Background, keine Shadows — sonst entstehen sichtbare Brüche zwischen
   den Tech-Rows weil jede Row ihren eigenen Gradient zeichnet. Die
   eigentliche Optik (Brand-Farben + zentrierter rotierter Tagesname)
   liefert das absolute-positionierte .cal-h-day-vert-overlay. */
.cal-h-day-strip{
  width:36px;flex-shrink:0;
  position:sticky;left:160px;z-index:4;
  background:transparent;
}
.cal-h-day-strip.is-today{background:transparent;}
/* Overlay: ÜBERNIMMT die Optik — eine durchgehende Spalte über alle
   Tech-Rows hinweg. Per-Row Strips sind transparent (siehe oben), der
   Overlay-Gradient läuft also lückenlos. Tagesname zentriert, nicht oben. */
.cal-h-day-vert-overlay{
  position:absolute;
  top:24px;          /* nach Header-Row beginnen */
  bottom:0;
  left:160px;        /* nach .cal-h-label */
  width:36px;
  z-index:6;
  pointer-events:none;
  display:flex;
  align-items:center;
  justify-content:center;
  padding:0;
  overflow:hidden;
  /* Flat: solid Brand-Color, kein Highlight-Gradient, keine Inset-Shadows.
     User wollte clean ohne Schatten. */
  background:#1B7599;
  box-shadow:none;
}
.cal-h-day-vert-overlay.is-today{
  background:#16a34a;
}
.cal-h-day-vert-text{
  writing-mode:vertical-rl;
  transform:rotate(180deg);
  font-size:14px;
  font-weight:600;
  color:#fff;
  letter-spacing:2px;
  text-transform:uppercase;
  text-shadow:none;
  white-space:nowrap;
  -webkit-font-smoothing:antialiased;
}
/* Heute-Akzent: subtle pulsing glow auf dem Overlay-Text */
.cal-h-day-vert-overlay.is-today .cal-h-day-vert-text{
  animation:dayVertTodayPulse 2.6s ease-in-out infinite;
}
@keyframes dayVertTodayPulse{
  0%,100%{text-shadow:0 2px 4px rgba(0,0,0,.45),0 0 12px rgba(255,255,255,.25);}
  50%{text-shadow:0 2px 4px rgba(0,0,0,.45),0 0 22px rgba(255,255,255,.55);}
}
.cal-h-label{
  width:160px;flex-shrink:0;padding:6px 10px;
  display:flex;align-items:center;gap:8px;
  position:sticky;left:0;z-index:5;background:var(--surface);
  border-right:1px solid var(--border);font-size:12px;font-weight:500;
}
.cal-h-avatar{width:28px;height:28px;border-radius:50%;object-fit:cover;flex-shrink:0;}
.cal-h-avatar-ini{
  width:28px;height:28px;border-radius:50%;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  font-size:10px;font-weight:700;color:#fff;
}
.cal-h-name{
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  /* Feste Breite + rechtsbündig: Kürzel endet immer am gleichen Punkt
     (egal ob 1 oder 2 Buchstaben) → gleicher Abstand zum cal-cap-bar. */
  width:22px;flex-shrink:0;text-align:right;
}
.cal-h-timeline{
  flex:1;position:relative;min-width:600px;overflow:hidden;
}
.cal-h-grid-line{
  position:absolute;top:0;bottom:0;width:0;
  border-left:1px solid rgba(0,0,0,.04);
}
/* Events */
.cal-h-event{
  position:absolute;top:3px;bottom:3px;border-radius:6px;
  color:#fff;padding:4px 8px;font-size:11px;cursor:pointer;
  overflow:hidden;z-index:3;
  display:flex;flex-direction:column;justify-content:center;gap:1px;
  box-shadow:0 1px 3px rgba(0,0,0,.12);
  border-left:3px solid rgba(0,0,0,.15);
  transition:transform .1s;z-index:2;
}
.cal-h-event:hover{transform:scaleY(1.08);z-index:10;box-shadow:0 3px 10px rgba(0,0,0,.2);}
.cal-h-ev-time{font-size:10px;opacity:.85;font-weight:600;z-index:2;position:relative;}
.cal-h-ev-title{font-weight:700;font-size:12px;text-shadow:0 1px 1px rgba(0,0,0,.15);z-index:2;position:relative;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.cal-h-ev-loc{font-size:9px;opacity:.7;z-index:2;position:relative;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.cal-h-ev-loc i{margin-right:2px;font-size:8px;}
.cal-h-buffer{
  position:absolute;top:8px;bottom:8px;border-radius:4px;
  background:rgba(27,117,153,.06);z-index:1;
}
/* Floating */
.cal-h-floating{
  border:none;border-left:3px solid #f59e0b;
  background:rgba(245,158,11,.08)!important;
  color:var(--text);
}
.cal-h-floating-hdr{
  padding:6px 12px;font-size:11px;font-weight:600;color:#d97706;
  background:rgba(245,158,11,.04);border-bottom:1px solid rgba(245,158,11,.15);
  display:flex;align-items:center;gap:6px;
}
.cal-h-floating-row{border-bottom:none;}
/* Department headers */
.cal-h-dept-hdr{
  padding:6px 12px;font-size:12px;font-weight:700;
  background:var(--surface-2);border-bottom:1px solid var(--border);
  cursor:pointer;user-select:none;display:flex;align-items:center;gap:6px;
}
.cal-h-dept-chevron{transition:transform .2s;font-size:10px;color:var(--muted);}
.cal-h-dept-chevron:not(.open){transform:rotate(-90deg);}
.cal-h-dept-group.collapsed{display:none;}

@media(max-width:768px){
  .cal-h-label{width:100px;padding:4px 6px;}
  .cal-h-name{display:none;}
  .cal-h-timeline{min-width:400px;}
  .cal-h-event{font-size:10px;padding:1px 4px;}
}

/* Month view compact */
.cal-h-compact{padding:4px 12px;font-size:11px;}
.cal-h-compact + .cal-h-container .cal-h-row{min-height:32px;}
.cal-h-compact + .cal-h-container .cal-h-event{top:2px;bottom:2px;font-size:10px;padding:1px 4px;}
.cal-h-weekend{background:rgba(0,0,0,.02);}

/* ── Event States ─────────────────────────────────────────────────────── */
.cal-ev-past{opacity:.5;}
.cal-h-event.cal-ev-past{opacity:.45;}

/* ── Fix: Tech chip name visibility ──────────────────────────────────── */
.cal-tech-name{
  color:var(--text)!important;font-weight:500;
}
.cal-tech-chip{color:var(--text);}

/* ── Month compact ──────────────────────────────────────────────────── */
.cal-shared-weekend{background:rgba(0,0,0,.02);}
.cal-shared-dom-compact{font-size:13px!important;}
.cal-shared-hdr{overflow-x:auto;}

/* ── Collapsible Verwaltung Nav ──────────────────────────────────────── */
.verwaltung-nav{transition:width .25s ease,padding .25s ease;overflow:hidden;}
.verwaltung-nav.collapsed{width:48px!important;min-width:48px!important;padding:8px 4px!important;}
.verwaltung-nav.collapsed .verwaltung-nav-item span{display:none;}
.verwaltung-nav.collapsed .verwaltung-nav-item{justify-content:center;padding:10px 4px;}
.verwaltung-nav.collapsed .verwaltung-nav-item .nav-icon{margin:0;font-size:16px;}
.verwaltung-nav.collapsed .nav-group-label{display:none;}
/* ══════════════════════════════════════════════════════════════════════════
   Month Grid (Google Calendar Style)
   ══════════════════════════════════════════════════════════════════════════ */
.cal-mg-root{flex:1;display:flex;flex-direction:column;overflow:auto;}
.cal-mg-hdr{display:grid;grid-template-columns:repeat(7,1fr);border-bottom:1px solid var(--border);}
.cal-mg-dow{padding:6px;text-align:center;font-size:11px;font-weight:700;color:var(--muted);text-transform:uppercase;}
.cal-mg-week{display:grid;grid-template-columns:repeat(7,1fr);min-height:90px;border-bottom:1px solid rgba(0,0,0,.05);}
.cal-mg-cell{
  padding:4px 6px;border-right:1px solid rgba(0,0,0,.04);
  cursor:pointer;transition:background .1s;overflow:hidden;
  display:flex;flex-direction:column;min-height:80px;
}
.cal-mg-cell:hover{background:rgba(27,117,153,.03);}
.cal-mg-other{opacity:.4;}
.cal-mg-today{background:rgba(27,117,153,.04);}
.cal-mg-we{background:rgba(0,0,0,.015);}
.cal-mg-num{font-size:12px;font-weight:600;margin-bottom:4px;color:var(--text);}
.cal-mg-num-today{
  background:#1B7599;color:#fff;
  width:24px;height:24px;border-radius:50%;
  display:inline-flex;align-items:center;justify-content:center;
  font-size:11px;
}
.cal-mg-ev{
  display:flex;align-items:center;gap:4px;
  padding:1px 4px;margin-bottom:1px;border-radius:3px;
  font-size:10px;cursor:pointer;overflow:hidden;white-space:nowrap;
  transition:background .1s;
}
.cal-mg-ev:hover{background:rgba(0,0,0,.06);}
.cal-mg-ev-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0;}
.cal-mg-ev-time{font-weight:600;color:var(--muted);flex-shrink:0;}
.cal-mg-ev-title{overflow:hidden;text-overflow:ellipsis;}
.cal-mg-more{font-size:10px;color:#1B7599;font-weight:600;padding:1px 4px;cursor:pointer;}
.cal-mg-more:hover{text-decoration:underline;}

@media(max-width:768px){
  .cal-mg-cell{min-height:60px;padding:2px 3px;}
  .cal-mg-ev-time{display:none;}
  .cal-mg-num{font-size:11px;}
}

/* ══════════════════════════════════════════════════════════════════════════
   Floating Appointments List
   ══════════════════════════════════════════════════════════════════════════ */
.cal-floating-list:empty{display:none;}
.cal-floating-list{border-top:2px solid var(--cal-border-color);flex-shrink:0;}
.cal-float-hdr{
  padding:10px 16px;font-size:12px;font-weight:700;color:#d97706;
  background:rgba(245,158,11,.04);display:flex;align-items:center;gap:8px;
  user-select:none;
}
.cal-float-hdr-text{flex:1;}
.cal-float-chevron{font-size:10px;transition:transform .2s;}
.cal-floating-list.collapsed .cal-float-chevron{transform:rotate(-90deg);}
.cal-floating-list.collapsed .cal-float-cards{display:none;}
.cal-floating-list.collapsed .cal-float-hdr-text{display:none;}
.cal-floating-list.collapsed .cal-float-hdr{
  padding:6px 10px;gap:6px;justify-content:center;
}
.cal-float-badge{
  background:#f59e0b;color:#fff;font-size:10px;font-weight:700;
  padding:1px 6px;border-radius:10px;min-width:18px;text-align:center;
}
.cal-floating-list.collapsed .cal-float-badge{
  animation:cal-float-pulse 2s ease-in-out infinite;
}
@keyframes cal-float-pulse{
  0%,100%{box-shadow:0 0 0 0 rgba(245,158,11,.4);}
  50%{box-shadow:0 0 0 4px rgba(245,158,11,0);}
}
.cal-float-cards{
  display:flex;flex-wrap:wrap;gap:8px;padding:10px 16px;
}
/* Float-Termin-Karte — SemperConnect-Style: brand-teal Akzent statt amber.
   Klar strukturiert, professionell, keine spielerischen Borders. */
.cal-float-card{
  background:rgba(255,255,255,.9);
  border:1px solid rgba(27,117,153,.15);
  border-left:3px solid var(--cal-ev-color,#1B7599);
  border-radius:8px;
  padding:10px 12px;
  cursor:pointer;
  min-width:220px;max-width:320px;flex:1;
  transition:border-color .15s, box-shadow .15s, transform .15s;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.65), 0 1px 3px rgba(27,117,153,.08);
}
.cal-float-card:hover{
  border-color:rgba(27,117,153,.40);
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85), 0 3px 10px rgba(27,117,153,.18);
  transform:translateY(-1px);
}
.cal-float-card-title{font-weight:700;font-size:12.5px;margin-bottom:3px;color:#0f3a52;}
.cal-float-card-meta{font-size:11px;color:var(--cal-muted);}

/* ── NOTE-CARDS (neue Struktur) ──────────────────────────────────────────
   Outer Wrap → enthält den klickbaren Note-Body + optional die separierte
   Linked-Event-Sub-Card. Beide Click-Areas haben distinct hover-states damit
   User klar erkennt was er anklickt. */
.cal-note-wrap, .cal-task-wrap{
  background:rgba(255,255,255,.92);
  border:1px solid rgba(27,117,153,.15);
  border-radius:8px;
  overflow:hidden;
  margin-bottom:6px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.65), 0 1px 3px rgba(27,117,153,.06);
  transition:box-shadow .15s, transform .15s;
}
.cal-note-wrap:hover, .cal-task-wrap:hover{
  box-shadow:inset 0 1px 0 rgba(255,255,255,.85), 0 3px 10px rgba(27,117,153,.15);
}
/* PINNED-Notes — deutlich sichtbar mit warmem Amber-Akzent */
.cal-note-wrap.is-pinned{
  background:linear-gradient(180deg, rgba(254,243,199,.95) 0%, rgba(255,255,255,.95) 60%);
  border-color:rgba(217,119,6,.45);
  border-left:4px solid #d97706;
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.85),
    0 2px 8px rgba(217,119,6,.18),
    0 0 0 1px rgba(217,119,6,.10);
}
.cal-note-wrap.is-pinned:hover{
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.95),
    0 4px 14px rgba(217,119,6,.30),
    0 0 0 1px rgba(217,119,6,.20);
}
.cal-note-wrap.is-archived{ opacity:.55; filter:grayscale(.4); }
.cal-task-wrap.is-overdue{ border-left:3px solid #dc2626; }
.cal-task-wrap.is-high{ border-left:3px solid #dc2626; }
.cal-task-wrap{ border-left:3px solid var(--cal-task-color, #1B7599); }

/* Klickbare Hauptzone — Body + Chevron rechts. Hover gibt deutliches
   Feedback (Brand-Teal-Tint), damit User sieht "DAS öffnet die Notiz". */
.cal-note-clickable, .cal-task-clickable{
  display:flex;
  align-items:flex-start;
  gap:10px;
  padding:10px 12px;
  cursor:pointer;
  transition:background .15s ease;
}
.cal-note-clickable:hover, .cal-task-clickable:hover{
  background:rgba(27,117,153,.06);
}
.cal-note-body, .cal-task-body{ flex:1; min-width:0; }
.cal-note-status, .cal-task-status{
  display:flex;
  align-items:center;
  gap:6px;
  font-size:9px;
  margin-bottom:3px;
}
.cal-note-status > i, .cal-task-status > i{ font-size:10px; }
.cal-note-title, .cal-task-title{
  font-weight:700;
  font-size:13px;
  color:#0f3a52;
  margin-bottom:3px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.cal-note-content{
  font-size:11px;
  color:var(--cal-muted, #64748b);
  white-space:pre-wrap;
  line-height:1.4;
  display:-webkit-box;
  -webkit-line-clamp:3;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
.cal-task-meta{
  font-size:11px;
  color:var(--cal-muted, #64748b);
  display:flex;
  gap:8px;
  align-items:center;
  flex-wrap:wrap;
}
.cal-task-due{ display:inline-flex; align-items:center; gap:4px; }
.cal-task-due.is-overdue{ color:#dc2626; font-weight:700; }
.cal-task-due i{ font-size:9px; }
.cal-task-assignee{ opacity:.85; }

.cal-note-chevron, .cal-task-chevron{
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  width:20px;
  height:20px;
  color:rgba(27,117,153,.40);
  font-size:11px;
  transition:transform .15s ease, color .15s ease;
}
.cal-note-clickable:hover .cal-note-chevron,
.cal-task-clickable:hover .cal-task-chevron{
  color:#1B7599;
  transform:translateX(2px);
}

/* Verknüpfte-Termin-Subkarte: visuell getrennt durch Hairline + helles
   teal-Background. So unterscheidet sich der Bereich klar von der
   Hauptklick-Zone der Notiz/Aufgabe. */
.cal-note-linked-wrap, .cal-task-linked-wrap{
  border-top:1px dashed rgba(27,117,153,.20);
  background:rgba(27,117,153,.04);
  padding:8px 10px 8px;
}
.cal-note-linked-wrap > .cal-float-linked-event,
.cal-task-linked-wrap > .cal-float-linked-event{
  margin:0;
}

/* ── ADD-Buttons in Sidebar — SemperConnect Brand-Style ─────────────────
   Statt der dashed-yellow Buttons jetzt ein sauberer brand-teal Button
   mit liquid-glass-Highlight, konsistent zum Top-Nav. */
.cal-side-add-btn{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:6px;
  width:100%;
  padding:9px 12px;
  margin-top:6px;
  border:0;
  border-radius:8px;
  background:
    linear-gradient(180deg,
      rgba(255,255,255,.30) 0%,
      rgba(255,255,255,.08) 40%,
      transparent 100%),
    linear-gradient(180deg,#2a98c2 0%,#1B7599 100%);
  color:#fff;
  font-size:11px;
  font-weight:700;
  letter-spacing:.3px;
  cursor:pointer;
  text-shadow:0 1px 1px rgba(0,0,0,.18);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.55),
    inset 0 -1px 0 rgba(0,0,0,.10),
    0 2px 6px rgba(27,117,153,.30);
  transition:transform .15s ease, box-shadow .15s ease;
}
.cal-side-add-btn:hover{
  transform:translateY(-1px);
  box-shadow:
    inset 0 1px 0 rgba(255,255,255,.70),
    0 4px 12px rgba(27,117,153,.40);
}
.cal-side-add-btn i{font-size:11px;opacity:.95;}

.cal-side-secondary-btn{
  display:flex;
  align-items:center;
  justify-content:center;
  gap:5px;
  width:100%;
  padding:6px 10px;
  margin-top:5px;
  border:1px solid rgba(27,117,153,.18);
  border-radius:6px;
  background:rgba(27,117,153,.04);
  color:#1B7599;
  font-size:10px;
  font-weight:600;
  cursor:pointer;
  transition:background .14s ease, border-color .14s ease;
}
.cal-side-secondary-btn:hover{
  background:rgba(27,117,153,.10);
  border-color:rgba(27,117,153,.35);
}
.cal-side-secondary-btn i{font-size:10px;opacity:.9;}

/* ── LINKED-EVENT-SUBCARD ─────────────────────────────────────────────────
   Mini-Termin-Kachel innerhalb einer Notiz oder Aufgabe. Zeigt den
   verknüpften Termin (Titel, Datum, Zeit, Liegenschaft) als anklickbare
   Sub-Card. Klick öffnet calOpenEditor mit der Event-ID. */
.cal-float-linked-event{
  margin-top:8px;
  padding:6px 10px;
  border-radius:6px;
  border-left:3px solid var(--ev-color,#1B7599);
  background:rgba(27,117,153,.06);
  cursor:pointer;
  transition:background .15s ease, transform .15s ease;
}
.cal-float-linked-event:hover{
  background:rgba(27,117,153,.13);
  transform:translateX(1px);
}
.cal-float-linked-event-title{
  font-weight:600;
  font-size:11px;
  color:#0f3a52;
  margin-bottom:2px;
  display:flex;
  align-items:center;
  gap:5px;
}
.cal-float-linked-event-title i{
  font-size:9px;
  color:#1B7599;
  flex-shrink:0;
}
.cal-float-linked-event-meta{
  font-size:10px;
  color:var(--cal-muted,#64748b);
  display:flex;
  align-items:center;
  gap:5px;
  flex-wrap:wrap;
}
.cal-float-linked-event-meta i{
  font-size:9px;
  opacity:.8;
}

/* ══════════════════════════════════════════════════════════════════════════
   User Color Picker
   ══════════════════════════════════════════════════════════════════════════ */
.cal-color-user-row{
  display:flex;align-items:center;gap:10px;
  padding:10px 12px;border:1.5px solid var(--cal-border-color);
  border-radius:10px;background:var(--cal-surface);
  transition:border-color .15s;
}
.cal-color-user-row:hover{border-color:rgba(27,117,153,.2);}
.cal-color-avatar{
  width:34px;height:34px;border-radius:50%;flex-shrink:0;
  display:flex;align-items:center;justify-content:center;
  font-size:12px;font-weight:700;color:#fff;
  transition:background .2s;
}
.cal-color-name{font-weight:600;font-size:13px;min-width:80px;}
.cal-color-presets{display:flex;gap:4px;flex-wrap:wrap;margin-left:auto;align-items:center;}
.cal-color-dot{
  width:22px;height:22px;border-radius:50%;border:2px solid transparent;
  cursor:pointer;transition:all .15s;padding:0;
}
.cal-color-dot:hover{transform:scale(1.2);box-shadow:0 2px 6px rgba(0,0,0,.2);}
.cal-color-dot.active{border-color:#fff;box-shadow:0 0 0 2px rgba(0,0,0,.3),0 2px 6px rgba(0,0,0,.15);transform:scale(1.15);}
.cal-color-custom{
  width:22px;height:22px;border-radius:50%;border:2px dashed var(--cal-border-color);
  cursor:pointer;padding:0;background:none;
}
.cal-color-custom::-webkit-color-swatch-wrapper{padding:0;}
.cal-color-custom::-webkit-color-swatch{border:none;border-radius:50%;}
.cal-color-custom::-moz-color-swatch{border:none;border-radius:50%;}

/* Add button on technician rows */
.cal-h-add-btn{
  margin-left:auto;width:22px;height:22px;border-radius:50%;
  border:none;background:rgba(27,117,153,.08);color:#1B7599;
  cursor:pointer;font-size:10px;display:flex;align-items:center;
  justify-content:center;opacity:0;transition:all .15s;flex-shrink:0;
}
.cal-h-row:hover .cal-h-add-btn{opacity:1;}
.cal-h-add-btn:hover{background:#1B7599;color:#fff;transform:scale(1.15);}

/* Force calendar view to fill viewport */
#view-calendar{display:flex!important;flex:1 1 0%!important;flex-direction:column!important;overflow:hidden!important;min-height:0!important;}
#view-calendar>.cal-root{flex:1 1 0%!important;min-height:0!important;overflow:hidden;}

/* ══════════════════════════════════════════════════════════════════════════
   Equipment Kits (Gerätelisten)
   ══════════════════════════════════════════════════════════════════════════ */
.cal-kit-card{
  background:var(--surface);border:1.5px solid var(--border);
  border-radius:12px;padding:16px;display:flex;flex-direction:column;gap:8px;
  transition:border-color .15s,box-shadow .15s;
}
.cal-kit-card:hover{border-color:rgba(27,117,153,.3);box-shadow:0 2px 8px rgba(0,0,0,.06);}
.cal-kit-card-hdr{display:flex;align-items:center;justify-content:space-between;}
.cal-kit-card-title{font-weight:700;font-size:14px;display:flex;align-items:center;gap:8px;}
.cal-kit-card-desc{font-size:11px;color:var(--muted);}
.cal-kit-card-stats{display:flex;gap:12px;font-size:11px;color:var(--muted);}
.cal-kit-btn{
  width:28px;height:28px;border:none;border-radius:6px;
  background:rgba(0,0,0,.04);color:var(--muted);cursor:pointer;
  display:flex;align-items:center;justify-content:center;font-size:11px;
  transition:all .15s;
}
.cal-kit-btn:hover{background:rgba(27,117,153,.1);color:#1B7599;}
.cal-kit-btn-del:hover{background:rgba(220,38,38,.1);color:#dc2626;}
.cal-kit-items-preview{display:flex;flex-wrap:wrap;gap:4px;}
.cal-kit-item-chip{
  padding:3px 8px;border-radius:6px;font-size:10px;font-weight:500;
  display:flex;align-items:center;gap:4px;
  background:rgba(0,0,0,.04);
}
.cal-kit-item-req{background:rgba(220,38,38,.06);color:#dc2626;}
.cal-kit-item-opt{background:rgba(27,117,153,.06);color:#1B7599;}
.cal-kit-card-linked{display:flex;flex-wrap:wrap;gap:4px;margin-top:4px;border-top:1px solid var(--border);padding-top:8px;}
.cal-kit-svc-badge{
  padding:2px 8px;border-radius:4px;font-size:10px;font-weight:600;
  background:var(--c);color:#fff;
}

/* Kit editor — equipment rows */
.cal-kit-cat-hdr{
  font-size:11px;font-weight:700;color:var(--muted);
  padding:8px 12px 4px;display:flex;align-items:center;gap:6px;
  text-transform:uppercase;letter-spacing:.5px;
}
.cal-kit-eq-row{
  display:flex;align-items:center;gap:12px;
  padding:10px 14px;border:1.5px solid var(--border);border-radius:10px;
  cursor:pointer;transition:all .15s;
}
.cal-kit-eq-row:hover{border-color:rgba(27,117,153,.25);background:rgba(27,117,153,.02);}
.cal-kit-eq-sel{border-color:rgba(27,117,153,.4);background:rgba(27,117,153,.04);}
.cal-kit-eq-thumb{
  width:48px;height:48px;border-radius:8px;object-fit:cover;
  flex-shrink:0;border:1px solid var(--border);
}
.cal-kit-eq-nophoto{
  display:flex;align-items:center;justify-content:center;
  background:rgba(0,0,0,.03);color:var(--muted);font-size:18px;
}
.cal-kit-eq-info{flex:1;min-width:0;display:flex;flex-direction:column;gap:2px;}
.cal-kit-eq-name{font-weight:600;font-size:13px;}
.cal-kit-eq-meta{display:flex;flex-wrap:wrap;gap:8px;font-size:10px;color:var(--muted);}
.cal-kit-eq-meta i{margin-right:2px;}
.cal-kit-eq-note{font-size:10px;color:var(--muted);font-style:italic;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.cal-kit-req-sel{
  font-size:11px;padding:4px 8px;border-radius:6px;
  border:1px solid var(--border);flex-shrink:0;cursor:pointer;
}

/* ═══════════════════════════════════════════════════════════════════════════
   ANIMATIONS-KIT — Drag, Resize, Snap, Hover, Cross-Day-Drop
   ═══════════════════════════════════════════════════════════════════════════ */

/* Drop-Target — pulsiert leicht blau wenn ein Drag drüber schwebt */
.cal-h-timeline.cal-drop-target,
.cal-shared-day-col.cal-drop-target{
  position:relative;
}
.cal-h-timeline.cal-drop-target::before,
.cal-shared-day-col.cal-drop-target::before{
  content:'';position:absolute;inset:1px;
  background:rgba(27,117,153,.10);
  border:2px dashed rgba(27,117,153,.55);
  border-radius:6px;
  pointer-events:none;z-index:0;
  animation:cal-droptarget-pulse 1.2s ease-in-out infinite;
}
@keyframes cal-droptarget-pulse{
  0%,100% { background:rgba(27,117,153,.08); border-color:rgba(27,117,153,.45); }
  50%     { background:rgba(27,117,153,.16); border-color:rgba(27,117,153,.75); }
}

/* Drag-Ghost — fixed positioned, folgt Cursor mit weichem Schatten */
.drag-ghost{
  border-radius:8px;
  transition:none !important;
  user-select:none;
  -webkit-user-select:none;
}

.cal-shared-ev,.cal-h-event{
  cursor:pointer;
  /* Cubic-bezier ease-out für natürliche Beschleunigung beim Snap */
  transition:
    top    .18s cubic-bezier(.22,.61,.36,1),
    left   .18s cubic-bezier(.22,.61,.36,1),
    height .18s cubic-bezier(.22,.61,.36,1),
    width  .18s cubic-bezier(.22,.61,.36,1),
    transform .12s ease-out,
    box-shadow .15s ease-out;
  will-change:top,left,width,height;
}
/* Während aktivem Drag/Resize: keine transition, sonst hängt's */
.cal-shared-ev.dragging,.cal-h-event.dragging,
.cal-shared-ev.resizing,.cal-h-event.resizing{
  cursor:move;
  transition:none !important;
  /* Glow während Drag */
  box-shadow:
    0 8px 24px rgba(27,117,153,.35),
    0 0 0 2px rgba(27,117,153,.55),
    inset 0 0 0 1px rgba(255,255,255,.4) !important;
  z-index:100 !important;
  transform:scale(1.02);
}
.cal-h-event.resizing,.cal-shared-ev.resizing{
  transform:none;
  box-shadow:
    0 4px 14px rgba(27,117,153,.25),
    0 0 0 2px rgba(34,197,94,.55) !important;
}
/* Snap-Puls: kurzes grünes Aufleuchten beim 15-min Einrasten */
@keyframes cal-snap-flash{
  0%   { box-shadow: 0 0 0 0 rgba(34,197,94,.55); }
  60%  { box-shadow: 0 0 0 8px rgba(34,197,94,0); }
  100% { box-shadow: 0 0 0 0 rgba(34,197,94,0); }
}
.cal-shared-ev.snap-flash,.cal-h-event.snap-flash{
  animation:cal-snap-flash .35s ease-out;
}
/* Hover-Lift — leicht angehoben für tactile Feedback */
.cal-shared-ev:hover,.cal-h-event:hover{
  transform:translateY(-1px);
  box-shadow:0 4px 12px rgba(0,0,0,.18);
}
.cal-shared-ev.dragging:hover,.cal-h-event.dragging:hover{
  transform:scale(1.02); /* override hover-lift bei drag */
}
/* Drag-Ghost — der Original-Termin halbtransparent, sodass Original-Position
   sichtbar bleibt während die neue Position zeigt wo es hingeht */
.cal-shared-ev[data-drag-ghost],.cal-h-event[data-drag-ghost]{
  opacity:.35; pointer-events:none;
}
/* Drop-Bounce — kurzes Aufpoppen wenn Termin landet */
@keyframes cal-drop-bounce{
  0%   { transform:scale(1.05); }
  50%  { transform:scale(.98); }
  100% { transform:scale(1); }
}
.cal-shared-ev.drop-bounce,.cal-h-event.drop-bounce{
  animation:cal-drop-bounce .25s ease-out;
}

/* Buffer-Block transitions sind in der Hauptdefinition unten (Z.5924) konsolidiert */

/* Live-Preview-Shift: Termine die durch Drag-Hover wegrücken sollen */
.cal-h-event.cal-collide-shift,
.cal-shared-ev.cal-collide-shift{
  transition:transform .22s cubic-bezier(.34,1.5,.64,1) !important;
  z-index:30 !important;
  box-shadow:0 4px 14px rgba(220,38,38,.18), 0 0 0 1px rgba(220,38,38,.35) !important;
  opacity:.85;
}
/* Live-Shift auch für mitziehende Buffer-Blöcke */
.cal-travel-block.cal-collide-shift,
.cal-travel-block-vert.cal-collide-shift{
  transition:transform .22s cubic-bezier(.34,1.5,.64,1) !important;
  opacity:.7;
}

/* Worktime-Konflikt-Warnbox in Detail-Karte (Klick auf Termin) — sehr deutlich */
.cal-det-worktime-warn{
  display:flex;align-items:flex-start;gap:10px;
  padding:14px 16px;margin:0 0 12px 0;
  background:linear-gradient(135deg,rgba(220,38,38,.12),rgba(220,38,38,.06));
  border:2px solid rgba(220,38,38,.55);border-radius:8px;
  font-size:13px;color:#7c1d1d;font-weight:500;line-height:1.45;
  box-shadow:0 2px 8px rgba(220,38,38,.15);
  animation:cal-warn-slide .25s ease-out;
}
.cal-det-worktime-warn i{
  color:#dc2626;font-size:20px;flex-shrink:0;margin-top:1px;
  animation:cal-warn-pulse 1.6s ease-in-out infinite;
}
.cal-det-worktime-warn strong{color:#991b1b;}
@keyframes cal-warn-pulse{
  0%,100% { transform:scale(1); opacity:1; }
  50%     { transform:scale(1.1); opacity:.85; }
}

/* Drag Pop-Out — nur bei Cross-Day Drag: Original "ploppt" zuerst raus aus
   seinem Slot, dann wird Ghost erstellt. Rein visueller Effekt, dauert 180ms. */
@keyframes cal-drag-pop-out{
  0%   { transform:scale(1) translateY(0);            box-shadow:0 1px 3px rgba(0,0,0,.1); }
  60%  { transform:scale(1.08) translateY(-6px);      box-shadow:0 16px 40px rgba(0,0,0,.4), 0 0 0 3px rgba(27,117,153,.7); }
  100% { transform:scale(1.04) translateY(-3px);      box-shadow:0 12px 28px rgba(0,0,0,.3), 0 0 0 2px rgba(27,117,153,.5); }
}
.cal-shared-ev.popping-out,.cal-h-event.popping-out{
  animation:cal-drag-pop-out .22s cubic-bezier(.34,1.56,.64,1) forwards;
  z-index:200 !important;
  transition:none !important;
}

/* Same-Day-Drag: Card bleibt im Slot, smooth gleitend — Buffer-Block folgt */
.cal-shared-ev.dragging-same,.cal-h-event.dragging-same{
  z-index:50;
  box-shadow:0 6px 18px rgba(27,117,153,.32), 0 0 0 2px rgba(27,117,153,.5) !important;
  cursor:grabbing;
  transition:none !important; /* direkte Position-Updates */
  opacity:.96;
}
.cal-travel-block.same-day-following{
  transition:none !important;
  opacity:.85;
}

/* Einsatzort kompakt — wenn Property zugewiesen, kleine Read-Only-Darstellung
   mit "ändern"-Link statt großem Eingabefeld. Spart Platz im Editor. */
.cal-ed-loc-compact{
  display:flex;align-items:center;gap:8px;
  padding:10px 12px;background:rgba(27,117,153,.05);
  border:1px solid rgba(27,117,153,.15);border-radius:6px;
  font-size:13px;color:var(--text);
}
.cal-ed-loc-compact .cal-ed-loc-text{flex:1;font-weight:500;}
.cal-ed-loc-edit-link{
  font-size:11px;color:#1B7599;text-decoration:underline;
  cursor:pointer;flex-shrink:0;
}
.cal-ed-loc-edit-link:hover{color:#15647f;}

/* Worktime-Konflikt-Warnbox im Editor */
.cal-worktime-warn{
  margin-top:8px;padding:10px 12px;
  background:rgba(220,38,38,.08);border:1px solid rgba(220,38,38,.3);
  border-radius:6px;font-size:12px;color:#7c1d1d;
  display:flex;align-items:flex-start;gap:8px;
  animation:cal-warn-slide .22s ease-out;
}
.cal-worktime-warn i{color:#dc2626;font-size:14px;margin-top:1px;}
.cal-worktime-warn.is-error{
  background:rgba(220,38,38,.12);border-color:rgba(220,38,38,.45);
}
@keyframes cal-warn-slide{
  from { opacity:0; transform:translateY(-4px); }
  to   { opacity:1; transform:translateY(0); }
}

/* Draggable events in admin */
.cal-shared-ev,.cal-h-event{cursor:pointer;}
.cal-shared-ev.dragging,.cal-h-event.dragging{cursor:move;}

/* Equipment warning badge on dispo events */
.cal-h-eq-warn{
  position:absolute;top:1px;right:3px;
  font-size:8px;color:#fff;background:#dc2626;
  width:14px;height:14px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  animation:cal-eq-pulse 2s infinite;
}
@keyframes cal-eq-pulse{
  0%,100%{opacity:1;}
  50%{opacity:.5;}
}
/* Skip reason badge in checklist */
.cal-eq-skip-badge{
  color:#f59e0b;font-size:12px;cursor:help;margin-left:4px;
}

/* Service color — diagonal corner badge (clips to border-radius via parent overflow:hidden) */
.cal-h-svc-corner{
  position:absolute;top:0;left:0;
  width:0;height:0;
  border-style:solid;
  border-width:20px 20px 0 0;
  border-color:var(--svc-c,transparent) transparent transparent transparent;
  pointer-events:none;z-index:0;
}
.cal-shared-ev .cal-h-svc-corner{border-width:16px 16px 0 0;}

/* ── Work Status — Ultra-modern glow effects ─────────────────────────── */

/* Arbeit läuft — pulsing green glow behind event */
.cal-h-event.cal-ev-working{
  border-left:4px solid #22c55e!important;
  box-shadow:0 0 8px rgba(34,197,94,.3),0 0 20px rgba(34,197,94,.15),inset 0 0 12px rgba(34,197,94,.1);
  animation:cal-glow-green 2s ease-in-out infinite;
}
@keyframes cal-glow-green{
  0%,100%{box-shadow:0 0 8px rgba(34,197,94,.3),0 0 20px rgba(34,197,94,.1);}
  50%{box-shadow:0 0 14px rgba(34,197,94,.5),0 0 30px rgba(34,197,94,.25),inset 0 0 16px rgba(34,197,94,.15);}
}
.cal-h-event.cal-ev-working::before{
  content:'';position:absolute;inset:0;border-radius:inherit;
  background:linear-gradient(90deg,rgba(34,197,94,.12),transparent 50%);
  pointer-events:none;
}

/* Abgeschlossen — green shimmer + checkmark */
.cal-h-event.cal-ev-done{
  border-left:4px solid #16a34a!important;
  box-shadow:0 0 6px rgba(22,163,74,.2);
  opacity:.8;
}
.cal-h-event.cal-ev-done::before{
  content:'✓';position:absolute;right:6px;top:50%;transform:translateY(-50%);
  font-size:11px;font-weight:900;color:rgba(255,255,255,.6);
  text-shadow:0 0 6px rgba(22,163,74,.5);
}

/* Überfällig — pulsing red glow */
.cal-h-event.cal-ev-overdue{
  border-left:4px solid #ef4444!important;
  animation:cal-glow-red 1.2s ease-in-out infinite;
}
@keyframes cal-glow-red{
  0%,100%{box-shadow:0 0 8px rgba(239,68,68,.3),0 0 16px rgba(239,68,68,.1);}
  50%{box-shadow:0 0 16px rgba(239,68,68,.5),0 0 32px rgba(239,68,68,.2),inset 0 0 12px rgba(239,68,68,.1);}
}
.cal-h-event.cal-ev-overdue::before{
  content:'!';position:absolute;right:6px;top:50%;transform:translateY(-50%);
  font-size:12px;font-weight:900;color:rgba(255,200,200,.9);
  text-shadow:0 0 8px rgba(239,68,68,.6);
  animation:cal-glow-blink .8s ease-in-out infinite;
}
@keyframes cal-glow-blink{0%,100%{opacity:1;}50%{opacity:.2;}}

/* Startet bald — amber glow pulse */
.cal-h-event.cal-ev-starting{
  border-left:4px solid #f59e0b!important;
  box-shadow:0 0 6px rgba(245,158,11,.2),0 0 14px rgba(245,158,11,.1);
  animation:cal-glow-amber 2s ease-in-out infinite;
}
@keyframes cal-glow-amber{
  0%,100%{box-shadow:0 0 6px rgba(245,158,11,.2);}
  50%{box-shadow:0 0 12px rgba(245,158,11,.4),0 0 24px rgba(245,158,11,.15);}
}

/* ── Shared Timeline — Same glow effects ── */
.cal-shared-ev.cal-ev-working{
  border-left:4px solid #22c55e!important;
  animation:cal-glow-green 2s ease-in-out infinite;
}
.cal-shared-ev.cal-ev-working::after{
  content:'';position:absolute;inset:0;border-radius:inherit;
  background:linear-gradient(180deg,rgba(34,197,94,.1),transparent 60%);
  pointer-events:none;
}
.cal-shared-ev.cal-ev-done{
  border-left:4px solid #16a34a!important;opacity:.75;
  box-shadow:0 0 6px rgba(22,163,74,.2);
}
.cal-shared-ev.cal-ev-done::after{
  content:'✓';position:absolute;bottom:3px;right:4px;
  font-size:10px;font-weight:900;color:rgba(255,255,255,.6);
  text-shadow:0 0 4px rgba(22,163,74,.4);
}
.cal-shared-ev.cal-ev-overdue{
  border-left:4px solid #ef4444!important;
  animation:cal-glow-red 1.2s ease-in-out infinite;
}
.cal-shared-ev.cal-ev-starting{
  border-left:4px solid #f59e0b!important;
  animation:cal-glow-amber 2s ease-in-out infinite;
}

/* Floating drag — live preview in grid */
.cal-float-preview{
  position:absolute;top:3px;bottom:3px;border-radius:6px;
  background:rgba(245,158,11,.65);color:#fff;
  display:flex;align-items:center;gap:4px;
  padding:2px 8px;font-size:11px;overflow:hidden;white-space:nowrap;
  border:2px dashed rgba(255,255,255,.5);
  box-shadow:0 0 12px rgba(245,158,11,.3);
  pointer-events:none;z-index:20;
  transition:left .08s ease-out,width .08s ease-out;
}
.cal-float-preview-v{
  position:absolute;left:3px;right:3px;border-radius:6px;
  background:rgba(245,158,11,.65);color:#fff;
  padding:4px 8px;font-size:11px;overflow:hidden;
  border:2px dashed rgba(255,255,255,.5);
  box-shadow:0 0 12px rgba(245,158,11,.3);
  pointer-events:none;z-index:20;
  transition:top .08s ease-out,height .08s ease-out;
}
/* Drop zone highlight */
.cal-drop-zone-active{
  background:rgba(245,158,11,.03)!important;
  transition:background .2s;
}

/* ── Phase 3: Map Preview ── */
.cal-det-map{
  height:180px;border-radius:8px;overflow:hidden;
  border:1px solid var(--border);
}
.cal-det-map-section{margin:0 -2px;}

/* ── Phase 3: Upload Button ── */
.cal-det-upload-btn{
  margin-left:auto;background:var(--primary,#1B7599);color:#fff;
  border:none;border-radius:6px;padding:4px 10px;font-size:11px;
  cursor:pointer;display:flex;align-items:center;gap:4px;
  font-weight:600;
}
.cal-det-upload-btn:hover{opacity:.85;}
.cal-det-section-hdr{display:flex;align-items:center;gap:6px;}

/* ── Phase 3: Notes Section ── 
   Volle Breite — bis links und rechts zum Modal-Rand. Detail-Body hat
   padding:14px 16px → wir kompensieren mit margin -16px und ergänzen
   intern eigenes padding für Lesbarkeit. */
.cal-det-notes-block{
  margin:0 -16px 8px;
  padding:0 16px;
}
.cal-det-notes-label{
  font-size:11px;font-weight:600;color:var(--muted);
  margin-bottom:4px;padding:0 16px;
}
.cal-det-notes-text{
  font-size:13px;line-height:1.5;color:var(--text);
  padding:12px 16px;
  background:rgba(0,0,0,.02);
  border-radius:0;
  /* breakout: ausserhalb des -16px parents nochmal ausdehnen */
  margin:0;
}
.cal-det-access-notes{
  font-size:13px;resize:vertical;min-height:60px;
  width:100%;box-sizing:border-box;
}

/* ── Service Typeahead Dropdown ── */
.cal-svc-typeahead{position:relative;}
.cal-svc-dropdown{
  display:none;position:absolute;top:100%;left:0;right:0;
  background:var(--surface,#fff);border:1px solid var(--border);
  border-radius:8px;box-shadow:0 6px 20px rgba(0,0,0,.12);
  z-index:100;max-height:220px;overflow-y:auto;
}
.cal-svc-dd-item{
  padding:8px 12px;cursor:pointer;display:flex;align-items:center;gap:8px;
  font-size:13px;transition:background .1s;
}
.cal-svc-dd-item:hover{background:rgba(27,117,153,.06);}
.cal-svc-dd-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;}

/* ── Billing Section ── */
.cal-ed-billing-group{
  border:1px solid var(--border);border-radius:8px;padding:12px 14px;
  background:rgba(0,0,0,.01);
}
.cal-ed-billing-group .cal-section-hdr{margin-bottom:8px;}

/* ── Contact Picker Results ── */
.cal-contact-result{
  display:flex;align-items:center;gap:12px;
  padding:12px 14px;cursor:pointer;
  border-bottom:1px solid rgba(0,0,0,.05);
  transition:background .1s;
}
.cal-contact-result:last-child{border-bottom:none;}
.cal-contact-result:hover{background:rgba(27,117,153,.04);}
.cal-contact-result-main{flex:1;min-width:0;}
.cal-contact-result-name{font-weight:600;font-size:14px;margin-bottom:2px;}
.cal-contact-result-addr,.cal-contact-result-email,.cal-contact-result-phone{
  font-size:12px;color:var(--muted);display:flex;align-items:center;gap:4px;
}
.cal-contact-result-addr i,.cal-contact-result-email i,.cal-contact-result-phone i{
  width:12px;font-size:10px;opacity:.6;
}

/* ── Editor 2-Column Desktop Layout ── */
.cal-ed-columns{
  display:grid;grid-template-columns:1fr 1fr;gap:20px;
}
@media(max-width:680px){
  .cal-ed-columns{grid-template-columns:1fr;}
}
.cal-ed-col{display:flex;flex-direction:column;gap:12px;}
.cal-ed-col-hdr{
  font-size:11px;font-weight:700;text-transform:uppercase;
  letter-spacing:.5px;color:var(--muted);padding-bottom:4px;
  border-bottom:1px solid var(--border);margin-bottom:4px;
  display:flex;align-items:center;gap:6px;
}

/* ── Billing Toggle ── */
.cal-billing-toggle{
  display:flex;align-items:center;gap:8px;
  padding:10px 14px;border-radius:8px;cursor:pointer;
  border:1px solid var(--border);background:rgba(0,0,0,.01);
  transition:all .2s;font-size:13px;
}
.cal-billing-toggle:hover{border-color:var(--primary);}
.cal-billing-toggle i{font-size:14px;color:var(--primary);}
.cal-billing-toggle-switch{
  margin-left:auto;width:36px;height:20px;border-radius:10px;
  background:#ccc;position:relative;transition:background .2s;
}
.cal-billing-toggle-switch::after{
  content:'';position:absolute;top:2px;left:2px;
  width:16px;height:16px;border-radius:50%;background:#fff;
  transition:transform .2s;
}
.cal-billing-toggle.active .cal-billing-toggle-switch{background:var(--primary,#1B7599);}
.cal-billing-toggle.active .cal-billing-toggle-switch::after{transform:translateX(16px);}
.cal-billing-fields{overflow:hidden;max-height:0;opacity:0;transition:max-height .3s,opacity .3s,padding .3s;padding:0 14px;}
.cal-billing-fields.open{max-height:500px;opacity:1;padding:12px 14px 16px;}
.cal-billing-warn{
  font-size:11px;color:#d97706;display:flex;align-items:center;gap:6px;
  padding:6px 0;
}
.cal-billing-warn i{font-size:12px;}

/* ── Editor Map Preview ── */
.cal-ed-map-preview{
  display:none;height:160px;border-radius:8px;overflow:hidden;
  border:1px solid var(--border);margin-top:8px;
}
/* Fix Google Places dropdown z-index */
.pac-container{z-index:100000!important;}

/* ── Address Autocomplete Dropdown ── */
.cal-addr-wrap{position:relative;}
.cal-addr-dropdown{
  display:none;position:absolute;top:100%;left:0;right:0;
  background:var(--surface,#fff);border:1px solid var(--border);
  border-radius:0 0 8px 8px;box-shadow:0 8px 24px rgba(0,0,0,.12);
  z-index:1000;max-height:250px;overflow-y:auto;
  border-top:none;
}
.cal-addr-item{
  display:flex;align-items:flex-start;gap:10px;
  padding:10px 14px;cursor:pointer;transition:background .1s;
}
.cal-addr-item:hover{background:rgba(27,117,153,.05);}
.cal-addr-item i{color:var(--muted);margin-top:3px;flex-shrink:0;font-size:12px;}
.cal-addr-main{font-size:13px;font-weight:600;}
.cal-addr-sub{font-size:11px;color:var(--muted);}

/* ── Billing Warning Banner (prominent) ── */
.cal-billing-warn-banner{
  display:flex;align-items:center;gap:10px;
  padding:12px 16px;border-radius:8px;margin-bottom:8px;
  background:linear-gradient(135deg,#fef3c7,#fde68a);
  border:1.5px solid #f59e0b;
  color:#92400e;font-weight:700;font-size:13px;
  animation:cal-bill-pulse 2s ease-in-out infinite;
}
.cal-billing-warn-banner i{font-size:18px;color:#d97706;}
@keyframes cal-bill-pulse{
  0%,100%{box-shadow:0 0 0 0 rgba(245,158,11,.3);}
  50%{box-shadow:0 0 0 6px rgba(245,158,11,0);}
}

/* ── Billing Ask Toggle ── */
.cal-bill-ask-label{
  display:flex;align-items:center;gap:10px;cursor:pointer;
  padding:10px 12px;border-radius:8px;
  border:1px solid var(--border);background:rgba(0,0,0,.01);
  transition:all .2s;font-size:12px;
}
.cal-bill-ask-label:hover{border-color:#f59e0b;}
.cal-bill-ask-label input{display:none;}
.cal-bill-ask-switch{
  width:36px;height:20px;border-radius:10px;background:#ccc;
  position:relative;transition:background .2s;flex-shrink:0;
}
.cal-bill-ask-switch::after{
  content:'';position:absolute;top:2px;left:2px;
  width:16px;height:16px;border-radius:50%;background:#fff;
  transition:transform .2s;
}
.cal-bill-ask-label input:checked ~ .cal-bill-ask-switch{background:#f59e0b;}
.cal-bill-ask-label input:checked ~ .cal-bill-ask-switch::after{transform:translateX(16px);}
.cal-bill-ask-text{flex:1;line-height:1.4;color:var(--text);}
.cal-bill-ask-text i{color:#d97706;margin-right:2px;}

/* ── Stammadressen Cards ── */
.cal-addr-user-card{
  background:var(--surface,#fff);border:1px solid var(--border);
  border-radius:10px;padding:14px;
}

/* ── Ersttermin Toggle ── */
.cal-ersttermin-toggle{
  display:flex;align-items:center;gap:10px;cursor:pointer;
  padding:10px 14px;border-radius:8px;
  border:1px solid var(--border);background:rgba(0,0,0,.01);
  transition:all .2s;
}
.cal-ersttermin-toggle:hover{border-color:var(--primary);}
.cal-ersttermin-toggle input{display:none;}
.cal-ersttermin-switch{
  width:36px;height:20px;border-radius:10px;background:#ccc;
  position:relative;transition:background .2s;flex-shrink:0;
}
.cal-ersttermin-switch::after{
  content:'';position:absolute;top:2px;left:2px;
  width:16px;height:16px;border-radius:50%;background:#fff;
  transition:transform .2s;
}
.cal-ersttermin-toggle input:checked ~ .cal-ersttermin-switch{background:var(--primary,#1B7599);}
.cal-ersttermin-toggle input:checked ~ .cal-ersttermin-switch::after{transform:translateX(16px);}
.cal-ersttermin-text{font-size:13px;font-weight:600;}
.cal-ersttermin-text i{margin-right:4px;}
.cal-ersttermin-details{
  border:1px solid var(--border);border-radius:8px;
  padding:12px 14px;margin-top:8px;background:rgba(27,117,153,.02);
}

.cal-h-timeline-header{background:transparent;border-bottom:1px solid var(--border);min-height:22px;}

/* Timeline hour markers */
.cal-shared-hour-lbl{
  height:60px;display:flex;align-items:flex-start;
  position:relative;padding-right:8px;
}
.cal-shared-hour-line{
  position:absolute;right:0;top:0;bottom:0;width:1px;
  background:rgba(0,0,0,.1);
}
/* Grauer Punkt am Top der Stunden-Linie ENTFERNT — sah aus wie zusätzlicher
   Marker neben den Stundenzahlen und verwirrte das Auge. Saubere Linie reicht. */
.cal-shared-hour-text{
  font-size:10px;color:var(--muted);font-weight:600;
  margin-top:-1px;
}
/* Kein hochgestelltes "00" mehr — wirkte ebenfalls wie Pünktchen. */
.cal-shared-hour-text sup{display:none;}

/* ── Now-line (Timeline - horizontal red line) ── */
.cal-now-line-h{
  position:absolute;left:0;right:0;height:2px;
  background:#dc2626;z-index:20;pointer-events:none;
}
.cal-now-dot{
  position:absolute;left:-4px;top:-3px;
  width:8px;height:8px;border-radius:50%;background:#dc2626;
}
/* ── Standard-Arbeitszeit-Markierung: außerhalb der Arbeitszeit ───────
   Diagonale Streifen-Pattern statt schwacher Tint — User sieht klarer
   wo der Tech NICHT arbeitet. Liegt hinter Events und Buffern (z-index 0).
   Pointer-Events deaktiviert sodass Klicks/Drags durchgehen. */
.cal-nonwork{
  position:absolute;
  background-image:
    repeating-linear-gradient(
      45deg,
      rgba(220,38,38,.05) 0,
      rgba(220,38,38,.05) 6px,
      rgba(220,38,38,.13) 6px,
      rgba(220,38,38,.13) 12px
    );
  pointer-events:none;
  z-index:0;
}
/* ── Travel Buffer: Frosted Glass — wie vorher, nur ein Hauch deutlicher ── */
.cal-travel-block{
  position:absolute;top:2px;bottom:2px;
  /* RICHTIGER GLAS-LOOK:
     - Top-Reflex: hell-weißer Highlight oben (Lichtquelle)
     - Mitte: subtiler Blau-Tint
     - Bottom-Reflex: zarte zweite Highlight für Glas-Tiefe */
  background:
    linear-gradient(180deg,
      rgba(255,255,255,.32) 0%,
      rgba(255,255,255,.10) 25%,
      transparent 45%,
      rgba(255,255,255,.04) 75%,
      rgba(255,255,255,.18) 100%),
    linear-gradient(135deg,
      rgba(27,117,153,.10) 0%,
      rgba(27,117,153,.22) 50%,
      rgba(27,117,153,.12) 100%);
  /* Mehr Blur + Sättigung + Brightness = echtes mattes Glas */
  backdrop-filter:blur(14px) saturate(1.8) brightness(1.05);
  -webkit-backdrop-filter:blur(14px) saturate(1.8) brightness(1.05);
  border:1px solid rgba(255,255,255,.30);
  border-top:1px solid rgba(255,255,255,.65);
  border-bottom:1px solid rgba(27,117,153,.20);
  border-radius:9px;
  display:flex;align-items:center;justify-content:center;
  overflow:hidden;
  pointer-events:auto !important; cursor:pointer;
  z-index:10;
  /* Glas-Schatten: außen weicher Schatten + innen oben/unten für Tiefe */
  box-shadow:
    inset 0 1px 1px rgba(255,255,255,.70),
    inset 0 -1px 2px rgba(27,117,153,.18),
    inset 0 0 12px rgba(255,255,255,.10),
    0 4px 14px rgba(0,0,0,.08),
    0 0 1px rgba(27,117,153,.30);
  transform:translateZ(0);
  transition:transform .12s ease, box-shadow .12s ease, background .12s ease;
}
/* Vertikale Variante — User-Kalender Wochen/Tag-View. Tagesspalten sind vertikal,
   Stunden gehen nach unten. Buffer wird via inline style="top:X%; height:Y%"
   positioniert. WICHTIG: top hier NICHT auf auto !important setzen — sonst wird
   der inline-style ignoriert und der Buffer rutscht ans Container-Ende.
   Nur bottom:auto, weil vom .cal-travel-block ein bottom:2px geerbt wird. */
.cal-travel-block-vert{
  bottom:auto !important;
  left:3px !important;right:3px !important;
  width:auto;
  flex-direction:column;
  background:linear-gradient(180deg,rgba(27,117,153,.15) 0%,rgba(27,117,153,.28) 50%,rgba(27,117,153,.20) 100%) !important;
  border:1px solid rgba(27,117,153,.35) !important;
  /* Alle Ecken abrunden — Buffer hat oft etwas Abstand zum Event darunter */
  border-radius:8px !important;
  border-bottom:1px solid rgba(27,117,153,.5) !important;
  align-items:center;justify-content:center;
  padding:2px 4px;
  text-align:center;
  min-height:18px;
  /* Sicherstellen dass der Buffer UNTER dem Event liegt */
  z-index:1 !important;
}
.cal-travel-block-vert .cal-travel-block-text{
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
  max-width:100%;
  font-size:11px;line-height:1.3;
  font-weight:700;
  color:#0c4f6d;
  text-shadow:0 1px 2px rgba(255,255,255,.5);
  letter-spacing:.2px;
}
.cal-travel-block-vert .cal-travel-block-text i{
  margin-right:3px;color:#1B7599;
}
/* Tight-Variante: rötlich tönen */
.cal-travel-block-vert.tight{
  background:linear-gradient(180deg,rgba(220,38,38,.12) 0%,rgba(220,38,38,.25) 50%,rgba(220,38,38,.18) 100%) !important;
  border:1px solid rgba(220,38,38,.4) !important;
  border-bottom:1px solid rgba(220,38,38,.55) !important;
}
.cal-travel-block-vert.tight .cal-travel-block-text{color:#7c1d1d;}
.cal-travel-block-vert.tight .cal-travel-block-text i{color:#dc2626;}
/* Ersttermin (Stammadresse) — grünliche Tönung */
.cal-travel-block-vert.is-first{
  background:linear-gradient(180deg,rgba(31,138,90,.12) 0%,rgba(31,138,90,.25) 50%,rgba(31,138,90,.18) 100%) !important;
  border:1px solid rgba(31,138,90,.35) !important;
  border-bottom:1px solid rgba(31,138,90,.5) !important;
}
.cal-travel-block-vert.is-first .cal-travel-block-text{color:#0e5530;}
.cal-travel-block-vert.is-first .cal-travel-block-text i{color:#1f8a5a;}
/* Tight + First (rote Variante gewinnt) */
.cal-travel-block-vert.tight.is-first{
  background:linear-gradient(180deg,rgba(220,38,38,.12) 0%,rgba(220,38,38,.25) 50%,rgba(220,38,38,.18) 100%) !important;
  border:1px solid rgba(220,38,38,.4) !important;
  border-bottom:1px solid rgba(220,38,38,.55) !important;
}
.cal-travel-block-vert.tight.is-first .cal-travel-block-text{color:#7c1d1d;}
.cal-travel-block-vert.tight.is-first .cal-travel-block-text i{color:#dc2626;}
/* Hover: leicht hochheben + stärkerer Glow.
   KEIN scale() — sub-pixel rendering machte die Schrift unscharf.
   Stattdessen translateY für den Lift-Effekt + box-shadow-Glow. */
.cal-travel-block:hover,.cal-travel-block.is-hover{
  background:linear-gradient(180deg,rgba(27,117,153,.10) 0%,rgba(27,117,153,.24) 50%,rgba(27,117,153,.12) 100%);
  transform:translateZ(0) translateY(-2px);
  box-shadow:
    inset 0 1px 1px rgba(255,255,255,.55),
    inset 0 -1px 2px rgba(27,117,153,.12),
    0 6px 18px rgba(27,117,153,.22),
    0 0 0 1px rgba(27,117,153,.30);
  z-index:3;
}
.cal-travel-block:hover::before,.cal-travel-block.is-hover::before{
  animation-duration:3s;
}
.cal-travel-block:hover::after,.cal-travel-block.is-hover::after{
  animation-duration:5s;
}
/* Aktiv (Klick-Moment): kurz reindrücken — auch ohne scale */
.cal-travel-block:active{
  transform:translateZ(0) translateY(0);
  box-shadow:
    inset 0 1px 1px rgba(255,255,255,.4),
    inset 0 -1px 2px rgba(27,117,153,.08),
    0 1px 4px rgba(27,117,153,.18),
    0 0 0 1px rgba(27,117,153,.25);
}
/* Ersttermin-Anfahrt: Grün-Tönung statt Blau (= Stammadresse) */
.cal-travel-block.is-first{
  background:linear-gradient(180deg,rgba(34,139,87,.04) 0%,rgba(34,139,87,.12) 50%,rgba(34,139,87,.06) 100%);
  border-color:rgba(34,139,87,.18);
  /* Ersttermin = Anfahrt von Stammadresse — nicht ansnappbar (sind schon
     optimal positioniert). Cursor signalisiert das. */
  cursor:default !important;
  box-shadow:
    inset 0 1px 1px rgba(255,255,255,.4),
    inset 0 -1px 2px rgba(34,139,87,.08),
    0 2px 8px rgba(0,0,0,.04),
    0 0 1px rgba(34,139,87,.15);
}
/* Heimfahrt-Buffer (Endtermin → Stammadresse): warmes orange-braun, distinct
   von Ersttermin (grün) und Folgetermin-Buffer (blau). Nicht klickbar. */
.cal-travel-block.is-home-trip{
  background:linear-gradient(180deg,rgba(180,83,9,.05) 0%,rgba(180,83,9,.14) 50%,rgba(180,83,9,.07) 100%) !important;
  border-color:rgba(180,83,9,.22) !important;
  cursor:default !important;
}
.cal-travel-block.is-home-trip .cal-travel-block-text{ color:#7c2d12 !important; }
.cal-travel-block.is-first:hover,.cal-travel-block.is-first.is-hover{
  background:linear-gradient(180deg,rgba(34,139,87,.08) 0%,rgba(34,139,87,.22) 50%,rgba(34,139,87,.10) 100%);
  box-shadow:
    inset 0 1px 1px rgba(255,255,255,.55),
    inset 0 -1px 2px rgba(34,139,87,.14),
    0 4px 14px rgba(34,139,87,.20),
    0 0 0 1px rgba(34,139,87,.32);
}
.cal-travel-block.is-first .cal-travel-block-text{color:#1f8a5a;}

/* Buffer mit Lerndaten — grün eingefärbt statt blau, mit kleinem
   Daten-Marker oben rechts. Visuelles Signal: "System hat aus Klicks
   gelernt was die echte Fahrzeit für diese Strecke ist". */
.cal-travel-block.has-learned{
  background:linear-gradient(180deg,rgba(31,138,90,.10) 0%,rgba(31,138,90,.22) 50%,rgba(31,138,90,.12) 100%) !important;
  border:1px solid rgba(31,138,90,.40) !important;
  border-top:1px solid rgba(255,255,255,.50) !important;
}
.cal-travel-block.has-learned .cal-travel-block-text{ color:#0e5530 !important; }
.cal-travel-block.has-learned::after{
  content:'';position:absolute;top:3px;right:3px;width:6px;height:6px;
  border-radius:50%;background:#16a34a;
  box-shadow:0 0 0 2px rgba(22,163,74,.35);
  z-index:3;pointer-events:none;
}

/* Eyecandy: ZWEI Nebel-Wellen die fließend übers Glas ziehen.
   Beide mit filter:blur() = echte Diffusität, kein scharfer Lichtstreifen.
   - ::before = mittlere Nebelschwade (heller Kern, mittlere Geschwindigkeit)
   - ::after  = weite Nebelschwade (diffuser, breiter, langsamer)
   Beide laufen unabhängig → kreuzen sich → optisch reicher Nebel-Effekt.
   --shimmer-delay aus Date.now() (JS) hält die Phase über Re-Renders. */
/* NAHTLOSER NEBEL-LOOP — `background-position` auf periodischem Pattern.
   Das Pattern besteht aus Schlieren in der LINKEN und IDENTISCHEN Schlieren
   in der RECHTEN Hälfte. background-size:200% bedeutet Pattern-Periode = 2x
   Element-Breite. Animation von 0 → -200% schiebt um exakt eine Periode →
   bei 100% Animation sieht's IDENTISCH aus zu 0% Animation (weil's das
   nächste Pattern-Tile ist). Damit gibts NULL sichtbaren Snap am Cycle-End,
   egal wie oft der DOM neu rendert. */
.cal-travel-block::before{
  content:'';
  position:absolute;
  inset:0;
  background:
    /* LINKE Pattern-Hälfte (0-50% der 200%-Box) */
    radial-gradient(ellipse 6% 14% at  9% 30%, rgba(255,255,255,.75) 0%, rgba(255,255,255,.30) 50%, transparent 80%),
    radial-gradient(ellipse 8% 10% at 19% 65%, rgba(255,255,255,.85) 0%, rgba(255,255,255,.35) 45%, transparent 75%),
    radial-gradient(ellipse 7% 16% at 28% 25%, rgba(255,255,255,.70) 0%, rgba(255,255,255,.28) 50%, transparent 80%),
    radial-gradient(ellipse 8% 12% at 36% 70%, rgba(255,255,255,.80) 0%, rgba(255,255,255,.32) 45%, transparent 75%),
    radial-gradient(ellipse 6% 14% at 44% 40%, rgba(255,255,255,.65) 0%, rgba(255,255,255,.25) 50%, transparent 80%),
    /* RECHTE Pattern-Hälfte (50-100% der 200%-Box) — IDENTISCH +50% versetzt */
    radial-gradient(ellipse 6% 14% at 59% 30%, rgba(255,255,255,.75) 0%, rgba(255,255,255,.30) 50%, transparent 80%),
    radial-gradient(ellipse 8% 10% at 69% 65%, rgba(255,255,255,.85) 0%, rgba(255,255,255,.35) 45%, transparent 75%),
    radial-gradient(ellipse 7% 16% at 78% 25%, rgba(255,255,255,.70) 0%, rgba(255,255,255,.28) 50%, transparent 80%),
    radial-gradient(ellipse 8% 12% at 86% 70%, rgba(255,255,255,.80) 0%, rgba(255,255,255,.32) 45%, transparent 75%),
    radial-gradient(ellipse 6% 14% at 94% 40%, rgba(255,255,255,.65) 0%, rgba(255,255,255,.25) 50%, transparent 80%);
  background-size:200% 100%;
  background-repeat:repeat;
  background-position:0 0;
  pointer-events:none;
  border-radius:inherit;
  z-index:1;
  filter:blur(6px);
  mix-blend-mode:screen;
  will-change:background-position;
  animation:cal-buf-flow 22s linear infinite;
}
.cal-travel-block::after{
  content:'';
  position:absolute;
  inset:0;
  background:
    /* Hintergrund-Schicht: andere positions, GLEICHES Periodicity-Schema */
    radial-gradient(ellipse 9% 18% at  6% 60%, rgba(255,255,255,.55) 0%, rgba(255,255,255,.22) 50%, transparent 80%),
    radial-gradient(ellipse 8% 14% at 16% 25%, rgba(255,255,255,.65) 0%, rgba(255,255,255,.26) 45%, transparent 75%),
    radial-gradient(ellipse 10% 16% at 25% 75%, rgba(255,255,255,.50) 0%, rgba(255,255,255,.20) 50%, transparent 80%),
    radial-gradient(ellipse 9% 12% at 35% 35%, rgba(255,255,255,.60) 0%, rgba(255,255,255,.24) 45%, transparent 75%),
    radial-gradient(ellipse 8% 20% at 46% 65%, rgba(255,255,255,.45) 0%, rgba(255,255,255,.18) 50%, transparent 80%),
    /* +50% versetzt = perfekt periodisch */
    radial-gradient(ellipse 9% 18% at 56% 60%, rgba(255,255,255,.55) 0%, rgba(255,255,255,.22) 50%, transparent 80%),
    radial-gradient(ellipse 8% 14% at 66% 25%, rgba(255,255,255,.65) 0%, rgba(255,255,255,.26) 45%, transparent 75%),
    radial-gradient(ellipse 10% 16% at 75% 75%, rgba(255,255,255,.50) 0%, rgba(255,255,255,.20) 50%, transparent 80%),
    radial-gradient(ellipse 9% 12% at 85% 35%, rgba(255,255,255,.60) 0%, rgba(255,255,255,.24) 45%, transparent 75%),
    radial-gradient(ellipse 8% 20% at 96% 65%, rgba(255,255,255,.45) 0%, rgba(255,255,255,.18) 50%, transparent 80%);
  background-size:200% 100%;
  background-repeat:repeat;
  background-position:0 0;
  pointer-events:none;
  border-radius:inherit;
  z-index:1;
  filter:blur(10px);
  mix-blend-mode:screen;
  will-change:background-position;
  /* Hintere Schicht 35s = langsamer als vordere 22s. Beide nahtlos via
     Pattern-Wiederholung — der Reset wird durch's Repeat unsichtbar. */
  animation:cal-buf-flow 35s linear infinite reverse;
}
/* Eine Periode wandern = bg-position um -200% (= Pattern-Größe).
   Snap zurück zu 0% sieht IDENTISCH aus → KEIN sichtbarer Reset. */
@keyframes cal-buf-flow{
  from { background-position: 0 0; }
  to   { background-position: -200% 0; }
}
.cal-travel-block.tight{
  background:linear-gradient(180deg,rgba(220,38,38,.04) 0%,rgba(220,38,38,.13) 50%,rgba(220,38,38,.06) 100%);
  border-color:rgba(220,38,38,.2);
  border-top-color:rgba(255,255,255,.3);
  box-shadow:
    inset 0 1px 1px rgba(255,255,255,.35),
    inset 0 -1px 2px rgba(220,38,38,.1),
    0 2px 8px rgba(220,38,38,.06),
    0 0 1px rgba(220,38,38,.2);
}
/* Tight-Buffer: rote Nebel-Schwaden mit periodischem Schlieren-Pattern
   (selbe Struktur wie Standard-Wellen, nur in rot — Warnsignal) */
/* removed conflicting old iter rule for .cal-travel-block.tight::before */
/* removed conflicting old iter rule for .cal-travel-block.tight::after */
.cal-travel-block-text{
  background:rgba(255,255,255,.85);
  /* KEIN backdrop-filter hier — die Welle drüber + parent-blur erzeugte
     einen "Doppel-Blur" der die Schrift unscharf rendete. */
  padding:3px 10px;border-radius:6px;
  white-space:nowrap;font-weight:700;font-size:10px;
  color:#1B7599;letter-spacing:.3px;
  box-shadow:0 1px 4px rgba(0,0,0,.08),inset 0 1px 0 rgba(255,255,255,.6);
  position:relative;
  /* z-index 5 → ÜBER beiden Wellen-Pseudoelementen (z-index:1) damit
     der Text nicht von Welle-Highlights überlagert wird (= optisch scharf). */
  z-index:5;
  display:flex;align-items:center;gap:4px;
  /* Schrift-Rendering optimiert für scharfe Pixel auch im Glas-Container */
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:geometricPrecision;
  /* Eigener Compositing-Layer → Text wird unabhängig vom parent gerendert
     (parent hat translateZ + transform, das ohne diese Isolation Sub-Pixel-
     Artefakte am Text erzeugte). */
  transform:translateZ(0);
  will-change:auto;
  backface-visibility:hidden;
}
.cal-travel-block-text i{font-size:9px;}
.cal-travel-block.tight .cal-travel-block-text{
  color:#dc2626;background:rgba(255,255,255,.78);
  box-shadow:0 1px 4px rgba(220,38,38,.08),inset 0 1px 0 rgba(255,255,255,.5);
}

/* ══════════════════════════════════════════════════════════════════════
   BUFFER FIXES (oberhalb der Original-Stile via Override)
   ══════════════════════════════════════════════════════════════════════
   1) Höhe identisch zur Termin-Card (top/bottom 3px) — !important damit
      keine andere Regel das überschreibt
   2) Border-radius 6px (matched Termin-Card)
   3) KEIN min-width — Buffer in seiner echten Zeit-Breite (sonst Overlap)
   ══════════════════════════════════════════════════════════════════════ */
.cal-travel-block{
  top:3px !important;
  bottom:3px !important;
  height:auto !important;
  border-radius:6px !important;
}
/* ══════════════════════════════════════════════════════════════
   REWRITTEN: Hour markers + Now-line (full container height)
   ══════════════════════════════════════════════════════════════ */

/* Overlay sitzt über allen Rows, deckt NUR die Timeline-Fläche ab.
   Layout: .cal-h-label (160px) + .cal-h-day-strip (36px) + Border (1px)
   = 197px Offset. Vorher fälschlich auf 161px ohne Day-Strip → Stunden-
   Striche waren um 36px verschoben gegenüber den Stunden-Labels im Header. */
.cal-h-marks-overlay{
  position:absolute;top:0;bottom:0;
  left:197px;right:0;
  pointer-events:none;z-index:15;
}

/* Full-height hour line — clean line, no dots */
.cal-h-hfull{
  position:absolute;top:0;bottom:0;width:1px;
  background:rgba(0,0,0,.08);
}

/* Hour label in header - just text, no dots */
.cal-h-hour-label{
  position:absolute;top:0;height:100%;
  font-size:10px;color:var(--muted);font-weight:600;
  padding-left:6px;padding-top:3px;
  white-space:nowrap;
}
.cal-h-hour-label sup{font-size:7px;vertical-align:super;}

/* Now-line (full height, red) — flache Linie OHNE Punkte oben/unten.
   Die runden Punkte verwirren in der Timeline und sehen aus wie weitere
   Marker neben den Stunden. */
.cal-now-line-dispo{
  position:absolute;top:0;bottom:0;width:2px;
  background:#dc2626;z-index:25;pointer-events:none;
}

/* ── Drag-to-Create Preview ── */
.cal-drag-preview{
  position:absolute;
  background:rgba(27,117,153,.2);
  border:2px solid rgba(27,117,153,.5);
  border-radius:6px;
  display:flex;align-items:center;justify-content:center;
  font-size:11px;font-weight:600;color:#1B7599;
  pointer-events:none;z-index:30;
  min-height:15px;
}

/* ── Equipment locked (detail view, not editing) ── */
.cal-eq-locked .cal-eq-remove{display:none;}
.cal-eq-locked .cal-eq-add-row{display:none;}

/* ── Upload buttons side by side ── */
.cal-det-upload-btns{display:flex;gap:6px;margin-left:auto;}
.cal-det-upload-btn{
  background:none;border:1px solid var(--border);border-radius:6px;
  padding:4px 10px;cursor:pointer;font-size:12px;color:var(--text);
  display:flex;align-items:center;gap:4px;
}
.cal-det-upload-btn:hover{background:rgba(27,117,153,.08);border-color:#1B7599;color:#1B7599;}

/* ── Travel Info Panel (Editor) ── */
.cal-travel-info-panel{
  background:linear-gradient(135deg,rgba(27,117,153,.03),rgba(27,117,153,.08));
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  border:1px solid rgba(27,117,153,.15);
  border-radius:10px;padding:12px 16px;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.3),0 2px 8px rgba(0,0,0,.03);
}
.cal-travel-info-hdr{
  font-weight:700;font-size:12px;color:#1B7599;
  margin-bottom:10px;display:flex;align-items:center;gap:6px;
}
.cal-travel-info-prev{font-size:12px;line-height:1.5;margin-bottom:8px;color:var(--text);}
.cal-travel-info-calc{font-size:13px;color:#1B7599;font-weight:600;margin-bottom:4px;}
.cal-travel-info-detail{font-size:11px;color:var(--muted);margin-bottom:2px;padding-left:20px;}
.cal-travel-info-total{
  font-size:13px;color:#1B7599;margin-top:8px;
  padding-top:8px;border-top:1px solid rgba(27,117,153,.15);
}
.cal-travel-info-no-coords{font-size:11px;color:var(--muted);font-style:italic;margin-top:6px;}

/* ── Buffer-Text Skalierung nach Buffer-Breite ──
   Klassen werden via JS (ResizeObserver in calendar-dispo.js) gesetzt:
   - cal-buf-narrow = Buffer <50px → Hochkant-Text, kein Icon
   - cal-buf-tiny   = Buffer <26px → noch kleiner

   Klassen-basiert statt @container-Query weil Container-Queries in
   einigen Render-Pfaden inkonsistent matchten. */
/* Default (horizontal): NIE rotieren — horizontale Buffer sind 14-20px
   hoch, rotiert wäre der Text unlesbar. Icon weg + Schriftgröße runter. */
.cal-travel-block.cal-buf-narrow .cal-travel-block-text i{display:none;}
.cal-travel-block.cal-buf-narrow .cal-travel-block-text{
  font-size:9px;
  letter-spacing:0;
  padding:1px 4px;
  line-height:1.15;
  white-space:nowrap;
  text-overflow:clip;
}
.cal-travel-block.cal-buf-tiny .cal-travel-block-text{
  font-size:8px;
  letter-spacing:0;
  padding:0 2px;
}
/* Vertikal: hier IST Rotation richtig — der Buffer ist hoch, schmal in
   Breite. Hochkant-Text füllt die Höhe lesbar. */
.cal-travel-block.cal-travel-block-vert.cal-buf-narrow .cal-travel-block-text{
  writing-mode:vertical-rl;
  transform:rotate(180deg) translateZ(0);
  font-size:9px;
  letter-spacing:.5px;
  padding:8px 4px;
  line-height:1.15;
}
.cal-travel-block.cal-travel-block-vert.cal-buf-tiny .cal-travel-block-text{
  padding:6px 2px;
}
/* Container-Query als Bonus für Browser mit Support — falls JS aus
   irgendeinem Grund nicht greift, fallen wir hier rein. NUR für
   .cal-travel-block-vert: horizontale Buffer dürfen NICHT rotieren. */
@container (max-width: 50px){
  .cal-travel-block-vert .cal-travel-block-text i{display:none;}
  .cal-travel-block-vert .cal-travel-block-text{
    writing-mode:vertical-rl;
    transform:rotate(180deg) translateZ(0);
    font-size:9px;letter-spacing:.5px;padding:8px 4px;line-height:1.15;
  }
}
/* Fallback for browsers without container queries */
.cal-travel-block{
  container-type:inline-size;
  /* isolation: isolate → mix-blend-mode auf den Wellen-Pseudoelementen
     wirkt nur auf den Glas-Body, nicht auf Termine/Background dahinter */
  isolation:isolate;
}
.cal-travel-block-text{overflow:hidden;text-overflow:ellipsis;max-width:100%;}
/* Very narrow buffers: just show a thin colored bar */
/* ENTFERNT: .cal-travel-block:has(.cal-travel-block-text){min-width:3px;}
   Die hat das min-width:64px der Hauptdefinition überschrieben → Buffer
   wurde bei kurzen Anfahrten unter 30px breit gerendert. Mindestbreite
   wird jetzt zentral in der Hauptdefinition + im JS-Render verwaltet. */

/* ══════════════════════════════════════════════════════════════════════
   DRAG-GHOST: Live-Vorschau während Drag mit 15-Min-Snap
   ════════════════════════════════════════════════════════════════════════
   Erscheint NUR während ein Event über eine Tech-Spalte gezogen wird.
   Zeigt: vorderen Buffer (Ghost), Snap-Linie auf 15-Min-Raster, Event-Block.
   ══════════════════════════════════════════════════════════════════════ */
.cal-drag-ghost{
  position:absolute;inset:2px 0 2px 0;
  pointer-events:none;z-index:50;
  contain:layout style;
}
/* Buffer vor der Snap-Linie — gestreift damit klar = Vorschau */
.cal-drag-ghost-buffer{
  position:absolute;top:0;bottom:0;
  background:
    repeating-linear-gradient(135deg,
      rgba(27,117,153,.18) 0,
      rgba(27,117,153,.18) 6px,
      rgba(27,117,153,.06) 6px,
      rgba(27,117,153,.06) 12px);
  border:1px dashed rgba(27,117,153,.5);
  border-radius:6px;
  animation:cal-ghost-pulse 1.2s ease-in-out infinite;
}
/* Vertikale Snap-Linie — markiert den exakten 15-Min-Punkt */
.cal-drag-ghost-snap{
  position:absolute;top:-4px;bottom:-4px;width:0;
  border-left:2px solid #1B7599;
  box-shadow:0 0 8px rgba(27,117,153,.6),0 0 14px rgba(27,117,153,.3);
}
.cal-drag-ghost-snap::before,
.cal-drag-ghost-snap::after{
  content:'';position:absolute;left:-5px;width:8px;height:8px;
  background:#1B7599;border-radius:50%;
  box-shadow:0 0 6px rgba(27,117,153,.7);
}
.cal-drag-ghost-snap::before{top:-3px;}
.cal-drag-ghost-snap::after{bottom:-3px;}
/* Event-Vorschau-Block — solider als Buffer aber transparent */
.cal-drag-ghost-event{
  position:absolute;top:2px;bottom:2px;
  background:linear-gradient(180deg,rgba(27,117,153,.35),rgba(27,117,153,.22));
  border:2px solid rgba(27,117,153,.7);
  border-radius:8px;
  box-shadow:0 4px 14px rgba(27,117,153,.25);
  animation:cal-ghost-pulse 1.2s ease-in-out infinite;
}
/* Zeit-Label oberhalb der Snap-Linie */
.cal-drag-ghost-label{
  position:absolute;top:-22px;
  transform:translateX(-50%);
  background:#1B7599;color:#fff;
  font-size:10px;font-weight:700;
  padding:3px 8px;border-radius:6px;
  white-space:nowrap;letter-spacing:.3px;
  box-shadow:0 2px 8px rgba(27,117,153,.4);
}
.cal-drag-ghost-label::after{
  content:'';position:absolute;left:50%;bottom:-4px;
  width:0;height:0;transform:translateX(-50%);
  border-left:5px solid transparent;
  border-right:5px solid transparent;
  border-top:4px solid #1B7599;
}
@keyframes cal-ghost-pulse{
  0%,100%{opacity:.85;}
  50%   {opacity:1;}
}

/* ══════════════════════════════════════════════════════════════════════
   EDITOR — Visuelle Sektionen-Trennung
   ══════════════════════════════════════════════════════════════════════ */

/* Spalten-Header: stärker hervorgehoben mit Akzent-Streifen */
.cal-ed-col-hdr{
  font-size:13px;font-weight:700;text-transform:uppercase;
  letter-spacing:.6px;color:var(--cal-primary,#1B7599);
  padding:8px 0 8px 12px;
  border-left:3px solid var(--cal-primary,#1B7599);
  border-bottom:1px solid var(--border);
  margin-bottom:8px;background:linear-gradient(90deg,rgba(27,117,153,.05),transparent);
  display:flex;align-items:center;gap:8px;
}
.cal-ed-col-hdr i{font-size:13px;color:var(--cal-primary,#1B7599);}

/* Eigenständige Sub-Sektion innerhalb einer Spalte (z.B. "Schadenfall & Zugang") */
.cal-ed-section{
  border:1px solid var(--border,#e5e7eb);
  border-radius:8px;
  background:rgba(0,0,0,.01);
  overflow:hidden;
  margin-top:4px;
}
.cal-ed-section-hdr{
  font-size:12px;font-weight:600;
  color:var(--cal-primary,#1B7599);
  padding:8px 12px;
  background:linear-gradient(90deg,rgba(27,117,153,.08),rgba(27,117,153,.02));
  border-bottom:1px solid var(--border,#e5e7eb);
  display:flex;align-items:center;gap:6px;
  letter-spacing:.3px;
}
.cal-ed-section-hdr i{font-size:11px;}
.cal-ed-section-body{padding:12px;}
.cal-ed-section-body .form-group:last-child{margin-bottom:0;}

/* ══════════════════════════════════════════════════════════════════════
   EDITOR — Vertikale Spinner (Datum / Std / Min)
   Layout: ▲ oben, Input in Mitte, ▼ unten, Label darunter.
   Drei Spalten nebeneinander pro Start/Ende.
   ══════════════════════════════════════════════════════════════════════ */
.cal-spinner-row{
  display:flex;gap:8px;align-items:flex-start;
  flex-wrap:nowrap;
}
.cal-spinner{
  display:flex;flex-direction:column;align-items:stretch;
  flex:1;min-width:0;
  position:relative;
}
.cal-spinner-date{flex:1.4;}        /* Datum etwas breiter — passt YYYY-MM-DD */
.cal-spinner-hour,.cal-spinner-min{flex:0.7;}

.cal-spinner-btn{
  border:1px solid var(--border,#e5e7eb);
  background:linear-gradient(180deg,#fff 0%,#f5f8fb 100%);
  cursor:pointer;
  padding:5px 0;
  font-size:10px;line-height:1;
  color:#1B7599;
  transition:background .12s ease,color .12s ease,box-shadow .12s ease;
  user-select:none;
  display:flex;align-items:center;justify-content:center;
}
.cal-spinner-btn:hover{
  background:linear-gradient(180deg,#e8f3f8 0%,#d4ebf3 100%);
  color:#0d4a63;
  box-shadow:inset 0 0 0 1px rgba(27,117,153,.25);
}
.cal-spinner-btn:active{
  background:linear-gradient(180deg,#d4ebf3 0%,#bdd9e6 100%);
  transform:translateY(1px);
}
.cal-spinner-btn:disabled{
  opacity:.4;cursor:not-allowed;background:#f5f5f5;
}
.cal-spinner-up{
  border-radius:6px 6px 0 0;
  border-bottom:none;
}
.cal-spinner-down{
  border-radius:0 0 6px 6px;
  border-top:none;
}
.cal-spinner-input{
  border-radius:0 !important;
  text-align:center !important;
  border-top:none !important;border-bottom:none !important;
  border-left:1px solid var(--border,#e5e7eb) !important;
  border-right:1px solid var(--border,#e5e7eb) !important;
  font-size:13px;font-weight:600;
  font-variant-numeric:tabular-nums;
  background:#fff !important;
  padding:8px 6px !important;
  width:100%;min-width:0;
  box-sizing:border-box;
}
.cal-spinner-input:focus{
  outline:none;
  background:rgba(27,117,153,.04) !important;
  box-shadow:inset 0 0 0 2px rgba(27,117,153,.3);
}
.cal-spinner-num{
  -moz-appearance:textfield;
}
.cal-spinner-num::-webkit-outer-spin-button,
.cal-spinner-num::-webkit-inner-spin-button{
  -webkit-appearance:none;margin:0;
}
/* Natives Kalender-Symbol komplett entfernen — würde sonst das Datum verdecken.
   Mehrstufiger Ansatz:
   1) Das sichtbare Datum-Feld ist KEIN type="date" mehr, sondern ein readonly
      Text-Input (.cal-spinner-date-display) — kein Browser-Symbol möglich.
   2) Daneben liegt ein verstecktes type="date" Input (.cal-spinner-date-hidden)
      ausschließlich für showPicker(). 0px groß, off-screen, aria-hidden.
   3) Trotzdem auch Pseudo-Elemente killen, falls irgendwo ein date-Input bleibt. */
/* Phase 71.x: Hidden Date-Input liegt jetzt direkt OVER dem Display-Field
   als unsichtbarer Klick-Catcher. So bekommt der Browser eine echte
   User-Geste auf das date-Input → showPicker() funktioniert zuverlässig
   bzw. native Picker öffnet sich beim Klick auf das Datum. Ohne diesen
   Trick mussten User auf das winzige Kalender-Icon neben dem Label
   klicken — total unintuitiv. */
.cal-spinner.cal-spinner-date{
  position:relative;
}
.cal-spinner-date-hidden{
  position:absolute !important;
  /* Layout: liegt zwischen den beiden Spinner-Pfeilen, deckt nur das
     Display-Feld in der Mitte ab (28px Pfeile oben/unten). */
  left:0 !important;right:0 !important;
  top:28px !important;bottom:28px !important;
  width:auto !important;height:auto !important;
  opacity:0 !important;
  cursor:pointer !important;
  z-index:5;
  border:0 !important;padding:0 !important;margin:0 !important;
  background:transparent !important;
  color:transparent !important;
}
/* Browser-eigenes Calendar-Symbol weiterhin unterdrücken — wir wollen
   nur den Picker beim Klick öffnen, kein extra Icon im overlay. */
.cal-spinner-date-hidden::-webkit-calendar-picker-indicator{
  opacity:0 !important;
  width:100% !important;height:100% !important;
  position:absolute;inset:0;cursor:pointer;
}
.cal-spinner-date-display{
  cursor:pointer;
}
.cal-spinner-input[type="date"]::-webkit-calendar-picker-indicator,
.cal-spinner-input[type="date"]::-webkit-inner-spin-button,
.cal-spinner-input[type="date"]::-webkit-clear-button,
input[type="date"].cal-spinner-input::-webkit-calendar-picker-indicator,
input[type="date"].cal-spinner-input::-webkit-inner-spin-button{
  display:none !important;
  -webkit-appearance:none !important;
  appearance:none !important;
  opacity:0 !important;
  width:0 !important;
  height:0 !important;
}

/* Label-Zeile: Text + Kalender-Icon-Button rechts */
.cal-time-label{
  display:flex;align-items:center;gap:8px;
  margin-bottom:6px;
}
.cal-date-pick-btn{
  background:linear-gradient(135deg,#1B7599 0%,#2a8fb5 100%);
  color:#fff;
  border:none;
  border-radius:6px;
  padding:4px 9px;
  cursor:pointer;
  font-size:12px;line-height:1;
  display:inline-flex;align-items:center;gap:4px;
  box-shadow:0 1px 3px rgba(27,117,153,.25);
  transition:box-shadow .12s,transform .1s;
}
.cal-date-pick-btn:hover{
  box-shadow:0 2px 6px rgba(27,117,153,.4);
  transform:translateY(-1px);
}
.cal-date-pick-btn:active{
  transform:translateY(0);
}
.cal-date-pick-btn i{font-size:11px;}

/* Speech-to-Text Mikro-Button neben Textarea-Labels.
   Im Inactive-State dezent, im Active-State (Recording) rot pulsierend. */
.cal-mic-label{
  display:flex;align-items:center;gap:8px;
  margin-bottom:6px;
}
.cal-mic-btn{
  background:linear-gradient(135deg,#6c757d 0%,#868e96 100%);
  color:#fff;
  border:none;
  border-radius:6px;
  padding:4px 9px;
  cursor:pointer;
  font-size:12px;line-height:1;
  display:inline-flex;align-items:center;gap:4px;
  box-shadow:0 1px 3px rgba(0,0,0,.15);
  transition:box-shadow .12s,transform .1s,background .15s;
}
.cal-mic-btn:hover{
  box-shadow:0 2px 6px rgba(0,0,0,.25);
  transform:translateY(-1px);
}
.cal-mic-btn:active{transform:translateY(0);}
.cal-mic-btn-active{
  background:linear-gradient(135deg,#dc2626 0%,#ef4444 100%) !important;
  animation:cal-mic-pulse 1s ease-in-out infinite;
}
@keyframes cal-mic-pulse{
  0%,100% { box-shadow:0 0 0 0 rgba(220,38,38,.5); }
  50%     { box-shadow:0 0 0 6px rgba(220,38,38,0); }
}
.cal-mic-btn i{font-size:11px;}
.cal-spinner-label{
  display:block;
  font-size:9px;text-align:center;
  color:#888;font-weight:500;
  text-transform:uppercase;letter-spacing:.5px;
  margin-top:5px;
  user-select:none;
}
.cal-spinner.is-disabled{opacity:.5;}
.cal-spinner.is-disabled .cal-spinner-input{background:#f8f9fa !important;}

/* Time-Block soll nicht zu eng sein */
.cal-time-block .form-group{flex:1;min-width:0;}

/* ══════════════════════════════════════════════════════════════════════
   EDITOR — Eye-Candy Polish
   Modal-Hintergrund mit subtilem Gradient, Spalten als weiche Cards,
   Headers prominenter, Save-Button Gradient.
   ══════════════════════════════════════════════════════════════════════ */

/* Modal: feiner Gradient + entspanntes Padding */
.cal-editor-modal{
  background:linear-gradient(180deg,#fafbfc 0%,#f4f6f9 100%) !important;
}

/* Modal-Header: prominenter mit Farbakzent */
.cal-editor-hdr{
  background:linear-gradient(135deg,#1B7599 0%,#2a8fb5 100%) !important;
  color:#fff !important;
  padding:14px 20px !important;
  border-bottom:1px solid rgba(0,0,0,.08) !important;
  box-shadow:0 2px 8px rgba(27,117,153,.15);
}
.cal-editor-title{
  color:#fff !important;
  font-size:16px !important;font-weight:600 !important;
  letter-spacing:.3px;
  display:flex;align-items:center;gap:14px;
  flex-wrap:wrap;
}
/* Heute-Info rechts neben dem Titel — visuell deutlich blasser, dezent */
.cal-editor-today-info{
  font-size:12px;
  font-weight:400;
  color:rgba(255,255,255,.6);
  letter-spacing:.2px;
  display:inline-flex;align-items:center;gap:5px;
  padding:3px 10px;
  background:rgba(255,255,255,.08);
  border-radius:12px;
  border:1px solid rgba(255,255,255,.1);
}
.cal-editor-today-info i{font-size:11px;opacity:.7;}
.cal-editor-hdr .cal-detail-close{
  color:rgba(255,255,255,.85) !important;
  background:rgba(255,255,255,.1) !important;
  border-radius:50%;
  width:30px;height:30px;
  transition:background .15s,color .15s;
}
.cal-editor-hdr .cal-detail-close:hover{
  background:rgba(255,255,255,.25) !important;color:#fff !important;
}

/* Spalten als weiche Cards mit Schatten */
.cal-editor-body{
  padding:20px !important;
}
.cal-ed-col{
  background:#fff;
  border-radius:10px;
  padding:16px;
  box-shadow:0 1px 3px rgba(0,0,0,.04),0 1px 2px rgba(0,0,0,.06);
  border:1px solid rgba(0,0,0,.04);
}

/* Form-Inputs: Hover & Focus polish */
.cal-editor-modal .form-control{
  transition:border-color .15s,box-shadow .15s,background .15s;
}
.cal-editor-modal .form-control:hover:not(:focus):not(.cal-ed-invalid){
  border-color:#bbd5e0;
}
.cal-editor-modal .form-control:focus{
  border-color:#1B7599;
  box-shadow:0 0 0 3px rgba(27,117,153,.12);
  outline:none;
}

/* Section-Header: schöner Gradient + Hover-Animation */
.cal-ed-section{
  transition:box-shadow .2s,border-color .2s;
}
.cal-ed-section:hover{
  border-color:rgba(27,117,153,.25);
  box-shadow:0 2px 6px rgba(27,117,153,.08);
}

/* Footer-Buttons */
.cal-editor-footer{
  background:rgba(0,0,0,.02) !important;
  border-top:1px solid rgba(0,0,0,.06) !important;
  padding:12px 20px !important;
}
.cal-editor-footer .btn-primary{
  background:linear-gradient(135deg,#1B7599 0%,#2a8fb5 100%) !important;
  border:none !important;
  padding:9px 22px !important;
  font-weight:600 !important;
  letter-spacing:.3px;
  box-shadow:0 2px 6px rgba(27,117,153,.25);
  transition:box-shadow .15s,transform .12s;
}
.cal-editor-footer .btn-primary:hover{
  box-shadow:0 4px 12px rgba(27,117,153,.35);
  transform:translateY(-1px);
}
.cal-editor-footer .btn-primary:active{
  transform:translateY(0);
}

/* Versicherung/Schadennummer in der Section-Row gleiche Höhe + saubere Margins */
.cal-ed-section-body .cal-form-row{
  align-items: flex-start;
  margin-bottom: 12px;
}
.cal-ed-section-body .cal-form-row > .form-group{
  margin-bottom: 0;
}

/* ── Editor: Pflichtfeld-Validierung ─────────────────────────────────────
   Wird per JS angehängt wenn doSave() leere Pflichtfelder findet.
   Der Border ist deutlich rot, das Feld wackelt kurz zur Aufmerksamkeit.
   Bei nächster User-Eingabe entfernt JS die Klasse automatisch.
   ────────────────────────────────────────────────────────────────────── */
.cal-ed-invalid,
.cal-ed-invalid input,
.cal-ed-invalid select,
.cal-ed-invalid textarea{
  border-color:#dc2626 !important;
  box-shadow:0 0 0 3px rgba(220,38,38,.12) !important;
  background:rgba(220,38,38,.02) !important;
}
input.cal-ed-invalid,
select.cal-ed-invalid,
textarea.cal-ed-invalid{
  animation:cal-ed-shake .35s ease-in-out;
}
@keyframes cal-ed-shake{
  0%,100% { transform:translateX(0); }
  20%     { transform:translateX(-4px); }
  40%     { transform:translateX(4px); }
  60%     { transform:translateX(-3px); }
  80%     { transform:translateX(3px); }
}

/* ╔══════════════════════════════════════════════════════════════════════╗
   ║ PHASE 33 — Buffer-Persistenz, Now-Line Root-Fix, z-Index Layering   ║
   ║ Ziel: Buffer DÜRFEN NICHT Termine überlappen. Now-Line SICHTBAR.    ║
   ║ Klarer z-Index-Stack durchgesetzt. Inkonsistenz Dispo/Timeline weg.  ║
   ╚══════════════════════════════════════════════════════════════════════╝

   ── z-index Stack (KANONISCH) ──
   Slots/Background ........... 0
   Buffer (BEIDE Varianten) ... 1   ← UNTER Events. War 10 in Dispo. Bug.
   Grid-Linien ................ 2
   Events (Card) .............. 3
   Sticky-Labels .............. 5
   Hovered Card ............... 10
   Marks-Overlay-Container .... 15
   Now-Line ................... 25
   Now-Dot .................... 26
   Drag-Ghost ................. 50
   Tooltip/Popup .............. 100
   Modal ...................... 10000+
*/

/* ── Phase 33.1: Buffer UNTER Events (Dispo wie Timeline) ───────────── */
/* Hauptbeschwerde User: Buffer überlappten zusammenhängende Termine.
   Ursache: .cal-travel-block hatte z-index:10 in Dispo (HORIZONTAL),
   während .cal-travel-block-vert in Timeline (VERTIKAL) z-index:1 hatte.
   Diese Inkonsistenz führte dazu dass Buffer in Dispo VOR Termin-Cards
   gezeichnet wurden — sichtbar wenn sie minimal überlappen oder die
   Card-Border den Buffer-Rand überschneidet. */
.cal-travel-block,
.cal-travel-block-vert,
.cal-h-buffer{
  z-index: 1 !important;       /* IMMER unter Events */
}
/* Im Hover-State darf der Buffer leicht hochkommen (clickable feedback) */
.cal-travel-block:hover,
.cal-travel-block-vert:hover,
.cal-h-buffer:hover{
  z-index: 4 !important;       /* knapp über Events, deutliches Klick-Signal */
}
/* Bei Drop-Target State (Drag landet im Buffer): hochsetzen für Highlight */
.cal-travel-block.is-drop-target,
.cal-travel-block-vert.is-drop-target{
  z-index: 12 !important;
}

/* ── Phase 33.2: Now-Line WIRKLICH sichtbar ─────────────────────────── */
/* Drei Klassen = drei Render-Pfade. Alle bekommen denselben sichtbaren Look. */
.cal-now-line,
.cal-now-line-h,
.cal-now-line-dispo{
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  pointer-events: none;
  z-index: 25 !important;
  /* Sattes Rot, nicht das alte stumpfe #dc2626 — etwas leuchtender */
  background: #ef4444 !important;
}
/* HORIZONTALE Variante (Timeline-Vertikal-View): horizontale rote Linie */
.cal-now-line,
.cal-now-line-h{
  height: 3px !important;       /* war 2px → kaum sichtbar */
  left: 0; right: 0;
  box-shadow:
    0 0 6px  rgba(239,68,68,.65),
    0 0 14px rgba(239,68,68,.35),
    0 0 22px rgba(239,68,68,.15) !important;
  animation: cal-now-glow 2.5s ease-in-out infinite;
}
/* VERTIKALE Variante (Dispo, Tech-Reihen): vertikale rote Linie */
.cal-now-line-dispo{
  width: 3px !important;        /* war 2px → kaum sichtbar */
  top: 0; bottom: 0;
  box-shadow:
    0 0 6px  rgba(239,68,68,.65),
    0 0 14px rgba(239,68,68,.35),
    0 0 22px rgba(239,68,68,.15) !important;
  animation: cal-now-glow 2.5s ease-in-out infinite;
}
@keyframes cal-now-glow{
  0%,100%{
    box-shadow:
      0 0 6px  rgba(239,68,68,.55),
      0 0 14px rgba(239,68,68,.30),
      0 0 22px rgba(239,68,68,.10);
  }
  50%{
    box-shadow:
      0 0 8px  rgba(239,68,68,.85),
      0 0 18px rgba(239,68,68,.50),
      0 0 28px rgba(239,68,68,.25);
  }
}
/* Punkt-Indikator (horizontal: links, vertikal: oben). 
   Den setzen wir per JS auch für cal-now-line-dispo wenn fehlt — siehe JS. */
.cal-now-dot,
.cal-now-line-dispo::before,
.cal-now-line-h::before{
  content:'';
  position: absolute;
  width: 10px; height: 10px;
  border-radius: 50%;
  background: #ef4444;
  box-shadow: 0 0 8px rgba(239,68,68,.85), 0 0 16px rgba(239,68,68,.5);
  z-index: 26 !important;
  animation: cal-now-pulse 1.6s ease-in-out infinite;
  pointer-events: none;
}
.cal-now-line-dispo::before{
  /* Vertikale Variante: Punkt OBEN  */
  top: -5px; left: -4px;
}
.cal-now-line-h::before{
  /* Horizontale Variante: Punkt LINKS — überschreibt das alte cal-now-dot Span,
     macht es robust gegen JS das den Span vergisst zu rendern */
  top: -4px; left: -5px;
}
.cal-now-line::before{
  top: -4px; left: -5px;
}
@keyframes cal-now-pulse{
  0%,100% { transform: scale(1);   opacity: 1;   }
  50%     { transform: scale(1.5); opacity: .55; }
}
/* Das cal-now-dot Span bekommt denselben Style — falls es schon im DOM ist */
.cal-now-line-h .cal-now-dot,
.cal-now-line .cal-now-dot{
  position: absolute;
  width: 10px; height: 10px;
  top: -4px; left: -5px;
  border-radius: 50%;
  background: #ef4444;
  box-shadow: 0 0 8px rgba(239,68,68,.85), 0 0 16px rgba(239,68,68,.5);
  z-index: 26 !important;
  animation: cal-now-pulse 1.6s ease-in-out infinite;
  display: block !important;
  visibility: visible !important;
}

/* ── Phase 33.3: Marks-Overlay GARANTIERT sichtbar ─────────────────── */
.cal-h-marks-overlay{
  display: block !important;
  visibility: visible !important;
  z-index: 15 !important;
  pointer-events: none !important;
}

/* ── Phase 33.4: Buffer "manuell gesetzt" Marker ───────────────────── */
/* Pin-Indicator: kleines Reisszweck-Icon oben rechts. Hinweis: das ::after
   ist normalerweise die sekundäre Wellen-Animation. Bei is-pinned wird
   stattdessen der Pin angezeigt — "manuell" hat keine sekundäre Welle. */
.cal-travel-block.is-pinned::after,
.cal-travel-block-vert.is-pinned::after{
  content: "\f08d";        /* fa-thumbtack */
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  position: absolute;
  top: 1px; right: 3px;
  font-size: 8px;
  color: #d97706;
  text-shadow: 0 0 2px rgba(255,255,255,.8);
  pointer-events: none;
  z-index: 3;
  /* Animation/Wellen-Reset weil hier sonst die Sekundärwelle reinpfuscht */
  background: none;
  width: auto;
  height: auto;
  transform: none;
  animation: none;
  border-radius: 0;
}
/* Bei is-first KEIN Pin-Symbol — Erstanfahrt ist immer auto-pinned, das
   Symbol würde nur jeden Buffer am Tagesanfang zumüllen. */
.cal-travel-block.is-first.is-pinned::after,
.cal-travel-block-vert.is-first.is-pinned::after{
  content: none;
}

/* ── Phase 33.5: Buffer-Edit-Cursor zeigen wenn click-möglich ───── */
.cal-travel-block,
.cal-travel-block-vert{
  cursor: pointer;
}
.cal-travel-block.is-pinned,
.cal-travel-block-vert.is-pinned{
  /* Manueller Buffer: Doppelklick zum Edit, Kontext-Menü für "Auto" */
  cursor: context-menu;
}


/* ╔══════════════════════════════════════════════════════════════════════╗
   ║ PHASE 34 — Sticky Top-Stack: Nav + Float-Termine + Dispo-Toolbar    ║
   ║ Bei Scrollen kleben alle drei am oberen Rand des Cal-Bodies          ║
   ╚══════════════════════════════════════════════════════════════════════╝ */

/* Phase 34.1: cal-body wird scroll-container, alles drinnen kann sticky werden */
.cal-body{
  overflow-y: auto;
  overflow-x: hidden;
  flex: 1;
  min-height: 0;
}

/* Float-Termine & Notizen — Sticky-Bar oben am cal-body, NICHT mehr seitlich */
.cal-floating-list{
  position: sticky;
  top: 0;
  z-index: 28;
  background: var(--cal-surface, var(--surface));
  border-top: none;
  border-bottom: 1px solid var(--cal-border-color, var(--border));
  flex-shrink: 0;
  /* Nur sichtbar wenn Inhalt vorhanden */
  display: none;
}
.cal-floating-list.has-content{ display: block; }
.cal-floating-list:empty{ display: none; }

/* Cal-nav-row: position:sticky am Top des cal-root scroll-context.
   Da cal-root selbst nicht scrollt, sticky tut hier nichts — aber als
   visueller Marker und für mobile-Browser die window scrollen. */
.cal-nav-row{
  position: sticky;
  top: 0;
  z-index: 30;
  background: var(--bg);
}

/* Dispo-Toolbar: Sticky am Top des cal-body. Klebt UNTER der Floating-List
   wenn diese sichtbar ist. */
.cal-dispo-toolbar{
  position: sticky;
  top: 0;
  z-index: 27;
  background: var(--cal-surface-2);
  /* Wenn floating-list davor existiert, top-offset über CSS-Variable */
  top: var(--cal-sticky-toolbar-top, 0px);
}

/* Legacy-Styles für .cal-float-note-card entfernt — neue Note-Struktur
   nutzt .cal-note-wrap (siehe oben). Die alten gelben Borders waren zu
   verspielt für SemperConnect-Look. */

/* Float-Panel collapsed: Stick-Höhe wird kleiner */
.cal-floating-list.collapsed{
  /* Behält sticky-Verhalten bei collapsed; nur Höhe ändert sich */
}

/* ═════════════════════════════════════════════════════════════════════════
   H4 + H5: Right-Sidebar mit Collapse-Toggle und Content-Indikatoren.
   Verhalten wie verwaltung-nav.collapsed — schmal mit nur Icons sichtbar.
   ═════════════════════════════════════════════════════════════════════════ */

/* Header-Bar oben in der Right-Sidebar — clean, ohne Gradient */
.cal-rs-hdr{
  display:flex;align-items:center;gap:10px;
  padding:8px 14px;
  background:transparent;
  border-bottom:1px solid var(--cal-border-color,var(--border));
  font:800 12px/1.2 system-ui,-apple-system,sans-serif;
  color:var(--cal-fg,var(--text));
  letter-spacing:.6px;text-transform:uppercase;
  flex-shrink:0;position:sticky;top:0;z-index:6;
  box-shadow:none;
}
.cal-rs-hdr-icon{
  color:#1B7599;
  font-size:16px;
  flex-shrink:0;
  filter:drop-shadow(0 1px 1px rgba(27,117,153,.20));
}
.cal-rs-hdr-title{
  flex:1;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  background:linear-gradient(135deg,#1B7599 0%,#2a98c2 50%,#1B7599 100%);
  -webkit-background-clip:text;
  background-clip:text;
  -webkit-text-fill-color:transparent;
  font-weight:900;
}
/* Total-Badge (Summe aller Inhalte) — auch im collapsed-Mode oben sichtbar */
.cal-rs-total-badge{
  background:#1B7599;color:#fff;
  font-size:10px;font-weight:700;
  padding:2px 7px;border-radius:10px;
  min-width:18px;text-align:center;
  letter-spacing:0;text-transform:none;
}
/* Toggle-Button (analog .verw-collapse-btn) */
.cal-rs-collapse-btn{
  width:24px;height:24px;border:none;background:transparent;
  border-radius:4px;cursor:pointer;
  color:var(--cal-muted,var(--muted));
  display:flex;align-items:center;justify-content:center;
  transition:background .15s,color .15s,transform .25s;
  flex-shrink:0;
}
.cal-rs-collapse-btn:hover{background:rgba(27,117,153,.1);color:#1B7599;}
.cal-rs-collapse-btn i{font-size:12px;transition:transform .25s;}

/* Right-Sidebar als Block in der cal-layout (Desktop) */
@media (min-width: 769px){
  .cal-floating-list{
    position:relative !important;
    top:auto !important;
    width:300px;flex-shrink:0;
    display:flex !important;flex-direction:column;
    border-left:1px solid var(--cal-border-color,var(--border));
    border-bottom:none;
    transition:width 220ms ease;
    /* Sticky-Verhalten: Sidebar selbst stretcht über volle Layout-Höhe
       (default flex align-items:stretch). Sobald Inhalte (Floats / Notizen
       / Aufgaben) länger werden als die Sidebar-Höhe, scrollt der Inhalt
       INTERN — Sidebar bleibt immer sichtbar, Sektion-Header (sind schon
       position:sticky;top:0) bleiben dabei oben kleben. */
    overflow-y:auto;
    overflow-x:hidden;
    overscroll-behavior:contain;
  }
  .cal-floating-list.has-content{display:flex !important;}

  /* Collapsed: schmaler Streifen mit nur Icons */
  .cal-floating-list.right-collapsed{width:48px;}
  .cal-floating-list.right-collapsed .cal-rs-hdr-title,
  .cal-floating-list.right-collapsed .cal-rs-total-badge{display:none;}
  .cal-floating-list.right-collapsed .cal-rs-hdr{
    padding:10px 0;justify-content:center;gap:0;
  }
  .cal-floating-list.right-collapsed .cal-rs-hdr-icon{display:none;}
  /* Toggle-Icon dreht sich (zeigt jetzt nach links zum Aufklappen) */
  .cal-floating-list.right-collapsed .cal-rs-collapse-btn i{
    transform:rotate(180deg);
  }

  /* Inhalts-Bereich (alles unter dem Header) */
  .cal-floating-list > .cal-side-master-bar,
  .cal-floating-list > .cal-side-section{flex-shrink:0;}

  /* Master-Bar im collapsed-Mode verstecken */
  .cal-floating-list.right-collapsed .cal-side-master-bar{display:none;}

  /* Sektionen im collapsed-Mode: nur Icons mittig zeigen — clean, ohne Border */
  .cal-floating-list.right-collapsed .cal-side-section{
    border:none;border-radius:0;background:transparent;
  }
  .cal-floating-list.right-collapsed .cal-side-hdr{
    padding:8px 0;justify-content:center;
    position:relative;background:transparent;border:none;
    transition:background var(--dur,.15s) var(--ease,ease);
  }
  .cal-floating-list.right-collapsed .cal-side-hdr-text,
  .cal-floating-list.right-collapsed .cal-side-chevron{display:none;}
  .cal-floating-list.right-collapsed .cal-side-hdr-icon{font-size:18px;margin:0;}
  .cal-floating-list.right-collapsed .cal-side-body{display:none;}
  /* H5 Iteration 9: Section-Header braucht position:relative damit das
     absolute Badge drin sitzen kann. Badge sitzt rechts oben in der Ecke
     des Header-Containers — NICHT über dem Icon. Sticky beibehalten. */
  .cal-floating-list.right-collapsed .cal-side-hdr{
    position:relative;
    padding:14px 0;
    display:flex;align-items:center;justify-content:center;
    cursor:pointer;
  }
  .cal-floating-list.right-collapsed .cal-side-badge{
    position:absolute !important;
    top:4px !important;
    right:4px !important;
    left:auto !important;
    transform:none !important;
    min-width:14px;height:14px;
    padding:0 4px;
    font-size:9px;font-weight:700;
    background:#dc2626;color:#fff;
    border-radius:7px;
    display:flex;align-items:center;justify-content:center;
    line-height:1;letter-spacing:0;
    border:1.5px solid var(--cal-surface,var(--surface,#fff));
    box-sizing:content-box;
    box-shadow:0 1px 3px rgba(0,0,0,.18);
    pointer-events:none;
    /* z-index oberhalb des Header-Icons */
    z-index:2;
  }
  /* Wenn Counter == 0 oder Section leer: Badge weg */
  .cal-floating-list.right-collapsed .cal-side-badge:empty,
  .cal-floating-list.right-collapsed .cal-side-section:has(.cal-side-empty) .cal-side-badge{
    display:none !important;
  }
  /* Hover wie verwaltung-nav-item — clean Background-Tint, blaue Schrift */
  .cal-floating-list.right-collapsed .cal-side-hdr:hover{
    background:rgba(27,117,153,.06);
  }
  .cal-floating-list.right-collapsed .cal-side-hdr:hover .cal-side-hdr-icon{
    color:#1B7599;
  }
}

/* H5: Counter-Badge sichtbar machen wenn 0 = leer (dezent grau) */
/* ── SIDE-BADGE — Glas-Pille (passt zum Liquid-Glass-Buffer-Style) ──
   Layout (font-size, padding, radius) kommt aus .cal-side-badge weiter
   unten (Z. ~8059). Hier nur Optik / Color-States. */
.cal-side-badge{
  background: rgba(27,117,153,.10);
  color: #1B7599;
  box-shadow:
    inset 0 0 0 1px rgba(27,117,153,.22),
    inset 0 1px 0 rgba(255,255,255,.55);
  text-shadow: none;
}
/* Empty-State (count=0) → grau-blau, dezent.
   Trigger entweder über .is-empty Klasse (zentral via JS gesetzt) oder
   über vorhandenes .cal-side-empty Element (legacy / wenn Body wirklich leer). */
.cal-side-section.is-empty .cal-side-badge,
.cal-side-section:has(.cal-side-empty) .cal-side-badge{
  background: rgba(148,163,184,.14);
  color: #64748b;
  box-shadow:
    inset 0 0 0 1px rgba(148,163,184,.22),
    inset 0 1px 0 rgba(255,255,255,.45);
}
/* Filled-State (count>0) → brand-teal Glas-Pille mit Specular-Highlight oben.
   Greift wenn weder .is-empty noch .cal-side-empty present sind. */
.cal-side-section:not(.is-empty):not(:has(.cal-side-empty)) .cal-side-badge{
  background:
    linear-gradient(180deg,
      rgba(255,255,255,.22) 0%,
      transparent 60%),
    rgba(27,117,153,.88);
  color: #fff;
  box-shadow:
    inset 0 0 0 1px rgba(255,255,255,.30),
    inset 0 1px 0 rgba(255,255,255,.55),
    0 1px 4px rgba(27,117,153,.30);
  text-shadow: 0 1px 1px rgba(0,0,0,.18);
}


/* ═════════════════════════════════════════════════════════════════════════
   ── DRAG-DROP-POLISH (Welle 1 integriert) ──
   Drag-Eleganz, Buffer-Konfidenz-Punkt, Snap-Indicator, Undo-Toast,
   Snap-Vorschau-Modal-Polish.
   ═════════════════════════════════════════════════════════════════════════ */

/* ── Ghost beim Cross-Day-Drag ── */
.cal-h-event.dragging,
.cal-shared-ev.dragging {
  opacity: 0.45;
  transition: opacity 140ms ease-out;
}
.cal-h-event.dragging-same,
.cal-shared-ev.dragging-same {
  opacity: 0.85;
  box-shadow: 0 6px 18px rgba(15,23,42,0.18);
  transform: scale(1.015);
  transition: transform 100ms ease-out, box-shadow 100ms ease-out, opacity 100ms ease-out;
  z-index: 50;
}
.cal-drop-target {
  background: rgba(27,117,153,0.06) !important;
  outline: 2px dashed rgba(27,117,153,0.3);
  outline-offset: -2px;
  transition: background 120ms ease-out, outline-color 120ms ease-out;
}

/* ── Snap-Indicator-Linie während Drag ── */
.cal-snap-indicator {
  pointer-events: none;
}
.cal-snap-indicator-time {
  pointer-events: none;
  user-select: none;
}

/* ── Live-Verschiebung von Folgeterminen ── */
.cal-collide-shift {
  transition: transform 180ms cubic-bezier(0.16, 1, 0.3, 1) !important;
  filter: hue-rotate(15deg) saturate(0.85);
  animation: cal-collide-pulse 1200ms ease-in-out infinite;
}
@keyframes cal-collide-pulse {
  0%, 100% { box-shadow: 0 0 0 0 rgba(245, 158, 11, 0); }
  50%      { box-shadow: 0 0 0 3px rgba(245, 158, 11, 0.25); }
}

/* ── Buffer-Konfidenz-Indikator ── */
/* (.cal-travel-block { position: relative; } war hier — ENTFERNT.
    Es überschrieb das position:absolute der Hauptdefinition mit höherer
    Spezifität durch Reihenfolge → Buffer fiel auf intrinsische Höhe
    zurück statt voll-Card-Höhe.) */
.cal-buf-conf-dot {
  position: absolute;
  top: 3px;
  right: 5px;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  pointer-events: none;
  box-shadow: 0 0 0 1.5px rgba(255,255,255,0.7);
}
.cal-buf-conf-icon {
  position: absolute;
  top: 3px;
  right: 4px;
  font-size: 8px;
  pointer-events: none;
  text-shadow: 0 0 2px rgba(255,255,255,0.9);
}
.cal-travel-block-vert .cal-buf-conf-dot,
.cal-travel-block-vert .cal-buf-conf-icon {
  top: 3px;
  right: 3px;
}

/* ── Drop-Bounce nach erfolgreichem Move ── */
.cal-h-event.drop-bounce,
.cal-shared-ev.drop-bounce {
  animation: cal-drop-bounce 280ms cubic-bezier(0.34, 1.56, 0.64, 1);
}
@keyframes cal-drop-bounce {
  0%   { transform: scale(0.9); }
  60%  { transform: scale(1.05); }
  100% { transform: scale(1); }
}

/* ── Undo-Toast ── */
.cal-undo-toast {
  position: fixed;
  bottom: 24px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 9500;
  background: #0f172a;
  color: #fff;
  border-radius: 10px;
  padding: 12px 16px 12px 14px;
  display: flex;
  align-items: center;
  gap: 12px;
  box-shadow: 0 10px 30px rgba(0,0,0,0.35);
  min-width: 320px;
  max-width: 480px;
  overflow: hidden;
  animation: cal-undo-toast-in 280ms cubic-bezier(0.16, 1, 0.3, 1);
}
@keyframes cal-undo-toast-in {
  from { transform: translate(-50%, 16px); opacity: 0; }
  to   { transform: translate(-50%, 0);    opacity: 1; }
}
.cal-undo-toast.is-leaving {
  animation: cal-undo-toast-out 220ms ease-in forwards;
}
@keyframes cal-undo-toast-out {
  to { transform: translate(-50%, 16px); opacity: 0; }
}
.cal-undo-toast-bar {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  height: 3px;
  background: rgba(255,255,255,0.1);
}
.cal-undo-toast-bar-fill {
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, #1B7599, #38bdf8);
  transform-origin: left;
  transform: scaleX(1);
}
.cal-undo-toast-icon {
  font-size: 18px;
  color: #38bdf8;
  flex: 0 0 auto;
}
.cal-undo-toast-msg {
  flex: 1 1 auto;
  min-width: 0;
}
.cal-undo-toast-title {
  font: 700 13px/1.3 system-ui, sans-serif;
}
.cal-undo-toast-sub {
  font: 400 11px/1.4 system-ui, sans-serif;
  color: rgba(255,255,255,0.65);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-top: 1px;
}
.cal-undo-toast-btn {
  flex: 0 0 auto;
  background: #1B7599;
  color: #fff;
  border: 0;
  border-radius: 6px;
  padding: 6px 12px;
  font: 600 12px/1 system-ui, sans-serif;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 5px;
  transition: background 120ms ease-out, transform 80ms ease-out;
}
.cal-undo-toast-btn:hover {
  background: #156183;
  transform: translateY(-1px);
}
.cal-undo-toast-close {
  flex: 0 0 auto;
  background: transparent;
  color: rgba(255,255,255,0.5);
  border: 0;
  width: 26px;
  height: 26px;
  border-radius: 5px;
  cursor: pointer;
  display: grid;
  place-items: center;
  font-size: 12px;
  transition: all 120ms ease-out;
}
.cal-undo-toast-close:hover {
  background: rgba(255,255,255,0.1);
  color: #fff;
}

@media (prefers-reduced-motion: reduce) {
  .cal-h-event.dragging-same,
  .cal-shared-ev.dragging-same,
  .cal-collide-shift,
  .cal-snap-indicator,
  .cal-undo-toast,
  .cal-h-event.drop-bounce { transition: none !important; animation: none !important; }
}

/* ── Mobile-Anpassung Undo-Toast ── */
@media (max-width: 640px) {
  .cal-undo-toast {
    bottom: 12px;
    left: 12px;
    right: 12px;
    transform: none;
    min-width: 0;
    max-width: 100%;
    width: auto;
  }
  @keyframes cal-undo-toast-in {
    from { transform: translateY(16px); opacity: 0; }
    to   { transform: translateY(0);    opacity: 1; }
  }
}

/* ═════════════════════════════════════════════════════════════════════════
   ── LEARNING + SCHEDULING + UX (Welle 2a / 2b / 4 integriert) ──
   ═════════════════════════════════════════════════════════════════════════ */

/* ── Capacity-Bar pro Tech-Row (Welle 2a) ── */
.cal-cap-bar {
  display: inline-block;
  width: 38px;
  height: 5px;
  margin-left: 6px;
  background: rgba(15,23,42,0.08);
  border-radius: 999px;
  overflow: hidden;
  position: relative;
  vertical-align: middle;
  flex: 0 0 auto;
}
.cal-cap-bar-fill {
  position: absolute;
  inset: 0;
  width: 0;
  background: #16a34a;
  border-radius: inherit;
  transition: width 240ms ease-out, background 240ms ease-out;
}
.cal-cap-bar[data-state="off"]   { opacity: 0.3; }
.cal-cap-bar[data-state="free"]  .cal-cap-bar-fill { background: #cbd5e1; }
.cal-cap-bar[data-state="low"]   .cal-cap-bar-fill { background: #16a34a; }
.cal-cap-bar[data-state="med"]   .cal-cap-bar-fill { background: #1B7599; }
.cal-cap-bar[data-state="high"]  .cal-cap-bar-fill { background: #f59e0b; }
.cal-cap-bar[data-state="full"]  .cal-cap-bar-fill { background: #dc2626; }
.cal-h-row[data-cap-state="full"] .cal-h-name { color: #b91c1c; }

/* ── Tech-Korrektur-Modal (Welle 2a) ── */
.cal-tech-correct-overlay {
  position: fixed;
  inset: 0;
  z-index: 8800;
  background: rgba(15, 23, 42, 0.55);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
}
.cal-tech-correct-modal {
  background: #fff;
  border-radius: 14px;
  width: 100%;
  max-width: 380px;
  box-shadow: 0 20px 48px rgba(0,0,0,0.30);
  animation: cal-tc-modal-in 200ms cubic-bezier(0.16, 1, 0.3, 1);
}
@keyframes cal-tc-modal-in {
  from { opacity: 0; transform: translateY(12px) scale(0.96); }
  to   { opacity: 1; transform: translateY(0) scale(1); }
}
.cal-tech-correct-head {
  padding: 14px 18px;
  border-bottom: 1px solid #e2e8f0;
  display: flex;
  align-items: center;
  gap: 10px;
}
.cal-tech-correct-head h3 {
  margin: 0;
  flex: 1 1 auto;
  font: 700 16px/1.3 system-ui, sans-serif;
  color: #0f172a;
}
.cal-tech-correct-close {
  width: 30px;
  height: 30px;
  border-radius: 6px;
  border: 0;
  background: #f1f5f9;
  color: #475569;
  cursor: pointer;
  display: grid;
  place-items: center;
}
.cal-tech-correct-close:hover { background: #e2e8f0; }
.cal-tech-correct-body {
  padding: 16px 18px;
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.cal-tech-correct-field label {
  display: block;
  font: 600 11px/1.3 system-ui, sans-serif;
  color: #475569;
  text-transform: uppercase;
  letter-spacing: 0.4px;
  margin-bottom: 4px;
}
.cal-tech-correct-field input[type="time"] {
  width: 100%;
  padding: 9px 11px;
  border: 1.5px solid #cbd5e1;
  border-radius: 8px;
  font: 600 14px/1.3 system-ui, sans-serif;
  background: #f8fafc;
  color: #0f172a;
}
.cal-tech-correct-field input[type="time"]:focus {
  outline: none;
  border-color: #1B7599;
  background: #fff;
}
.cal-tech-correct-actions {
  padding: 12px 18px;
  border-top: 1px solid #e2e8f0;
  display: flex;
  gap: 8px;
  justify-content: flex-end;
}
.cal-tech-correct-btn {
  margin-left: 6px;
  font-size: 11px !important;
}

/* ── Schedule-Assistant-Modal (Welle 2b) ── */
.cal-sched-modal-overlay {
  position: fixed;
  inset: 0;
  z-index: 8850;
  background: rgba(15, 23, 42, 0.55);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 16px;
}
.cal-sched-modal {
  background: #fff;
  border-radius: 14px;
  width: 100%;
  max-width: 480px;
  max-height: 80vh;
  overflow-y: auto;
  box-shadow: 0 20px 48px rgba(0,0,0,0.30);
}
.cal-sched-modal-head {
  padding: 14px 18px;
  border-bottom: 1px solid #e2e8f0;
  display: flex;
  align-items: center;
  gap: 10px;
}
.cal-sched-modal-head h3 {
  margin: 0;
  flex: 1 1 auto;
  font: 700 16px/1.3 system-ui, sans-serif;
}
.cal-sched-modal-close {
  width: 30px;
  height: 30px;
  border-radius: 6px;
  border: 0;
  background: #f1f5f9;
  color: #475569;
  cursor: pointer;
  display: grid;
  place-items: center;
}
.cal-sched-modal-close:hover { background: #e2e8f0; }
.cal-sched-modal-body {
  padding: 12px 18px;
}
.cal-sched-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.cal-sched-slot {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 12px 14px;
  border: 1.5px solid #e2e8f0;
  border-radius: 10px;
  cursor: pointer;
  transition: all 140ms ease-out;
  background: #fafbfc;
}
.cal-sched-slot:hover {
  border-color: #1B7599;
  background: #f0f9ff;
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(27,117,153,0.1);
}
.cal-sched-slot-rank {
  flex: 0 0 auto;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  background: #1B7599;
  color: #fff;
  display: grid;
  place-items: center;
  font: 700 13px/1 system-ui, sans-serif;
}
.cal-sched-slot-info { flex: 1 1 auto; min-width: 0; }
.cal-sched-slot-when {
  font: 700 14px/1.3 system-ui, sans-serif;
  color: #0f172a;
}
.cal-sched-slot-meta {
  font: 400 11px/1.4 system-ui, sans-serif;
  color: #64748b;
  margin-top: 2px;
}
.cal-sched-slot-reason {
  font: 400 10px/1.3 system-ui, sans-serif;
  color: #16a34a;
  font-style: italic;
  margin-top: 2px;
}
.cal-sched-slot-score {
  flex: 0 0 auto;
  font: 700 11px/1 system-ui, sans-serif;
  color: #94a3b8;
  background: #f1f5f9;
  padding: 4px 8px;
  border-radius: 999px;
}

/* ── Free-Slot-Finder-Popover (Welle 2b) ── */
@keyframes cal-freeslot-in {
  from { opacity: 0; transform: scale(0.95); }
  to   { opacity: 1; transform: scale(1); }
}

/* ── Sticky Headers (Welle 4) ── */
#cal-root {
  --cal-sticky-toolbar-h: 0px;
  --cal-sticky-day-header-h: 0px;
  --cal-sticky-hour-header-h: 0px;
}
#cal-body .cal-h-day-header,
#cal-body .cal-shared-day-header {
  position: sticky;
  top: var(--cal-sticky-toolbar-h, 0px);
  z-index: 50;
  background: var(--cal-surface-2, #fff);
}
#cal-body .cal-h-header-row,
#cal-body .cal-h-timeline-header {
  position: sticky;
  top: calc(var(--cal-sticky-toolbar-h, 0px) + var(--cal-sticky-day-header-h, 0px));
  z-index: 40;
  background: var(--cal-surface-2, #fff);
  box-shadow: 0 1px 0 var(--border, #e2e8f0);
}

/* ── Right-Click-Context-Menü auf Termine (Welle 4) ── */
.cal-ev-ctxmenu {
  background: #fff;
  border-radius: 10px;
  min-width: 220px;
  max-width: 280px;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.18),
              0 0 0 1px rgba(15, 23, 42, 0.08);
  overflow: hidden;
  animation: cal-ctx-pop-in 140ms cubic-bezier(0.16, 1, 0.3, 1);
}
@keyframes cal-ctx-pop-in {
  from { opacity: 0; transform: scale(0.94); }
  to   { opacity: 1; transform: scale(1); }
}
.cal-ctx-header {
  padding: 10px 14px 8px;
  background: linear-gradient(135deg, rgba(27,117,153,0.08), rgba(27,117,153,0.02));
  border-bottom: 1px solid #f1f5f9;
}
.cal-ctx-header-title {
  font: 700 12px/1.3 system-ui, -apple-system, sans-serif;
  color: #0f172a;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
.cal-ctx-header-meta {
  font: 500 10px/1.4 system-ui, sans-serif;
  color: #64748b;
  margin-top: 2px;
}
.cal-ctx-section {
  padding: 4px 0;
  border-bottom: 1px solid #f1f5f9;
}
.cal-ctx-section:last-child { border-bottom: 0; }
.cal-ctx-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 14px;
  font: 500 13px/1.3 system-ui, sans-serif;
  color: #334155;
  cursor: pointer;
  transition: background 100ms ease-out, color 100ms ease-out;
  border: 0;
  background: transparent;
  width: 100%;
  text-align: left;
}
.cal-ctx-item:hover {
  background: #f0f9ff;
  color: #1B7599;
}
.cal-ctx-item:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}
.cal-ctx-item:disabled:hover {
  background: transparent;
  color: #334155;
}
.cal-ctx-item .cal-ctx-icon {
  flex: 0 0 16px;
  width: 16px;
  text-align: center;
  font-size: 12px;
  color: #64748b;
}
.cal-ctx-item:hover .cal-ctx-icon { color: #1B7599; }
.cal-ctx-item.is-danger { color: #b91c1c; }
.cal-ctx-item.is-danger .cal-ctx-icon { color: #dc2626; }
.cal-ctx-item.is-danger:hover {
  background: #fef2f2;
  color: #991b1b;
}

@media (prefers-reduced-motion: reduce) {
  .cal-ev-ctxmenu, .cal-tech-correct-modal, .cal-sched-slot,
  .cal-cap-bar-fill { animation: none !important; transition: none !important; }
}

/* ═════════════════════════════════════════════════════════════════════════
   ── LOGBOOK-PLZ-BRIDGE (Welle 7 integriert) ──
   ═════════════════════════════════════════════════════════════════════════ */
.calbridge-hint {
  margin: 6px 0 8px;
  padding: 8px 10px;
  background: rgba(27, 117, 153, 0.06);
  border-left: 3px solid #1B7599;
  border-radius: 6px;
  font: 500 12px/1.4 system-ui, -apple-system, sans-serif;
  color: #155e75;
  display: flex;
  align-items: flex-start;
  gap: 8px;
  animation: calbridge-in 220ms ease-out;
}
@keyframes calbridge-in {
  from { opacity: 0; transform: translateY(-4px); }
  to   { opacity: 1; transform: translateY(0); }
}
.calbridge-hint i.calbridge-icon {
  flex: 0 0 auto;
  color: #1B7599;
  margin-top: 1px;
  font-size: 13px;
}
.calbridge-hint-content { flex: 1 1 auto; min-width: 0; }
.calbridge-hint-title {
  font-weight: 700;
  margin-bottom: 3px;
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}
.calbridge-hint-zips {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin: 4px 0;
}
.calbridge-zip-chip {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  background: rgba(27, 117, 153, 0.12);
  color: #155e75;
  padding: 2px 8px;
  border-radius: 999px;
  font: 600 11px/1.3 system-ui, sans-serif;
  cursor: default;
}
.calbridge-zip-chip.is-already-in {
  opacity: 0.5;
  text-decoration: line-through;
}
.calbridge-hint-actions {
  display: flex;
  gap: 6px;
  margin-top: 6px;
  flex-wrap: wrap;
}
.calbridge-btn {
  padding: 4px 10px;
  border-radius: 5px;
  border: 0;
  font: 600 11px/1 system-ui, sans-serif;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  transition: transform 80ms ease-out, background 120ms ease-out;
}
.calbridge-btn:hover { transform: translateY(-1px); }
.calbridge-btn.is-apply {
  background: #1B7599;
  color: #fff;
}
.calbridge-btn.is-apply:hover { background: #156183; }
.calbridge-btn.is-dismiss {
  background: transparent;
  color: #64748b;
  border: 1px solid #cbd5e1;
}
.calbridge-btn.is-dismiss:hover { background: #f1f5f9; }

@media (prefers-reduced-motion: reduce) {
  .calbridge-hint { animation: none !important; transition: none !important; }
}

/* ═════════════════════════════════════════════════════════════════════════
   ── TEAM-TERMIN VISUELLE KENNZEICHNUNG ──
   Termine die mit team.length > 1 kommen bekommen ein Badge oben rechts.
   Member-View (Tech ist Member, nicht Lead) zeigt ein dezenter Border
   damit klar ist: das ist ein Team-Termin den ich nicht selbst lead.
   ═════════════════════════════════════════════════════════════════════════ */
.cal-h-event.cal-ev-team,
.cal-shared-ev.cal-ev-team {
  /* zusätzlicher subtiler Akzent */
  box-shadow: 0 1px 3px rgba(0,0,0,.12), inset 0 0 0 1px rgba(255,255,255,.18);
}
.cal-h-event.cal-ev-team-member,
.cal-shared-ev.cal-ev-team-member {
  /* Member-View: gestrichelt, etwas transparenter, "Lead ist anderer Tech" */
  border-left-style: dashed !important;
  border-left-width: 4px !important;
  border-left-color: rgba(255,255,255,0.55) !important;
  background-image: repeating-linear-gradient(45deg,
    rgba(255,255,255,0.06) 0,
    rgba(255,255,255,0.06) 6px,
    transparent 6px,
    transparent 12px);
}

.cal-h-team-badge {
  position: absolute;
  top: 3px;
  right: 4px;
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 2px 6px 2px 5px;
  border-radius: 999px;
  background: rgba(255,255,255,0.22);
  color: #fff;
  font: 700 9px/1 system-ui, sans-serif;
  text-shadow: 0 1px 1px rgba(0,0,0,.25);
  pointer-events: none;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
  z-index: 4;
}
.cal-h-team-badge i {
  font-size: 9px;
}
.cal-h-team-badge-count {
  font-size: 10px;
  font-weight: 800;
}

/* Bei sehr schmalen Cards Badge ohne Count, nur Icon */
.cal-h-event[style*="width:0"] .cal-h-team-badge-count,
.cal-h-event[style*="width:1"] .cal-h-team-badge-count,
.cal-h-event[style*="width:2"] .cal-h-team-badge-count,
.cal-h-event[style*="width:3"] .cal-h-team-badge-count {
  display: none;
}

/* ═════════════════════════════════════════════════════════════════════════
   ── SIDEBAR 3-SEKTIONEN-LAYOUT (Welle-Fix) ──
   Float-Termine, Notizen, Aufgaben — separate Sektionen mit sticky-Header.
   Container ist scrollbar; jeder Header bleibt beim Scroll seiner Sektion
   oben kleben.
   ═════════════════════════════════════════════════════════════════════════ */

.cal-floating-list {
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 10px 10px 14px;
  /* Sticky-Feel: leichter linker Border-Schatten + Glas-Hintergrund */
  background:
    linear-gradient(180deg,
      rgba(255,255,255,.55) 0%,
      rgba(255,255,255,.30) 100%),
    rgba(248,250,252,.85) !important;
  backdrop-filter: blur(12px) saturate(1.4) !important;
  -webkit-backdrop-filter: blur(12px) saturate(1.4) !important;
  box-shadow: inset 4px 0 12px rgba(27,117,153,.06), -2px 0 8px rgba(27,117,153,.04);
}

.cal-side-section {
  display: flex;
  flex-direction: column;
  background: transparent;
  border: none;
  border-radius: 0;
  overflow: hidden;
  transition: max-height 200ms ease-out;
  box-shadow: none;
}
.cal-side-section:hover {
  box-shadow: none;
}

.cal-side-hdr {
  position: sticky;
  top: 0;
  z-index: 5;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 12px;
  background: transparent;
  background-color: var(--surface, #fff);
  /* alter Gradient entfernt für cleaneres Aussehen */
  background-image: none;
  border-bottom: 1px solid rgba(27,117,153,.10);
  cursor: pointer;
  user-select: none;
  font: 800 11px/1.2 system-ui, -apple-system, sans-serif;
  color: var(--text, #0f172a);
  letter-spacing: 0.5px;
  text-transform: uppercase;
  transition: background 120ms ease;
}
.cal-side-hdr:hover {
  background: rgba(27,117,153,.06);
  color: #1B7599;
}
.cal-side-hdr:hover .cal-side-hdr-icon{ color: #1B7599; }

.cal-side-hdr-icon {
  font-size: 14px;
  flex: 0 0 18px;
  height: auto;
  text-align: center;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  color: var(--blue, #1B7599);
}

.cal-side-hdr-text {
  flex: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Layout-only — Optik (background/color/shadow) ist in den State-Regeln
   weiter oben (Z. ~7280) definiert. Hier nur Größe + Typo. */
.cal-side-badge {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 20px;
  height: 18px;
  font-size: 10px;
  font-weight: 700;
  padding: 0 7px;
  border-radius: 999px;
  letter-spacing: 0;
  text-transform: none;
}

.cal-side-chevron {
  font-size: 9px;
  color: var(--muted, #94a3b8);
  transition: transform 200ms ease;
  flex: 0 0 12px;
  text-align: center;
}

.cal-side-section.collapsed .cal-side-chevron {
  transform: rotate(-90deg);
}

.cal-side-body {
  padding: 8px;
  display: flex;
  flex-direction: column;
  gap: 6px;
  overflow: hidden;
  max-height: 9999px;
  transition: max-height 200ms ease-out, padding 200ms ease-out;
}

.cal-side-section.collapsed .cal-side-body {
  max-height: 0;
  padding-top: 0;
  padding-bottom: 0;
  overflow: hidden;
}

.cal-side-empty {
  padding: 12px 8px;
  text-align: center;
  font-size: 11px;
  color: var(--muted, #94a3b8);
  font-style: italic;
}

/* Tasks-Card im Aufgaben-Bereich */
.cal-task-card {
  border-left: 3px solid var(--cal-ev-color, #1B7599);
}
.cal-task-card.is-overdue {
  background: rgba(220, 38, 38, 0.06);
  border-left-color: #dc2626;
}
.cal-task-card.is-overdue .cal-float-card-title {
  color: #991b1b;
}

/* Sektion-Headers heben sich beim Hover-Zustand mit Pulse */
.cal-side-hdr:active {
  background: var(--surface-3, rgba(27, 117, 153, 0.12));
  transform: translateZ(0);
}

@media (max-width: 768px) {
  .cal-side-hdr {
    padding: 6px 10px;
  }
  .cal-side-body {
    padding: 6px;
  }
}

/* ── Verknüpfte Notizen + Aufgaben im Termin-Detail ────────────────────── */
.cal-det-linked-list {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-top: 8px;
}
.cal-det-linked-item {
  background: var(--surface, #f8fafc);
  border: 1px solid var(--border, #e2e8f0);
  border-radius: 6px;
  padding: 8px 10px;
  cursor: pointer;
  transition: background 120ms ease, transform 120ms ease;
}
.cal-det-linked-item:hover {
  background: var(--surface-2, rgba(27, 117, 153, 0.06));
  transform: translateX(2px);
}
.cal-det-linked-title {
  font-size: 13px;
  font-weight: 600;
  color: var(--text, #0f172a);
}
.cal-det-linked-meta {
  font-size: 11px;
  color: var(--muted, #64748b);
  margin-top: 2px;
}
.cal-det-linked-empty {
  padding: 8px 10px;
  font-size: 11px;
  color: var(--muted, #94a3b8);
  font-style: italic;
  text-align: center;
}
.btn-xs {
  padding: 3px 8px;
  font-size: 11px;
  border-radius: 5px;
}

/* ── Master-Toggle für die 3 Sektionen ───────────────────────────────── */
.cal-side-master-bar {
  display: flex;
  justify-content: flex-end;
  padding: 4px 0 6px;
  margin-bottom: 4px;
  border-bottom: 1px solid var(--border, #e2e8f0);
}
.cal-side-master-btn {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 10px;
  background: var(--surface-2, rgba(27, 117, 153, 0.06));
  border: 1px solid var(--border, #e2e8f0);
  border-radius: 6px;
  font: 600 11px/1 system-ui, -apple-system, sans-serif;
  color: var(--text, #0f172a);
  cursor: pointer;
  letter-spacing: 0.2px;
  text-transform: uppercase;
  transition: background 120ms ease, transform 100ms ease;
}
.cal-side-master-btn:hover {
  background: var(--surface-3, rgba(27, 117, 153, 0.12));
}
.cal-side-master-btn:active {
  transform: scale(0.97);
}
.cal-side-master-btn i {
  font-size: 12px;
  color: var(--blue, #1B7599);
}

/* ── Buffer-Pille bekommt Type-Farbe als Border + Background-Tint ────────
   Mit den aktualisierten Buffer-Stilen ist die Pille jetzt fast volle
   Höhe. Damit man trotzdem den Buffer-Typ erkennt (Erstanfahrt /
   Heimfahrt / Tight / Regulär), kriegt sie hier den passenden Border. */
/* Type-Border-Overrides entfernt — der Block ist jetzt selbst die farbige
   Card. Die Pille (.cal-travel-block-text) braucht keinen eigenen Border
   und keinen eigenen Hintergrund mehr. */

/* ═════════════════════════════════════════════════════════════════════════
   G3: Foto-Thumbnails in Termin-Detail-Datei-Liste
   ═════════════════════════════════════════════════════════════════════════ */
.cal-det-file-preview{
  flex-shrink:0;
  width:48px;height:48px;
  display:flex;align-items:center;justify-content:center;
  background:var(--surface,#f8fafc);
  border:1px solid var(--border,#e2e8f0);
  border-radius:6px;
  overflow:hidden;
  text-decoration:none;
  color:var(--muted,#64748b);
  transition:transform .15s, box-shadow .15s;
}
.cal-det-file-preview:hover{
  transform:scale(1.05);
  box-shadow:0 2px 8px rgba(0,0,0,.12);
}
.cal-det-file-preview > i{font-size:20px;}
.cal-det-file-preview > img{display:block;}

/* ═════════════════════════════════════════════════════════════════════════
   H6: Buffer-Alarm (vereinfacht)
   ─────────────────────────────────────────────────────────────────────────
   .tight        = Termin-Überlappung (Folge startet vor Vorgänger-Ende)
                  → bestehender roter Schlieren-Effekt aus Z.6177-6204,
                    PLUS animation-direction:reverse damit beide Schichten
                    von rechts nach links wandern (kritischer als Standard)
                    PLUS Speed bleibt 11s/18s = Faktor 2 schneller
   .insufficient = Fahrzeit reicht nicht (kein Overlap, aber zu knapp)
                  → gleiche rote Schlieren wie tight, aber mit der normalen
                    22s/35s Geschwindigkeit (= weniger dramatisch)
   ═════════════════════════════════════════════════════════════════════════ */

/* H6.2: tight-Schlieren laufen rechts→links (gegen den Standard-Lesefluss) */
/* removed conflicting old iter rule for .cal-travel-block.tight::before */
/* removed conflicting old iter rule for .cal-travel-block.tight::after */
/* H6: insufficient — gleiche rote Wolken wie tight, aber Standard-Geschwindigkeit.
   Wir kopieren die Backgrounds des tight-Patterns aber kein Speed-Override. */
.cal-travel-block.insufficient{
  background:linear-gradient(180deg,rgba(220,38,38,.04) 0%,rgba(220,38,38,.10) 50%,rgba(220,38,38,.05) 100%);
  border-color:rgba(220,38,38,.18);
  border-top-color:rgba(255,255,255,.32);
  box-shadow:
    inset 0 1px 1px rgba(255,255,255,.36),
    inset 0 -1px 2px rgba(220,38,38,.08),
    0 2px 8px rgba(220,38,38,.05),
    0 0 1px rgba(220,38,38,.16);
}
/* removed conflicting old iter rule for .cal-travel-block.insufficient::before */
/* removed conflicting old iter rule for .cal-travel-block.insufficient::after */
.cal-travel-block.insufficient .cal-travel-block-text{
  color:#dc2626;background:rgba(255,255,255,.78);
  box-shadow:0 1px 4px rgba(220,38,38,.06),inset 0 1px 0 rgba(255,255,255,.5);
}

/* User-Kalender Vert-Variante: insufficient genauso eingefärbt wie tight,
   aber mit weniger Sättigung (visuelle Eskalations-Hierarchie) */
.cal-travel-block-vert.insufficient{
  background:linear-gradient(180deg,rgba(220,38,38,.10) 0%,rgba(220,38,38,.18) 50%,rgba(220,38,38,.13) 100%) !important;
  border-color:rgba(220,38,38,.40) !important;
}
.cal-travel-block-vert.insufficient .cal-travel-block-text{color:#7c1d1d;}
.cal-travel-block-vert.insufficient .cal-travel-block-text i{color:#dc2626;}

/* User-Kalender uc-buffer (tight bleibt wie definiert in calendar-user.js,
   insufficient ähnlich aber weniger kontrastreich) */
.uc-buffer.insufficient{
  background:repeating-linear-gradient(135deg,
    rgba(220,38,38,.10) 0,
    rgba(220,38,38,.10) 7px,
    rgba(220,38,38,.20) 7px,
    rgba(220,38,38,.20) 14px) !important;
  border-color:rgba(220,38,38,.35) !important;
  color:#7c1d1d !important;
}

/* ═════════════════════════════════════════════════════════════════════════
   Iteration 9: Buffer-Alarm — MAXIMAL kräftig, "kann man nicht übersehen"
   - Tight: dunkles Tomatenrot Hintergrund, intensive Schwaden, 4s/7s, Glow
     extern via box-shadow filter:drop-shadow, Border 2px
   - Insufficient: zwischen normal und tight, klar als Warning erkennbar
   ═════════════════════════════════════════════════════════════════════════ */

/* TIGHT: massive Eskalation — erkennbar auch im Augenwinkel */
.cal-travel-block.tight{
  /* Hintergrund deutlich dunkler & roter — kein Glas-Effekt mehr, klare Alarmfarbe */
  background:
    linear-gradient(180deg,
      rgba(239,68,68,.42) 0%,
      rgba(220,38,38,.65) 50%,
      rgba(239,68,68,.45) 100%) !important;
  border: 2px solid rgba(220,38,38,.85) !important;
  border-top: 2px solid rgba(255,180,180,.70) !important;
  /* Externes rotes Glühen — sichtbar selbst wenn Buffer schmal ist */
  box-shadow:
    inset 0 1px 2px rgba(255,200,200,.60),
    inset 0 -2px 4px rgba(220,38,38,.40),
    0 0 0 1px rgba(220,38,38,.40),
    0 4px 18px rgba(220,38,38,.55),
    0 0 24px rgba(220,38,38,.30) !important;
  /* Drop-Shadow filter macht das Glühen "weicher" und übers Border hinaus */
  filter: drop-shadow(0 2px 6px rgba(220,38,38,.45));
}
/* removed conflicting old iter rule for .cal-travel-block.tight::before */
/* removed conflicting old iter rule for .cal-travel-block.tight::after */
.cal-travel-block.tight .cal-travel-block-text{
  color:#fff !important;
  background:rgba(127,29,29,.92) !important;  /* Sehr dunkles Rot */
  text-shadow:0 1px 3px rgba(0,0,0,.6) !important;
  box-shadow:
    0 2px 8px rgba(0,0,0,.35),
    inset 0 1px 0 rgba(255,255,255,.20),
    0 0 0 1px rgba(220,38,38,.55) !important;
  font-weight:800 !important;
  letter-spacing:.5px !important;
}
.cal-travel-block.tight .cal-travel-block-text i{
  color:#ffe5e5 !important;
}

/* INSUFFICIENT: deutlich roter als jetzt (war fast unsichtbar) */
.cal-travel-block.insufficient{
  background:linear-gradient(180deg,rgba(220,38,38,.18) 0%,rgba(220,38,38,.32) 50%,rgba(220,38,38,.20) 100%) !important;
  border-color:rgba(220,38,38,.55) !important;
  border-top-color:rgba(255,200,200,.50) !important;
  box-shadow:
    inset 0 1px 1px rgba(255,200,200,.50),
    inset 0 -1px 2px rgba(220,38,38,.25),
    0 2px 12px rgba(220,38,38,.20),
    0 0 1px rgba(220,38,38,.40) !important;
}
/* removed conflicting old iter rule for .cal-travel-block.insufficient::before */
/* removed conflicting old iter rule for .cal-travel-block.insufficient::after */
.cal-travel-block.insufficient .cal-travel-block-text{
  color:#fff !important;
  background:rgba(220,38,38,.85) !important;
  font-weight:700 !important;
  text-shadow:0 1px 2px rgba(0,0,0,.4) !important;
}
.cal-travel-block.insufficient .cal-travel-block-text i{color:#fff !important;}

/* User-Kalender vert-Variante — gleiche Eskalation */
.cal-travel-block-vert.tight{
  background:linear-gradient(180deg,rgba(220,38,38,.50) 0%,rgba(220,38,38,.70) 50%,rgba(220,38,38,.55) 100%) !important;
  border:2px solid rgba(220,38,38,.85) !important;
  box-shadow:0 0 12px rgba(220,38,38,.50) !important;
}
.cal-travel-block-vert.tight .cal-travel-block-text{color:#fff !important;font-weight:800 !important;text-shadow:0 1px 2px rgba(0,0,0,.5) !important;}
.cal-travel-block-vert.tight .cal-travel-block-text i{color:#fff !important;}

/* ═════════════════════════════════════════════════════════════════════════
   Iteration 9: Buffer-Alarm MAX EYECANDY
   - Tight: Animation 3s/5s (~6× Standard), opacity 1.0, blur reduziert,
     drop-shadow Glow extern, Borders dicker, Background-Tönung satter
   - Schwaden mit pure rgb(255,40,40) statt rosa-mix → strahlendes Tomatenrot
   ═════════════════════════════════════════════════════════════════════════ */

.cal-travel-block.tight,
.cal-travel-block-vert.tight {
  /* Externer Glow als drop-shadow (nicht inset) — leuchtet RAUS */
  filter: drop-shadow(0 0 8px rgba(220,38,38,.55)) drop-shadow(0 0 16px rgba(220,38,38,.30)) !important;
  border-width: 2px !important;
  border-color: rgba(220,38,38,.85) !important;
  background:
    linear-gradient(180deg,
      rgba(220,38,38,.28) 0%,
      rgba(220,38,38,.45) 50%,
      rgba(220,38,38,.32) 100%) !important;
}

/* removed conflicting old iter rule for .cal-travel-block.tight::before */
/* removed conflicting old iter rule for .cal-travel-block.tight::after */
/* Text-Box maximal sichtbar: pure weiß auf rein-rotem Tomatenpoll mit dickem Schatten */
.cal-travel-block.tight .cal-travel-block-text {
  color: #fff !important;
  background: rgba(220,38,38,.96) !important;
  text-shadow: 0 1px 3px rgba(0,0,0,.6), 0 0 8px rgba(255,255,255,.3) !important;
  box-shadow:
    0 2px 8px rgba(0,0,0,.4),
    inset 0 1px 0 rgba(255,255,255,.35),
    0 0 0 2px rgba(255,80,80,.5) !important;
  font-weight: 900 !important;
  letter-spacing: .5px !important;
  padding: 4px 12px !important;
  font-size: 11px !important;
}
.cal-travel-block.tight .cal-travel-block-text i {
  color: #fff !important;
  font-size: 10px !important;
  margin-right: 5px !important;
  filter: drop-shadow(0 0 3px rgba(255,255,255,.6)) !important;
}

/* Insufficient — etwas kräftiger als bisher aber unter tight bleibend */
.cal-travel-block.insufficient {
  filter: drop-shadow(0 0 4px rgba(220,38,38,.30)) !important;
  border-width: 1.5px !important;
  border-color: rgba(220,38,38,.45) !important;
}
/* removed conflicting old iter rule for .cal-travel-block.insufficient::before */
/* removed conflicting old iter rule for .cal-travel-block.insufficient::after */
/* ═════════════════════════════════════════════════════════════════════════
   Iteration 9.1: Section-Badge collapsed — UNTER dem Icon statt drüber
   User-Feedback: Badge erschien überhalb der Icons. Lösung: explizit
   bottom statt top, plus mehr top-padding am Section-Header.
   ═════════════════════════════════════════════════════════════════════════ */
@media (min-width: 769px){
  .cal-floating-list.right-collapsed .cal-side-hdr{
    position:relative !important;
    padding:14px 0 22px !important;  /* viel mehr unten — Platz für Badge */
  }
  .cal-floating-list.right-collapsed .cal-side-hdr-icon{
    font-size:18px !important;
    display:block !important;
    margin:0 auto !important;
    line-height:1 !important;
  }
  .cal-floating-list.right-collapsed .cal-side-badge,
  .cal-floating-list.right-collapsed .cal-badge.cal-side-badge {
    position:absolute !important;
    top:auto !important;
    bottom:4px !important;            /* UNTER dem Icon */
    right:auto !important;
    left:50% !important;
    transform:translateX(-50%) !important;  /* mittig */
    min-width:16px !important;
    height:14px !important;
    padding:0 5px !important;
    font-size:9px !important;
    line-height:14px !important;
    font-weight:700 !important;
    background:#dc2626 !important;
    color:#fff !important;
    border:1.5px solid var(--cal-surface,var(--surface,#fff)) !important;
    border-radius:7px !important;
    box-shadow:0 1px 3px rgba(0,0,0,.25) !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    z-index:5 !important;
  }
}

/* ═════════════════════════════════════════════════════════════════════════
   Iteration 10
   ═════════════════════════════════════════════════════════════════════════ */

/* ── 10.1: ROLLBACK ──
   Vorher hatte ich .cal-floating-list auf position:fixed gesetzt damit sie
   bis ganz oben reicht. Nebenwirkung: der Collapse-Button (data-rs-toggle)
   war visuell weg/unerreichbar. User: "war gerade vor deiner Änderung noch
   da". Daher zurück zur ursprünglichen Layout-Sidebar (relative im flex).
   Die "bis ganz oben"-Anforderung lasse ich für später — braucht andere
   Lösung als position:fixed (z.B. App-Layout-Restructure). */

/* ── 10.2: Badge ÜBER dem Icon (oberhalb, mittig) ──────────────────────── */
@media (min-width: 769px){
  .cal-floating-list.right-collapsed .cal-side-hdr{
    padding:22px 0 12px !important;  /* viel Platz oben für Badge drüber */
  }
  .cal-floating-list.right-collapsed .cal-side-badge,
  .cal-floating-list.right-collapsed .cal-badge.cal-side-badge{
    position:absolute !important;
    top:3px !important;               /* GANZ oben über dem Icon */
    bottom:auto !important;
    left:50% !important;
    right:auto !important;
    transform:translateX(-50%) !important;
    min-width:18px !important;
    height:14px !important;
    padding:0 5px !important;
    font-size:9px !important;
    font-weight:800 !important;
    line-height:14px !important;
    background:#dc2626 !important;
    color:#fff !important;
    border:1.5px solid var(--cal-surface,var(--surface,#fff)) !important;
    border-radius:8px !important;
    box-shadow:0 1px 4px rgba(0,0,0,.25) !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    z-index:5 !important;
    letter-spacing:0 !important;
  }
  /* Icon zentriert mittig — eigene Vertikal-Position, Badge oberhalb */
  .cal-floating-list.right-collapsed .cal-side-hdr-icon{
    margin-top:6px !important;
    display:block !important;
  }
}

/* ── 10.3: insufficient ULTRA erkennbar als Nebeneffekt ──────────────────
   Vorher: rgba(255,220,220,.65) - nur leicht heller. Soll deutlich rot sein
   ohne ganz so heftig wie tight zu wirken. */
.cal-travel-block.insufficient,
.cal-travel-block-vert.insufficient,
.uc-buffer.insufficient{
  background:linear-gradient(180deg,
    rgba(220,38,38,.18) 0%,
    rgba(220,38,38,.32) 50%,
    rgba(220,38,38,.22) 100%) !important;
  border-width:2px !important;
  border-color:rgba(220,38,38,.62) !important;
  border-top-color:rgba(255,200,200,.45) !important;
  filter:drop-shadow(0 0 6px rgba(220,38,38,.42)) !important;
  box-shadow:
    inset 0 1px 1px rgba(255,200,200,.45),
    inset 0 -1px 2px rgba(220,38,38,.22),
    0 2px 10px rgba(220,38,38,.18),
    0 0 1px rgba(220,38,38,.42) !important;
}
/* removed conflicting old iter rule for .cal-travel-block.insufficient::before */
/* removed conflicting old iter rule for .cal-travel-block.insufficient::after */
.cal-travel-block.insufficient .cal-travel-block-text{
  color:#7c1d1d !important;
  background:rgba(255,255,255,.92) !important;
  font-weight:800 !important;
  text-shadow:0 1px 2px rgba(255,255,255,.8) !important;
  box-shadow:0 1px 4px rgba(220,38,38,.15),inset 0 1px 0 rgba(255,255,255,.7),0 0 0 1.5px rgba(220,38,38,.4) !important;
  padding:3px 11px !important;
}
.cal-travel-block.insufficient .cal-travel-block-text i{
  color:#dc2626 !important;
  font-weight:900 !important;
}

/* ── 10.4: Service-Corner — Diagonal Ribbon (lang+flach) statt kleines Dreieck ── */
.cal-h-svc-corner{
  position:absolute;
  top:0;
  left:0;
  width:0;height:0;
  border-style:solid;
  border-width:14px 70px 0 0;        /* lang flach: 70px breit, 14px hoch */
  border-color:var(--svc-c,transparent) transparent transparent transparent;
  pointer-events:none;
  z-index:1;
  /* Subtle shimmer-Highlight auf dem Ribbon damit es nicht flach wirkt */
  filter:drop-shadow(1px 1px 0 rgba(255,255,255,.25));
  /* Bei sehr breiten Cards bleibt es proportional schlank */
}
.cal-shared-ev .cal-h-svc-corner{
  border-width:11px 50px 0 0;        /* User-View: kleiner */
}
/* Hover: Ribbon wandert leicht raus für Hover-Feedback */
.cal-h-event:hover .cal-h-svc-corner{
  filter:drop-shadow(2px 2px 1px rgba(0,0,0,.18));
  transition:filter .15s ease;
}

/* ── 10.5: Hochkant-Schwellwert hochsetzen ─────────────────────────────── */
/* CSS allein reicht nicht — JS-Resize-Observer setzt die Klasse. Aber
   die Klasse wird unten in calendar-dispo.js auf <70px statt <50px geändert.
   Hier nur Container-Query Fallback erweitern: */
@container (max-width: 70px){
  .cal-travel-block-text i{display:none;}
  .cal-travel-block-text{
    writing-mode:vertical-rl;
    transform:rotate(180deg) translateZ(0);
    font-size:9px;letter-spacing:.5px;padding:8px 4px;line-height:1.15;
  }
}


/* ═════════════════════════════════════════════════════════════════════════
   Iteration 11 — FINAL: Buffer-Animation + Border weg + svc-corner Schatten
   ─────────────────────────────────────────────────────────────────────────
   Bug aus vorherigen Iterationen: `background: gradient !important;` ist
   eine SHORTHAND property → resetet `background-size` auf `auto`.
   Damit lief die Animation zwar (bewegte background-position), aber das
   Gradient passte nicht mehr ins 200%-Pattern und verschwand sichtbar.

   Fix: explizit `background-size: 200% 100% !important` setzen damit das
   Pattern wieder das richtige Verhältnis hat und die Schwaden tatsächlich
   sichtbar wandern.
   ═════════════════════════════════════════════════════════════════════════ */

/* ── BORDER WEG bei tight/insufficient ──────────────────────────────────── */
.cal-travel-block.tight,
.cal-travel-block.insufficient{
  border: none !important;
  outline: none !important;
}

/* ── tight: background-size + Animation reaktivieren ────────────────────── */
/* removed conflicting old iter rule for .cal-travel-block.tight::before */
/* removed conflicting old iter rule for .cal-travel-block.tight::after */
/* tight Glow — drop-shadow extern statt Border */
.cal-travel-block.tight{
  filter:
    drop-shadow(0 0 8px rgba(220,38,38,.55))
    drop-shadow(0 0 16px rgba(220,38,38,.32)) !important;
}

/* ── insufficient: background-size + Animation reaktivieren ─────────────── */
/* removed conflicting old iter rule for .cal-travel-block.insufficient::before */
/* removed conflicting old iter rule for .cal-travel-block.insufficient::after */
/* insufficient Glow — milder als tight */
.cal-travel-block.insufficient{
  filter:
    drop-shadow(0 0 6px rgba(220,38,38,.40))
    drop-shadow(0 0 12px rgba(220,38,38,.22)) !important;
}

/* tight UND insufficient zusammen: tight gewinnt visuell mit kräftigerem Glow */
.cal-travel-block.tight.insufficient{
  filter:
    drop-shadow(0 0 10px rgba(220,38,38,.65))
    drop-shadow(0 0 20px rgba(220,38,38,.40)) !important;
}

/* ── svc-corner: Schatten unter die Card werfen ─────────────────────────── */
.cal-h-svc-corner{
  filter:
    drop-shadow(1px 1px 0 rgba(255,255,255,.25))    /* Highlight oben links */
    drop-shadow(2px 3px 4px rgba(0,0,0,.18))         /* Schatten unten rechts */
    drop-shadow(1px 2px 2px rgba(0,0,0,.12)) !important;  /* zusätzliche Tiefe */
}
.cal-h-event:hover .cal-h-svc-corner{
  filter:
    drop-shadow(1px 1px 0 rgba(255,255,255,.30))
    drop-shadow(3px 5px 6px rgba(0,0,0,.25))
    drop-shadow(2px 3px 3px rgba(0,0,0,.15)) !important;
  transition: filter .2s ease;
}

/* ═════════════════════════════════════════════════════════════════════════
   Iteration 11 — Sidebar collapsed-Mode: ALLES strikt zentriert
   ─────────────────────────────────────────────────────────────────────────
   User: "Symbole und Infos zentrieren — nicht ganz mittig"
   Final-Override damit Icon, Badge und Toggle-Button perfekt auf der
   48px-Mittelachse sitzen.
   ═════════════════════════════════════════════════════════════════════════ */
@media (min-width: 769px){
  /* Header (cal-rs-hdr) im collapsed-Mode — nur Toggle-Button mittig */
  .cal-floating-list.right-collapsed .cal-rs-hdr{
    display:flex !important;
    justify-content:center !important;
    align-items:center !important;
    padding:10px 0 !important;
    gap:0 !important;
    width:100% !important;
  }
  .cal-floating-list.right-collapsed .cal-rs-collapse-btn{
    margin:0 !important;
    flex:0 0 auto !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    width:32px !important;
    height:32px !important;
  }

  /* Section-Container: kein padding/margin damit Header voll zentriert sitzt */
  .cal-floating-list.right-collapsed .cal-side-section{
    padding:0 !important;
    margin:0 !important;
    width:100% !important;
  }

  /* Section-Header (cal-side-hdr): Icon strikt mittig, Badge oben drüber */
  .cal-floating-list.right-collapsed .cal-side-hdr{
    position:relative !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    padding:24px 0 14px !important;     /* viel Platz oben für Badge */
    width:100% !important;
    text-align:center !important;
    cursor:pointer !important;
    gap:0 !important;
    box-sizing:border-box !important;
  }

  /* Icon: zentriert, gleich groß, line-height kontrolliert */
  .cal-floating-list.right-collapsed .cal-side-hdr-icon{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    margin:0 auto !important;
    padding:0 !important;
    font-size:20px !important;
    line-height:1 !important;
    width:24px !important;
    height:24px !important;
    text-align:center !important;
    flex:0 0 auto !important;
  }

  /* Text + Chevron komplett aus dem Layout (nicht nur visuell weg) */
  .cal-floating-list.right-collapsed .cal-side-hdr-text,
  .cal-floating-list.right-collapsed .cal-side-chevron{
    display:none !important;
    width:0 !important;
    height:0 !important;
    margin:0 !important;
    padding:0 !important;
    flex:0 0 0 !important;
  }

  /* Badge mittig OBEN über dem Icon — perfekt auf der Mittelachse */
  .cal-floating-list.right-collapsed .cal-side-badge,
  .cal-floating-list.right-collapsed .cal-badge.cal-side-badge{
    position:absolute !important;
    top:5px !important;
    bottom:auto !important;
    left:50% !important;
    right:auto !important;
    transform:translateX(-50%) !important;
    min-width:18px !important;
    height:15px !important;
    padding:0 5px !important;
    font-size:9px !important;
    line-height:15px !important;
    font-weight:800 !important;
    text-align:center !important;
    background:#dc2626 !important;
    color:#fff !important;
    border:1.5px solid var(--cal-surface,var(--surface,#fff)) !important;
    border-radius:8px !important;
    box-shadow:0 1px 3px rgba(0,0,0,.25) !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    box-sizing:content-box !important;
    z-index:5 !important;
    letter-spacing:0 !important;
    margin:0 !important;
  }

  /* Empty Badge / leere Section: ausblenden */
  .cal-floating-list.right-collapsed .cal-side-badge:empty,
  .cal-floating-list.right-collapsed .cal-side-section:has(.cal-side-empty) .cal-side-badge{
    display:none !important;
  }

  /* Body (Card-Liste) bleibt versteckt */
  .cal-floating-list.right-collapsed .cal-side-body{
    display:none !important;
  }

  /* Master-Bar bleibt versteckt */
  .cal-floating-list.right-collapsed .cal-side-master-bar{
    display:none !important;
  }
}

/* ═════════════════════════════════════════════════════════════════════════
   Iteration 11 — FINAL FINAL: Buffer-Animation komplett neu aufgesetzt
   ─────────────────────────────────────────────────────────────────────────
   Problem-Diagnose:
   1. Existing tight/insufficient regeln nutzen `background:` shorthand →
      resetet background-size auf auto → Pattern unsichtbar.
   2. Z.6969 setzt `animation:none` für .is-pinned::after → killt rote
      Animation komplett wenn Pin gesetzt.

   Fix: eigene Keyframes (cal-buf-pulse-red) + background-image (nicht
   background) + alle Properties explizit + is-pinned override.
   ═════════════════════════════════════════════════════════════════════════ */

@keyframes cal-buf-pulse-red {
  from { background-position:    0% 0; }
  to   { background-position: -200% 0; }
}

/* ═══ tight + insufficient: Border weg ═══ */
.cal-travel-block.tight,
.cal-travel-block.insufficient,
.cal-travel-block-vert.tight,
.cal-travel-block-vert.insufficient,
.uc-buffer.tight,
.uc-buffer.insufficient{
  border: none !important;
  outline: none !important;
}

/* ═══ tight ::before — vordere Schwaden, schnell, reverse ═══ */
.cal-travel-block.tight::before,
.cal-travel-block.tight.is-pinned::before,
.cal-travel-block-vert.tight::before,
.uc-buffer.tight::before,
.uc-buffer.tight.is-pinned::before{
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  border-radius: inherit !important;
  z-index: 1 !important;
  background-image:
    radial-gradient(ellipse 8% 20% at  6% 30%, rgba(255,80,80,.95) 0%, rgba(220,38,38,.62) 50%, transparent 80%),
    radial-gradient(ellipse 10% 16% at 16% 65%, rgba(255,100,100,1)  0%, rgba(220,38,38,.68) 45%, transparent 75%),
    radial-gradient(ellipse 9% 22% at 25% 25%, rgba(255,80,80,.90)  0%, rgba(220,38,38,.58) 50%, transparent 80%),
    radial-gradient(ellipse 10% 18% at 36% 70%, rgba(255,100,100,1) 0%, rgba(220,38,38,.65) 45%, transparent 75%),
    radial-gradient(ellipse 8% 20% at 44% 40%, rgba(255,80,80,.85)  0%, rgba(220,38,38,.55) 50%, transparent 80%),
    radial-gradient(ellipse 8% 20% at 56% 30%, rgba(255,80,80,.95)  0%, rgba(220,38,38,.62) 50%, transparent 80%),
    radial-gradient(ellipse 10% 16% at 66% 65%, rgba(255,100,100,1) 0%, rgba(220,38,38,.68) 45%, transparent 75%),
    radial-gradient(ellipse 9% 22% at 75% 25%, rgba(255,80,80,.90)  0%, rgba(220,38,38,.58) 50%, transparent 80%),
    radial-gradient(ellipse 10% 18% at 86% 70%, rgba(255,100,100,1) 0%, rgba(220,38,38,.65) 45%, transparent 75%),
    radial-gradient(ellipse 8% 20% at 94% 40%, rgba(255,80,80,.85)  0%, rgba(220,38,38,.55) 50%, transparent 80%) !important;
  background-size: 200% 100% !important;
  background-repeat: repeat !important;
  /* KEIN !important — Keyframe-Animation muss background-position animieren können */
  background-position: 0 0;
  background-color: transparent !important;
  filter: blur(6px) !important;
  mix-blend-mode: normal !important;
  opacity: 0.95 !important;
  width: auto !important;
  height: auto !important;
  transform: none !important;
  will-change: background-position !important;
  animation: cal-buf-pulse-red 3s linear infinite reverse !important;
}

/* ═══ tight ::after — hintere Schwaden, langsamer, normal ═══ */
.cal-travel-block.tight::after,
.cal-travel-block.tight.is-pinned::after,
.cal-travel-block-vert.tight::after,
.uc-buffer.tight::after,
.uc-buffer.tight.is-pinned::after{
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  border-radius: inherit !important;
  z-index: 1 !important;
  font-family: inherit !important;
  font-weight: inherit !important;
  font-size: inherit !important;
  color: transparent !important;        /* falls Pin-content noch existiert */
  text-shadow: none !important;
  background-image:
    radial-gradient(ellipse 11% 20% at  6% 60%, rgba(255,70,70,.85) 0%, rgba(220,38,38,.55) 50%, transparent 80%),
    radial-gradient(ellipse 10% 16% at 16% 25%, rgba(255,90,90,.95) 0%, rgba(220,38,38,.62) 45%, transparent 75%),
    radial-gradient(ellipse 12% 18% at 25% 75%, rgba(255,70,70,.80) 0%, rgba(220,38,38,.50) 50%, transparent 80%),
    radial-gradient(ellipse 11% 14% at 35% 35%, rgba(255,90,90,.90) 0%, rgba(220,38,38,.58) 45%, transparent 75%),
    radial-gradient(ellipse 10% 22% at 46% 65%, rgba(255,70,70,.75) 0%, rgba(220,38,38,.46) 50%, transparent 80%),
    radial-gradient(ellipse 11% 20% at 56% 60%, rgba(255,70,70,.85) 0%, rgba(220,38,38,.55) 50%, transparent 80%),
    radial-gradient(ellipse 10% 16% at 66% 25%, rgba(255,90,90,.95) 0%, rgba(220,38,38,.62) 45%, transparent 75%),
    radial-gradient(ellipse 12% 18% at 75% 75%, rgba(255,70,70,.80) 0%, rgba(220,38,38,.50) 50%, transparent 80%),
    radial-gradient(ellipse 11% 14% at 85% 35%, rgba(255,90,90,.90) 0%, rgba(220,38,38,.58) 45%, transparent 75%),
    radial-gradient(ellipse 10% 22% at 96% 65%, rgba(255,70,70,.75) 0%, rgba(220,38,38,.46) 50%, transparent 80%) !important;
  background-size: 200% 100% !important;
  background-repeat: repeat !important;
  background-position: 0 0;
  background-color: transparent !important;
  filter: blur(8px) !important;
  mix-blend-mode: normal !important;
  opacity: 0.85 !important;
  width: auto !important;
  height: auto !important;
  transform: none !important;
  top: 0 !important;
  right: 0 !important;
  will-change: background-position !important;
  animation: cal-buf-pulse-red 5s linear infinite !important;
}

/* ═══ insufficient ::before — gemäßigt schnell ═══ */
.cal-travel-block.insufficient::before,
.cal-travel-block.insufficient.is-pinned::before,
.cal-travel-block-vert.insufficient::before,
.uc-buffer.insufficient::before,
.uc-buffer.insufficient.is-pinned::before{
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  border-radius: inherit !important;
  z-index: 1 !important;
  background-image:
    radial-gradient(ellipse 8% 18% at  9% 30%, rgba(255,80,80,.85) 0%, rgba(255,40,40,.55) 50%, transparent 80%),
    radial-gradient(ellipse 10% 14% at 19% 65%, rgba(255,100,100,.95) 0%, rgba(255,50,50,.60) 45%, transparent 75%),
    radial-gradient(ellipse 9% 20% at 28% 25%, rgba(255,80,80,.80) 0%, rgba(255,40,40,.50) 50%, transparent 80%),
    radial-gradient(ellipse 10% 16% at 36% 70%, rgba(255,100,100,.95) 0%, rgba(255,50,50,.58) 45%, transparent 75%),
    radial-gradient(ellipse 8% 18% at 44% 40%, rgba(255,80,80,.75) 0%, rgba(255,40,40,.48) 50%, transparent 80%),
    radial-gradient(ellipse 8% 18% at 59% 30%, rgba(255,80,80,.85) 0%, rgba(255,40,40,.55) 50%, transparent 80%),
    radial-gradient(ellipse 10% 14% at 69% 65%, rgba(255,100,100,.95) 0%, rgba(255,50,50,.60) 45%, transparent 75%),
    radial-gradient(ellipse 9% 20% at 78% 25%, rgba(255,80,80,.80) 0%, rgba(255,40,40,.50) 50%, transparent 80%),
    radial-gradient(ellipse 10% 16% at 86% 70%, rgba(255,100,100,.95) 0%, rgba(255,50,50,.58) 45%, transparent 75%),
    radial-gradient(ellipse 8% 18% at 94% 40%, rgba(255,80,80,.75) 0%, rgba(255,40,40,.48) 50%, transparent 80%) !important;
  background-size: 200% 100% !important;
  background-repeat: repeat !important;
  background-position: 0 0;
  background-color: transparent !important;
  filter: blur(6px) !important;
  mix-blend-mode: normal !important;
  opacity: 0.85 !important;
  width: auto !important;
  height: auto !important;
  transform: none !important;
  will-change: background-position !important;
  animation: cal-buf-pulse-red 6s linear infinite !important;
}

/* ═══ insufficient ::after — gemäßigt langsam, reverse ═══ */
.cal-travel-block.insufficient::after,
.cal-travel-block.insufficient.is-pinned::after,
.cal-travel-block-vert.insufficient::after,
.uc-buffer.insufficient::after,
.uc-buffer.insufficient.is-pinned::after{
  content: '' !important;
  position: absolute !important;
  inset: 0 !important;
  pointer-events: none !important;
  border-radius: inherit !important;
  z-index: 1 !important;
  font-family: inherit !important;
  font-weight: inherit !important;
  font-size: inherit !important;
  color: transparent !important;
  text-shadow: none !important;
  background-image:
    radial-gradient(ellipse 11% 18% at  6% 60%, rgba(255,70,70,.78) 0%, rgba(220,38,38,.48) 50%, transparent 80%),
    radial-gradient(ellipse 10% 14% at 16% 25%, rgba(255,90,90,.85) 0%, rgba(220,38,38,.55) 45%, transparent 75%),
    radial-gradient(ellipse 12% 16% at 25% 75%, rgba(255,70,70,.72) 0%, rgba(220,38,38,.42) 50%, transparent 80%),
    radial-gradient(ellipse 11% 12% at 35% 35%, rgba(255,90,90,.80) 0%, rgba(220,38,38,.50) 45%, transparent 75%),
    radial-gradient(ellipse 10% 20% at 46% 65%, rgba(255,70,70,.68) 0%, rgba(220,38,38,.40) 50%, transparent 80%),
    radial-gradient(ellipse 11% 18% at 56% 60%, rgba(255,70,70,.78) 0%, rgba(220,38,38,.48) 50%, transparent 80%),
    radial-gradient(ellipse 10% 14% at 66% 25%, rgba(255,90,90,.85) 0%, rgba(220,38,38,.55) 45%, transparent 75%),
    radial-gradient(ellipse 12% 16% at 75% 75%, rgba(255,70,70,.72) 0%, rgba(220,38,38,.42) 50%, transparent 80%),
    radial-gradient(ellipse 11% 12% at 85% 35%, rgba(255,90,90,.80) 0%, rgba(220,38,38,.50) 45%, transparent 75%),
    radial-gradient(ellipse 10% 20% at 96% 65%, rgba(255,70,70,.68) 0%, rgba(220,38,38,.40) 50%, transparent 80%) !important;
  background-size: 200% 100% !important;
  background-repeat: repeat !important;
  background-position: 0 0;
  background-color: transparent !important;
  filter: blur(8px) !important;
  mix-blend-mode: normal !important;
  opacity: 0.78 !important;
  width: auto !important;
  height: auto !important;
  transform: none !important;
  top: 0 !important;
  right: 0 !important;
  will-change: background-position !important;
  animation: cal-buf-pulse-red 10s linear infinite reverse !important;
}

/* ═══ Glow extern via drop-shadow auf das Element selbst ═══ */
.cal-travel-block.tight,
.cal-travel-block-vert.tight,
.uc-buffer.tight{
  filter:
    drop-shadow(0 0 8px rgba(220,38,38,.55))
    drop-shadow(0 0 16px rgba(220,38,38,.32)) !important;
}
.cal-travel-block.insufficient,
.cal-travel-block-vert.insufficient,
.uc-buffer.insufficient{
  filter:
    drop-shadow(0 0 6px rgba(220,38,38,.40))
    drop-shadow(0 0 12px rgba(220,38,38,.22)) !important;
}
.cal-travel-block.tight.insufficient,
.cal-travel-block-vert.tight.insufficient,
.uc-buffer.tight.insufficient{
  filter:
    drop-shadow(0 0 10px rgba(220,38,38,.65))
    drop-shadow(0 0 20px rgba(220,38,38,.40)) !important;
}

/* ═══ Pin-Symbol bei tight/insufficient: in vordere Ecke als kleines Icon ═══ */
/* Sonst würde der ::after Pin-Content (text "\f08d") sichtbar sein, der aber
   durch unser color:transparent versteckt ist. Falls erwünscht hier ein eigenes
   Pin-Element aber das ist ein anderes Thema. */

/* ═══ svc-corner: kräftiger Schatten (idle = hover-Style auf User-Wunsch) ═══ */
.cal-h-svc-corner{
  filter:
    drop-shadow(1px 1px 0 rgba(255,255,255,.30))
    drop-shadow(3px 5px 6px rgba(0,0,0,.25))
    drop-shadow(2px 3px 3px rgba(0,0,0,.15)) !important;
  transition: filter .2s ease;
}
/* Hover: noch eine Spur kräftiger als idle */
.cal-h-event:hover .cal-h-svc-corner{
  filter:
    drop-shadow(1px 1px 0 rgba(255,255,255,.35))
    drop-shadow(4px 6px 8px rgba(0,0,0,.32))
    drop-shadow(2px 4px 4px rgba(0,0,0,.20)) !important;
}

/* ═══════════════════════════════════════════════════════════════════
   FROSTED GLASS BUFFER v5 — kompletter Reset + Neubau
   Überschreibt ALLE alten Iterationen inkl. drop-shadow-Filter.
   ═══════════════════════════════════════════════════════════════════
   TECHNISCHE GRUNDLAGE:
   · backdrop-filter direkt auf .cal-travel-block → blurred den Inhalt
     DAHINTER (Kalender-Grid, Termin-Cards) = echter Frosted-Glass-Effekt
   · filter:none !important auf tight/insufficient → killt drop-shadow
     aus alten Iterationen, sonst würde backdrop-filter nicht arbeiten
   · ::before = Shimmer-Streifen (background-position animation)
   · ::after  = Top-Highlight (statisch, atmet nur in opacity)
   · Alle animation-Overrides als shorthand (nicht name+duration getrennt)
   ═══════════════════════════════════════════════════════════════════ */

/* ── 0. NUCLEAR RESET — alle alten tight/insufficient Pseudo-Styes ── */
.cal-travel-block.tight::before,
.cal-travel-block.tight.is-pinned::before,
.cal-travel-block-vert.tight::before,
.cal-travel-block.insufficient::before,
.cal-travel-block.insufficient.is-pinned::before,
.cal-travel-block-vert.insufficient::before{
  background-image:none !important;
  background-size:50% 100% !important;
  background-repeat:repeat-x !important;
  background-position:0 0;
  filter:none !important;
  mix-blend-mode:normal !important;
  opacity:1 !important;
  animation:none !important;
}
.cal-travel-block.tight::after,
.cal-travel-block.tight.is-pinned::after,
.cal-travel-block-vert.tight::after,
.cal-travel-block.insufficient::after,
.cal-travel-block.insufficient.is-pinned::after,
.cal-travel-block-vert.insufficient::after{
  content:'' !important;
  background-image:none !important;
  filter:none !important;
  mix-blend-mode:normal !important;
  opacity:1 !important;
  animation:none !important;
  color:transparent !important;
  text-shadow:none !important;
}
/* drop-shadow aus alter Iteration weg — sonst bricht backdrop-filter */
.cal-travel-block.tight,
.cal-travel-block.insufficient,
.cal-travel-block.tight.insufficient,
.cal-travel-block-vert.tight,
.cal-travel-block-vert.insufficient{
  filter:none !important;
}

/* ── 1. NORMALER BUFFER — ultra-transparent Frosted Glass ─────────── */
.cal-travel-block{
  background:rgba(255,255,255,.07) !important;
  backdrop-filter:blur(20px) saturate(2) brightness(1.1) !important;
  -webkit-backdrop-filter:blur(20px) saturate(2) brightness(1.1) !important;
  border:1px solid rgba(255,255,255,.28) !important;
  border-top:1px solid rgba(255,255,255,.50) !important;
  border-bottom:1px solid rgba(255,255,255,.08) !important;
  box-shadow:
    inset 0  1px 0 rgba(255,255,255,.55),
    inset 0 -1px 0 rgba(0,0,0,.06),
    0 2px 12px rgba(0,0,0,.10) !important;
  overflow:hidden !important;
  isolation:isolate !important;
  transform:translateZ(0);
  transition:background .2s,border-color .2s,transform .15s,box-shadow .15s;
}
.cal-travel-block:hover,
.cal-travel-block.is-hover{
  background:rgba(255,255,255,.13) !important;
  border-color:rgba(255,255,255,.45) !important;
  border-top-color:rgba(255,255,255,.68) !important;
  box-shadow:
    inset 0  1px 0 rgba(255,255,255,.70),
    inset 0 -1px 0 rgba(0,0,0,.04),
    0 4px 18px rgba(0,0,0,.14) !important;
  transform:translateZ(0) translateY(-2px);
}

/* Shimmer-Streifen — helles Lichtband gleitet durch das Glas */
.cal-travel-block::before{
  content:'';
  position:absolute;inset:0;
  background:
    linear-gradient(108deg,
      transparent            14%,
      rgba(255,255,255,.00)  26%,
      rgba(255,255,255,.55)  36%,
      rgba(255,255,255,.75)  42%,
      rgba(255,255,255,.55)  48%,
      rgba(255,255,255,.00)  60%,
      transparent            72%),
    linear-gradient(108deg,
      transparent            56%,
      rgba(255,255,255,.00)  65%,
      rgba(255,255,255,.30)  71%,
      rgba(255,255,255,.00)  77%,
      transparent            88%);
  background-size:50% 100%;
  background-repeat:repeat-x;
  background-position:0 0;
  z-index:1;pointer-events:none;border-radius:inherit;
  will-change:background-position;
  animation:fglass-drift var(--cal-aur-dur,8s) linear infinite;
  animation-delay:var(--shimmer-delay,0s);
}

/* Top-Highlight — klassischer Glas-Reflex oben */
.cal-travel-block::after{
  content:'';
  position:absolute;inset:0;
  background:linear-gradient(180deg,
    rgba(255,255,255,.28) 0%,
    rgba(255,255,255,.06) 40%,
    transparent           100%);
  z-index:2;pointer-events:none;border-radius:inherit;
  animation:fglass-topglow 5s ease-in-out infinite;
}

@keyframes fglass-drift{
  from{background-position:  0% 0;}
  to  {background-position:-100% 0;}
}
@keyframes fglass-topglow{
  0%,100%{opacity:.6;}
  50%    {opacity:1;}
}

/* Pille — kompakt, klar lesbar */
.cal-travel-block-text{
  position:relative !important;z-index:5 !important;
  background:rgba(255,255,255,.82) !important;
  backdrop-filter:blur(8px) !important;
  -webkit-backdrop-filter:blur(8px) !important;
  color:#1e3a4c !important;
  font-weight:700 !important;font-size:10px !important;letter-spacing:.3px !important;
  padding:3px 10px !important;border-radius:6px !important;white-space:nowrap !important;
  display:flex !important;align-items:center !important;gap:4px !important;
  border:1px solid rgba(255,255,255,.55) !important;
  box-shadow:0 1px 6px rgba(0,0,0,.10),inset 0 1px 0 rgba(255,255,255,.9) !important;
  -webkit-font-smoothing:antialiased !important;
  transform:translateZ(0) !important;isolation:isolate !important;
}
.cal-travel-block-text i{font-size:9px;color:#0f766e;}
.cal-travel-block:hover::before,
.cal-travel-block.is-hover::before{
  animation-duration:calc(var(--cal-aur-dur,8s) * 0.55) !important;
}

/* ── 2. TIGHT — rotes Glas, pulsierender Glow ─────────────────────── */
.cal-travel-block.tight{
  background:rgba(255,100,100,.12) !important;
  backdrop-filter:blur(20px) saturate(2) brightness(1.1) !important;
  -webkit-backdrop-filter:blur(20px) saturate(2) brightness(1.1) !important;
  border:1px solid rgba(255,150,150,.38) !important;
  border-top:1px solid rgba(255,200,200,.65) !important;
  border-bottom:1px solid rgba(220,38,38,.12) !important;
  filter:none !important;
  animation:fglass-alarm 1.8s ease-in-out infinite !important;
}
@keyframes fglass-alarm{
  0%,100%{box-shadow:
    inset 0  1px 0 rgba(255,200,200,.55),
    inset 0 -1px 0 rgba(0,0,0,.06),
    0 0 14px rgba(220,38,38,.30),
    0 2px 12px rgba(0,0,0,.12);}
  50%{box-shadow:
    inset 0  1px 0 rgba(255,220,220,.80),
    inset 0 -1px 0 rgba(0,0,0,.04),
    0 0 28px rgba(220,38,38,.58),
    0 0 52px rgba(220,38,38,.24),
    0 2px 12px rgba(0,0,0,.12);}
}
/* Iteration-9-Glas-Drift entfernt — neue Chevron-Animation in
   calendar-buffer.css übernimmt. background:-shorthand !important
   würde sonst background-position: 0% 0% !important setzen und
   damit unsere bufChevronFlow-Keyframes blockieren. */
.cal-travel-block.tight .cal-travel-block-text{
  background:rgba(200,20,20,.88) !important;
  backdrop-filter:blur(8px) !important;
  -webkit-backdrop-filter:blur(8px) !important;
  color:#fff !important;font-weight:900 !important;
  text-shadow:0 1px 3px rgba(0,0,0,.40) !important;
  border:1px solid rgba(255,120,120,.35) !important;
  box-shadow:0 1px 6px rgba(0,0,0,.22),inset 0 1px 0 rgba(255,255,255,.20),0 0 0 1px rgba(255,100,100,.30) !important;
}
.cal-travel-block.tight .cal-travel-block-text i{color:#ffd0d0 !important;}

/* ── 3. INSUFFICIENT — orange Glas, subtiler Puls ─────────────────── */
.cal-travel-block.insufficient{
  background:rgba(255,160,60,.11) !important;
  backdrop-filter:blur(20px) saturate(2) brightness(1.1) !important;
  -webkit-backdrop-filter:blur(20px) saturate(2) brightness(1.1) !important;
  border:1px solid rgba(255,160,60,.34) !important;
  border-top:1px solid rgba(255,210,120,.58) !important;
  border-bottom:1px solid rgba(200,100,0,.10) !important;
  filter:none !important;
  animation:fglass-insuf 2.5s ease-in-out infinite !important;
}
@keyframes fglass-insuf{
  0%,100%{box-shadow:
    inset 0  1px 0 rgba(255,210,120,.50),
    inset 0 -1px 0 rgba(0,0,0,.06),
    0 0 10px rgba(200,100,0,.22),
    0 2px 12px rgba(0,0,0,.10);}
  50%{box-shadow:
    inset 0  1px 0 rgba(255,225,150,.72),
    inset 0 -1px 0 rgba(0,0,0,.04),
    0 0 20px rgba(200,100,0,.42),
    0 0 38px rgba(200,100,0,.18),
    0 2px 12px rgba(0,0,0,.10);}
}
/* Iteration-9-Insufficient-Glas-Drift entfernt — neue Chevron-Animation
   in calendar-buffer.css übernimmt. */
.cal-travel-block.insufficient .cal-travel-block-text{
  background:rgba(160,65,0,.86) !important;
  backdrop-filter:blur(8px) !important;
  -webkit-backdrop-filter:blur(8px) !important;
  color:#fff !important;font-weight:800 !important;
  text-shadow:0 1px 2px rgba(0,0,0,.35) !important;
  border:1px solid rgba(255,160,60,.30) !important;
  box-shadow:0 1px 6px rgba(0,0,0,.18),inset 0 1px 0 rgba(255,255,255,.18),0 0 0 1px rgba(255,140,40,.25) !important;
}
.cal-travel-block.insufficient .cal-travel-block-text i{color:#ffd8a0 !important;}

/* ── 4. IS-HOME-TRIP — warmes gold-bernstein Glas ─────────────────── */
.cal-travel-block.is-home-trip{
  background:rgba(255,200,50,.10) !important;
  backdrop-filter:blur(20px) saturate(2) brightness(1.1) !important;
  -webkit-backdrop-filter:blur(20px) saturate(2) brightness(1.1) !important;
  border:1px solid rgba(250,190,40,.30) !important;
  border-top:1px solid rgba(255,225,100,.52) !important;
  border-bottom:1px solid rgba(180,110,0,.08) !important;
  box-shadow:
    inset 0  1px 0 rgba(255,225,100,.45),
    inset 0 -1px 0 rgba(0,0,0,.05),
    0 0  8px rgba(180,110,0,.18),
    0 2px 12px rgba(0,0,0,.10) !important;
  cursor:default !important;
  filter:none !important;
}
/* Iteration-9-Home-Trip-Glas-Drift entfernt — Chevron-Animation aus
   calendar-buffer.css übernimmt. */
.cal-travel-block.is-home-trip .cal-travel-block-text{color:#7c3a00 !important;}
.cal-travel-block.is-home-trip .cal-travel-block-text i{color:#b45309 !important;}

/* ── 5. IS-FIRST — grünes Glas ──────────────────────────────────────── */
.cal-travel-block.is-first{
  background:rgba(60,210,120,.10) !important;
  backdrop-filter:blur(20px) saturate(2) brightness(1.1) !important;
  -webkit-backdrop-filter:blur(20px) saturate(2) brightness(1.1) !important;
  border:1px solid rgba(60,200,110,.28) !important;
  border-top:1px solid rgba(140,240,170,.50) !important;
  border-bottom:1px solid rgba(20,130,60,.08) !important;
  box-shadow:
    inset 0  1px 0 rgba(140,240,170,.42),
    inset 0 -1px 0 rgba(0,0,0,.05),
    0 0  8px rgba(30,150,80,.16),
    0 2px 12px rgba(0,0,0,.10) !important;
  cursor:default !important;
  filter:none !important;
}
/* Iteration-9-Is-First-Glas-Drift entfernt — Chevron-Animation aus
   calendar-buffer.css übernimmt. */
.cal-travel-block.is-first .cal-travel-block-text{color:#064e3b !important;}
.cal-travel-block.is-first .cal-travel-block-text i{color:#059669 !important;}

/* ── 6. HAS-LEARNED — teal Tint ─────────────────────────────────────── */
/* Iteration-9-Has-Learned-Glas-Drift entfernt — Chevron-Animation aus
   calendar-buffer.css übernimmt. */

/* ── TOGGLE BUTTON — gleicher Look wie .verw-collapse-btn ───────── */
.cal-rs-collapse-btn{
  width:28px !important;height:28px !important;
  padding:0 !important;
  border:none !important;
  background:none !important;
  border-radius:6px !important;color:#1B7599 !important;
  box-shadow:none !important;
}
.cal-rs-collapse-btn:hover{
  background:rgba(27,117,153,.12) !important;border-color:transparent !important;
  box-shadow:none !important;transform:none !important;
}
.cal-rs-collapse-btn i{font-size:14px !important;}

/* ── SVC-CORNER ────────────────────────────────────────────────────── */
.cal-h-svc-corner{
  filter:drop-shadow(2px 3px 4px rgba(0,0,0,.20)) drop-shadow(1px 2px 2px rgba(0,0,0,.12)) !important;
}
.cal-h-event:hover .cal-h-svc-corner{
  filter:drop-shadow(3px 5px 6px rgba(0,0,0,.28)) drop-shadow(2px 3px 3px rgba(0,0,0,.16)) !important;
}

/* ── REDUCED MOTION ────────────────────────────────────────────────── */
@media(prefers-reduced-motion:reduce){
  .cal-travel-block::before,.cal-travel-block::after{animation:none !important;}
  .cal-travel-block.tight,.cal-travel-block.insufficient{animation:none !important;}
  .cal-travel-block.tight::before,.cal-travel-block.tight::after,
  .cal-travel-block.insufficient::before,.cal-travel-block.insufficient::after{animation:none !important;}
}