/* ============================================================
   MALERPLUS - PLANNER DRAG & DROP
   Nur transform + opacity, GPU-only, keine Layout-Shifts
   ============================================================ */


/* -- Tile waehrend Pointer-Drag (Original) -- */

.dash-planner-month-item.is-dragging-pointer,
.dash-planner-entry.is-dragging-pointer,
.dash-planner-worker-chip.is-dragging-pointer,
.dash-planner-entry-worker-pill.is-dragging-pointer {
  opacity: 0.4;
  transform: scale(0.98);
  transition: opacity 120ms ease, transform 120ms ease;
  pointer-events: none;
}

/* Worker-Chips + Entries: Android braucht touch-action: none damit
   der Browser beim Long-Press nicht scrollt statt zu draggen.
   -webkit-touch-callout: none unterdrueckt das iOS/Android
   "Herunterladen/Kopieren" Kontextmenue. */
.dash-planner-worker-chip,
.dash-planner-entry-worker-pill,
.dash-planner-month-item,
.dash-planner-entry {
  touch-action: none;
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  -webkit-tap-highlight-color: transparent;
}
.dash-planner-worker-chip *,
.dash-planner-entry-worker-pill *,
.dash-planner-month-item *,
.dash-planner-entry * {
  -webkit-user-select: none;
  user-select: none;
  -webkit-touch-callout: none;
  pointer-events: none; /* Nested spans/imgs duerfen Pointer-Events nicht abfangen */
}

.dash-planner-entry-worker-pill {
  cursor: grab;
  pointer-events: auto !important;
  transition: transform 120ms ease, box-shadow 120ms ease, border-color 120ms ease;
}

.dash-planner-entry-worker-pill:hover {
  transform: translateY(-1px);
  box-shadow: 0 5px 14px rgba(15, 23, 42, 0.10);
}

.dash-planner-entry-worker-pill:active {
  cursor: grabbing;
}

/* Tablet/iPad: Nach kurzem Halten zeigt die Karte schon vor dem Abheben,
   dass sie gegriffen wird. Nur transform/opacity — kein Layout-Sprung. */
.dash-planner-month-item.is-drag-pending,
.dash-planner-entry.is-drag-pending,
.dash-planner-worker-chip.is-drag-pending,
.dash-planner-entry-worker-pill.is-drag-pending {
  transform: scale(.975);
  opacity: .82;
  box-shadow: 0 0 0 3px rgba(43, 176, 255, .16), 0 8px 20px rgba(15, 23, 42, .10);
  transition: transform 160ms ease, opacity 160ms ease, box-shadow 160ms ease;
}


/* -- Ghost-Clone (am body) -- */

.mp-planner-dnd-ghost {
  opacity: 0.96;
  box-shadow:
    0 4px 10px rgba(15, 23, 42, 0.12),
    0 20px 40px rgba(15, 23, 42, 0.18);
  border-radius: 10px;
  cursor: grabbing;
  transition: none;
  user-select: none;
  -webkit-user-select: none;
  touch-action: none;
  /* Verhindert dass Inhalte im Ghost unsauber clipen */
  overflow: hidden;
}


/* -- Body-Class waehrend aktivem Drag -- */

body.mp-planner-dnd-active {
  cursor: grabbing;
  -webkit-user-select: none;
  user-select: none;
  touch-action: none;  /* Browser-Scroll verhindern */
}

body.mp-planner-dnd-active .dash-planner-month-item:not(.is-dragging-pointer) {
  touch-action: none;
}


/* -- Drop-Zone Highlight (valide) -- */

.dash-planner-month-cell.is-drop-target,
.dash-planner-team-cell.is-drop-target,
.dash-planner-slot.is-drop-target,
[data-project-id][data-date].is-drop-target {
  background: rgba(43, 176, 255, 0.08) !important;
  box-shadow:
    inset 0 0 0 2px rgba(43, 176, 255, 0.45),
    0 0 0 1px rgba(43, 176, 255, 0.25);
  transition: background 80ms ease, box-shadow 80ms ease;
}


/* -- Drop-Zone Highlight (Konflikt — rot) -- */

.dash-planner-month-cell.is-drop-conflict,
.dash-planner-team-cell.is-drop-conflict,
.dash-planner-slot.is-drop-conflict,
[data-project-id][data-date].is-drop-conflict {
  background: rgba(224, 64, 64, 0.08) !important;
  box-shadow:
    inset 0 0 0 2px rgba(224, 64, 64, 0.45),
    0 0 0 1px rgba(224, 64, 64, 0.25);
  transition: background 80ms ease, box-shadow 80ms ease;
}

/* -- Drop-Zone Soft-Warning (Range-Abwesenheit — orange, nicht blockend) -- */

.dash-planner-month-cell.is-drop-warning,
.dash-planner-team-cell.is-drop-warning,
.dash-planner-slot.is-drop-warning,
[data-project-id][data-date].is-drop-warning {
  background: rgba(234, 88, 12, 0.08) !important;
  box-shadow:
    inset 0 0 0 2px rgba(234, 88, 12, 0.45),
    0 0 0 1px rgba(234, 88, 12, 0.25);
  transition: background 80ms ease, box-shadow 80ms ease;
}


/* -- Conflict-Reject Shake auf Origin-Tile -- */

