/* Dropzone Component - Design system styling */
/* Single outer border on the dropzone wrapper */

.custom-dropzone {
  border: 2px dashed var(--card-border);
  border-radius: var(--app-radius, 8px);
  background-color: var(--muted, #f8fafc);
  transition: border-color 150ms ease, background-color 150ms ease;
}

.custom-dropzone:hover {
  border-color: hsl(var(--accent-brand) / 0.5);
  background-color: hsl(var(--accent-brand) / 0.04);
}

.custom-dropzone:active {
  border-color: hsl(var(--accent-brand));
  background-color: hsl(var(--accent-brand) / 0.08);
}

/* Remove border from inner Upload div - we use outer only */
.custom-dropzone > div {
  border: none !important;
  background: transparent !important;
}

.custom-dropzone:hover > div {
  background: transparent !important;
}

.custom-dropzone:active > div {
  background: transparent !important;
}

/* Disable dropzone during processing - custom_spinner is only in DOM when loading */
.custom-dropzone:has(.buro-upload-spinner) {
  pointer-events: none !important;
  opacity: 0.7;
  cursor: not-allowed !important;
}

.custom-dropzone:has(.buro-upload-spinner) * {
  pointer-events: none !important;
}

/* No hover effect when loading */
.custom-dropzone:has(.buro-upload-spinner):hover {
  border-color: var(--card-border) !important;
  background-color: var(--muted, #f8fafc) !important;
}

.custom-dropzone:has(.buro-upload-spinner) > div:hover,
.custom-dropzone:has(.buro-upload-spinner) > div:hover > div {
  background: transparent !important;
}