/*
 * DSE Secure Files - editorial design (2026-10-14).
 * Matches the DSE Helpdesk and dsesecurity.com: light canvas, white cards, ink type, navy pill actions,
 * hairline borders, Inter. Loaded through httpd.bindings[].branding.web_client.extra_css on top of the
 * stock SFTPGo 2.7 (Bootstrap 5 / KeenThemes) styles. Replaces dse-secure-files-enterprise-20260821-v3.css.
 * SFTPGo's own light/dark switch is honoured: [data-bs-theme="dark"] gets the dark editorial tokens.
 */
@font-face {
    font-family: "DSE Inter";
    src: url("./fonts/inter-latin-variable.woff2") format("woff2");
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}

/* ---------- tokens ---------- */
:root, [data-bs-theme="light"] {
    --ed-ink: #17181b;
    --ed-muted: #62666e;
    --ed-soft: #72767e;
    --ed-line: #dedfe3;
    --ed-line-strong: #c9cbd0;
    --ed-canvas: #f5f5f7;
    --ed-panel: #ffffff;
    --ed-navy: #101d2e;
    --ed-navy-hover: #284566;
    --ed-link: #235f99;
    --ed-focus: #387ac0;
    --ed-ok: #1f7a4d;
    --ed-warn: #8a5a00;
    --ed-danger: #b42318;
    --ed-select: #eef3f9;
    --ed-font: "DSE Inter", Inter, system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;

    --bs-font-sans-serif: var(--ed-font);
    --bs-body-font-family: var(--ed-font);
    --bs-body-bg: var(--ed-canvas);
    --bs-body-color: var(--ed-ink);
    --bs-border-color: var(--ed-line);
    --bs-link-color: var(--ed-link);
    --bs-link-hover-color: var(--ed-navy-hover);
    --bs-primary: var(--ed-navy);
    --bs-primary-rgb: 16, 29, 46;
    --bs-primary-active: var(--ed-navy-hover);
    --bs-primary-light: #e8ecf2;
    --bs-primary-inverse: #ffffff;
    --bs-text-primary: var(--ed-navy);
    --bs-app-bg-color: var(--ed-canvas);
    --bs-app-blank-bg-color: var(--ed-canvas);
    --bs-app-header-base-bg-color: var(--ed-panel);
    --bs-app-header-base-box-shadow: none;
    --bs-app-sidebar-base-bg-color: var(--ed-panel);
    --bs-app-sidebar-base-box-shadow: none;
    --bs-app-sidebar-base-border-end: 1px solid var(--ed-line);
    --bs-app-toolbar-base-bg-color: transparent;
    --bs-app-footer-bg-color: transparent;
    --bs-card-box-shadow: none;
    --bs-card-border-color: var(--ed-line);
}
[data-bs-theme="dark"] {
    --ed-ink: #e8e8ea;
    --ed-muted: #a3a6ad;
    --ed-soft: #8b8f97;
    --ed-line: #2c2e33;
    --ed-line-strong: #3a3d43;
    --ed-canvas: #121316;
    --ed-panel: #1a1b1f;
    --ed-navy: #e8ecf2;
    --ed-navy-hover: #ffffff;
    --ed-link: #8fb8e6;
    --ed-focus: #6ea3dc;
    --ed-ok: #57c08a;
    --ed-warn: #e0b45a;
    --ed-danger: #f08679;
    --ed-select: #1f2a38;

    --bs-body-bg: var(--ed-canvas);
    --bs-body-color: var(--ed-ink);
    --bs-border-color: var(--ed-line);
    --bs-link-color: var(--ed-link);
    --bs-link-hover-color: #ffffff;
    --bs-primary: #e8ecf2;
    --bs-primary-rgb: 232, 236, 242;
    --bs-primary-active: #ffffff;
    --bs-primary-light: #222833;
    --bs-primary-inverse: #101d2e;
    --bs-text-primary: #e8ecf2;
    --bs-app-bg-color: var(--ed-canvas);
    --bs-app-blank-bg-color: var(--ed-canvas);
    --bs-app-header-base-bg-color: var(--ed-panel);
    --bs-app-sidebar-base-bg-color: var(--ed-panel);
    --bs-app-sidebar-base-border-end: 1px solid var(--ed-line);
    --bs-card-border-color: var(--ed-line);
}

