/* Glassphere — palette Briglass Gestion. Shared by all screen layouts. */
:root,
[data-theme="light"] {
    color-scheme: dark;
    --background: #07131f;
    --night: #06111b;
    --panel: rgba(10, 25, 38, .96);
    --panel-strong: rgba(12, 31, 48, .99);
    --panel-soft: rgba(255, 255, 255, .075);
    --border: rgba(155, 214, 255, .18);
    --border-strong: rgba(102, 191, 255, .36);
    --primary: #27a8ff;
    --cyan: #6bd8ff;
    --ice: #eef9ff;
    --text: #eaf7ff;
    --text-muted: #94afc2;
    --success: #66ff5c;
    --warning: #ffb000;
    --error: #ef4444;
    --danger: var(--error);
    /* Mission workflow badges use distinct colors for each informational step. */
    --status-published: var(--cyan);
    --status-technician-assignment: #b59aff;
    --status-glass-ordered: #ffa080;
    --status-client-info-sent: #ff9fbe;
    --status-glass-received: #5de2d3;
    --chat-role-garage: var(--cyan);
    --chat-role-technician: var(--success);
    --chat-role-platform: #b59aff;
    --theme-shadow: 0 24px 70px rgba(0, 0, 0, .34);
    --theme-glow: 0 0 28px rgba(39, 168, 255, .22);
    --surface-gradient: linear-gradient(135deg, rgba(18, 42, 62, .98), rgba(7, 17, 28, .96));
    --navbar-background: var(--surface-gradient);
    --primary-gradient: linear-gradient(135deg, var(--primary), var(--cyan));
    --sidebar-gradient: linear-gradient(180deg, rgba(15, 40, 59, .99), var(--night) 70%);
    --sidebar-width: 260px;
    --content-width: 1280px;
    --border-radius: 18px;
    /* Navigation accents are independent from success, warning and error states. */
    --nav-blue: #69baff;
    --nav-violet: #b59aff;
    --nav-amber: #ffce70;
    --nav-sky: #8acbff;
    --nav-mint: #82e5ad;
    --nav-lilac: #d9b6ff;
    --nav-gold: #ffdf7d;
    --nav-teal: #5de2d3;
    --nav-rose: #ff9fbe;
    --nav-coral: #ffa080;
    --nav-periwinkle: #a5b4fc;
    --nav-lime: #c9e985;
    --input-muted: color-mix(in srgb, var(--night) 70%, var(--ice));
    --error-text: color-mix(in srgb, var(--error) 65%, var(--ice));

    /* Compatibility aliases for the existing glass components. */
    --emerald: var(--night);
    --emerald-light: var(--primary);
    --gold: var(--primary);
    --gold-light: var(--cyan);
    --amber: var(--cyan);
    --cream: var(--ice);
    --coral: var(--cyan);
    --slate: var(--panel-strong);
    --glass-bg: var(--panel);
    --glass-border: var(--border);
    --glass-shadow: rgba(0, 0, 0, .34);
    --glass-hover: var(--panel-soft);
    --bg-dark: var(--background);
    --bg-gradient-1: var(--background);
    --bg-gradient-2: var(--background);
    --bg-gradient-3: var(--night);
    --text-primary: var(--text);
    --text-secondary: var(--text-muted);
    --info: var(--cyan);

    /* Bootstrap 5.3 semantic colors; each state retains its own foreground. */
    --bs-body-bg: var(--background);
    --bs-body-color: var(--text);
    --bs-body-color-rgb: 234, 247, 255;
    --bs-body-bg-rgb: 7, 19, 31;
    --bs-emphasis-color: var(--text);
    --bs-emphasis-color-rgb: 234, 247, 255;
    --bs-secondary-color: var(--text-muted);
    --bs-secondary-bg: var(--panel-strong);
    --bs-tertiary-bg: var(--panel-soft);
    --bs-border-color: var(--border);
    --bs-border-color-translucent: var(--border);
    --bs-primary: var(--primary);
    --bs-primary-rgb: 39, 168, 255;
    --bs-info: var(--cyan);
    --bs-info-rgb: 107, 216, 255;
    --bs-success: var(--success);
    --bs-success-rgb: 102, 255, 92;
    --bs-warning: var(--warning);
    --bs-warning-rgb: 255, 176, 0;
    --bs-danger: var(--error);
    --bs-danger-rgb: 239, 68, 68;
    --bs-link-color: var(--cyan);
    --bs-link-hover-color: var(--ice);
    --bs-link-color-rgb: 107, 216, 255;
    --bs-link-hover-color-rgb: 238, 249, 255;
    --bs-primary-text-emphasis: var(--cyan);
    --bs-info-text-emphasis: var(--cyan);
    --bs-success-text-emphasis: var(--success);
    --bs-warning-text-emphasis: var(--warning);
    --bs-danger-text-emphasis: var(--error-text);
    --bs-secondary-text-emphasis: var(--text-muted);
    --bs-primary-bg-subtle: color-mix(in srgb, var(--primary) 12%, var(--night));
    --bs-info-bg-subtle: color-mix(in srgb, var(--cyan) 12%, var(--night));
    --bs-success-bg-subtle: color-mix(in srgb, var(--success) 10%, var(--night));
    --bs-warning-bg-subtle: color-mix(in srgb, var(--warning) 10%, var(--night));
    --bs-danger-bg-subtle: color-mix(in srgb, var(--error) 10%, var(--night));
    --bs-secondary-bg-subtle: var(--panel-strong);
    --bs-primary-border-subtle: var(--border-strong);
    --bs-info-border-subtle: var(--border-strong);
    --bs-success-border-subtle: color-mix(in srgb, var(--success) 36%, transparent);
    --bs-warning-border-subtle: color-mix(in srgb, var(--warning) 36%, transparent);
    --bs-danger-border-subtle: color-mix(in srgb, var(--error) 45%, transparent);
    --bs-secondary-border-subtle: var(--border);
}

