/* Extracted from app.css */


.staff-block .h-100 {
  background: rgba(255, 255, 255, 0.85);
  border: 1px solid var(--surface-elevated-border);
  box-shadow: var(--shadow-xs);
  transition: transform 180ms ease, box-shadow 180ms ease;
}

.staff-block .h-100:hover {
  transform: translateY(-6px);
  box-shadow: var(--shadow-sm);
}

/* Phone + WhatsApp inline layout */
.staff-block .phone-wrap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}

.staff-block .whatsapp-link {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #25D366;
  transition: opacity 0.15s ease;
  flex-shrink: 0;
  text-decoration: none;
}

.staff-block .whatsapp-link:hover {
  opacity: 0.7;
}

/* ── Editor drag-and-drop styles ── */
.staff-row[draggable="true"] {
  cursor: grab;
  user-select: none;
}

.staff-row[draggable="true"]:active {
  cursor: grabbing;
}

.staff-row .drag-handle {
  cursor: grab;
  font-size: 1.1rem;
  line-height: 1;
  color: #6c757d;
  padding: 0 4px;
  user-select: none;
  transition: color 0.15s;
}

.staff-row .drag-handle:hover {
  color: #212529;
}

.staff-row.ghost {
  opacity: 0.35;
  outline: 2px dashed #adb5bd;
  outline-offset: -2px;
}

.staff-row.drag-over {
  outline: 2px solid #0d6efd;
  outline-offset: -2px;
  background-color: #f0f7ff;
}

/* ── Canvas staff-card drag styles ── */
.block-live .staff-drag-handle {
  position: absolute;
  top: 6px;
  right: 6px;
  z-index: 3;
  cursor: grab;
  font-size: 1rem;
  line-height: 1;
  color: #fff;
  background: rgba(0,0,0,0.35);
  border-radius: 4px;
  padding: 3px 6px 2px;
  opacity: 0;
  transition: opacity 0.15s ease;
  user-select: none;
  pointer-events: auto;
}

.block-live .h-100 {
  position: relative;
}

.block-live .h-100:hover .staff-drag-handle {
  opacity: 1;
}

.block-live .h-100[draggable="true"] {
  cursor: grab;
  user-select: none;
}

.block-live .h-100[draggable="true"]:active {
  cursor: grabbing;
}

.block-live .h-100.ghost {
  opacity: 0.3;
  outline: 2px dashed #0d6efd;
  outline-offset: -2px;
  transform: scale(0.95);
  transition: opacity 0.15s, transform 0.15s;
}

.block-live .h-100.drag-over {
  outline: 3px solid #0d6efd;
  outline-offset: 2px;
  box-shadow: 0 0 0 4px rgba(13,110,253,0.15);
  transform: scale(1.03);
  transition: outline 0.1s, box-shadow 0.1s, transform 0.1s;
}