/* Public copy of mobile-file-upload-clean.css (synced from root) */
/* Duplicated to avoid 404s; keep source of truth in root until build step added */

.file-upload-area { border: 2px dashed #cbd5e1; border-radius: 8px; padding: 2rem; text-align: center; cursor: pointer; transition: all 0.3s ease; background:#fff; position:relative; }
.file-upload-area:hover, .file-upload-area.dragover { border-color:#3b82f6; background:#f8fafc; }
.file-upload-area.focused { border-color:#3b82f6; box-shadow:0 0 0 2px rgba(59,130,246,.2); }
.file-upload-area.upload-success { border-color:#10b981; background:#f0fdf4; }
.file-upload-area.upload-error { border-color:#dc2626; background:#fef2f2; }
.upload-content { display:block; }
.upload-content.hidden { display:none; }
.file-info { display:block; }
.file-info.hidden { display:none; }
.file-info .flex { align-items:center; justify-content:center; gap:1rem; }
.file-name { font-weight:500; color:#1f2937; }
.file-size { color:#6b7280; font-size:.75rem; }
.remove-file { color:#dc2626; padding:.25rem; border-radius:.25rem; transition:color .2s ease; background:none; border:none; cursor:pointer; }
.remove-file:hover { color:#991b1b; background:rgba(220,38,38,.1); }
.upload-error-message { margin-top:.5rem; padding:.5rem; border-radius:.375rem; background:#fef2f2; border:1px solid #fecaca; color:#dc2626; font-size:.875rem; text-align:center; }
@media (max-width:768px){ .file-upload-area{ padding:1.5rem 1rem; margin:.5rem 0;} .upload-content p{ font-size:.875rem;} .upload-content .text-lg{ font-size:1rem;} .file-info .flex{ flex-direction:column; gap:.75rem;} .file-info .flex>div{ text-align:center;} .remove-file{ padding:.5rem; min-width:44px; min-height:44px; display:flex; align-items:center; justify-content:center; } }
@media (hover:none) and (pointer:coarse){ .file-upload-area{ min-height:120px; display:flex; align-items:center; justify-content:center;} .remove-file{ min-width:48px; min-height:48px;} }
.file-upload-area:focus-within { outline:2px solid #3b82f6; outline-offset:2px; }
@media (prefers-contrast: high){ .file-upload-area{ border-width:3px;} .file-upload-area:hover, .file-upload-area.dragover{ border-width:3px;} }
@media (prefers-reduced-motion: reduce){ .file-upload-area, .remove-file{ transition:none; } }