body { background: var(--background); color: var(--text); }
a:where(:not(.btn, .badge, .nav-link, .dropdown-item, .page-link)) { color: var(--cyan); }
a:where(:not(.btn, .badge, .nav-link, .dropdown-item, .page-link)):hover { color: var(--ice); }
::selection { color: var(--night); background: var(--cyan); }
hr { border-color: var(--border); opacity: 1; }

.glass-card,
.card,
.login-card,
.dashboard-panel,
.dashboard-stat-card,
.mission-list-card {
    min-width: 0;
    background: var(--surface-gradient);
    border-color: var(--border);
    border-radius: var(--border-radius);
    color: var(--text);
    box-shadow: var(--theme-shadow);
}
.glass-card:hover { background: var(--surface-gradient); border-color: var(--border-strong); }
.card {
    --bs-card-bg: var(--panel);
    --bs-card-color: var(--text);
    --bs-card-border-color: var(--border);
    --bs-card-border-radius: var(--border-radius);
    --bs-card-inner-border-radius: 17px;
    --bs-card-cap-bg: var(--panel-strong);
    border: 1px solid var(--border);
    backdrop-filter: blur(16px);
}
.card-body { padding: 20px; }
.card-header, .card-footer {
    padding: 15px 20px;
    color: var(--text);
    background: var(--panel-strong);
    border-color: var(--border);
}
.card-header { font-size: 15px; font-weight: 600; border-radius: 17px 17px 0 0; }
.card-footer { border-radius: 0 0 17px 17px; }

