/* =====================================================================
   Account modals / popups - modern redesign (2026-06-19)
   Separate stylesheet for EVERY popup in the member area:
   filter/search, add-edit folder, edit file, share, stats, file links,
   download zip, file details, general confirm + the upload window.
   Loaded only in the account layout, so plain .modal selectors are safe.
   ===================================================================== */

:root {
    --m-accent:     #1299f0;
    --m-accent-d:   #0d6efd;
    --m-accent-deep:#0a4fb4;
    --m-green:      #16c47f;
    --m-danger:     #ef4d4d;
    --m-ink:        #1d2733;
    --m-grey:       #6b7a8d;
    --m-light:      #f4f8fd;
    --m-border:     #e3eaf2;
    --m-radius:     16px;
}

/* ---------- backdrop ---------- */
.modal-backdrop.in { opacity: .55; }

/* ---------- dialog + container ---------- */
.modal.custom-width .modal-dialog {
    width: auto;
    max-width: 720px;
    margin: 34px auto;
    padding: 0 14px;
}
.modal.stats-modal .modal-dialog,
/* file-details modal sizing handled in file-details-redesign.css */
.modal.general-modal .modal-dialog,
.modal.download-folder-modal .modal-dialog { max-width: 560px; }

.modal-content {
    border: 0;
    border-radius: var(--m-radius);
    box-shadow: 0 24px 64px rgba(16, 42, 73, .28);
    overflow: hidden;
}

/* ---------- header ---------- */
.modal .modal-header {
    position: relative;
    padding: 18px 24px;
    border-bottom: 1px solid var(--m-border);
    background: #fff;
}
.modal .modal-header h4,
.modal .modal-title {
    font-size: 18px;
    font-weight: 700;
    color: var(--m-ink);
    line-height: 1.35;
    margin: 0;
    padding-right: 36px;
}

/* modern circular close button (applies to header + standalone .close) */
.modal .close,
.modal .modal-header .close {
    position: absolute;
    top: 14px;
    right: 16px;
    width: 32px;
    height: 32px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #f0f3f7;
    color: #8a97a6;
    font-size: 20px;
    font-weight: 400;
    line-height: 32px;
    text-align: center;
    opacity: 1;
    text-shadow: none;
    transition: background .15s ease, color .15s ease, transform .05s ease;
}
.modal .close:hover,
.modal .modal-header .close:hover {
    background: #fdecec;
    color: var(--m-danger);
    opacity: 1;
}
.modal .close:active { transform: scale(.92); }

/* ---------- body ---------- */
.modal .modal-body {
    padding: 22px 24px;
    color: var(--m-ink);
}
.modal .modal-body .modal-icon-left {
    text-align: center;
    padding: 8px;
}
.modal .modal-body .modal-icon-left img {
    max-width: 96px;
    max-height: 96px;
    opacity: .9;
}

/* ---------- footer ---------- */
.modal .modal-footer {
    padding: 14px 22px;
    border-top: 1px solid var(--m-border);
    background: #fbfcfe;
}

/* ---------- form controls inside modals ---------- */
.modal .control-label {
    font-weight: 600;
    font-size: 13px;
    color: var(--m-ink);
    margin-bottom: 5px;
}
.modal .form-group { margin-bottom: 16px; }
.modal .form-control {
    height: auto;
    border: 1.5px solid var(--m-border);
    border-radius: 10px;
    padding: 9px 12px;
    font-size: 14px;
    color: var(--m-ink);
    box-shadow: none;
    transition: border-color .15s ease, box-shadow .15s ease;
}
.modal .form-control:focus {
    border-color: var(--m-accent);
    box-shadow: 0 0 0 3px rgba(18, 153, 240, .14);
    outline: none;
}
.modal textarea.form-control { min-height: 84px; resize: vertical; }
.modal select.form-control {
    appearance: none;
    -webkit-appearance: none;
    background-image: url("data:image/svg+xml;charset=US-ASCII,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20width%3D'14'%20height%3D'14'%20viewBox%3D'0%200%2024%2024'%20fill%3D'%236b7a8d'%3E%3Cpath%20d%3D'M7%2010l5%205%205-5z'%2F%3E%3C%2Fsvg%3E");
    background-repeat: no-repeat;
    background-position: right 12px center;
    padding-right: 32px;
}

