/* v5.23.44 - Resize-Vorschau für Timeline und Ressourcenplanung */
.resize-preview-ghost {
  position: fixed;
  z-index: 9999;
  pointer-events: none;
  box-sizing: border-box;
  border: 2px solid color-mix(in srgb, var(--primary) 78%, white);
  border-radius: 12px;
  background: color-mix(in srgb, var(--primary) 18%, transparent);
  box-shadow: 0 10px 26px rgba(15, 23, 42, .22), inset 0 0 0 1px color-mix(in srgb, var(--primary) 24%, transparent);
  transition: left .04s linear, width .04s linear;
}
.resize-preview-ghost.invalid {
  border-color: var(--error, #ba1a1a);
  background: color-mix(in srgb, var(--error, #ba1a1a) 16%, transparent);
}
.resize-preview-ghost .resize-preview-label {
  position: absolute;
  left: 50%;
  top: -34px;
  transform: translateX(-50%);
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  max-width: min(420px, 88vw);
  white-space: nowrap;
  padding: 6px 10px;
  border-radius: 999px;
  background: var(--inverse-surface, #111827);
  color: var(--inverse-on-surface, #fff);
  font-size: 12px;
  font-weight: 800;
  line-height: 1.1;
  box-shadow: 0 8px 22px rgba(15, 23, 42, .25);
}
.resize-preview-ghost.invalid .resize-preview-label {
  background: var(--error, #ba1a1a);
  color: #fff;
}
body.resource-resizing .occupancy-chip.resizing,
body.timeline-resizing .timeline-bar-new.resizing {
  opacity: .58 !important;
  transform: none !important;
  outline-style: dashed !important;
}
body.resource-resizing .occupancy-chip.resizing::after,
body.timeline-resizing .timeline-bar-new.resizing::after {
  content: none !important;
}
.timeline-bar-new.resizing,
.resource-planner-v2 .occupancy-chip.resizing {
  cursor: ew-resize !important;
}
@media (max-width: 640px) {
  .resize-preview-ghost .resize-preview-label {
    white-space: normal;
    text-align: center;
    border-radius: 12px;
  }
}

/* v5.23.45 - Resize in 15-Minuten-Schritten und sichtbare Griffe in allen Planungsansichten */
.resource-planner-v2.resource-scale-day .occupancy-day-lane {
  grid-template-columns: repeat(var(--occ-cols), minmax(0, 1fr)) !important;
}
.resource-planner-v2.resource-scale-month .occupancy-month-cell .occupancy-chip {
  position: relative;
  padding-inline: 13px;
}
.resource-planner-v2.resource-scale-month .occupancy-month-cell .resource-resize-handle {
  opacity: .65;
}
.resource-planner-v2.resource-scale-month .occupancy-month-cell .occupancy-chip:hover .resource-resize-handle,
.resource-planner-v2.resource-scale-month .occupancy-month-cell .occupancy-chip:focus-visible .resource-resize-handle {
  opacity: 1;
}
.resize-preview-ghost .resize-preview-label::after {
  content: " · 15-Min.-Raster";
  opacity: .78;
  font-weight: 600;
}

/* v5.23.46 - Ressourcenplanung: dünnere Resize-Griffe */
.resource-planner-v2 .resource-resize-handle {
  width: 14px !important;
  min-width: 14px !important;
  top: -2px !important;
  bottom: -2px !important;
  opacity: .55 !important;
  background: transparent !important;
  box-shadow: none !important;
}
.resource-planner-v2 .resource-resize-handle.left {
  left: -4px !important;
}
.resource-planner-v2 .resource-resize-handle.right {
  right: -4px !important;
}
.resource-planner-v2 .resource-resize-handle::after {
  width: 3px !important;
  top: 9px !important;
  bottom: 9px !important;
  opacity: .72 !important;
  box-shadow: none !important;
}
.resource-planner-v2 .resource-resize-handle.left::after {
  left: 5px !important;
}
.resource-planner-v2 .resource-resize-handle.right::after {
  right: 5px !important;
}
.resource-planner-v2 .resource-resize-handle:hover,
.resource-planner-v2 .resource-resize-handle:focus-visible,
.resource-planner-v2 .occupancy-chip.resizing .resource-resize-handle {
  opacity: .95 !important;
  background: color-mix(in srgb, var(--primary) 8%, transparent) !important;
}
.resource-planner-v2 .occupancy-chip.resizing .resource-resize-handle::after,
.resource-planner-v2 .resource-resize-handle:hover::after,
.resource-planner-v2 .resource-resize-handle:focus-visible::after {
  opacity: 1 !important;
}

/* v5.23.47 - Resize stabil in Timeline/Projekt-Timeline/Ressourcenplanung */
.timeline-bar-new,
.resource-planner-v2 .occupancy-chip {
  position: relative !important;
  overflow: visible !important;
}
.timeline-resize-handle,
.resource-planner-v2 .resource-resize-handle {
  pointer-events: auto !important;
  z-index: 20 !important;
}
.resource-planner-v2 .occupancy-week-lane,
.resource-planner-v2 .occupancy-day-lane,
.resource-planner-v2 .occupancy-month-cell {
  overflow: visible !important;
}
.resource-planner-v2 .occupancy-month-cell .occupancy-chip.compact {
  min-height: 34px;
}
.resize-preview-ghost.timeline,
.resize-preview-ghost.resource {
  border-width: 1.5px;
}


/* v5.23.48 - Ressourcenplanung: Woche/Monat Drop und Resize stabil */
.resource-planner-v2 .occupancy-month-cell.drag-over {
  outline: 2px dashed color-mix(in srgb, var(--primary) 55%, transparent);
  outline-offset: -4px;
  background: color-mix(in srgb, var(--primary) 9%, var(--surface-container-lowest));
}
.resource-planner-v2 .occupancy-month-cell.resource-drop-slot {
  box-shadow: inset 0 0 0 2px color-mix(in srgb, var(--primary) 50%, transparent);
}
.resource-planner-v2 .occupancy-month-cell.drag-over::after {
  content: attr(data-drop-preview);
  display: inline-flex;
  width: fit-content;
  max-width: 100%;
  margin-top: 4px;
  padding: 3px 7px;
  border-radius: 999px;
  background: color-mix(in srgb, var(--primary) 16%, transparent);
  color: var(--primary);
  font-size: 11px;
  font-weight: 800;
}

/* v5.23.49 - Ressourcenplanung Monat: nur Verschieben, kein Resize */
.resource-planner-v2.resource-scale-month .resource-resize-handle,
.resource-planner-v2 .occupancy-month .resource-resize-handle {
  display: none !important;
}
.resource-planner-v2.resource-scale-month .occupancy-chip {
  cursor: grab;
}
.resource-planner-v2.resource-scale-month .occupancy-chip.dragging {
  cursor: grabbing;
}


/* v5.23.50 - Timeline: korrekte Tagesbreite und Resize-Hinweis nur bei 15-Minuten-Raster */
.resize-preview-ghost .resize-preview-label::after {
  content: "" !important;
}
.resize-preview-ghost.snap-15 .resize-preview-label::after {
  content: " · 15-Min.-Raster" !important;
  opacity: .78;
  font-weight: 600;
}
.timeline-task-name.appointment-row .drag-dot {
  color: var(--primary);
}
.timeline-scale-day .timeline-bar-new,
.timeline-scale-week .timeline-bar-new,
.timeline-scale-month .timeline-bar-new {
  min-width: 18px;
}

/* v5.23.51 - Timeline: kompakte Resize-Vorschau statt großer Umriss */
.timeline-bar-new.no-resize .timeline-resize-handle { display: none !important; }
.resize-preview-ghost.timeline.timeline-compact {
  position: fixed;
  z-index: 9999;
  width: auto !important;
  height: auto !important;
  min-width: 0;
  max-width: min(360px, calc(100vw - 24px));
  padding: 6px 10px;
  border: 1px solid color-mix(in srgb, var(--primary) 42%, transparent);
  border-radius: 999px;
  background: color-mix(in srgb, var(--surface-container-high) 94%, transparent);
  box-shadow: 0 10px 26px rgba(0,0,0,.22);
  pointer-events: none;
}
.resize-preview-ghost.timeline.timeline-compact::before,
.resize-preview-ghost.timeline.timeline-compact::after {
  display: none !important;
  content: none !important;
}
.resize-preview-ghost.timeline.timeline-compact .resize-preview-label {
  position: static;
  display: block;
  white-space: nowrap;
  font-size: 12px;
  font-weight: 700;
  color: var(--on-surface);
}
.resize-preview-ghost.timeline.timeline-compact.snap-15 .resize-preview-label::after {
  content: ' · 15-Min.-Raster';
  color: var(--primary);
}
.resize-preview-ghost.timeline.timeline-compact.invalid {
  border-color: color-mix(in srgb, var(--error) 70%, transparent);
  background: color-mix(in srgb, var(--error-container) 90%, var(--surface));
}

/* v5.23.52 - Timeline Stunden/Tag: Raster und Zeilenposition repariert */
.timeline-pro {
  align-items: stretch !important;
}
.timeline-task-head {
  grid-column: 1 !important;
  grid-row: 1 !important;
}
.timeline-date-head {
  grid-column: 2 !important;
  grid-row: 1 !important;
}
.timeline-task-list {
  grid-column: 1 !important;
  grid-row: 2 !important;
  height: calc(var(--tl-rows) * var(--tl-row-h)) !important;
}
.timeline-canvas {
  grid-column: 2 !important;
  grid-row: 2 !important;
  height: calc(var(--tl-rows) * var(--tl-row-h)) !important;
  min-height: calc(var(--tl-rows) * var(--tl-row-h)) !important;
  overflow: hidden !important;
}
.timeline-canvas .timeline-grid-bg,
.timeline-canvas .timeline-lane,
.timeline-canvas .timeline-bar-new,
.timeline-canvas .timeline-ghost,
.timeline-canvas .timeline-today-line,
.timeline-canvas .dependency-svg {
  position: absolute !important;
}
.timeline-canvas .timeline-bar-new,
.timeline-canvas .timeline-ghost {
  margin: 0 !important;
  transform: none !important;
}
.timeline-canvas .timeline-grid-bg {
  inset: 0 !important;
  height: 100% !important;
}
.timeline-scale-hours .timeline-date-head,
.timeline-scale-day .timeline-date-head {
  grid-template-columns: repeat(var(--tl-cols), minmax(0, 1fr)) !important;
}
.timeline-scale-hours .timeline-grid-bg,
.timeline-scale-day .timeline-grid-bg {
  grid-template-columns: repeat(var(--tl-cols), minmax(0, 1fr)) !important;
}
.timeline-scale-hours .timeline-bar-new,
.timeline-scale-day .timeline-bar-new {
  top: var(--bar-top, auto);
}

/* v5.23.53 - Timeline Resize: Zielbox mit Text innerhalb, stabile Vorschau */
.resize-preview-ghost.timeline.timeline-compact,
.resize-preview-ghost.timeline.timeline-target {
  display: flex !important;
  align-items: center !important;
  justify-content: flex-start !important;
  box-sizing: border-box !important;
  padding: 0 9px !important;
  min-height: 24px !important;
  border: 1px solid color-mix(in srgb, var(--primary) 70%, transparent) !important;
  border-radius: 10px !important;
  background: color-mix(in srgb, var(--primary) 24%, var(--surface-container-high)) !important;
  color: var(--on-surface) !important;
  box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--primary) 24%, transparent), 0 8px 18px rgba(0,0,0,.18) !important;
  overflow: hidden !important;
}
.resize-preview-ghost.timeline.timeline-compact .resize-preview-label,
.resize-preview-ghost.timeline.timeline-target .resize-preview-label {
  position: static !important;
  transform: none !important;
  display: block !important;
  min-width: 0 !important;
  max-width: 100% !important;
  width: 100% !important;
  padding: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: inherit !important;
  box-shadow: none !important;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  text-align: left !important;
  font-size: 12px !important;
  line-height: 1.2 !important;
  font-weight: 800 !important;
}
.resize-preview-ghost.timeline.timeline-compact.snap-15 .resize-preview-label::after,
.resize-preview-ghost.timeline.timeline-target.snap-15 .resize-preview-label::after {
  content: ' · 15 Min.' !important;
  color: var(--primary) !important;
  opacity: .9 !important;
  font-weight: 700 !important;
}
.resize-preview-ghost.timeline.timeline-compact.invalid,
.resize-preview-ghost.timeline.timeline-target.invalid {
  border-color: color-mix(in srgb, var(--error) 75%, transparent) !important;
  background: color-mix(in srgb, var(--error-container) 84%, var(--surface)) !important;
}
.timeline-canvas .timeline-bar-new.dragging {
  opacity: .62 !important;
}



/* v5.25.67 - Ressourcenplanung: Termin-Chips exakt im Tages-/Wochenraster halten */
.resource-planner-v2.resource-scale-day .occupancy-day-lane,
.resource-planner-v2.resource-scale-week .occupancy-week-lane {
  align-items: stretch;
  justify-items: stretch;
}
.resource-planner-v2.resource-scale-day .occupancy-day-event,
.resource-planner-v2.resource-scale-week .occupancy-week-event {
  box-sizing: border-box !important;
  width: auto !important;
  max-width: none !important;
  justify-self: stretch !important;
}
.resource-planner-v2.resource-scale-day .occupancy-day-event {
  margin: 4px 2px !important;
}
.resource-planner-v2.resource-scale-week .occupancy-week-event {
  margin: 3px 2px 4px !important;
}
.resource-planner-v2.resource-scale-day .occupancy-hour-bg,
.resource-planner-v2.resource-scale-week .occupancy-week-bg,
.resource-planner-v2.resource-scale-week .occupancy-week-day-summary {
  box-sizing: border-box !important;
}
