/*
 * PTL color modes
 * Keep raw palette values in this file. Application styles should consume the
 * semantic --app-* tokens so light and dark modes remain maintainable.
 */
:root,
[data-bs-theme="light"] {
    color-scheme: light;

    --app-canvas: #f4f7fb;
    --app-canvas-accent: #eef4fb;
    --app-surface: #ffffff;
    --app-surface-elevated: #ffffff;
    --app-surface-subtle: #f8fafc;
    --app-surface-hover: #eff6ff;
    --app-surface-active: #eaf3ff;
    --app-overlay: rgba(15, 23, 42, 0.55);
    --app-loader-bg: rgba(215, 219, 221, 0.9);

    --app-text: #0f172a;
    --app-text-muted: #64748b;
    --app-text-subtle: #94a3b8;
    --app-text-inverse: #ffffff;
    --app-border: #dbe5ef;
    --app-border-strong: #cbd5e1;

    --app-input-bg: #ffffff;
    --app-input-text: #0f172a;
    --app-input-placeholder: #94a3b8;
    --app-input-border: #cbd5e1;
    --app-input-disabled: #eef2f7;

    --app-primary: #2563eb;
    --app-primary-hover: #1d4ed8;
    --app-primary-subtle: #eff6ff;
    --app-focus: rgba(37, 99, 235, 0.25);

    --app-success: #047857;
    --app-success-subtle: #ecfdf5;
    --app-warning: #b45309;
    --app-warning-subtle: #fffbeb;
    --app-danger: #dc2626;
    --app-danger-subtle: #fef2f2;
    --app-info: #0369a1;
    --app-info-subtle: #f0f9ff;

    --app-shadow: 0 10px 30px rgba(15, 23, 42, 0.08);
    --app-shadow-lg: 0 18px 42px rgba(15, 23, 42, 0.14);

    /* Compatibility aliases for existing PTL styles. */
    --topbar-bg: rgba(255, 255, 255, 0.94);
    --nav-bg: rgba(235, 244, 238, 0.96);
    --primary-text: var(--app-text);
    --muted-text: var(--app-text-muted);
    --soft-border: var(--app-border);
    --soft-border-2: #e6eef5;
    --soft-hover: var(--app-surface-hover);
    --nav-hover-bg: rgba(255, 255, 255, 0.88);
    --shadow-soft: var(--app-shadow);
    --shadow-nav: 0 6px 18px rgba(15, 23, 42, 0.05);

    --dash-bg: var(--app-canvas);
    --dash-card: var(--app-surface);
    --dash-border: var(--app-border);
    --dash-text: var(--app-text);
    --dash-muted: var(--app-text-muted);
    --dash-shadow: var(--app-shadow);
    --dash-shadow-soft: 0 6px 18px rgba(15, 23, 42, 0.05);

    --login-text: var(--app-text);
    --login-muted: var(--app-text-muted);
    --login-border: var(--app-border);
    --login-soft: var(--app-surface-subtle);
    --login-bg: var(--app-canvas-accent);
}