/* ---------- base ---------- */
html, body {
    font-family: var(--ed-font) !important;
    background: var(--ed-canvas) !important;
    color: var(--ed-ink);
    -webkit-font-smoothing: antialiased;
}
body { font-feature-settings: "cv11", "ss01"; }
h1, h2, h3, h4, .card-title, .page-heading, .fs-2hx, .fs-1 { letter-spacing: -.02em; }
a { color: var(--ed-link); }
.text-primary, .link-primary { color: var(--ed-link) !important; }
.text-gray-900, .text-gray-800, .text-dark { color: var(--ed-ink) !important; }
.text-gray-700, .text-gray-600 { color: var(--ed-muted) !important; }
.text-gray-500, .text-gray-400, .text-muted { color: var(--ed-soft) !important; }
.bg-light, .bg-body, .bg-white { background-color: var(--ed-panel) !important; }
.separator { border-color: var(--ed-line) !important; }
:focus-visible { outline: 3px solid rgba(56, 122, 192, .45) !important; outline-offset: 2px; }
table, .table, .badge, .fs-7, [class*="text-"] { font-variant-numeric: tabular-nums; }

/* ---------- buttons ---------- */
.btn { font-family: var(--ed-font); font-weight: 600 !important; letter-spacing: 0; box-shadow: none !important; }
.btn.btn-primary, .btn-primary:not(.btn-active) {
    background: var(--ed-navy) !important; border: 1px solid var(--ed-navy) !important; color: var(--bs-primary-inverse) !important;
    border-radius: 999px !important;
}
.btn.btn-primary:hover, .btn.btn-primary:focus-visible, .btn.btn-primary:active { background: var(--ed-navy-hover) !important; border-color: var(--ed-navy-hover) !important; }
.btn.btn-primary i, .btn.btn-primary .ki-duotone, .btn.btn-primary [class*="path"] { color: inherit !important; }
.btn.btn-primary:disabled, .btn.btn-primary.disabled { opacity: .45 !important; }
.btn.btn-light, .btn.btn-light-primary, .btn.btn-secondary, .btn.btn-outline, .btn.btn-light-secondary {
    background: var(--ed-panel) !important; color: var(--ed-ink) !important; border: 1px solid var(--ed-line-strong) !important; border-radius: 999px !important;
}
.btn.btn-light:hover, .btn.btn-light-primary:hover, .btn.btn-secondary:hover, .btn.btn-outline:hover { background: var(--ed-canvas) !important; border-color: var(--ed-soft) !important; }
.btn.btn-light-primary i, .btn.btn-light i { color: var(--ed-ink) !important; }
.btn.btn-danger, .btn.btn-light-danger { background: var(--ed-panel) !important; color: var(--ed-danger) !important; border: 1px solid var(--ed-line-strong) !important; border-radius: 999px !important; }
.btn.btn-danger:hover, .btn.btn-light-danger:hover { background: #fdecea !important; }
.btn.btn-icon { border-radius: 10px !important; }
.btn.btn-icon.btn-active-light-primary:hover, .btn.btn-icon.btn-active-light-primary.active { background: var(--ed-canvas) !important; }

/* ---------- forms ---------- */
.form-control, .form-select, .form-control.form-control-solid, .form-select.form-select-solid, .select2-container--bootstrap5 .select2-selection {
    background-color: var(--ed-panel) !important; color: var(--ed-ink) !important; border: 1px solid var(--ed-line-strong) !important;
    border-radius: 12px !important; box-shadow: none !important; font-family: var(--ed-font);
}
.form-control::placeholder { color: var(--ed-soft) !important; opacity: 1; }
.form-control:focus, .form-select:focus, .form-control.form-control-solid:focus {
    border-color: var(--ed-focus) !important; box-shadow: 0 0 0 3px rgba(56, 122, 192, .18) !important;
}
.form-label, label { color: var(--ed-ink); font-weight: 600; }
.form-check-input:checked { background-color: var(--ed-navy) !important; border-color: var(--ed-navy) !important; }
.form-text { color: var(--ed-muted) !important; }

/* ---------- sign-in, share sign-in and message pages (blank layout) ---------- */
body.app-blank { background: var(--ed-canvas) !important; background-image: none !important; }
body.app-blank::before, body.app-blank::after { display: none !important; content: none !important; }
body.app-blank #app_root .w-lg-500px, body.app-blank #app_root .w-md-450px, body.app-blank #app_root .w-sm-400px {
    background: var(--ed-panel) !important; border: 1px solid var(--ed-line) !important; border-radius: 22px !important;
    padding: 36px 36px 28px !important; box-shadow: 0 1px 2px rgba(16, 29, 46, .04), 0 24px 60px rgba(16, 29, 46, .06) !important;
    margin: 32px 16px !important; max-width: calc(100vw - 32px);
}
body.app-blank #sign_in_form .container { padding: 0 !important; }
body.app-blank #sign_in_form .container .row { flex-direction: column; align-items: flex-start !important; gap: 14px; margin: 0; }
body.app-blank #sign_in_form .container .row > [class*="col-"] { width: auto; max-width: none; padding: 0; }
body.app-blank #sign_in_form .container img { height: 56px !important; width: auto; border-radius: 12px; }
body.app-blank #sign_in_form h1 {
    margin: 0 !important; font: 650 34px/1.05 var(--ed-font) !important; letter-spacing: -.035em !important; color: var(--ed-ink) !important;
}
body.app-blank #sign_in_form h1::after {
    content: "Sign in with your DSE account to send, receive and share files securely.";
    display: block; margin-top: 10px; font: 400 15px/1.5 var(--ed-font); letter-spacing: 0; color: var(--ed-muted);
}
body.app-blank #sign_in_form .form-control-lg { min-height: 52px; font-size: 16px !important; padding: 12px 16px !important; }
body.app-blank #sign_in_form .fv-row.mb-10 { margin-bottom: 18px !important; }
body.app-blank #sign_in_submit { min-height: 52px; font-size: 16px !important; }
body.app-blank #dse_turnstile_shell .rounded.border { background: var(--ed-canvas) !important; border: 1px solid var(--ed-line) !important; border-radius: 14px !important; }
body.app-blank #dse_turnstile_shell .text-muted { color: var(--ed-muted) !important; }
body.app-blank #errorMsg { background: #fdecea !important; border: 1px solid #f3c6c0 !important; border-radius: 14px !important; color: var(--ed-danger) !important; }
body.app-blank #errorMsg .text-gray-800 { color: var(--ed-danger) !important; }
body.app-blank hr { border-color: var(--ed-line) !important; opacity: 1; }
body.app-blank .d-flex.fw-semibold.text-primary a { color: var(--ed-link) !important; font-weight: 550; }
body.app-blank #app_root .w-lg-500px .card, body.app-blank #app_root .w-lg-500px .card-body { background: transparent !important; border: 0 !important; box-shadow: none !important; }
[data-bs-theme="dark"] body.app-blank #app_root .w-lg-500px { box-shadow: none !important; }