/* input groups (filename + extension, sharing url + copy btn) */
.modal .input-group-addon {
    background: var(--m-light);
    border: 1.5px solid var(--m-border);
    color: var(--m-grey);
    border-radius: 0 10px 10px 0;
    font-size: 13px;
}
.modal .input-group .form-control:first-child { border-radius: 10px 0 0 10px; }
.modal .input-group-btn .btn {
    border-radius: 0 10px 10px 0;
    padding: 9px 14px;
}
.modal .inline-checkbox { padding-top: 8px; }

/* ---------- buttons inside modals (footer + body) ---------- */
.modal .modal-footer .btn,
.modal .modal-body .btn:not(.input-group-btn .btn) {
    border-radius: 10px;
    font-weight: 600;
    font-size: 14px;
    padding: 9px 18px;
    border: 0;
    box-shadow: none;
    transition: background .15s ease, color .15s ease, transform .04s ease;
}
.modal .modal-footer .btn:active { transform: translateY(1px); }
.modal .btn-info,
.modal .btn-primary {
    background: var(--m-accent);
    color: #fff;
}
.modal .btn-info:hover,
.modal .btn-primary:hover {
    background: var(--m-accent-deep);
    color: #fff;
}
.modal .btn-success, .modal .btn-green {
    background: var(--m-green);
    color: #fff;
}
.modal .btn-success:hover, .modal .btn-green:hover { background: #12a86c; color: #fff; }
.modal .btn-danger { background: var(--m-danger); color: #fff; }
.modal .btn-danger:hover { background: #d63a3a; color: #fff; }
.modal .modal-footer .btn-default,
.modal .btn-default {
    background: #eef2f7;
    color: var(--m-ink);
}
.modal .modal-footer .btn-default:hover,
.modal .btn-default:hover { background: #e0e7ef; color: var(--m-ink); }

/* ---------- specific popups ---------- */
/* file links / urls */
.modal .link-section {
    background: var(--m-light);
    border: 1px solid var(--m-border);
    border-radius: 10px;
    padding: 12px 14px;
    font-size: 13px;
    word-wrap: break-word;
    cursor: pointer;
}
/* stats */
.modal.stats-modal .chartWrapper { text-align: center; }
/* file details table */
/* tags input */
.modal .tagsinput {
    border: 1.5px solid var(--m-border) !important;
    border-radius: 10px !important;
}

/* ---------- responsive ---------- */
@media (max-width: 640px) {
    .modal.custom-width .modal-dialog { margin: 14px auto; padding: 0 10px; }
    .modal .modal-header, .modal .modal-body, .modal .modal-footer { padding-left: 16px; padding-right: 16px; }
    .modal .modal-body .modal-icon-left { display: none; }
}


/* =====================================================================
   UPLOAD WINDOW  -  comprehensive modern redesign
   Scoped with the #fileUploadWrapper id so it reliably overrides the
   legacy upload rules in file-upload.css (id beats any class chain).
   ===================================================================== */

/* dialog sizing */
#fileUploadWrapper .modal-dialog { max-width: 640px; width: auto; margin: 34px auto; padding: 0 14px; }
#fileUploadWrapper .modal-content { padding: 0; }

/* neutralise the legacy boxes / borders that bleed in from file-upload.css */
#fileUploadWrapper .tab-content,
#fileUploadWrapper .tab-content .tab-pane,
#fileUploadWrapper .fileUploadMain,
#fileUploadWrapper .urlUploadMain,
#fileUploadWrapper .fileupload-content,
#fileUploadWrapper .uploader-container,
#fileUploadWrapper #uploader,
#fileUploadWrapper #uploaderContainer,
#fileUploadWrapper form,
#fileUploadWrapper .fileSection,
#fileUploadWrapper .urlFileUploaderWrapper {
    border: 0 !important;
    background: none !important;
    padding: 0;
    margin: 0;
    width: auto;
    float: none;
    box-shadow: none;
}
#fileUploadWrapper .nav-tabs.bordered + .tab-content { border: 0; padding: 0; margin: 0; }

/* container card */
#fileUploadWrapper .upload-modal-modern {
    position: relative;
    background: #fff;
    border-radius: 16px;
    padding: 26px 28px 28px;
    max-width: 100%;
    margin: 0;
    font-family: "Open Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    color: var(--m-ink);
}
#fileUploadWrapper .upload-modal-modern * { box-sizing: border-box; }

/* close button */
#fileUploadWrapper .close {
    position: absolute;
    top: 16px;
    right: 18px;
    width: 34px;
    height: 34px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #f0f3f7;
    color: #8a97a6;
    font-size: 20px;
    line-height: 34px;
    text-align: center;
    opacity: 1;
    text-shadow: none;
    cursor: pointer;
    z-index: 6;
    transition: background .15s, color .15s;
}
#fileUploadWrapper .close:hover { background: #fdecec; color: var(--m-danger); opacity: 1; }

/* tabs - segmented pills */
#fileUploadWrapper .nav-tabs {
    border: 0;
    display: flex;
    gap: 8px;
    margin: 2px 0 22px;
    padding: 0;
    text-align: left;
}
#fileUploadWrapper .nav-tabs > li { float: none; display: inline-block; margin: 0; }
#fileUploadWrapper .nav-tabs > li > a {
    border: 0 !important;
    border-radius: 30px;
    padding: 9px 20px;
    margin: 0;
    color: var(--m-grey);
    font-weight: 600;
    font-size: 14px;
    background: #f1f5fa;
    line-height: 1.4;
    transition: all .15s;
}
#fileUploadWrapper .nav-tabs > li > a:hover { background: #e6f1fe; color: var(--m-accent-d); border: 0 !important; }
#fileUploadWrapper .nav-tabs > li.active > a,
#fileUploadWrapper .nav-tabs > li.active > a:hover,
#fileUploadWrapper .nav-tabs > li.active > a:focus {
    background: var(--m-accent) !important;
    color: #fff !important;
    border: 0 !important;
    box-shadow: 0 5px 14px rgba(18, 153, 240, .34);
}