[data-bs-theme="dark"] {
    color-scheme: dark;

    --app-canvas: #0b1120;
    --app-canvas-accent: #0f172a;
    --app-surface: #111827;
    --app-surface-elevated: #182235;
    --app-surface-subtle: #172033;
    --app-surface-hover: #1e293b;
    --app-surface-active: #23324a;
    --app-overlay: rgba(0, 0, 0, 0.72);
    --app-loader-bg: rgba(2, 6, 23, 0.84);

    --app-text: #e5e7eb;
    --app-text-muted: #a8b3c5;
    --app-text-subtle: #94a3b8;
    --app-text-inverse: #0b1120;
    --app-border: #334155;
    --app-border-strong: #475569;

    --app-input-bg: #111827;
    --app-input-text: #e5e7eb;
    --app-input-placeholder: #94a3b8;
    --app-input-border: #475569;
    --app-input-disabled: #1e293b;

    --app-primary: #60a5fa;
    --app-primary-hover: #93c5fd;
    --app-primary-subtle: #172554;
    --app-focus: rgba(96, 165, 250, 0.32);

    --app-success: #6ee7b7;
    --app-success-subtle: #052e2b;
    --app-warning: #fbbf24;
    --app-warning-subtle: #422006;
    --app-danger: #fca5a5;
    --app-danger-subtle: #450a0a;
    --app-info: #7dd3fc;
    --app-info-subtle: #082f49;

    --app-shadow: 0 10px 30px rgba(0, 0, 0, 0.34);
    --app-shadow-lg: 0 18px 42px rgba(0, 0, 0, 0.48);

    --topbar-bg: rgba(17, 24, 39, 0.96);
    --nav-bg: rgba(15, 23, 42, 0.97);
    --primary-text: var(--app-text);
    --muted-text: var(--app-text-muted);
    --soft-border: var(--app-border);
    --soft-border-2: var(--app-border);
    --soft-hover: var(--app-surface-hover);
    --nav-hover-bg: rgba(51, 65, 85, 0.74);
    --shadow-soft: var(--app-shadow);
    --shadow-nav: 0 6px 18px rgba(0, 0, 0, 0.3);

    --dash-bg: var(--app-canvas);
    --dash-card: var(--app-surface);
    --dash-border: var(--app-border);
    --dash-text: var(--app-text);
    --dash-muted: var(--app-text-muted);
    --dash-shadow: var(--app-shadow);
    --dash-shadow-soft: 0 6px 18px rgba(0, 0, 0, 0.24);

    --login-text: var(--app-text);
    --login-muted: var(--app-text-muted);
    --login-border: var(--app-border);
    --login-soft: var(--app-surface-subtle);
    --login-bg: var(--app-canvas-accent);
}

html,
body {
    background-color: var(--app-canvas);
    color: var(--app-text);
}

.theme-ready body,
.theme-ready .card,
.theme-ready .modal-content,
.theme-ready .dropdown-menu,
.theme-ready .form-control,
.theme-ready .form-select {
    transition: background-color 160ms ease, border-color 160ms ease, color 160ms ease;
}

@media (prefers-reduced-motion: reduce) {
    .theme-ready body,
    .theme-ready .card,
    .theme-ready .modal-content,
    .theme-ready .dropdown-menu,
    .theme-ready .form-control,
    .theme-ready .form-select {
        transition: none;
    }
}

/* Shared application surfaces and Bootstrap 5.0 compatibility. */
.container_full,
.content_wrapper,
.page-wrapper,
.main-content {
    color: var(--app-text);
}

.card,
.modal-content,
.offcanvas,
.dropdown-menu,
.list-group-item,
.accordion-item,
.popover,
.bg-white,
.bg-light {
    background-color: var(--app-surface) !important;
    border-color: var(--app-border) !important;
    color: var(--app-text);
}

.toast:not(.toast-success):not(.toast-error):not(.toast-warning):not(.toast-info) {
    background-color: var(--app-surface) !important;
    border-color: var(--app-border) !important;
    color: var(--app-text);
}

.card-header,
.card-footer,
.modal-header,
.modal-footer,
.accordion-button,
.popover-header {
    background-color: var(--app-surface-subtle);
    border-color: var(--app-border);
    color: var(--app-text);
}

.dropdown-item,
.nav-link,
.list-group-item-action,
.page-link,
.breadcrumb-item,
.accordion-button {
    color: var(--app-text);
}

.dropdown-item:hover,
.dropdown-item:focus,
.list-group-item-action:hover,
.list-group-item-action:focus,
.page-link:hover,
.accordion-button:not(.collapsed) {
    background-color: var(--app-surface-hover);
    color: var(--app-text);
}

.dropdown-divider,
hr,
.border,
.border-top,
.border-end,
.border-bottom,
.border-start {
    border-color: var(--app-border) !important;
}

.text-dark {
    color: var(--app-text) !important;
}

.text-muted,
.form-text {
    color: var(--app-text-muted) !important;
}

.close,
.btn-close {
    color: var(--app-text);
}

[data-bs-theme="dark"] .btn-close {
    filter: invert(1) grayscale(100%) brightness(200%);
}