/* The shared application shell owns navigation and spacing across all roles. */
.sidebar {
    --nav-accent: var(--cyan);
    position: fixed;
    inset: 0 auto 0 0;
    z-index: 100;
    display: flex;
    flex-direction: column;
    width: var(--sidebar-width);
    height: 100vh;
    height: 100dvh;
    padding: 20px 14px;
    overflow-y: auto;
    overflow-x: hidden;
    background: var(--sidebar-gradient);
    border-right: 1px solid var(--border);
    box-shadow: 12px 0 36px rgba(0, 0, 0, .12);
    transition: transform .25s ease;
}
.sidebar-header {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 0 20px;
    margin: 0 0 20px;
    border-bottom: 1px solid var(--border);
}
.sidebar-header > a { display: block; width: 100%; }
.app-logo { display: block; width: 100%; height: auto; object-fit: contain; }
.sidebar .nav-menu, .sidebar .nav-menu ul { display: grid; gap: 8px; margin: 0; padding: 0; list-style: none; }
.sidebar .nav-menu { gap: 22px; }
.sidebar .nav-section { min-width: 0; margin: 0; list-style: none; }
.sidebar .nav-section-title {
    display: block;
    margin: 0 0 12px;
    color: var(--text-muted);
    font-size: 11px;
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: .09em;
    text-transform: uppercase;
}
.sidebar .nav-section-title::after { content: ""; display: block; width: 20px; height: 1px; margin-top: 5px; background: var(--border-strong); }
.sidebar .nav-item { min-width: 0; margin: 0; list-style: none; }
.sidebar [data-nav-accent="blue"] { --nav-accent: var(--nav-blue); }
.sidebar [data-nav-accent="violet"] { --nav-accent: var(--nav-violet); }
.sidebar [data-nav-accent="amber"] { --nav-accent: var(--nav-amber); }
.sidebar [data-nav-accent="sky"] { --nav-accent: var(--nav-sky); }
.sidebar [data-nav-accent="mint"] { --nav-accent: var(--nav-mint); }
.sidebar [data-nav-accent="lilac"] { --nav-accent: var(--nav-lilac); }
.sidebar [data-nav-accent="gold"] { --nav-accent: var(--nav-gold); }
.sidebar [data-nav-accent="teal"] { --nav-accent: var(--nav-teal); }
.sidebar [data-nav-accent="rose"] { --nav-accent: var(--nav-rose); }
.sidebar [data-nav-accent="coral"] { --nav-accent: var(--nav-coral); }
.sidebar [data-nav-accent="periwinkle"] { --nav-accent: var(--nav-periwinkle); }
.sidebar [data-nav-accent="lime"] { --nav-accent: var(--nav-lime); }
.sidebar .nav-link {
    position: relative;
    display: flex;
    align-items: center;
    gap: 10px;
    width: 100%;
    min-height: 46px;
    padding: 10px 12px;
    border: 1px solid color-mix(in srgb, var(--nav-accent) 38%, transparent);
    border-radius: 12px;
    color: var(--nav-accent);
    background: linear-gradient(135deg, color-mix(in srgb, var(--nav-accent) 10%, var(--panel-strong)), color-mix(in srgb, var(--nav-accent) 3%, var(--night)));
    font-size: 14px;
    font-weight: 500;
    line-height: 1.4;
    text-align: left;
    text-decoration: none;
    cursor: pointer;
    transition: background-color .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.sidebar .nav-link:hover { color: var(--nav-accent); background: color-mix(in srgb, var(--nav-accent) 16%, var(--panel-strong)); border-color: var(--nav-accent); }
.sidebar .nav-link:focus-visible { outline-color: var(--nav-accent); }
.sidebar .nav-link.active, .sidebar .nav-button.is-active {
    color: var(--nav-accent);
    background: linear-gradient(135deg, color-mix(in srgb, var(--nav-accent) 22%, var(--panel-strong)), color-mix(in srgb, var(--nav-accent) 8%, var(--night)));
    border-color: var(--nav-accent);
    box-shadow: 0 0 28px color-mix(in srgb, var(--nav-accent) 22%, transparent);
}
.sidebar .nav-link.active::before, .sidebar .nav-button.is-active::before {
    content: "";
    position: absolute;
    inset: 9px auto 9px 0;
    width: 3px;
    border-radius: 3px;
    background: var(--nav-accent);
    box-shadow: 0 0 12px var(--nav-accent);
}
.sidebar .nav-icon { display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; flex: 0 0 26px; border: 1px solid color-mix(in srgb, var(--nav-accent) 38%, transparent); border-radius: 7px; color: var(--nav-accent); background: color-mix(in srgb, var(--nav-accent) 12%, transparent); }
.sidebar .nav-icon svg { width: 17px; height: 17px; }
.sidebar .nav-badge { color: var(--night); background: var(--nav-accent); }
.sidebar .push-nav-item { display: grid; gap: 7px; }
.sidebar .push-status { padding: 0 10px; color: var(--text-muted); font-size: 12px; line-height: 1.5; }
.sidebar .nav-button:disabled { opacity: .65; cursor: not-allowed; }
.sidebar-footer { padding-top: 18px; margin-top: 22px; border-top: 1px solid var(--border); }
.user-profile { display: flex; align-items: center; gap: 10px; padding: 10px 8px; border-radius: 12px; color: var(--text); text-decoration: none; }
.user-profile:hover { background: var(--panel-soft); }
.user-avatar { display: grid; place-items: center; flex: 0 0 38px; width: 38px; height: 38px; color: var(--night); background: var(--primary-gradient); border-radius: 10px; font-size: 14px; font-weight: 700; }
.user-info { min-width: 0; flex: 1; }
.user-name { font-size: 13px; font-weight: 600; overflow-wrap: anywhere; }
.user-role { margin-top: 3px; color: var(--text-muted); font-size: 12px; }

.main-content { position: relative; isolation: isolate; flex: 1; min-width: 0; margin-left: var(--sidebar-width); padding: 24px 32px 40px; min-height: 100vh; }
.main-content > :is(.container, .dashboard-overview-page, .app-topbar, .app-alerts) { width: 100%; max-width: var(--content-width); margin-inline: auto; }
.main-content > .container { padding-inline: 0; }
.main-content::before, .main-content::after { content: ""; position: fixed; inset: 0 0 0 var(--sidebar-width); pointer-events: none; }
.main-content::before { z-index: -2; background: url('../img/logo2.png') center / min(94%, 1500px) auto no-repeat; opacity: .14; filter: blur(1px); }
.main-content::after {
    z-index: -1;
    background-image: linear-gradient(rgba(107, 216, 255, .04) 1px, transparent 1px), linear-gradient(90deg, rgba(107, 216, 255, .04) 1px, transparent 1px), linear-gradient(135deg, rgba(7, 19, 31, .66), rgba(6, 17, 27, .78));
    background-size: 42px 42px, 42px 42px, auto;
}

.navbar.app-topbar {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 16px;
    min-height: 88px;
    margin-bottom: 24px;
    padding: 18px 22px;
    background: var(--navbar-background);
    border: 1px solid var(--border);
    border-radius: var(--border-radius);
    box-shadow: 0 12px 36px rgba(0, 0, 0, .22);
}
.topbar-heading { min-width: 0; flex: 1; }
.app-topbar .page-title { margin: 0; font-size: clamp(23px, 2.2vw, 28px); font-weight: 700; line-height: 1.2; overflow-wrap: anywhere; }
.page-breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 7px; color: var(--text-muted); font-size: 13px; line-height: 1.5; }
.navbar-right { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; }
.nav-btn { position: relative; display: inline-flex; align-items: center; justify-content: center; gap: 8px; width: 44px; height: 44px; flex-shrink: 0; border: 1px solid var(--border); border-radius: 12px; color: var(--cyan); background: var(--panel); cursor: pointer; transition: border-color .2s ease, background-color .2s ease; }
.nav-btn svg { width: 20px; height: 20px; color: inherit; }
.nav-btn:hover {
    color: var(--cyan);
    background: var(--panel-strong);
    border-color: var(--border-strong);
}
.push-topbar-control { display: flex; align-items: center; gap: 8px; }
.push-topbar-btn { width: auto; padding: 0 12px; font-size: 13px; font-weight: 600; }
.push-topbar-status { color: var(--text-muted); font-size: 12px; }
.push-topbar-btn.is-active { box-shadow: var(--theme-glow); }
.topbar-menu-toggle { display: none; }
.sidebar-close { display: none; }
.sidebar-backdrop { display: none; }
.dashboard-kicker { color: var(--cyan); }
.nav-badge, .notification-count { color: var(--night); background: var(--cyan); }
.nav-badge { margin-left: auto; padding: 2px 7px; border-radius: 20px; font-size: 12px; font-weight: 700; }