/* dropzone */
#fileUploadWrapper .initialUploadSection {
    border: 2px dashed #bcd6f3 !important;
    border-radius: 16px;
    background: radial-gradient(120% 120% at 50% 0%, #f3f9ff 0%, #eaf3ff 100%) !important;
    padding: 40px 24px 34px !important;
    text-align: center;
    cursor: pointer;
    transition: border-color .18s, background .18s, box-shadow .18s;
}
#fileUploadWrapper .initialUploadSection:hover {
    border-color: var(--m-accent) !important;
    background: #e6f1ff !important;
    box-shadow: inset 0 0 0 100px rgba(18,153,240,.03);
}
#fileUploadWrapper #initialUploadSectionLabel { display: block; width: 100%; margin: 0; font-weight: 400; cursor: pointer; }

/* reset legacy uppercase / grey / oversize on the inner text wrappers */
#fileUploadWrapper .initialUploadSection .initialUploadText,
#fileUploadWrapper .initialUploadSection .uploadElement,
#fileUploadWrapper .initialUploadSection .internal {
    font-size: inherit;
    color: inherit;
    text-transform: none !important;
    font-weight: 400;
    padding: 0;
    width: auto;
    float: none;
}

/* cloud icon - circular gradient badge */
#fileUploadWrapper .upload-icon-badge {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 92px;
    height: 92px;
    border-radius: 50%;
    margin-bottom: 18px;
    background: linear-gradient(135deg, #38b0ff, #0d6efd);
    box-shadow: 0 12px 26px rgba(18, 153, 240, .38);
    transition: transform .18s ease, box-shadow .18s ease;
}
#fileUploadWrapper .initialUploadSection:hover .upload-icon-badge {
    transform: translateY(-4px) scale(1.03);
    box-shadow: 0 16px 32px rgba(18, 153, 240, .45);
}
#fileUploadWrapper .upload-fa-icon,
#fileUploadWrapper .initialUploadSection .internal i.upload-fa-icon {
    font-size: 42px !important;
    color: #fff !important;
    margin: 0 !important;
    display: inline-block;
    clear: none;
    line-height: 1;
}
#fileUploadWrapper .upload-icon-badge:has(.upload-fa-icon-disabled) { background: #d7dde5; box-shadow: none; }
#fileUploadWrapper .upload-headline { font-size: 21px; font-weight: 800; color: var(--m-ink); line-height: 1.4; letter-spacing: -.2px; }
#fileUploadWrapper .upload-subline { font-size: 13px; color: var(--m-grey); margin-top: 7px; line-height: 1.5; }

/* prominent browse-files call-to-action */
#fileUploadWrapper .up-browse-btn {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    margin-top: 20px;
    padding: 11px 26px;
    border-radius: 30px;
    background: var(--m-accent);
    color: #fff;
    font-weight: 700;
    font-size: 14px;
    cursor: pointer;
    box-shadow: 0 6px 16px rgba(18, 153, 240, .32);
    transition: background .15s ease, transform .05s ease, box-shadow .15s ease;
}
#fileUploadWrapper .up-browse-btn:hover { background: var(--m-accent-deep); box-shadow: 0 8px 20px rgba(18, 153, 240, .4); }
#fileUploadWrapper .up-browse-btn:active { transform: translateY(1px); }
#fileUploadWrapper .up-browse-btn i { font-size: 14px; }