.modal-backdrop,
#overlay {
    background-color: var(--app-overlay);
}

/* Inputs and focus states. */
.form-control,
.form-select,
.input-group-text,
.custom-select,
select,
textarea {
    background-color: var(--app-input-bg);
    border-color: var(--app-input-border);
    color: var(--app-input-text);
}

.form-label {
    color: var(--app-text);
}

.form-control:focus,
.form-select:focus,
.custom-select:focus,
select:focus,
textarea:focus {
    background-color: var(--app-input-bg);
    border-color: var(--app-primary);
    color: var(--app-input-text);
    box-shadow: 0 0 0 0.2rem var(--app-focus);
}

.form-control::placeholder,
textarea::placeholder {
    color: var(--app-input-placeholder);
    opacity: 1;
}

.form-control:disabled,
.form-control[readonly],
.form-select:disabled,
select:disabled,
textarea:disabled {
    background-color: var(--app-input-disabled);
    color: var(--app-text-muted);
    opacity: 1;
}

[data-bs-theme="dark"] input:-webkit-autofill,
[data-bs-theme="dark"] input:-webkit-autofill:hover,
[data-bs-theme="dark"] input:-webkit-autofill:focus {
    -webkit-text-fill-color: var(--app-input-text);
    box-shadow: 0 0 0 1000px var(--app-input-bg) inset;
    caret-color: var(--app-input-text);
}

:focus-visible {
    outline: 2px solid var(--app-primary);
    outline-offset: 2px;
}

/* Theme-aware QR actions used by stock and barcode reports. */
.theme-qr-icon {
    color: var(--app-primary) !important;
    transition: color 150ms ease;
}

button:hover .theme-qr-icon,
button:focus .theme-qr-icon {
    color: var(--app-primary-hover) !important;
}

/* Tables, including legacy striped and hover rules. */
.table {
    --row-bg: var(--app-surface);
    color: var(--app-text);
    border-color: var(--app-border);
}

[data-bs-theme="dark"] .table,
[data-bs-theme="dark"] table.dataTable {
    background: var(--app-surface) !important;
    border-color: var(--app-border) !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.22);
    color: var(--app-text) !important;
}

.table > :not(caption) > * > *,
.table thead th,
.table tbody td,
.table tfoot td,
.table tfoot th {
    background-color: var(--row-bg, var(--app-surface)) !important;
    border-color: var(--app-border) !important;
    color: var(--app-text);
}

.table-striped > tbody > tr:nth-of-type(odd),
.table tbody tr:nth-of-type(odd) {
    --row-bg: var(--app-surface);
}

.table-striped > tbody > tr:nth-of-type(even),
.table tbody tr:nth-of-type(even) {
    --row-bg: var(--app-surface-subtle);
}

.table-hover > tbody > tr:hover,
.table tbody tr:hover {
    --row-bg: var(--app-surface-hover);
    color: var(--app-text);
}

.table-light,
.thead-light,
.table .thead-light th {
    --row-bg: var(--app-surface-subtle);
    background-color: var(--app-surface-subtle) !important;
    color: var(--app-text) !important;
}

[data-bs-theme="dark"] table thead,
[data-bs-theme="dark"] .table thead,
[data-bs-theme="dark"] table.dataTable thead {
    background: var(--app-surface-elevated) !important;
    color: var(--app-text) !important;
}

[data-bs-theme="dark"] table thead th,
[data-bs-theme="dark"] table thead td,
[data-bs-theme="dark"] .table thead th,
[data-bs-theme="dark"] .table thead td,
[data-bs-theme="dark"] table.dataTable thead th,
[data-bs-theme="dark"] table.dataTable thead td,
[data-bs-theme="dark"] .table .thead-light th {
    --row-bg: var(--app-surface-elevated);
    background: linear-gradient(
        180deg,
        var(--app-surface-elevated) 0%,
        var(--app-surface-subtle) 100%
    ) !important;
    border-color: var(--app-border-strong) !important;
    color: var(--app-text) !important;
}

