/* finale-dnd base styles. Everything here is safe to override. */
:root {
  --fdnd-accent: #111;
  --fdnd-shadow: 0 14px 30px rgba(0, 0, 0, 0.18), 0 2px 6px rgba(0, 0, 0, 0.12);
}

/* Things you can pick up. Touch needs the callout and text selection off for press-and-hold. */
.fdnd-draggable,
.fdnd-sortable > * {
  cursor: grab;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  user-select: none;
}

html.fdnd-active,
html.fdnd-active * {
  cursor: grabbing !important;
  user-select: none !important;
}

/* The floating preview that follows the pointer */
.fdnd-ghost {
  box-shadow: var(--fdnd-shadow);
  rotate: 1.5deg;
  scale: 1.03;
  opacity: 0.97;
  transition: rotate 0.16s, scale 0.16s, box-shadow 0.16s;
}
.fdnd-ghost-settling { rotate: 0deg; scale: 1; box-shadow: none; }

/* A sorted item's spot in the list while it is being dragged */
.fdnd-placeholder { opacity: 0.3; }
/* The gap shown when something from outside a list is dragged into it */
.fdnd-drop-placeholder {
  box-sizing: border-box;
  border: 2px dashed currentColor;
  border-radius: 8px;
  opacity: 0.35;
}
/* A plain draggable while its preview is away from it (copies leave theirs untouched) */
.fdnd-source { opacity: 0.4; }

/* An element being moved freely (e.g. a table on a canvas) */
.fdnd-moving {
  z-index: 10;
  box-shadow: var(--fdnd-shadow);
  pointer-events: none;
}

/* Drop targets: every target that accepts the current drag, then the one under the pointer */
.fdnd-can-drop { outline: 2px dashed color-mix(in srgb, var(--fdnd-accent) 30%, transparent); outline-offset: 2px; }
.fdnd-over { outline: 2px solid var(--fdnd-accent); outline-offset: 2px; }

/* An item picked up with the keyboard */
.fdnd-lifted { outline: 2px solid var(--fdnd-accent); outline-offset: 2px; box-shadow: var(--fdnd-shadow); }

@media (prefers-reduced-motion: reduce) {
  .fdnd-ghost { rotate: none; scale: none; transition: none; }
}