/* footer text under dropzone */
#fileUploadWrapper .uploadFooter { margin-top: 18px; }
#fileUploadWrapper .baseText { font-size: 12.5px; color: var(--m-grey); text-align: center; }
#fileUploadWrapper .baseText .showAdditionalOptionsLink { color: var(--m-accent-d); font-weight: 600; cursor: pointer; text-decoration: none; }
#fileUploadWrapper .baseText .showAdditionalOptionsLink:hover { text-decoration: underline; }
#fileUploadWrapper .dot-sep { margin: 0 8px; color: #cfd8e3; }

/* buttons */
#fileUploadWrapper .upload-modal-modern .btn,
#fileUploadWrapper .btn-green,
#fileUploadWrapper #transferFilesButton {
    border-radius: 30px !important;
    font-weight: 700;
    font-size: 14px;
    padding: 11px 24px;
    border: 0 !important;
    box-shadow: none;
    transition: all .15s;
}
#fileUploadWrapper .btn-lg { padding: 12px 30px; font-size: 15px; }
#fileUploadWrapper .btn-green,
#fileUploadWrapper #transferFilesButton { background: var(--m-green) !important; color: #fff !important; }
#fileUploadWrapper .btn-green:hover,
#fileUploadWrapper #transferFilesButton:hover { background: #12a86c !important; color: #fff !important; }
#fileUploadWrapper .btn-info { background: var(--m-accent) !important; color: #fff !important; }
#fileUploadWrapper .btn-info:hover { background: var(--m-accent-deep) !important; color: #fff !important; }
#fileUploadWrapper .btn-default { background: #eef2f7 !important; color: var(--m-ink) !important; }
#fileUploadWrapper .btn-default:hover { background: #e0e7ef !important; }
#fileUploadWrapper .upload-button { text-align: center; margin: 18px 0 8px; }

/* ---- upload file tiles: clean list rows (Drive/Dropbox style) ---- */
#fileUploadWrapper .fileListingWrapper { padding-top: 6px; }
#fileUploadWrapper .files { display: flex; flex-direction: column; gap: 10px; width: 100%; }
#fileUploadWrapper .up-tile {
    display: block !important; width: 100% !important; margin: 0 !important; padding: 0 !important;
    border: 1px solid var(--m-border) !important; border-radius: 12px !important; background: #fff !important;
    box-shadow: 0 1px 3px rgba(16, 42, 73, .05); overflow: hidden; text-align: left;
}
#fileUploadWrapper .up-tile__row { display: flex !important; align-items: center; gap: 12px; padding: 11px 14px; width: auto !important; }
#fileUploadWrapper .up-tile__icon {
    flex: 0 0 auto; width: 44px; height: 44px; border-radius: 9px; padding: 0 !important; margin: 0 !important;
    background: #eaf2fe url("data:image/svg+xml;charset=UTF-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24' fill='none' stroke='%231299f0' stroke-width='1.8' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M14 2H6a2 2 0 0 0-2 2v16a2 2 0 0 0 2 2h12a2 2 0 0 0 2-2V8z'/%3E%3Cpolyline points='14 2 14 8 20 8'/%3E%3C/svg%3E") center center no-repeat;
    overflow: hidden; text-align: center;
}
#fileUploadWrapper .up-tile__icon img { width: 44px; height: 44px; object-fit: cover; border-radius: 9px; display: block; }
#fileUploadWrapper .up-tile__icon .fade { display: none; }
#fileUploadWrapper .up-tile__info { flex: 1 1 auto; min-width: 0; }
#fileUploadWrapper .up-tile__name {
    font-size: 13px; font-weight: 600; color: var(--m-ink); text-align: left !important;
    white-space: nowrap; overflow: hidden; text-overflow: ellipsis; padding: 0 !important; margin: 0; width: auto !important; display: block;
}
#fileUploadWrapper .up-tile__sub { font-size: 12px; color: var(--m-grey); margin-top: 1px; }
#fileUploadWrapper .up-tile__prog { display: flex; align-items: center; gap: 8px; margin-top: 7px; }
#fileUploadWrapper .up-tile__prog .progress { flex: 1 1 auto; height: 7px; margin: 0; background: #e9eef5; border-radius: 20px; box-shadow: none; }
#fileUploadWrapper .up-tile__prog .progress.hidden { display: none; }
#fileUploadWrapper .up-tile__prog .progress-bar { background: linear-gradient(90deg, var(--m-accent), var(--m-accent-d)); border-radius: 20px; height: 100%; }
#fileUploadWrapper .up-tile__prog .progressText { flex: 0 0 auto; font-size: 11px; font-weight: 700; color: var(--m-accent); min-width: 34px; text-align: right; }
#fileUploadWrapper .up-tile__prog .progressText.hidden { display: none; }
#fileUploadWrapper .up-tile__x {
    flex: 0 0 auto; position: static !important; float: none !important; width: 28px; height: 28px;
    border-radius: 50%; background: #f0f3f7; display: inline-flex; align-items: center; justify-content: center; transition: background .15s;
}
#fileUploadWrapper .up-tile__x:hover { background: #fdecec; }
#fileUploadWrapper .up-tile__x a { position: static !important; width: auto !important; height: auto !important; display: inline-flex; }
#fileUploadWrapper .up-tile__x a img { position: static !important; top: auto !important; right: auto !important; }
#fileUploadWrapper .up-tile__err { color: var(--m-danger); font-size: 12px; font-weight: 600; margin-top: 2px; }
#fileUploadWrapper .up-tile--error { border-color: #f3c7c4 !important; background: #fdf2f1 !important; }
#fileUploadWrapper .up-tile--error .up-tile__icon { background-color: #fbe3e1; }
#fileUploadWrapper .up-tile .start { display: none !important; }