.card-header.bg-white,
.card-footer.bg-white { background: var(--panel-strong) !important; }
.btn-primary.text-white, .btn-info.text-white,
.btn-success.text-white, .btn-warning.text-white,
.btn-danger.text-white { color: var(--night) !important; }

.text-primary,
.link-primary { color: var(--cyan) !important; }
.text-muted,
.text-secondary,
.form-text { color: var(--text-muted) !important; }
.text-danger { color: var(--error-text) !important; }
/* Foregrounds are scoped to filled state surfaces, never all badge descendants. */
.bg-primary,
.bg-info,
.bg-success,
.bg-warning,
.bg-danger,
.text-bg-primary,
.text-bg-info,
.text-bg-success,
.text-bg-warning,
.text-bg-danger { color: var(--night) !important; }
.badge.bg-secondary,
.badge.text-bg-secondary { background-color: var(--panel-strong) !important; color: var(--text) !important; }

.btn {
    --bs-btn-focus-shadow-rgb: 39, 168, 255;
    --bs-btn-border-radius: 12px;
    min-height: 44px;
    padding: 10px 16px;
    border-radius: 12px;
    font-size: 15px;
    font-weight: 600;
    line-height: 1.4;
    transition: color .2s ease, background-color .2s ease, border-color .2s ease, box-shadow .2s ease;
}
.btn-sm { padding: 8px 12px; font-size: 14px; }
.btn :is(i, svg) { color: inherit; }
.btn-primary,
.pwa-install-action {
    --bs-btn-color: var(--night);
    --bs-btn-bg: var(--primary);
    --bs-btn-border-color: var(--primary);
    --bs-btn-hover-color: var(--night);
    --bs-btn-hover-bg: var(--cyan);
    --bs-btn-hover-border-color: var(--cyan);
    --bs-btn-active-color: var(--night);
    --bs-btn-active-bg: var(--cyan);
    --bs-btn-active-border-color: var(--cyan);
    --bs-btn-disabled-color: var(--night);
    --bs-btn-disabled-bg: var(--primary);
    --bs-btn-disabled-border-color: var(--primary);
    color: var(--night);
    background: var(--primary-gradient);
    border-color: var(--primary);
    box-shadow: var(--theme-glow);
}
.btn-primary:hover,
.btn-primary:active,
.btn-primary.active { color: var(--night); background: var(--cyan); }

.btn-secondary,
.btn-outline-secondary,
.btn-outline-primary,
.btn-outline-info {
    --bs-btn-color: var(--cyan);
    --bs-btn-border-color: var(--border-strong);
    --bs-btn-hover-color: var(--cyan);
    --bs-btn-hover-bg: var(--panel-soft);
    --bs-btn-hover-border-color: var(--cyan);
    --bs-btn-active-color: var(--night);
    --bs-btn-active-bg: var(--cyan);
    --bs-btn-active-border-color: var(--cyan);
    --bs-btn-disabled-color: var(--text-muted);
    --bs-btn-disabled-bg: var(--panel);
    --bs-btn-disabled-border-color: var(--border);
    color: var(--cyan);
    background: var(--panel-soft);
    border: 1px solid var(--border-strong);
}
.btn-secondary:hover,
.btn-outline-secondary:hover,
.btn-outline-primary:hover,
.btn-outline-info:hover { color: var(--cyan); background: var(--panel-soft); border-color: var(--cyan); }
.btn-secondary.active,
.btn-outline-primary.active,
.btn-outline-info.active,
.btn-outline-secondary.active { color: var(--night); background: var(--cyan); }
.btn-link { --bs-btn-color: var(--cyan); --bs-btn-hover-color: var(--ice); }

