/* High-Contrast Table & DataTables Overrides for Dark Mode */
    html.dark-mode table,
    html.dark-mode .table,
    html.dark-mode .table-list,
    html.dark-mode table.table-list,
    html.dark-mode table.dataTable,
    html.dark-mode .table-responsive,
    html.dark-mode .table-container,
    html.dark-mode .dataTables_wrapper,
    html.dark-mode div.dataTables_wrapper,
    html.dark-mode table.table-list tbody,
    html.dark-mode table.table-list tbody tr,
    html.dark-mode table.table-list tbody td,
    html.dark-mode .table-list > tbody > tr,
    html.dark-mode .table-list > tbody > tr > td,
    html.dark-mode table.dataTable tbody tr,
    html.dark-mode table.dataTable tbody td,
    html.dark-mode .table tbody tr,
    html.dark-mode .table tbody td,
    html.dark-mode table tbody tr,
    html.dark-mode table tbody td,
    html.dark-mode table tr,
    html.dark-mode table td {
        background-color: #1e293b !important;
        background: #1e293b !important;
        color: #f8fafc !important;
    }

    html.dark-mode .table-list > tbody > tr:hover > td,
    html.dark-mode table.table-list tbody tr:hover > td,
    html.dark-mode table.dataTable tbody tr:hover > td,
    html.dark-mode .table-hover tbody tr:hover > td,
    html.dark-mode .table-list > tbody > tr:hover,
    html.dark-mode table.table-list tbody tr:hover {
        background-color: #334155 !important;
        background: #334155 !important;
        color: #f8fafc !important;
    }

    html.dark-mode table thead,
    html.dark-mode table thead tr,
    html.dark-mode table thead th,
    html.dark-mode .table thead th,
    html.dark-mode table.table-list thead th,
    html.dark-mode table.dataTable thead th,
    html.dark-mode .table-list > thead > tr > th,
    html.dark-mode .table-list > thead > tr {
        background-color: #334155 !important;
        background: #334155 !important;
        color: #f8fafc !important;
        border-color: #334155 !important;
    }

    html.dark-mode table td *,
    html.dark-mode table th *,
    html.dark-mode .table-list td *,
    html.dark-mode .table-list th * {
        color: inherit !important;
    }

    html.dark-mode table td a,
    html.dark-mode table th a,
    html.dark-mode .table-list td a,
    html.dark-mode .table-list th a {
        color: #60a5fa !important;
    }

    html.dark-mode table td a:hover,
    html.dark-mode table th a:hover {
        color: #93c5fd !important;
    }

    /* DataTables Controls & Info Text Font Color Fixes */
    html.dark-mode .dataTables_info,
    html.dark-mode .dataTables_length,
    html.dark-mode .dataTables_filter,
    html.dark-mode .dataTables_paginate,
    html.dark-mode .dataTables_wrapper label,
    html.dark-mode div.dataTables_info,
    html.dark-mode div.dataTables_length,
    html.dark-mode div.dataTables_filter,
    html.dark-mode .dataTables_wrapper .dataTables_info,
    html.dark-mode .dataTables_wrapper .dataTables_length {
        color: #cbd5e1 !important;
    }

    html.dark-mode .dataTables_length select,
    html.dark-mode .dataTables_filter input,
    html.dark-mode div.dataTables_wrapper input,
    html.dark-mode div.dataTables_wrapper select {
        background-color: #334155 !important;
        color: #f8fafc !important;
        border: 1px solid #334155 !important;
    }

    html.dark-mode .dataTables_paginate .paginate_button,
    html.dark-mode .pagination .page-link {
        background-color: #334155 !important;
        border-color: #334155 !important;
        color: #f8fafc !important;
    }

    html.dark-mode .dataTables_paginate .paginate_button.active,
    html.dark-mode .dataTables_paginate .paginate_button.current,
    html.dark-mode .pagination .page-item.active .page-link {
        background-color: #2563eb !important;
        color: #ffffff !important;
        border-color: #2563eb !important;
    }

    /* Content Catalog & Widget Headers & Tabs Font Color Fixes */
    html.dark-mode .card-header,
    html.dark-mode .card-header *,
    html.dark-mode .card-header i,
    html.dark-mode .panel-heading,
    html.dark-mode .panel-heading *,
    html.dark-mode div[id^="Panel-"] .card-header,
    html.dark-mode div[id^="Panel-"] .card-header *,
    html.dark-mode div[id^="Panel-"] .card-title {
        color: #f8fafc !important;
    }

    html.dark-mode .xui-nav-tabs a {
        color: #cbd5e1 !important;
    }

    html.dark-mode .xui-nav-tabs a.active,
    html.dark-mode .xui-nav-tabs a:hover {
        color: #60a5fa !important;
        border-bottom-color: #60a5fa !important;
    }

    html.dark-mode .xui-search-input {
        background-color: #334155 !important;
        color: #f8fafc !important;
        border: 1px solid #334155 !important;
    }

    html.dark-mode .xui-search-input::placeholder {
        color: #94a3b8 !important;
    }

    /* Form Inputs & Select Options */
    html.dark-mode .form-control,
    html.dark-mode input[type="text"],
    html.dark-mode input[type="password"],
    html.dark-mode input[type="email"],
    html.dark-mode input[type="number"],
    html.dark-mode textarea,
    html.dark-mode select,
    html.dark-mode select.custom-select,
    html.dark-mode .custom-select {
        background-color: #334155 !important;
        color: #f8fafc !important;
        border-color: #334155 !important;
    }

    html.dark-mode select option {
        background-color: #1e293b !important;
        color: #f8fafc !important;
    }

    html.dark-mode ::placeholder,
    html.dark-mode .form-control::placeholder {
        color: #94a3b8 !important;
        opacity: 1 !important;
    }

    /* Custom Hooks & Cards */
    html.dark-mode #slug-preview,
    html.dark-mode .aff-metrics .m-val,
    html.dark-mode .aff-metrics .m-lbl,
    html.dark-mode .credit-balance,
    html.dark-mode .wallet-balance,
    html.dark-mode .balance-value,
    html.dark-mode .sip-val,
    html.dark-mode .sip-label,
    html.dark-mode #sip-ctr,
    html.dark-mode .sip-accordion-header,
    html.dark-mode .sip-credentials-box {
        color: #f8fafc !important;
    }

    /* ------------------------------------------------------------------
       Content Catalog widget (xui_content_widget) — dark mode
       Added 2026-08-28. The widget's own CSS in
       modules/addons/xui_content_widget/hooks.php is written light-mode only
       (#444 titles on a #f9f9f9 card), so in dark mode the poster captions and
       episode list rendered dark-grey-on-dark and were effectively unreadable.
       Its nav tabs and search input were already handled above; these are the
       pieces that were missed.
       Palette matches the rest of this file: #1e293b / #334155 surfaces,
       #f8fafc / #cbd5e1 / #94a3b8 text.
       ------------------------------------------------------------------ */

    /* Card surface — the caption strip sits on this, so it has to move first */
    html.dark-mode .xui-movie-card {
        background: #1e293b !important;
        border: 1px solid #334155 !important;
    }

    /* Poster placeholder while the image loads */
    html.dark-mode .xui-poster {
        background: #334155 !important;
    }

    /* THE fix: poster captions were #444 on a dark card (~1.6:1) */
    html.dark-mode .xui-title {
        color: #f8fafc !important;
    }

    /* Episodes tab list */
    html.dark-mode .xui-list-item {
        color: #cbd5e1 !important;
        border-bottom: 1px solid #334155 !important;
    }

    html.dark-mode .xui-list-item:hover {
        background-color: #334155 !important;
    }

    /* Round icon chip beside each episode — was a light #eee circle */
    html.dark-mode .xui-icon-box {
        background: #334155 !important;
        color: #cbd5e1 !important;
    }

    /* Trailing action icons (YouTube / copy) — #999 is too dim on dark */
    html.dark-mode .xui-action-icon {
        color: #94a3b8 !important;
    }

    /* Pagination — was a white button with a #ddd border */
    html.dark-mode .xui-page-btn {
        background: #1e293b !important;
        border: 1px solid #334155 !important;
        color: #93c5fd !important;
    }

    html.dark-mode .xui-page-btn.active {
        background: #2563eb !important;
        border-color: #2563eb !important;
        color: #ffffff !important;
    }

    /* Corner ribbon button sat on a near-white pill, which glared on dark */
    html.dark-mode .xui-ribbon-btn {
        background: rgba(15, 23, 42, 0.85) !important;
    }