/* add-more row */
#fileUploadWrapper #addFileRow { width: 100%; margin-top: 10px; }
#fileUploadWrapper #addFileRow .template-upload {
    display: flex !important; align-items: center; justify-content: center; gap: 8px;
    width: 100% !important; padding: 13px !important; border: 2px dashed #c4d6ea !important;
    border-radius: 12px !important; background: #f7faff !important; color: var(--m-accent); cursor: pointer;
    font-weight: 600; font-size: 13px; box-shadow: none;
}
#fileUploadWrapper #addFileRow .template-upload:hover { border-color: var(--m-accent) !important; background: #eef5ff !important; }
#fileUploadWrapper #addFileRow .template-upload,
#fileUploadWrapper #addFileRow .template-upload a {
    font-size: 14px !important; line-height: 1.4 !important; font-weight: 600 !important;
    color: var(--m-accent) !important; text-transform: none !important; text-decoration: none;
}
#fileUploadWrapper #addFileRow .glyphicon-plus { font-size: 15px !important; }

/* progress */
#fileUploadWrapper .progress { background: #e9eef5; border-radius: 30px; height: 14px; box-shadow: none; overflow: hidden; }
#fileUploadWrapper .progress-bar { background: linear-gradient(90deg, var(--m-accent), var(--m-accent-d)); border-radius: 30px; }
#fileUploadWrapper .globalProgressWrapper { margin: 18px 0; }

/* completed / success state */
#fileUploadWrapper #completedSection { text-align: center; padding: 18px 6px 8px; }
#fileUploadWrapper .upload-done { display: flex; flex-direction: column; align-items: center; gap: 12px; margin-bottom: 6px; }
#fileUploadWrapper .upload-done__badge {
    display: inline-flex; align-items: center; justify-content: center;
    width: 72px; height: 72px; border-radius: 50%;
    background: linear-gradient(135deg, #2fd98a, #16c47f); color: #fff; font-size: 32px;
    box-shadow: 0 12px 26px rgba(22, 196, 127, .4);
}
#fileUploadWrapper .upload-done__title { font-size: 21px; font-weight: 800; color: var(--m-ink); letter-spacing: -.2px; }
#fileUploadWrapper .completed-text { font-size: 13.5px; color: var(--m-grey); text-align: center; margin: 2px auto 18px; max-width: 420px; line-height: 1.6; }
#fileUploadWrapper .completed-text a { color: var(--m-accent-d); font-weight: 600; }
#fileUploadWrapper .upload-complete-btns { text-align: center; display: flex; gap: 10px; justify-content: center; flex-wrap: wrap; margin-top: 8px; }