.btn-success, .btn-outline-success { --state-color: var(--success); }
.btn-warning, .btn-outline-warning { --state-color: var(--warning); }
.btn-danger, .btn-outline-danger { --state-color: var(--error); }
.btn-info { --state-color: var(--cyan); }
.btn-success, .btn-warning, .btn-danger, .btn-info {
    --bs-btn-color: var(--night);
    --bs-btn-bg: var(--state-color);
    --bs-btn-border-color: var(--state-color);
    --bs-btn-hover-color: var(--night);
    --bs-btn-hover-bg: color-mix(in srgb, var(--state-color) 80%, var(--ice));
    --bs-btn-hover-border-color: var(--state-color);
    --bs-btn-active-color: var(--night);
    --bs-btn-active-bg: var(--state-color);
    --bs-btn-active-border-color: var(--state-color);
    --bs-btn-disabled-color: var(--night);
    --bs-btn-disabled-bg: var(--state-color);
    --bs-btn-disabled-border-color: var(--state-color);
    color: var(--night);
    background: var(--state-color);
    border-color: var(--state-color);
}
.btn-success:hover, .btn-warning:hover, .btn-danger:hover, .btn-info:hover {
    color: var(--night);
    background: color-mix(in srgb, var(--state-color) 80%, var(--ice));
}
.btn-outline-success, .btn-outline-warning, .btn-outline-danger {
    --bs-btn-color: var(--state-color);
    --bs-btn-hover-color: var(--night);
    --bs-btn-hover-bg: var(--state-color);
    --bs-btn-active-color: var(--night);
    --bs-btn-active-bg: var(--state-color);
    --bs-btn-active-border-color: var(--state-color);
    --bs-btn-disabled-color: var(--state-color);
    --bs-btn-disabled-border-color: var(--state-color);
    color: var(--state-color);
    background: transparent;
    border: 1px solid var(--state-color);
}
.btn-outline-danger { --bs-btn-color: var(--error-text); color: var(--error-text); }
.btn-outline-success:hover, .btn-outline-warning:hover, .btn-outline-danger:hover,
.btn-outline-success.active, .btn-outline-warning.active, .btn-outline-danger.active {
    color: var(--night); background: var(--state-color); border-color: var(--state-color);
}
.btn:disabled, .btn.disabled, button:disabled { cursor: not-allowed; opacity: .65; box-shadow: none; }