@keyframes mp-planner-reject {
  0%, 100% { transform: translateX(0); }
  20%      { transform: translateX(-4px); }
  40%      { transform: translateX(4px); }
  60%      { transform: translateX(-2px); }
  80%      { transform: translateX(2px); }
}

.dash-planner-month-item.is-drop-rejected {
  animation: mp-planner-reject 320ms ease-out both;
  border-color: rgba(224, 64, 64, 0.5) !important;
  box-shadow: 0 0 0 2px rgba(224, 64, 64, 0.25) !important;
}


/* -- Drop-Settle (kurze Landung, verschwindet mit Re-Render) -- */

.dash-planner-month-item.is-drop-settled {
  opacity: 0.6;
  transition: opacity 120ms ease;
}


/* -- Reduced Motion -- */

@media (prefers-reduced-motion: reduce) {
  .dash-planner-month-item.is-dragging-pointer,
  .dash-planner-entry.is-dragging-pointer,
  .dash-planner-entry.is-drag-pending,
  .dash-planner-month-item.is-drag-pending,
  .dash-planner-entry-worker-pill.is-dragging-pointer,
  .dash-planner-month-item.is-drop-rejected,
  .dash-planner-month-item.is-drop-settled {
    animation: none !important;
    transition: none !important;
  }
}


/* ============================================================
   MULTI-DAY DRAG-TO-RESIZE (MP-20261003-022)
   Rechter Greif-Handle fuer Termine und Einsaetze in allen Ansichten
   (Team-, Wochen- und Monatsansicht).
   ============================================================ */

.dash-planner-entry,
.dash-planner-team-chip,
.dash-planner-month-item {
  position: relative !important;
}

.mp-event-resize-handle {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  width: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: ew-resize;
  pointer-events: auto !important;
  touch-action: none;
  z-index: 15;
  opacity: 0;
  background: transparent;
  border-top-right-radius: inherit;
  border-bottom-right-radius: inherit;
  transition: opacity 140ms ease, background 140ms ease;
  user-select: none;
  -webkit-user-select: none;
}

/* Sichtbarkeit bei Hover ueber Kachel oder Handle */
.dash-planner-entry:hover .mp-event-resize-handle,
.dash-planner-team-chip:hover .mp-event-resize-handle,
.dash-planner-month-item:hover .mp-event-resize-handle,
.mp-event-resize-handle:hover,
.mp-event-resize-handle.is-resizing {
  opacity: 1;
}

/* Auf Touch-Geraeten dauerhaft dezent sichtbar und breitere Trefferflaeche */
@media (hover: none) {
  .mp-event-resize-handle {
    opacity: 0.65;
    width: 20px;
  }
}

.mp-event-resize-handle .mp-resize-bar {
  display: block;
  width: 3px;
  height: 14px;
  border-radius: 2px;
  background: rgba(255, 255, 255, 0.75);
  box-shadow: 0 0 2px rgba(0, 0, 0, 0.35);
  pointer-events: none;
  transition: height 120ms ease, background 120ms ease, transform 120ms ease;
}

.mp-event-resize-handle:hover .mp-resize-bar,
.mp-event-resize-handle.is-resizing .mp-resize-bar {
  background: #2bb0ff;
  height: 18px;
  transform: scaleX(1.3);
  box-shadow: 0 0 6px rgba(43, 176, 255, 0.6);
}

/* Aktiver Resize-Zustand auf Karte */
.dash-planner-entry.is-resizing,
.dash-planner-team-chip.is-resizing,
.dash-planner-month-item.is-resizing {
  box-shadow: 0 0 0 2px #2bb0ff, 0 6px 16px rgba(43, 176, 255, 0.25) !important;
  z-index: 20 !important;
}

/* Body waehrend Resize */
body.mp-planner-resizing-active {
  cursor: ew-resize !important;
  user-select: none;
  -webkit-user-select: none;
  touch-action: none;
}

/* Ziel-Tage Highlight (Span) */
.dash-planner-slot.is-resize-span,
.dash-planner-team-cell.is-resize-span,
.dash-planner-month-cell.is-resize-span {
  background: rgba(43, 176, 255, 0.14) !important;
  box-shadow: inset 0 0 0 2px rgba(43, 176, 255, 0.65) !important;
  transition: background 60ms ease, box-shadow 60ms ease;
}

html.dark .dash-planner-slot.is-resize-span,
html.dark .dash-planner-team-cell.is-resize-span,
html.dark .dash-planner-month-cell.is-resize-span {
  background: rgba(43, 176, 255, 0.22) !important;
  box-shadow: inset 0 0 0 2px #2bb0ff !important;
}

/* Schwebender Zeitraum-Tooltip */
.mp-planner-resize-tooltip {
  position: fixed;
  z-index: 100000;
  pointer-events: none;
  background: rgba(15, 23, 42, 0.94);
  color: #ffffff;
  padding: 6px 12px;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 600;
  letter-spacing: -0.01em;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.3);
  border: 1px solid rgba(255, 255, 255, 0.16);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  transform: translate(-50%, -130%);
  white-space: nowrap;
  user-select: none;
}

html.dark .mp-planner-resize-tooltip {
  background: rgba(20, 29, 44, 0.96);
  border-color: rgba(43, 176, 255, 0.35);
  color: #f1f5f9;
}