/* url upload */
#fileUploadWrapper .url-intro { font-size: 14px; color: var(--m-grey); margin-bottom: 14px; line-height: 1.6; text-align: center; }
#fileUploadWrapper .urlList { width: 100%; min-height: 130px; border: 1.5px solid var(--m-border) !important; border-radius: 12px; padding: 14px; font-size: 14px; resize: vertical; transition: border-color .2s; }
#fileUploadWrapper .urlList:focus { border-color: var(--m-accent) !important; outline: none; box-shadow: 0 0 0 3px rgba(18, 153, 240, .14); }
#fileUploadWrapper .urlUploadFooter { margin-top: 14px; }

/* additional options cards */
#fileUploadWrapper .additional-options-wrapper { padding-top: 4px; }
#fileUploadWrapper .additional-options-wrapper .options-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px; margin: 6px 0 18px; }
#fileUploadWrapper .additional-options-wrapper .option-card { background: var(--m-light); border: 1px solid var(--m-border) !important; border-radius: 12px !important; padding: 16px; box-shadow: none !important; }
#fileUploadWrapper .additional-options-wrapper .option-card-title { font-weight: 700; font-size: 14px; margin-bottom: 6px; color: var(--m-ink); }
#fileUploadWrapper .additional-options-wrapper .option-card-desc { font-size: 12px; color: var(--m-grey); line-height: 1.5; margin-bottom: 10px; }
#fileUploadWrapper .additional-options-wrapper .form-control { border: 1.5px solid var(--m-border) !important; border-radius: 10px !important; padding: 9px 12px; font-size: 13px; width: 100%; box-shadow: none !important; }
#fileUploadWrapper .additional-options-wrapper .form-control:focus { border-color: var(--m-accent) !important; outline: none; box-shadow: 0 0 0 3px rgba(18, 153, 240, .14) !important; }
#fileUploadWrapper .additional-options-wrapper .options-footer { display: flex; gap: 10px; justify-content: flex-end; }

/* upload window - mobile / phone */
@media (max-width: 600px) {
    /* fit the dialog to the screen - compact auto-height card (not full-screen) */
    #fileUploadWrapper { padding: 0 !important; }
    #fileUploadWrapper .modal-dialog {
        width: auto !important; max-width: 100% !important;
        margin: 16px !important; padding: 0 !important;
        min-height: 0 !important; height: auto !important;
    }
    #fileUploadWrapper .modal-content {
        max-width: 100% !important;
        min-height: 0 !important; height: auto !important;
        border-radius: 16px !important;
    }
    #fileUploadWrapper .upload-modal-modern { padding: 16px 14px 20px !important; max-width: 100% !important; overflow: hidden; }
    #fileUploadWrapper .upload-modal-modern * { max-width: 100%; }

    /* tabs: centered pills that wrap, clear of the close button */
    #fileUploadWrapper .nav-tabs { flex-wrap: wrap; justify-content: center; gap: 6px; margin: 2px 0 16px; padding-right: 38px; }
    #fileUploadWrapper .nav-tabs > li > a { padding: 8px 16px; font-size: 13px; }

    /* dropzone */
    #fileUploadWrapper .initialUploadSection { padding: 28px 12px 22px !important; }
    #fileUploadWrapper .upload-icon-badge { width: 72px; height: 72px; margin-bottom: 14px; }
    #fileUploadWrapper .upload-fa-icon { font-size: 32px !important; }
    #fileUploadWrapper .upload-headline { font-size: 17px !important; line-height: 1.35; }
    #fileUploadWrapper .upload-subline { font-size: 12px; margin-top: 6px; }
    #fileUploadWrapper .up-browse-btn { margin-top: 16px; padding: 11px 22px; }

    /* footer meta wraps instead of overflowing */
    #fileUploadWrapper .baseText { white-space: normal !important; line-height: 1.9; word-wrap: break-word; }
    #fileUploadWrapper .dot-sep { margin: 0 6px; }

    /* options cards stack + full-width actions */
    #fileUploadWrapper .additional-options-wrapper .options-grid { grid-template-columns: 1fr; gap: 12px; }
    #fileUploadWrapper .additional-options-wrapper .options-footer { flex-direction: column-reverse; }
    #fileUploadWrapper .additional-options-wrapper .options-footer .btn { width: 100%; }
    #fileUploadWrapper .upload-complete-btns .btn { width: 100%; }
    #fileUploadWrapper .upload-button .btn { width: 100%; }
}


/* =====================================================================
   FILE DETAILS  -  "open file in account" view
   Moved out: now fully handled by asset/styles/file-details-redesign.css
   (paired with the rewritten file_details.html.twig markup).
   ===================================================================== */