.form-control,
.form-select,
.form-input,
.search-input,
.settings-select {
    min-width: 0;
    min-height: 44px;
    padding: 10px 14px;
    border-radius: 12px;
    font-size: 15px;
    line-height: 1.5;
    color-scheme: light;
    color: var(--night);
    background-color: var(--ice);
    border-color: var(--border-strong);
    caret-color: var(--night);
}
.form-control:focus,
.form-select:focus,
.form-input:focus,
.search-input:focus,
.settings-select:focus {
    color: var(--night);
    background-color: var(--ice);
    border-color: var(--primary);
    box-shadow: 0 0 0 .2rem color-mix(in srgb, var(--primary) 30%, transparent), var(--theme-glow);
}
.form-control::placeholder,
.form-input::placeholder,
.search-input::placeholder { color: var(--input-muted); opacity: 1; }
@media (max-width: 767.98px) {
    .withdrawal-request-form .form-control { font-size: 16px; }
}
.form-select option, .settings-select option { color: var(--night); background: var(--ice); }
.form-select { padding-right: 36px; background-image: var(--bs-form-select-bg-img), var(--bs-form-select-bg-icon, none); }
.form-select option:checked, .settings-select option:checked { color: var(--night); background: var(--cyan); }
.form-control:disabled, .form-select:disabled, .form-input:disabled,
.form-control[readonly], .form-input[readonly] {
    color: var(--input-muted);
    background-color: color-mix(in srgb, var(--ice) 80%, var(--text-muted));
    opacity: 1;
}
.form-control:disabled, .form-select:disabled, .form-input:disabled { cursor: not-allowed; }
.form-control.is-invalid, .form-select.is-invalid, .form-input.is-invalid,
.form-control.is-invalid:focus, .form-select.is-invalid:focus, .form-input.is-invalid:focus,
.was-validated .form-control:invalid, .was-validated .form-select:invalid,
.was-validated .form-control:invalid:focus, .was-validated .form-select:invalid:focus {
    border-color: var(--error);
    box-shadow: 0 0 0 .2rem color-mix(in srgb, var(--error) 22%, transparent);
}
.form-control.is-valid, .form-select.is-valid,
.was-validated .form-control:valid, .was-validated .form-select:valid { border-color: var(--success); }
.form-control.is-valid:focus, .form-select.is-valid:focus,
.was-validated .form-control:valid:focus, .was-validated .form-select:valid:focus {
    border-color: var(--success);
    box-shadow: 0 0 0 .2rem color-mix(in srgb, var(--success) 22%, transparent);
}
.invalid-feedback { color: var(--error-text); }
.valid-feedback { color: var(--success); }
input[type="date"].form-control::-webkit-calendar-picker-indicator,
input[type="time"].form-control::-webkit-calendar-picker-indicator { filter: none; opacity: .8; }
input[type="date"].form-control, input[type="time"].form-control { color-scheme: light; }
.form-control::file-selector-button { color: var(--night); background: color-mix(in srgb, var(--cyan) 25%, var(--ice)); }
.form-control:hover:not(:disabled):not([readonly])::file-selector-button { background: var(--cyan); }
.form-input:-webkit-autofill, .form-control:-webkit-autofill {
    -webkit-text-fill-color: var(--night);
    -webkit-box-shadow: 0 0 0 1000px var(--ice) inset;
    caret-color: var(--night);
}
.password-toggle { color: var(--night); }
.input-group-text { color: var(--cyan); background: var(--panel-strong); border-color: var(--border); }
.form-check-input { background-color: var(--ice); border-color: var(--border-strong); }
.form-check-input:checked { background-color: var(--primary); border-color: var(--cyan); }
.form-check-input[type="checkbox"]:checked {
    --bs-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%2306111b' stroke-linecap='round' stroke-linejoin='round' stroke-width='3' d='m6 10 3 3 6-6'/%3e%3c/svg%3e");
}
.form-check-input[type="radio"]:checked,
.form-switch .form-check-input:checked {
    --bs-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='2' fill='%2306111b'/%3e%3c/svg%3e");
}
.form-check-input:indeterminate {
    background-color: var(--primary);
    border-color: var(--cyan);
    --bs-form-check-bg-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3e%3cpath fill='none' stroke='%2306111b' stroke-linecap='round' stroke-width='3' d='M6 10h8'/%3e%3c/svg%3e");
}
.form-check-input:focus { border-color: var(--cyan); box-shadow: var(--theme-glow); }
.form-range::-webkit-slider-thumb { background: var(--primary); }
.form-range::-moz-range-thumb { background: var(--primary); }

/* Search controls share a row when space allows and stack without shrinking type. */
.platform-filter-form > .card-body { align-items: center; gap: 12px !important; }
.platform-filter-form :is(.form-control, .form-select) { flex: 1 1 220px; width: auto; }
.platform-filter-form .form-control { flex-grow: 2; }
.platform-filter-form .btn { flex: 0 0 auto; }

.empty-state { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 18px; padding: 28px 24px; text-align: left; }
.empty-state-icon { display: grid; place-items: center; flex: 0 0 48px; width: 48px; height: 48px; border: 1px solid var(--border-strong); border-radius: 14px; color: var(--cyan); background: rgba(39, 168, 255, .1); font-size: 23px; }
.empty-state-content { min-width: 0; max-width: 520px; }
.empty-state-title { margin: 0; color: var(--text); font-size: 17px; font-weight: 600; line-height: 1.5; }
.empty-state-message { margin: 5px 0 0; color: var(--text-muted); font-size: 14px; line-height: 1.6; }
.empty-state-action { display: inline-flex; align-items: center; justify-content: center; gap: 10px; }
.empty-state-compact { padding: 18px; gap: 12px; }
.empty-state-compact .empty-state-title { font-size: 15px; }
.empty-state-compact .empty-state-icon { flex-basis: 40px; width: 40px; height: 40px; font-size: 20px; }

.table {
    --bs-table-color: var(--text);
    --bs-table-bg: var(--panel);
    --bs-table-border-color: var(--border);
    --bs-table-striped-color: var(--text);
    --bs-table-striped-bg: var(--panel-soft);
    --bs-table-hover-color: var(--text);
    --bs-table-hover-bg: var(--panel-soft);
    --bs-table-active-color: var(--text);
    --bs-table-active-bg: color-mix(in srgb, var(--primary) 18%, var(--night));
    margin-bottom: 0;
    font-size: 14px;
    vertical-align: middle;
}
.table > :not(caption) > * > * { padding: 14px 16px; border-color: var(--border); }
.table thead th { color: var(--cyan); background-color: var(--panel-strong); font-weight: 600; }
.table-responsive { border-radius: 0 0 17px 17px; }
.list-group-item {
    --bs-list-group-bg: var(--panel);
    --bs-list-group-color: var(--text);
    --bs-list-group-action-hover-color: var(--cyan);
    --bs-list-group-action-hover-bg: var(--panel-strong);
    --bs-list-group-action-active-bg: var(--panel-strong);
    --bs-list-group-action-active-color: var(--cyan);
    --bs-list-group-active-bg: var(--panel-strong);
    --bs-list-group-active-color: var(--cyan);
    --bs-list-group-active-border-color: var(--border-strong);
    border-color: var(--border);
}
.list-group-item.active { color: var(--cyan); background: var(--panel-strong); border-color: var(--border-strong); }