.table-primary > :not(caption) > * > * {
    --row-bg: var(--app-primary-subtle);
}

.table-success > :not(caption) > * > * {
    --row-bg: var(--app-success-subtle);
}

.table-warning > :not(caption) > * > * {
    --row-bg: var(--app-warning-subtle);
}

.table-danger > :not(caption) > * > * {
    --row-bg: var(--app-danger-subtle);
}

.table-info > :not(caption) > * > * {
    --row-bg: var(--app-info-subtle);
}

/* Semantic feedback remains distinguishable in both modes. */
.alert-success {
    background-color: var(--app-success-subtle);
    border-color: var(--app-success);
    color: var(--app-success);
}

.alert-warning {
    background-color: var(--app-warning-subtle);
    border-color: var(--app-warning);
    color: var(--app-warning);
}

.alert-danger,
.validation-summary-errors {
    background-color: var(--app-danger-subtle);
    border-color: var(--app-danger);
    color: var(--app-danger);
}

.alert-info {
    background-color: var(--app-info-subtle);
    border-color: var(--app-info);
    color: var(--app-info);
}

.text-danger,
.field-validation-error {
    color: var(--app-danger) !important;
}

/* Existing top bar and navigation. */
[data-bs-theme="dark"] .header-info-wrap {
    background: linear-gradient(180deg, #111827 0%, #0f172a 100%);
}

[data-bs-theme="dark"] .navbar-premium {
    background: linear-gradient(180deg, #111827 0%, #172033 100%);
}

[data-bs-theme="dark"] .navbar-light .navbar-nav .nav-link,
[data-bs-theme="dark"] .navbar-light .navbar-brand,
[data-bs-theme="dark"] .company-title,
[data-bs-theme="dark"] .user-name {
    color: var(--app-text);
}

[data-bs-theme="dark"] .navbar-light .navbar-toggler {
    border-color: var(--app-border);
    color: var(--app-text);
}

[data-bs-theme="dark"] .navbar-light .navbar-toggler-icon {
    filter: invert(1) grayscale(100%) brightness(180%);
}

/* Login/public layout. */
[data-bs-theme="dark"] body {
    background: radial-gradient(circle at top left, rgba(37, 99, 235, 0.12), transparent 30%),
        radial-gradient(circle at bottom right, rgba(14, 165, 233, 0.08), transparent 34%),
        linear-gradient(180deg, var(--app-canvas-accent) 0%, var(--app-canvas) 100%);
}

[data-bs-theme="dark"] .login-card,
[data-bs-theme="dark"] .login-right,
[data-bs-theme="dark"] .modal-body {
    background: var(--app-surface) !important;
    border-color: var(--app-border);
    color: var(--app-text);
}

[data-bs-theme="dark"] .modal-header {
    background: linear-gradient(
        180deg,
        var(--app-surface-elevated) 0%,
        var(--app-surface-subtle) 100%
    ) !important;
    border-bottom-color: var(--app-border-strong) !important;
    color: var(--app-text) !important;
}

[data-bs-theme="dark"] .modal-header .modal-title,
[data-bs-theme="dark"] .modal-header h1,
[data-bs-theme="dark"] .modal-header h2,
[data-bs-theme="dark"] .modal-header h3,
[data-bs-theme="dark"] .modal-header h4,
[data-bs-theme="dark"] .modal-header h5,
[data-bs-theme="dark"] .modal-header h6 {
    color: var(--app-text) !important;
}

[data-bs-theme="dark"] .login-card {
    box-shadow: var(--app-shadow-lg);
}

[data-bs-theme="dark"] .forgot-wrap {
    border-color: var(--app-border);
}

[data-bs-theme="dark"] .modal-title,
[data-bs-theme="dark"] .heading.lead,
[data-bs-theme="dark"] .page-footer-login {
    color: var(--app-text);
}

/* Dashboard-specific legacy surfaces and text. */
[data-bs-theme="dark"] .kpi-card::before {
    background: linear-gradient(180deg, rgba(17, 24, 39, 0.78), rgba(17, 24, 39, 0.98));
}

[data-bs-theme="dark"] .side-stat-item,
[data-bs-theme="dark"] .side-panel .list-group-item > a,
[data-bs-theme="dark"] .recent-activity-panel .card-header,
[data-bs-theme="dark"] .recent-activity-header,
[data-bs-theme="dark"] .recent-activity-item,
[data-bs-theme="dark"] .recent-activity-user,
[data-bs-theme="dark"] .top-user-panel .card-header,
[data-bs-theme="dark"] .top-user-item,
[data-bs-theme="dark"] .store-financial-card,
[data-bs-theme="dark"] .top5-store-card,
[data-bs-theme="dark"] .kpi-box,
[data-bs-theme="dark"] .store-block,
[data-bs-theme="dark"] .top5-toggle .nav-link {
    background: var(--app-surface) !important;
    border-color: var(--app-border) !important;
    color: var(--app-text);
}

[data-bs-theme="dark"] .side-stat-item:hover,
[data-bs-theme="dark"] .side-panel .list-group-item > a:hover,
[data-bs-theme="dark"] .recent-activity-item:hover,
[data-bs-theme="dark"] .top-user-item:hover,
[data-bs-theme="dark"] .activity-search-box,
[data-bs-theme="dark"] .activity-search-box:focus-within {
    background: var(--app-surface-hover) !important;
    border-color: var(--app-border-strong) !important;
}

[data-bs-theme="dark"] .top-rank-1 {
    background: linear-gradient(90deg, rgba(133, 100, 4, 0.2), var(--app-surface) 100%) !important;
}

[data-bs-theme="dark"] .top-rank-2 {
    background: linear-gradient(90deg, rgba(148, 163, 184, 0.16), var(--app-surface) 100%) !important;
}

[data-bs-theme="dark"] .top-rank-3 {
    background: linear-gradient(90deg, rgba(234, 88, 12, 0.16), var(--app-surface) 100%) !important;
}

[data-bs-theme="dark"] .kpi-value,
[data-bs-theme="dark"] .panel-title,
[data-bs-theme="dark"] .homepage_fl_right span.h3,
[data-bs-theme="dark"] .voucher-title,
[data-bs-theme="dark"] .user-name,
[data-bs-theme="dark"] .top-user-name,
[data-bs-theme="dark"] .top-user-count,
[data-bs-theme="dark"] .store-title,
[data-bs-theme="dark"] .top-item-name,
[data-bs-theme="dark"] .top-item-value {
    color: var(--app-text) !important;
}

[data-bs-theme="dark"] .kpi-label,
[data-bs-theme="dark"] .kpi-meta,
[data-bs-theme="dark"] .panel-subtitle,
[data-bs-theme="dark"] .side-stat-label,
[data-bs-theme="dark"] .homepage_fl_right h5,
[data-bs-theme="dark"] .activity-time,
[data-bs-theme="dark"] .recent-activity-meta span,
[data-bs-theme="dark"] .user-role,
[data-bs-theme="dark"] .top-user-role,
[data-bs-theme="dark"] .empty-top5 {
    color: var(--app-text-muted) !important;
}

[data-bs-theme="dark"] .top5-toggle .nav-link.active {
    background: var(--app-primary) !important;
    border-color: var(--app-primary) !important;
    color: var(--app-text-inverse) !important;
}

[data-bs-theme="dark"] .top-item-progress {
    background: var(--app-surface-active);
}

/* Theme switcher. */
.theme-switcher-toggle {
    align-items: center;
    background: var(--app-surface-subtle);
    border: 1px solid var(--app-border);
    border-radius: 50%;
    color: var(--app-text);
    display: inline-flex;
    height: 36px;
    justify-content: center;
    padding: 0;
    width: 36px;
}

.theme-switcher-toggle::after {
    display: none;
}

.theme-switcher-toggle:hover,
.theme-switcher-toggle:focus,
.theme-switcher-toggle[aria-expanded="true"] {
    background: var(--app-surface-hover);
    border-color: var(--app-primary);
    color: var(--app-primary);
    box-shadow: 0 0 0 0.2rem var(--app-focus);
}

.theme-switcher-menu {
    min-width: 9.5rem;
    padding: 0.4rem;
    z-index: 3100;
}

.theme-switcher-menu .dropdown-item {
    border: 0;
    border-radius: 0.45rem;
    padding: 0.45rem 0.65rem;
}

.theme-switcher-menu .dropdown-item.active,
.theme-switcher-menu .dropdown-item:active {
    background: var(--app-primary-subtle);
    color: var(--app-primary);
}

.public-theme-switcher {
    position: fixed;
    right: 1rem;
    top: 1rem;
    z-index: 1080;
}

/* Vendor controls loaded by _MainLayout. */
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple,
.select2-dropdown,
.select2-search__field {
    background-color: var(--app-input-bg) !important;
    border-color: var(--app-input-border) !important;
    color: var(--app-input-text) !important;
}

.select2-container--default .select2-selection--single .select2-selection__rendered,
.select2-container--default .select2-selection--multiple .select2-selection__choice {
    color: var(--app-input-text) !important;
}

.select2-container--default .select2-results__option[aria-selected="true"],
.select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: var(--app-surface-active) !important;
    color: var(--app-text) !important;
}

.select2-container--default .select2-selection--multiple .select2-selection__choice {
    background-color: var(--app-surface-hover) !important;
    border-color: var(--app-border) !important;
}

.ui-widget,
.ui-widget-content,
.ui-datepicker,
.datepicker-dropdown,
.datepicker-dropdown table,
.datepicker-dropdown td,
.datepicker-dropdown th {
    background-color: var(--app-surface-elevated);
    border-color: var(--app-border);
    color: var(--app-text);
}

.ui-widget-header,
.datepicker table tr td.active,
.datepicker table tr td.active:hover {
    background: var(--app-surface-subtle);
    border-color: var(--app-border);
    color: var(--app-text);
}

.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default {
    background: var(--app-surface);
    border-color: var(--app-border);
    color: var(--app-text);
}

.ui-state-hover,
.ui-widget-content .ui-state-hover,
.datepicker table tr td.day:hover,
.datepicker table tr td.focused {
    background: var(--app-surface-hover);
    color: var(--app-text);
}

.note-editor.note-frame,
.note-toolbar,
.note-statusbar,
.note-editable,
.note-dropdown-menu {
    background-color: var(--app-surface) !important;
    border-color: var(--app-border) !important;
    color: var(--app-text) !important;
}

.note-btn {
    background-color: var(--app-surface-subtle);
    border-color: var(--app-border);
    color: var(--app-text);
}

.swal-modal,
.swal-title,
.swal-text,
.swal-content,
.swal-footer {
    background-color: var(--app-surface-elevated);
    color: var(--app-text);
}

.swal-icon--success::before,
.swal-icon--success::after,
.swal-icon--success__hide-corners {
    background-color: var(--app-surface-elevated);
}

.dataTables_wrapper,
.dataTables_info,
.dataTables_length,
.dataTables_filter,
.dataTables_paginate,
.dataTables_wrapper label {
    color: var(--app-text-muted) !important;
}

.dataTables_wrapper input,
.dataTables_wrapper select {
    background: var(--app-input-bg);
    border-color: var(--app-input-border);
    color: var(--app-input-text);
}

table.dataTable tbody tr,
table.dataTable.display tbody tr.odd,
table.dataTable.display tbody tr.even,
table.dataTable tbody td,
.dtfc-fixed-left,
.dtfc-fixed-right {
    background-color: var(--row-bg, var(--app-surface)) !important;
    color: var(--app-text);
}

/* DataTables can render Bootstrap page links or its native paginate buttons. */
.dataTables_wrapper .dataTables_paginate .page-link,
.dataTables_wrapper .dataTables_paginate .paginate_button {
    background: var(--app-surface) !important;
    border: 1px solid var(--app-border) !important;
    color: var(--app-text-muted) !important;
}

.dataTables_wrapper .dataTables_paginate .page-link:hover,
.dataTables_wrapper .dataTables_paginate .page-link:focus,
.dataTables_wrapper .dataTables_paginate .paginate_button:not(.disabled):not(.current):hover,
.dataTables_wrapper .dataTables_paginate .paginate_button:not(.disabled):not(.current):focus {
    background: var(--app-surface-hover) !important;
    border-color: var(--app-primary) !important;
    color: var(--app-primary) !important;
    box-shadow: 0 0 0 0.2rem var(--app-focus) !important;
    outline: 0;
}

.dataTables_wrapper .dataTables_paginate .page-item.active .page-link,
.dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
    background: var(--app-primary) !important;
    border-color: var(--app-primary) !important;
    color: var(--app-text-inverse) !important;
}

