/* THE ONE UPLOAD TOOL (R2, 13 Oct 2026): the look of <x-upload> (resources/views/components/upload.blade.php). Calm and plain, in
   the page's own font; colour always with words (a refusal is a sentence, never only red); light and dark; nothing wider than
   its column at 375 px; no motion beyond what the person causes. */
.hc-upload {
    --hc-up-text: #0f172a;
    --hc-up-muted: #475569;
    --hc-up-line: #cbd5e1;
    --hc-up-surface: #ffffff;
    --hc-up-soft: #f8fafc;
    --hc-up-ok: #0f766e;
    --hc-up-bad: #b91c1c;
    font-family: inherit;
    max-width: 100%;
    margin: 0 0 .25rem;
    border-radius: .5rem;
}
/* The Expert and Client pages are light; the admin panel (the document an admin adds for an Expert) follows Filament's .dark. */
.dark .hc-upload { --hc-up-text: #f1f5f9; --hc-up-muted: #cbd5e1; --hc-up-line: #475569; --hc-up-surface: #0f172a; --hc-up-soft: #1e293b; --hc-up-ok: #5eead4; --hc-up-bad: #fca5a5; }
/* A part the tool has hidden stays hidden, whatever display a rule below gives it. */
.hc-upload [hidden] { display: none !important; }
.hc-upload input[type=file] { font: inherit; max-width: 100%; box-sizing: border-box; }
.hc-upload.hc-upload-over { outline: 2px dashed var(--hc-up-ok); outline-offset: 4px; }
.hc-upload-chosen { list-style: none; margin: .35rem 0 0; padding: 0; color: var(--hc-up-text); font-size: .9rem; word-break: break-word; }
.hc-upload-chosen li { padding: .15rem 0; }
.hc-upload-chosen li[data-refused] { color: var(--hc-up-bad); }
.hc-upload-note { margin: .3rem 0 0; color: var(--hc-up-ok); font-size: .875rem; }
.hc-upload-message { margin: .35rem 0 0; color: var(--hc-up-bad); font-size: .9rem; font-weight: 600; }
.hc-upload-actions { display: flex; flex-wrap: wrap; gap: .5rem; margin: .45rem 0 0; }
.hc-upload-button {
    font: inherit; font-size: .9rem; min-height: 2.75rem; padding: .45rem .9rem; border-radius: .5rem; cursor: pointer;
    border: 1px solid var(--hc-up-line); background: var(--hc-up-surface); color: var(--hc-up-text);
}
.hc-upload-button:focus-visible, .hc-upload canvas:focus-visible { outline: 2px solid var(--hc-up-ok); outline-offset: 2px; }
.hc-upload-primary { background: var(--hc-up-ok); border-color: var(--hc-up-ok); color: #fff; font-weight: 600; }
.hc-upload-editor { margin: .6rem 0 0; padding: .75rem; border: 1px solid var(--hc-up-line); border-radius: .75rem; background: var(--hc-up-soft); }
.hc-upload-hint { margin: 0 0 .5rem; color: var(--hc-up-muted); font-size: .875rem; }
.hc-upload-stage { width: 100%; display: flex; justify-content: center; }
.hc-upload-stage canvas { display: block; max-width: 100%; touch-action: none; cursor: move; border-radius: .35rem; }
.hc-upload-tools, .hc-upload-finish { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem .9rem; margin: .6rem 0 0; }
.hc-upload-range { display: flex; flex-direction: column; gap: .2rem; color: var(--hc-up-text); font-size: .875rem; min-width: 8rem; flex: 1 1 8rem; }
.hc-upload-range input[type=range] { width: 100%; min-height: 2rem; }
@media (max-width: 480px) {
    .hc-upload-finish .hc-upload-button { flex: 1 1 100%; }
}