.dropdown-menu,
.notification-dropdown,
.modal-content,
.glassphere-modal,
.pwa-install-modal-panel,
.offcanvas,
.toast,
.popover {
    color: var(--text);
    background: var(--panel-strong);
    border-color: var(--border);
    box-shadow: var(--theme-shadow);
    border-radius: var(--border-radius);
}
.dropdown-item { padding: 10px 14px; font-size: 14px; }
.modal-content { border: 1px solid var(--border); }
.dropdown-menu {
    --bs-dropdown-color: var(--text);
    --bs-dropdown-link-color: var(--text);
    --bs-dropdown-link-hover-color: var(--cyan);
    --bs-dropdown-link-hover-bg: var(--panel-soft);
    --bs-dropdown-link-active-color: var(--night);
    --bs-dropdown-link-active-bg: var(--cyan);
    --bs-dropdown-link-disabled-color: var(--text-muted);
    --bs-dropdown-divider-bg: var(--border);
}
.dropdown-item:hover, .dropdown-item:focus { color: var(--cyan); background: var(--panel-soft); }
.dropdown-item.active, .dropdown-item:active { color: var(--night); background: var(--cyan); }
.dropdown-item.disabled, .dropdown-item:disabled { color: var(--text-muted); background: transparent; opacity: .65; }
.modal-header, .modal-footer, .toast-header { color: var(--text); background: transparent; border-color: var(--border); }
.modal-title { color: var(--cyan); }
.btn-close { box-sizing: border-box; width: 44px; height: 44px; flex-shrink: 0; filter: invert(1) grayscale(100%) brightness(200%); }
.alert .btn-close { filter: invert(1) grayscale(100%) brightness(200%); }
.notification-toast {
    background: var(--panel-strong);
    color: var(--text);
    border-color: var(--border-strong);
    box-shadow: var(--theme-shadow);
}
.notification-toast-icon { color: var(--cyan); background: var(--panel-soft); }
.notification-toast-content span, .notification-toast-close { color: var(--text-muted); }
.notification-item.is-unread { background: color-mix(in srgb, var(--primary) 14%, var(--night)) !important; border-color: var(--cyan); }
[data-theme="light"] .notification-dropdown { background: var(--panel-strong); border-color: var(--border); box-shadow: var(--theme-shadow); }
[data-theme="light"] .notification-dropdown-header,
[data-theme="light"] .notification-all { background: var(--panel); color: var(--cyan); }
[data-theme="light"] .notification-mini-content small { color: var(--text-muted); }
.chat-compliance-notice,
[data-theme="light"] .chat-compliance-notice { color: var(--cyan); background: var(--panel-strong); border-color: var(--border); }

.pagination {
    --bs-pagination-color: var(--cyan);
    --bs-pagination-bg: var(--panel);
    --bs-pagination-border-color: var(--border);
    --bs-pagination-hover-color: var(--ice);
    --bs-pagination-hover-bg: var(--panel-strong);
    --bs-pagination-hover-border-color: var(--border-strong);
    --bs-pagination-focus-color: var(--cyan);
    --bs-pagination-focus-bg: var(--panel-strong);
    --bs-pagination-focus-box-shadow: var(--theme-glow);
    --bs-pagination-active-color: var(--night);
    --bs-pagination-active-bg: var(--cyan);
    --bs-pagination-active-border-color: var(--cyan);
    --bs-pagination-disabled-color: var(--text-muted);
    --bs-pagination-disabled-bg: var(--panel);
    --bs-pagination-disabled-border-color: var(--border);
}
.accordion {
    --bs-accordion-color: var(--text);
    --bs-accordion-bg: var(--panel);
    --bs-accordion-border-color: var(--border);
    --bs-accordion-btn-color: var(--text);
    --bs-accordion-btn-bg: var(--panel);
    --bs-accordion-active-color: var(--cyan);
    --bs-accordion-active-bg: var(--panel-strong);
    --bs-accordion-btn-focus-box-shadow: var(--theme-glow);
}
.nav-tabs { --bs-nav-tabs-border-color: var(--border); --bs-nav-tabs-link-active-bg: var(--panel-strong); --bs-nav-tabs-link-active-color: var(--cyan); --bs-nav-tabs-link-active-border-color: var(--border-strong); }
.nav-pills { --bs-nav-pills-link-active-bg: var(--panel-strong); --bs-nav-pills-link-active-color: var(--cyan); }
.page-link { min-width: 44px; min-height: 44px; display: grid; place-items: center; }