.dataTables_wrapper .dataTables_paginate .page-item.disabled .page-link,
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover,
.dataTables_wrapper .dataTables_paginate .paginate_button.disabled:focus {
    background: var(--app-input-disabled) !important;
    border-color: var(--app-border) !important;
    color: var(--app-text-muted) !important;
    cursor: not-allowed !important;
    opacity: 0.72;
    box-shadow: none !important;
}

.dataTables_wrapper .dataTables_paginate .ellipsis {
    color: var(--app-text-muted) !important;
}

/* Non-DataTable Bootstrap pagination uses the same theme palette. */
.pagination .page-link {
    background-color: var(--app-surface);
    border-color: var(--app-border);
    color: var(--app-text-muted);
}

.pagination .page-item.disabled .page-link {
    background-color: var(--app-input-disabled);
    border-color: var(--app-border);
    color: var(--app-text-muted);
}

.pagination .page-item.active .page-link {
    background-color: var(--app-primary);
    border-color: var(--app-primary);
    color: var(--app-text-inverse);
}

.apexcharts-canvas,
.apexcharts-svg {
    background: transparent !important;
}

.apexcharts-tooltip,
.apexcharts-xaxistooltip,
.apexcharts-yaxistooltip {
    background: var(--app-surface-elevated) !important;
    border-color: var(--app-border) !important;
    color: var(--app-text) !important;
}