/* ---------- application shell ---------- */
#kt_app_header.app-header, .app-header {
    background: var(--ed-panel) !important; border-bottom: 1px solid var(--ed-line) !important; box-shadow: none !important; backdrop-filter: none !important;
}
#kt_app_header .btn i, #kt_app_header .ki-duotone { color: var(--ed-muted) !important; }
#kt_app_header .btn:hover i { color: var(--ed-ink) !important; }
#kt_app_sidebar.app-sidebar, .app-sidebar {
    background: var(--ed-panel) !important; border-right: 1px solid var(--ed-line) !important; box-shadow: none !important; background-image: none !important;
}
#kt_app_sidebar_header { border-bottom: 1px solid var(--ed-line) !important; background: transparent !important; }
.app-sidebar-logo img, #kt_app_sidebar_header img { max-height: 40px; width: auto; border-radius: 10px; }
.app-sidebar .menu .menu-item .menu-link {
    color: var(--ed-muted) !important; border-radius: 12px !important; margin: 2px 10px; padding: 10px 12px !important; font-weight: 550;
    background: transparent !important;
}
.app-sidebar .menu .menu-item .menu-link .menu-title { color: inherit !important; font-family: var(--ed-font); }
.app-sidebar .menu .menu-item .menu-link .menu-icon i, .app-sidebar .menu .menu-item .menu-link .menu-icon svg { color: inherit !important; stroke: currentColor; }
.app-sidebar .menu .menu-item .menu-link:hover { background: var(--ed-canvas) !important; color: var(--ed-ink) !important; }
.app-sidebar .menu .menu-item .menu-link.active { background: var(--ed-navy) !important; color: var(--bs-primary-inverse) !important; }
.app-sidebar .menu .menu-item .menu-link.active .menu-icon i, .app-sidebar .menu .menu-item .menu-link.active .menu-icon svg { color: var(--bs-primary-inverse) !important; }
.app-sidebar .menu-icon svg { width: 22px; height: 22px; fill: none; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }

/* DSE sidebar additions (webclient/base.html) */
.dse-sidebar-identity {
    display: flex; align-items: center; gap: 10px; margin: 14px 10px 6px; padding: 10px 12px;
    background: var(--ed-canvas); border: 1px solid var(--ed-line); border-radius: 14px; color: var(--ed-ink);
}
.dse-identity-icon {
    display: inline-grid; place-items: center; width: 34px; height: 34px; flex: 0 0 34px; border-radius: 10px;
    background: var(--ed-navy); color: var(--bs-primary-inverse);
}
.dse-identity-icon svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; }
.dse-identity-copy { display: flex; flex-direction: column; min-width: 0; }
.dse-identity-copy strong { font: 600 14px/1.25 var(--ed-font); color: var(--ed-ink); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dse-identity-copy small { font: 400 12px/1.3 var(--ed-font); color: var(--ed-muted); }
.dse-session-dot { width: 8px; height: 8px; margin-left: auto; border-radius: 50%; background: var(--ed-ok); box-shadow: 0 0 0 3px rgba(31, 122, 77, .15); }
.dse-sidebar-section-label { margin: 14px 22px 4px; font: 600 11px/1.3 var(--ed-font); letter-spacing: .08em; text-transform: uppercase; color: var(--ed-soft); }

/* toolbar + page heading */
#kt_app_toolbar, .app-toolbar { background: transparent !important; border: 0 !important; box-shadow: none !important; }
.page-heading, #kt_app_toolbar h1 { color: var(--ed-ink) !important; font: 650 26px/1.15 var(--ed-font) !important; letter-spacing: -.03em !important; }
.breadcrumb, .breadcrumb-item, .breadcrumb-item a { color: var(--ed-muted) !important; }
#kt_app_footer, .app-footer { background: transparent !important; border-top: 1px solid var(--ed-line) !important; color: var(--ed-muted) !important; }
#kt_app_footer a { color: var(--ed-link) !important; }

/* ---------- cards, menus, modals ---------- */
.card {
    background: var(--ed-panel) !important; border: 1px solid var(--ed-line) !important; border-radius: 18px !important;
    box-shadow: none !important; background-image: none !important;
}
.card .card-header { background: transparent !important; border-bottom: 1px solid var(--ed-line) !important; min-height: 64px; }
.card .card-header .card-title, .card .card-header h3 { color: var(--ed-ink) !important; font: 650 18px/1.3 var(--ed-font) !important; }
.card .card-footer { background: transparent !important; border-top: 1px solid var(--ed-line) !important; }
.menu-sub-dropdown, .dropdown-menu, .menu.menu-sub {
    background: var(--ed-panel) !important; border: 1px solid var(--ed-line) !important; border-radius: 14px !important;
    box-shadow: 0 18px 44px rgba(16, 29, 46, .12) !important;
}
.menu-sub-dropdown .menu-link, .dropdown-menu .dropdown-item { color: var(--ed-ink) !important; border-radius: 10px !important; }
.menu-sub-dropdown .menu-link:hover, .dropdown-menu .dropdown-item:hover { background: var(--ed-canvas) !important; color: var(--ed-ink) !important; }
.modal-content { background: var(--ed-panel) !important; border: 1px solid var(--ed-line) !important; border-radius: 20px !important; box-shadow: 0 30px 80px rgba(16, 29, 46, .22) !important; }
.modal-header { border-bottom: 1px solid var(--ed-line) !important; }
.modal-footer { border-top: 1px solid var(--ed-line) !important; }
.modal-title { color: var(--ed-ink) !important; font: 650 18px/1.3 var(--ed-font) !important; }
.modal-backdrop.show { opacity: .45; background: #101d2e; }
.alert { border-radius: 14px !important; }
.alert-warning { background: #fff4dc !important; border: 1px solid #f1d9a6 !important; color: var(--ed-warn) !important; }
.alert-danger { background: #fdecea !important; border: 1px solid #f3c6c0 !important; color: var(--ed-danger) !important; }
.alert-success, .alert-primary, .alert-info { background: var(--ed-canvas) !important; border: 1px solid var(--ed-line) !important; color: var(--ed-ink) !important; }
.badge { border-radius: 999px !important; font-weight: 600; }
.badge-light-primary, .badge-primary { background: var(--bs-primary-light) !important; color: var(--ed-navy) !important; }
.badge-light-success { background: #e6f4ec !important; color: var(--ed-ok) !important; }
.badge-light-danger { background: #fdecea !important; color: var(--ed-danger) !important; }
.badge-light-warning { background: #fff4dc !important; color: var(--ed-warn) !important; }

/* ---------- files and shares tables ---------- */
#kt_app_content input[name="search"], [data-kt-filemanager-table-filter="search"], [data-kt-shares-table-filter="search"] {
    background: var(--ed-panel) !important; border: 1px solid var(--ed-line-strong) !important; border-radius: 999px !important; padding-left: 44px !important;
}
[data-kt-filemanager-table-nav-bar="base"] { background: transparent !important; }
[data-kt-filemanager-table-nav-bar="base"] a { color: var(--ed-link) !important; font-weight: 550; }
.table { --bs-table-bg: transparent; --bs-table-color: var(--ed-ink); color: var(--ed-ink); }
.table thead th, .table thead tr, .table > thead > tr > th {
    background: var(--ed-canvas) !important; color: var(--ed-muted) !important; border-bottom: 1px solid var(--ed-line) !important;
    font: 600 12px/1.3 var(--ed-font) !important; letter-spacing: .06em; text-transform: uppercase;
}
.table thead th:first-child { border-top-left-radius: 12px; }
.table thead th:last-child { border-top-right-radius: 12px; }
.table tbody td { color: var(--ed-ink) !important; border-bottom: 1px solid var(--ed-line) !important; background: transparent !important; }
.table tbody tr:hover td { background: var(--ed-canvas) !important; }
.table tbody tr.selected td, .table tbody tr.table-active td, #file_manager_list tbody tr.selected td { background: var(--ed-select) !important; }
.table tbody td a, #file_manager_list tbody td a { color: var(--ed-ink) !important; font-weight: 550; }
.table tbody td a:hover { color: var(--ed-link) !important; }
.table .text-gray-600, .table .text-muted { color: var(--ed-muted) !important; }
.table .ki-folder, .table .ki-files, .table .ki-file { color: var(--ed-link) !important; }
.page-item.active .page-link, .dt-paging .page-item.active .page-link { background: var(--ed-navy) !important; border-color: var(--ed-navy) !important; color: var(--bs-primary-inverse) !important; border-radius: 999px !important; }
.page-link { color: var(--ed-ink) !important; border-radius: 999px !important; }
.dropzone, .dropzone-queue { background: var(--ed-canvas) !important; border: 1.5px dashed var(--ed-line-strong) !important; border-radius: 16px !important; }
.progress { background: var(--ed-line) !important; border-radius: 999px; }
.progress-bar { background: var(--ed-navy) !important; }

/* ---------- authorized-use notice (static disclaimer page) ---------- */
body.dse-legal-page { margin: 0; background: var(--ed-canvas) !important; color: var(--ed-ink); font: 400 16px/1.65 var(--ed-font); }
.dse-skip-link { position: absolute; left: -9999px; }
.dse-skip-link:focus { left: 16px; top: 16px; background: var(--ed-panel); padding: 8px 12px; border-radius: 10px; }
.dse-legal-shell {
    max-width: 760px; margin: 40px auto; padding: 36px; background: var(--ed-panel); border: 1px solid var(--ed-line); border-radius: 22px;
}
.dse-legal-header { display: flex; align-items: center; gap: 16px; padding-bottom: 18px; margin-bottom: 18px; border-bottom: 1px solid var(--ed-line); }
.dse-legal-header img { height: 52px; width: auto; border-radius: 12px; }
.dse-legal-kicker { display: block; font: 600 12px/1.3 var(--ed-font); letter-spacing: .08em; text-transform: uppercase; color: var(--ed-muted); }
.dse-legal-header h1 { margin: 4px 0 0; font: 650 32px/1.1 var(--ed-font); letter-spacing: -.03em; color: var(--ed-ink); }
.dse-legal-shell h2 { font: 650 18px/1.3 var(--ed-font); color: var(--ed-ink); margin: 24px 0 8px; }
.dse-legal-shell p, .dse-legal-shell li { color: #3a3d43; }
.dse-legal-shell a { color: var(--ed-link); }
@media (max-width: 640px) {
    .dse-legal-shell { margin: 16px; padding: 22px; }
    body.app-blank #app_root .w-lg-500px, body.app-blank #app_root .w-md-450px, body.app-blank #app_root .w-sm-400px { padding: 26px 20px 20px !important; border-radius: 18px !important; }
    body.app-blank #sign_in_form h1 { font-size: 28px !important; }
}

/* ---------- sidebar product name + Files page title ---------- */
#kt_app_sidebar .text-sidebar, .app-sidebar .text-sidebar { color: var(--ed-ink) !important; font: 650 16px/1.2 var(--ed-font) !important; letter-spacing: -.01em; }
#kt_app_sidebar_header { margin-left: 22px !important; margin-right: 22px !important; }
#kt_app_sidebar_header .app-sidebar-logo { display: flex; align-items: center; }
#kt_app_sidebar_header .app-sidebar-logo .text-sidebar { padding-left: 12px !important; }
body.app-default:has(#file_manager_list) #kt_app_header_navbar > .app-navbar-item:first-child {
    display: flex; flex-direction: column; align-items: flex-start !important; justify-content: center; gap: 2px; text-align: left;
}
body.app-default:has(#file_manager_list) #kt_app_header_navbar > .app-navbar-item:first-child::before {
    content: "Files"; font: 650 22px/1.15 var(--ed-font); letter-spacing: -.02em; color: var(--ed-ink);
}
body.app-default:has(#file_manager_list) #kt_app_header_navbar > .app-navbar-item:first-child::after {
    content: "Upload, download and share files with DSE securely"; font: 400 13px/1.3 var(--ed-font); color: var(--ed-muted);
}
@media (max-width: 991px) {
    body.app-default:has(#file_manager_list) #kt_app_header_navbar > .app-navbar-item:first-child::after { display: none; }
}