/* Minimal, safe styles for the uploader */
/* Minimal, safe styles for the uploader */
.vp-upload-wrap { margin: 14px 0; }
.vp-upload-label { display: block; font-weight: 600; margin-bottom: 6px; }
.vp-upload-input { display: none; }
.vp-upload-help { display: block; color: #555; margin-top: 6px; }
.vp-upload-preview img { display:inline-block; vertical-align:middle; border:1px solid #e5e7eb; padding:2px; border-radius:6px; }
.vp-upload-preview .vp-remove-upload { vertical-align:middle; margin-left:8px; }

/* Drag & Drop zone */
.vp-dropzone {
  --accent: var(--vp-accent, var(--primary, #2271b1));
  display: flex; align-items: center; justify-content: center; flex-direction: column;
  min-height: 140px; padding: 16px; border: 2px dashed color-mix(in srgb, var(--accent) 65%, transparent);
  border-radius: 10px; background: color-mix(in srgb, var(--accent) 6%, #fff);
  cursor: pointer; transition: background .15s ease, border-color .15s ease, transform .08s ease;
}
.vp-dropzone:hover { background: color-mix(in srgb, var(--accent) 10%, #fff); }
.vp-dropzone.is-dragover { border-color: var(--accent); background: color-mix(in srgb, var(--accent) 16%, #fff); transform: scale(1.01); }
.vp-drop-hint { color: color-mix(in srgb, var(--accent) 85%, #222); font-size: .95rem; opacity: .9; text-align: center; }

/* Progress bar */
.vp-progress { position: relative; width: 100%; max-width: 360px; height: 10px; border-radius: 999px; background: #eef2f7; margin-top: 10px; overflow: hidden; }
.vp-progress-bar { position: absolute; left: 0; top: 0; height: 100%; width: 0%; background: var(--accent); transition: width .15s ease; }
.vp-progress-text { margin-top: 6px; font-size: .85rem; color: #333; text-align: center; }
.vp-file-meta { font-size: .9rem; color: #333; }

/* Drag & Drop */
.vp-dropzone { position: relative; transition: background 120ms ease, outline-color 120ms ease; }
.vp-dropzone.is-dragover { outline: 2px dashed var(--vp-accent, #2271b1); outline-offset: 4px; background: color-mix(in srgb, var(--vp-accent, #2271b1) 8%, #fff); }