.apexcharts-tooltip-title {
    background: var(--app-surface-subtle) !important;
    border-color: var(--app-border) !important;
}

[data-bs-theme="dark"] .apexcharts-title-text {
    fill: var(--app-text) !important;
}

[data-bs-theme="dark"] .apexcharts-xaxis-label,
[data-bs-theme="dark"] .apexcharts-yaxis-label,
[data-bs-theme="dark"] .apexcharts-legend-text {
    color: var(--app-text-muted) !important;
    fill: var(--app-text-muted) !important;
}

.busy-load-container {
    color: var(--app-text);
}

[data-bs-theme="dark"] .busy-load-container {
    background: var(--app-loader-bg) !important;
}

.google-visualization-orgchart-node,
.google-visualization-orgchart-nodesel {
    background: var(--app-surface) !important;
    border-color: var(--app-border) !important;
    color: var(--app-text) !important;
}

/* Images and uploaded content keep their original color data. */
[data-bs-theme="dark"] img,
[data-bs-theme="dark"] video,
[data-bs-theme="dark"] canvas {
    filter: none;
}

/* Receipts are paper-like on screen and always print in light mode. */
.receipt,
#receiptArea,
.receipt-container {
    color-scheme: light;
}

[data-bs-theme="dark"] .receipt,
[data-bs-theme="dark"] #receiptArea {
    background: #ffffff !important;
    color: #000000 !important;
}

@media print {
    :root,
    html,
    body {
        color-scheme: only light !important;
        background: #ffffff !important;
        color: #000000 !important;
    }

    .theme-switcher,
    .public-theme-switcher {
        display: none !important;
    }

    .card,
    .card-header,
    .card-footer,
    .table,
    .table > :not(caption) > * > *,
    .receipt,
    #receiptArea {
        background: #ffffff !important;
        color: #000000 !important;
        box-shadow: none !important;
    }

    .table,
    .table > :not(caption) > * > *,
    .receipt,
    #receiptArea {
        border-color: #000000 !important;
    }
}