/* ============================================================================
   theme-dark-fixes.css — Marsland (tenant + public) dark theme gap-fill.
   The Marsland theme already ships a large compiled html.dark-mode block in
   main-style.css. This sheet covers the pieces it misses:
     - the customer/tenant portal wrappers (which also pull in the LIGHT-only
       frontend/css bundle), and
     - generic Bootstrap components rendered raw (cards, tables, forms, modals).
   Scope: html.dark-mode (set by partials/theme-boot). Uses the Marsland dark
   tokens defined in main-style.css:
     page --body #0D1117   surface --dark-bg1 #24292F   deep --dark-bg2 #161B22
   ========================================================================== */

html.dark-mode {
    --md-page:    var(--body, #0D1117);
    --md-surface: var(--dark-bg1, #24292F);
    --md-deep:    var(--dark-bg2, #161B22);
    --md-border:  #30363d;
    --md-text:    #e6edf3;
    --md-muted:   #9aa4b2;
}

/* ---- Customer / tenant portal wrappers ---------------------------------- */
html.dark-mode .profile-account-area,
html.dark-mode .section-bg-two,
html.dark-mode .section-bg-one,
html.dark-mode .flex-main-content {
    background-color: var(--md-page) !important;
    color: var(--md-text);
}

/* ---- Generic Bootstrap utilities ---------------------------------------- */
html.dark-mode .bg-white:not(.force-light),
html.dark-mode .bg-light:not(.force-light),
html.dark-mode .white-bg:not(.force-light) {
    background-color: var(--md-surface) !important;
    color: var(--md-text);
}
/* Tenant portal content cards (order detail, receipts, etc.) */
html.dark-mode .sidebar-content-wrap { background-color: var(--md-surface) !important; color: var(--md-text); }
html.dark-mode .text-dark:not(.force-light) { color: var(--md-text) !important; }
html.dark-mode .text-muted { color: var(--md-muted) !important; }
html.dark-mode .border,
html.dark-mode .border-top,
html.dark-mode .border-bottom,
html.dark-mode .border-start,
html.dark-mode .border-end { border-color: var(--md-border) !important; }

/* ---- Cards / panels ----------------------------------------------------- */
html.dark-mode .card,
html.dark-mode .card-body,
html.dark-mode .card-header,
html.dark-mode .card-footer,
html.dark-mode .dashboard-panel,
html.dark-mode .user-panel {
    background-color: var(--md-surface);
    border-color: var(--md-border);
    color: var(--md-text);
}

/* ---- Tables ------------------------------------------------------------- */
html.dark-mode .table {
    --bs-table-bg: transparent;
    --bs-table-color: var(--md-text);
    color: var(--md-text);
    border-color: var(--md-border);
}
html.dark-mode .table > :not(caption) > * > * {
    background-color: transparent;
    color: var(--md-text);
    border-color: var(--md-border);
}
html.dark-mode .table thead th { background-color: var(--md-deep); color: var(--md-text); border-color: var(--md-border); }
html.dark-mode .table-striped > tbody > tr:nth-of-type(odd) > * { background-color: rgba(255, 255, 255, .03); color: var(--md-text); }
html.dark-mode .table-hover > tbody > tr:hover > * { background-color: rgba(255, 255, 255, .06); color: var(--md-text); }

/* ---- Forms -------------------------------------------------------------- */
html.dark-mode .form-control,
html.dark-mode .form-select,
html.dark-mode textarea,
html.dark-mode .input-group-text {
    background-color: var(--md-deep);
    border-color: var(--md-border);
    color: var(--md-text);
}
html.dark-mode .form-control::placeholder,
html.dark-mode textarea::placeholder { color: var(--md-muted); opacity: 1; }
html.dark-mode label,
html.dark-mode .form-label { color: var(--md-text); }

/* ---- Dropdowns / modals ------------------------------------------------- */
html.dark-mode .dropdown-menu {
    background-color: var(--md-surface);
    border-color: var(--md-border);
    color: var(--md-text);
}
html.dark-mode .dropdown-item { color: var(--md-text); }
html.dark-mode .dropdown-item:hover,
html.dark-mode .dropdown-item:focus { background-color: rgba(255, 255, 255, .06); color: var(--md-text); }
html.dark-mode .modal-content {
    background-color: var(--md-surface);
    border-color: var(--md-border);
    color: var(--md-text);
}
html.dark-mode .modal-header,
html.dark-mode .modal-footer { border-color: var(--md-border); }
html.dark-mode .btn-close { filter: invert(1) grayscale(1) brightness(1.8); }

/* ---- List groups / pagination / nav-tabs -------------------------------- */
html.dark-mode .list-group-item {
    background-color: var(--md-surface);
    border-color: var(--md-border);
    color: var(--md-text);
}
html.dark-mode .page-link {
    background-color: var(--md-surface);
    border-color: var(--md-border);
    color: var(--md-text);
}
html.dark-mode .nav-tabs { border-color: var(--md-border); }
html.dark-mode .nav-tabs .nav-link.active {
    background-color: var(--md-surface);
    border-color: var(--md-border) var(--md-border) var(--md-surface);
    color: var(--md-text);
}

/* ---- select2 (tenant forms) --------------------------------------------- */
html.dark-mode .select2-container--default .select2-selection--single,
html.dark-mode .select2-container--default .select2-selection--multiple,
html.dark-mode .select2-dropdown,
html.dark-mode .select2-search__field {
    background-color: var(--md-deep) !important;
    border-color: var(--md-border) !important;
    color: var(--md-text);
}
html.dark-mode .select2-results__option { color: var(--md-text); background-color: var(--md-surface); }

/* Scrollbars */
html.dark-mode ::-webkit-scrollbar-track { background: var(--md-page); }
html.dark-mode ::-webkit-scrollbar-thumb { background: #3a4048; border-radius: 6px; }