@media (max-width: 992px) {
    :root, [data-theme="light"] { --sidebar-width: 0px; }
    .sidebar { width: 280px; max-width: 85vw; transform: translateX(-100%); }
    .sidebar.open { transform: translateX(0); }
    .sidebar-header { gap: 8px; }
    .sidebar-header > a { flex: 1; min-width: 0; }
    .sidebar-close, .topbar-menu-toggle { display: inline-flex; }
    .sidebar-close { width: 44px; height: 44px; }
    .sidebar-backdrop:not([hidden]) { display: block; position: fixed; inset: 0; z-index: 90; background: rgba(0, 0, 0, .55); backdrop-filter: blur(3px); }
    body.sidebar-open { overflow: hidden; }
    .main-content { padding: 20px 20px 40px; }
}

@media (max-width: 576px) {
    .main-content { padding: 16px 12px 32px; }
    .navbar.app-topbar { gap: 12px; padding: 16px; margin-bottom: 20px; }
    .app-topbar .topbar-heading { flex-basis: calc(100% - 60px); }
    .navbar-right { width: 100%; justify-content: flex-end; gap: 8px; }
    .card-body { padding: 16px; }
    .card-header, .card-footer { padding: 14px 16px; }
    .platform-filter-form :is(.form-control, .form-select, .btn) { flex-basis: 100%; width: 100%; }
    .empty-state { flex-direction: column; gap: 14px; padding: 24px 16px; text-align: center; }
    .empty-state-action { width: 100%; }
    .empty-state-compact { padding: 18px 12px; }
    .table > :not(caption) > * > * { padding: 12px; }
}

@media (prefers-reduced-motion: reduce) {
    html { scroll-behavior: auto; }
    .sidebar, .sidebar .nav-link, .nav-btn, .btn, .notification-dropdown { transition: none; }
    .orb, .login-page::before, .login-container { animation: none; }
}

:is(.btn, .form-control, .form-select, .form-input, .search-input, .nav-link,
    a, button, input, select, textarea, [tabindex]):focus-visible {
    outline: 3px solid var(--cyan);
    outline-offset: 3px;
}

/* Documents and signatures use paper colors when printed. PDF layouts are separate. */
@media print {
    :root { color-scheme: light; }
    html, body { background: #fff !important; color: #06111b !important; overflow: visible !important; }
    body * {
        animation: none !important;
        transition: none !important;
        color: #06111b !important;
        -webkit-text-fill-color: currentColor !important;
        text-shadow: none !important;
        box-shadow: none !important;
    }
    .text-muted, .text-secondary, .text-primary, .text-success, .text-danger,
    .text-warning, .text-info, .form-text, .status-pill, .badge,
    .badge.bg-secondary, .badge.text-bg-secondary, .bg-primary, .bg-info,
    .bg-success, .bg-warning, .bg-danger, .text-bg-primary, .text-bg-info,
    .text-bg-success, .text-bg-warning, .text-bg-danger { color: #06111b !important; }
    .background, .orb, .sidebar, .sidebar-backdrop, .navbar, .mobile-menu-toggle,
    .main-content::before, .main-content::after,
    .route-welcome-loader, .route-cinematic-loader, .notification-toast-stack,
    .pwa-install-card, .pwa-install-modal { display: none !important; }
    .main-content { margin-left: 0 !important; }
    .card, .card-header, .card-body, .card-footer, .glass-card, .login-card,
    .dashboard-welcome, .dashboard-panel, .dashboard-stat-card, .empty-state-icon,
    .mission-list-card, .mission-list-card-field, .contract-document,
    .signed-contract-item, .dashboard-contract-banner, .contract-signed-banner,
    .alert, .dashboard-action, .dashboard-list-row, .dashboard-recent-row,
    .dashboard-row-avatar, .dashboard-trend-labels > div, .admin-month-filter,
    .admin-finance-table, .admin-action-row, .admin-top-garage-row,
    .withdrawal-billing-details, .withdrawal-billing-identifiers > div,
    .form-control, .form-select, .form-input, .dashboard-search,
    .list-group-item, .status-pill, .badge, .btn,
    .badge.bg-secondary, .badge.text-bg-secondary,
    .table, .table > :not(caption) > * > *, .chat-bubble, .signature-canvas {
        background: #fff !important;
        background-image: none !important;
        border-color: #94afc2 !important;
    }
    .card-header.bg-white, .card-footer.bg-white { background: #fff !important; }
    .table { --bs-table-bg: #fff; --bs-table-striped-bg: #fff; --bs-table-hover-bg: #fff; --bs-table-active-bg: #fff; }
    a { text-decoration: underline; }
}