:root,
[data-theme="light"] {
    /* Brand */
    --gold: #AE8732;
    --gold-dark: #8C6B27;
    --gold-light: #F4EAD3;
    --gold-line: #D9BE84;
    --gold-text-on-fill: #221804;

    /* Sidebar (dark shell even in light mode) */
    --sidebar-bg: #211C16;
    --sidebar-bg-2: #2C2519;
    --sidebar-border: #3A3123;
    --sidebar-text: #C9BFA9;
    --sidebar-text-strong: #F6EFDD;
    --sidebar-text-faint: #8A806A;

    /* Surfaces */
    --canvas: #F5EFE6;
    --card: #FFFFFF;
    --card-2: #F9F4EB;
    --border: #E3D9C5;

    /* Text */
    --text: #2A241B;
    --text-soft: #6B634E;
    --text-faint: #9A8F76;
    --ink: #1A160F;

    /* Status — derived from primary gold, kept distinguishable */
    --get: #6B5A3D;
    --get-bg: #F4EAD3;
    --post: #8C5A1F;
    --post-bg: #F6E9D4;

    --shadow: 0 1px 2px rgba(27, 23, 18, 0.05), 0 8px 24px rgba(27, 23, 18, 0.05);

    /* Osen/Bootstrap shadow bridge */
    --osen-box-shadow: var(--shadow);
    --osen-box-shadow-sm: 0 1px 2px rgba(27, 23, 18, 0.05), 0 2px 8px rgba(27, 23, 18, 0.05);
    --osen-box-shadow-lg: var(--shadow);

    /* Compatibility aliases for existing component CSS */
    --brand-primary: var(--gold);
    --brand-primary-rgb: 174, 135, 50;
    --brand-primary-hover: var(--gold-dark);
    --brand-primary-active: var(--gold-dark);
    --brand-primary-soft: var(--gold-light);
    --brand-primary-subtle: var(--gold-light);
    --brand-primary-border: var(--gold-line);
    --brand-primary-text: var(--gold-text-on-fill);
    --brand-on-primary: var(--gold-text-on-fill);
    --brand-gold-highlight: var(--gold);
    --brand-sidebar-bg: var(--sidebar-bg);
    --brand-sidebar-text: var(--sidebar-text);
    --brand-sidebar-muted: var(--sidebar-text-faint);
    --brand-sidebar-active: var(--gold-light);
    --brand-topbar-bg: var(--card);
    --brand-page-bg: var(--canvas);
    --brand-card-bg: var(--card);
    --brand-table-header: var(--gold-light);
    --brand-table-border: var(--border);

    /* Osen/Bootstrap variable bridge */
    --osen-body-bg: var(--canvas);
    --osen-body-color: var(--text);
    --osen-body-color-rgb: 40, 34, 26;
    --osen-secondary-color: var(--text-soft);
    --osen-secondary-color-rgb: 121, 112, 94;
    --osen-primary: var(--gold);
    --osen-primary-rgb: var(--brand-primary-rgb);
    --osen-blue: var(--gold);
    --osen-link-color: var(--gold);
    --osen-link-hover-color: var(--gold-dark);
    --osen-menu-bg: var(--sidebar-bg);
    --osen-menu-item-color: var(--sidebar-text);
    --osen-menu-item-hover-color: var(--sidebar-text-strong);
    --osen-menu-item-hover-bg: var(--sidebar-bg-2);
    --osen-menu-item-active-color: var(--gold);
    --osen-menu-item-active-bg: linear-gradient(90deg, var(--gold-light), transparent);
    --osen-menu-item-icon-color: var(--sidebar-text);
    --osen-menu-item-icon-active-color: var(--gold);
    --osen-menu-item-icon-hover-color: var(--sidebar-text-strong);
    --osen-topbar-bg: var(--card);
    --osen-topbar-item-color: var(--text);
    --osen-topbar-item-hover-color: var(--gold);
}

html {
    color-scheme: light;
}

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


/* Landing page tokens */
:root,
[data-theme="light"] {
    --landing-card: var(--card);
    --landing-ink: var(--ink);
}

[data-theme="dark"] {
    --landing-card: var(--card);
    --landing-ink: var(--ink);
}

[data-theme="dark"] {
    /* Brand — identical hue, dark-safe variants for tints/lines only */
    --gold: #AE8732;
    --gold-dark: #C99B44;
    --gold-light: rgba(174, 135, 50, 0.22);
    --gold-line: rgba(217, 190, 132, 0.45);
    --gold-text-on-fill: #1B1204;

    /* Sidebar */
    --sidebar-bg: #15110C;
    --sidebar-bg-2: #1E1911;
    --sidebar-border: #332B1E;
    --sidebar-text: #C9BFA9;
    --sidebar-text-strong: #F6EFDD;
    --sidebar-text-faint: #786F5C;

    /* Surfaces */
    --canvas: #1A150E;
    --card: #221C14;
    --card-2: #2A2317;
    --border: #3A3123;

    /* Text */
    --text: #EFE7D6;
    --text-soft: #B9AD92;
    --text-faint: #8A806A;
    --ink: #F6EFDD;

    /* Status */
    --get: #8FD3B7;
    --get-bg: rgba(47, 109, 92, 0.22);
    --post: #E3BC84;
    --post-bg: rgba(140, 90, 31, 0.22);

    --shadow: 0 1px 2px rgba(0, 0, 0, 0.3), 0 8px 24px rgba(0, 0, 0, 0.35);

    /* Osen/Bootstrap shadow bridge */
    --osen-box-shadow: var(--shadow);
    --osen-box-shadow-sm: var(--shadow);
    --osen-box-shadow-lg: var(--shadow);

    /* Osen/Bootstrap dark bridge */
    --osen-body-bg: var(--canvas);
    --osen-body-color: var(--text);
    --osen-body-color-rgb: 239, 231, 214;
    --osen-secondary-color: var(--text-soft);
    --osen-secondary-color-rgb: 185, 173, 146;
    --osen-primary-bg-subtle: var(--gold-light);
    --osen-primary-border-subtle: var(--gold-line);
    --osen-primary-text-emphasis: var(--gold);
    --osen-menu-bg: var(--sidebar-bg);
    --osen-menu-item-color: var(--sidebar-text);
    --osen-menu-item-hover-bg: var(--sidebar-bg-2);
    --osen-menu-item-active-bg: linear-gradient(90deg, var(--gold-light), transparent);
    --osen-topbar-bg: var(--card);
    --osen-topbar-item-color: var(--text);
}

/* Smooth switching for themeable surfaces */
html,
body,
.page-content,
.content-page,
.wrapper,
.app-topbar,
.topbar-color,
.page-container,
.sidenav-menu,
.leftside-menu,
.navbar-vertical-content,
.card,
.data-table,
.table,
.table thead th,
.table td,
.modal-content,
.dropdown-menu,
.form-control,
.form-select,
.form-check-input,
.select2-container--default .select2-selection--single,
.select2-container--default .select2-selection--multiple,
.gridjs-wrapper,
.gridjs-td,
.gridjs-th,
.toast,
.swal2-popup {
    transition: background-color .18s ease, color .18s ease, border-color .18s ease;
}

/* Osen theme primary overrides */
html,
[data-bs-theme="light"],
[data-bs-theme="dark"] {
    --osen-primary: var(--gold) !important;
    --osen-primary-rgb: var(--brand-primary-rgb) !important;
    --osen-blue: var(--gold) !important;
    --osen-primary-text-emphasis: var(--gold-text-on-fill) !important;
    --osen-primary-bg-subtle: var(--gold-light) !important;
    --osen-primary-border-subtle: var(--gold-line) !important;
}

/* Legacy admin theme variables */
:root {
    --theme-primary: var(--gold);
    --theme-primary-hover: var(--gold-dark);
    --theme-primary-drop: var(--gold-light);
    --theme-primary-text: var(--gold-text-on-fill);
    --theme-complementary: var(--gold);
    --theme-complementary-text: var(--gold);
    --theme-active-text: var(--gold);
    --primary-clr: var(--gold);
    --primary: var(--gold);
    --base-clr: var(--gold);
    --base-clr-2: var(--gold);
    --dark-clr: var(--sidebar-bg);
    --border-clr: var(--border);
    --title-clr: var(--ink);
}

/* Buttons */
.btn-primary,
.btn--primary,
.page-button,
.btn-add-new,
.login-button,
.swal2-confirm {
    background-color: var(--gold) !important;
    border-color: var(--gold) !important;
    color: var(--gold-text-on-fill) !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.btn--primary:hover,
.btn--primary:focus,
.btn--primary:active,
.btn-add-new:hover,
.btn-add-new:focus,
.btn-add-new:active,
.login-button:hover,
.login-button:focus,
.swal2-confirm:hover,
.swal2-confirm:focus {
    background-color: var(--gold-dark) !important;
    border-color: var(--gold-dark) !important;
    color: var(--gold-text-on-fill) !important;
}

.btn-outline-primary {
    color: var(--gold) !important;
    border-color: var(--gold) !important;
}

.btn-outline-primary:hover,
.btn-outline-primary:focus,
.btn-outline-primary:active {
    background-color: var(--gold) !important;
    border-color: var(--gold) !important;
    color: var(--gold-text-on-fill) !important;
}

/* Links */
a,
.link-primary,
.page-link,
.breadcrumb a,
.voyager .breadcrumb a,
.topbar-link,
.dropdown-item:hover,
.dropdown-item:focus {
    color: var(--gold);
}

.nav-link,
.navbar-nav .nav-link,
.side-nav-link .menu-text,
.side-nav-link .menu-icon,
.navbar-vertical-aside-has-menu .nav-link,
.navbar-vertical-aside-has-menu.active>.nav-link,
.navbar-vertical .navbar-nav .nav-link,
.navbar-vertical .navbar-nav .nav-link:hover {
    color: var(--sidebar-text);
}

.side-nav-link:hover .menu-text,
.side-nav-link:hover .menu-icon,
.navbar-vertical-aside-has-menu .nav-link:hover,
.navbar-vertical-aside-has-menu.active>.nav-link,
.navbar-vertical .navbar-nav .nav-link:hover {
    color: var(--sidebar-text-strong);
}

a:hover,
.link-primary:hover,
.page-link:hover,
.breadcrumb a:hover,
.nav-link:hover,
.topbar-link:hover,
.dropdown-item:hover {
    color: var(--gold-dark);
}

/* Badges */
.badge-primary,
.badge-soft-primary,
.badge.bg-primary {
    background-color: var(--gold-light) !important;
    color: var(--gold-text-on-fill) !important;
}

.badge-primary {
    background-color: var(--gold) !important;
    color: var(--gold-text-on-fill) !important;
}

/* Form focus states */
.form-control:focus,
.form-select:focus,
.form-check-input:focus,
.form-group-default.focused,
body.login .form-group-default.focused,
.select2-container--default.select2-container--focus .select2-selection--multiple,
.select2-container--default.select2-container--open .select2-selection--multiple {
    border-color: var(--gold) !important;
    outline: 0 !important;
    box-shadow: none !important;
}

.form-check-input:checked {
    background-color: var(--gold) !important;
    border-color: var(--gold) !important;
}

/* Tabs / pills */
.nav-tabs .nav-link.active,
.nav-pills .nav-link.active,
.customer-tab-section .nav-link.active,
.merchant-tab-section .nav-link.active {
    background-color: var(--gold) !important;
    border-color: var(--gold) !important;
    color: var(--gold-text-on-fill) !important;
}

/* Topbar — always light/card background regardless of data-topbar-color */
.app-topbar,
.app-topbar-wrapper,
.topbar-color,
.page-container.topbar-color,
[data-bs-theme="light"] .app-topbar,
[data-bs-theme="light"] .app-topbar-wrapper,
[data-bs-theme="light"] .topbar-color,
[data-bs-theme="light"] .page-container.topbar-color,
[data-bs-theme="dark"] .app-topbar,
[data-bs-theme="dark"] .app-topbar-wrapper,
[data-bs-theme="dark"] .topbar-color,
[data-bs-theme="dark"] .page-container.topbar-color,
[data-theme="light"] .app-topbar,
[data-theme="light"] .app-topbar-wrapper,
[data-theme="light"] .topbar-color,
[data-theme="light"] .page-container.topbar-color,
[data-theme="dark"] .app-topbar,
[data-theme="dark"] .app-topbar-wrapper,
[data-theme="dark"] .topbar-color,
[data-theme="dark"] .page-container.topbar-color {
    background: var(--card) !important;
    border-bottom: 1px solid var(--border) !important;
}

.app-topbar .topbar-link,
.app-topbar .dropdown-toggle,
.app-topbar .topbar-menu .topbar-item .topbar-link,
.app-topbar .header-title,
.app-topbar h1,
.app-topbar h2,
.app-topbar h3,
.app-topbar h4,
.app-topbar h5,
.app-topbar h6 {
    color: var(--ink) !important;
}

.app-topbar .text-muted,
.app-topbar .small,
.app-topbar small,
.app-topbar .topbar-item,
.app-topbar .dropdown-menu .dropdown-header,
.app-topbar .user-role {
    color: var(--text-soft) !important;
}

.app-topbar .topbar-link:hover,
.app-topbar .topbar-link:focus,
.app-topbar .dropdown-toggle:hover,
.app-topbar #light-dark-mode:hover {
    color: var(--gold) !important;
}

/* Theme toggle icon button */
#light-dark-mode {
    background-color: var(--gold-light) !important;
    border: 1px solid var(--gold-line) !important;
    color: var(--gold-dark) !important;
    border-radius: 0.5rem !important;
    width: 2.5rem;
    height: 2.5rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
}

#light-dark-mode:hover,
#light-dark-mode:focus {
    background-color: var(--gold) !important;
    border-color: var(--gold) !important;
    color: var(--gold-text-on-fill) !important;
}

/* Topbar user block and search must sit on the card background */
.app-topbar .nav-user,
.app-topbar .topbar-search,
.app-topbar .dropdown-menu,
.app-topbar .dropdown-menu .dropdown-header,
.app-topbar .dropdown-menu .dropdown-item,
.app-topbar .dropdown-menu .dropdown-divider {
    background-color: var(--card) !important;
    color: var(--text) !important;
    border-color: var(--border) !important;
}

.app-topbar .dropdown-menu .dropdown-item:hover,
.app-topbar .dropdown-menu .dropdown-item:focus {
    background-color: var(--gold-light) !important;
    color: var(--gold-text-on-fill) !important;
}

.app-topbar .nav-user .user-name,
.app-topbar .nav-user .user-role,
.app-topbar .nav-user h5,
.app-topbar .nav-user h6,
.app-topbar .nav-user .dropdown-toggle {
    color: var(--ink) !important;
}

.app-topbar .nav-user img,
.app-topbar .nav-user .avatar-circle {
    border: none;
}

/* Force all surface components to resolve through tokens, not Osen sidebar colors */
[data-bs-theme="light"] .card,
[data-bs-theme="dark"] .card,
[data-theme="light"] .card,
[data-theme="dark"] .card {
    background-color: var(--card) !important;
    box-shadow: var(--shadow) !important;
}

[data-bs-theme="light"] .shadow-sm,
[data-bs-theme="dark"] .shadow-sm,
[data-theme="light"] .shadow-sm,
[data-theme="dark"] .shadow-sm,
[data-bs-theme="light"] .shadow,
[data-bs-theme="dark"] .shadow,
[data-theme="light"] .shadow,
[data-theme="dark"] .shadow,
[data-bs-theme="light"] .shadow-lg,
[data-bs-theme="dark"] .shadow-lg,
[data-theme="light"] .shadow-lg,
[data-theme="dark"] .shadow-lg {
    box-shadow: var(--shadow) !important;
}

[data-bs-theme="light"] .dropdown-menu,
[data-bs-theme="dark"] .dropdown-menu,
[data-theme="light"] .dropdown-menu,
[data-theme="dark"] .dropdown-menu {
    background-color: var(--card) !important;
    color: var(--text) !important;
    border-color: var(--border) !important;
    box-shadow: var(--shadow) !important;
}

[data-bs-theme="light"] .dropdown-menu .dropdown-item,
[data-bs-theme="dark"] .dropdown-menu .dropdown-item,
[data-theme="light"] .dropdown-menu .dropdown-item,
[data-theme="dark"] .dropdown-menu .dropdown-item {
    color: var(--text) !important;
}

[data-bs-theme="light"] .dropdown-menu .dropdown-item:hover,
[data-bs-theme="dark"] .dropdown-menu .dropdown-item:hover,
[data-theme="light"] .dropdown-menu .dropdown-item:hover,
[data-theme="dark"] .dropdown-menu .dropdown-item:hover {
    background-color: var(--gold-light) !important;
    color: var(--gold-text-on-fill) !important;
}

[data-bs-theme="light"] .sidenav-menu,
[data-bs-theme="light"] .leftside-menu,
[data-bs-theme="dark"] .sidenav-menu,
[data-bs-theme="dark"] .leftside-menu,
[data-theme="light"] .sidenav-menu,
[data-theme="light"] .leftside-menu,
[data-theme="dark"] .sidenav-menu,
[data-theme="dark"] .leftside-menu {
    background: var(--sidebar-bg) !important;
}

/* Force Osen sidebar variables for readable contrast on dark sidebar */
.sidenav-menu,
.leftside-menu,
html[data-menu-color="brand"] .sidenav-menu,
html[data-menu-color="dark"] .sidenav-menu,
html[data-menu-color="brand"] .leftside-menu,
html[data-menu-color="dark"] .leftside-menu {
    --osen-menu-bg: var(--sidebar-bg) !important;
    --osen-menu-item-color: var(--sidebar-text) !important;
    --osen-menu-item-hover-color: var(--sidebar-text-strong) !important;
    --osen-menu-item-hover-bg: var(--sidebar-bg-2) !important;
    --osen-menu-item-active-color: var(--gold) !important;
    --osen-menu-item-active-bg: linear-gradient(90deg, var(--gold-light), transparent) !important;
    --osen-menu-item-icon-color: var(--sidebar-text) !important;
    --osen-menu-item-icon-active-color: var(--gold) !important;
    --osen-menu-item-icon-hover-color: var(--sidebar-text-strong) !important;
}

/* Main content / page background */
[data-bs-theme="light"] .page-content,
[data-bs-theme="light"] .content-page,
[data-bs-theme="light"] .wrapper>.content-page,
[data-bs-theme="light"] body,
[data-bs-theme="dark"] .page-content,
[data-bs-theme="dark"] .content-page,
[data-bs-theme="dark"] .wrapper>.content-page,
[data-bs-theme="dark"] body,
[data-theme="light"] .page-content,
[data-theme="light"] .content-page,
[data-theme="light"] .wrapper>.content-page,
[data-theme="light"] body,
[data-theme="dark"] .page-content,
[data-theme="dark"] .content-page,
[data-theme="dark"] .wrapper>.content-page,
[data-theme="dark"] body {
    background: var(--canvas) !important;
    color: var(--text) !important;
}

/* Cards / tables on content area */
[data-bs-theme="light"] .card,
[data-bs-theme="light"] .data-table,
[data-bs-theme="light"] .table,
[data-bs-theme="dark"] .card,
[data-bs-theme="dark"] .data-table,
[data-bs-theme="dark"] .table,
[data-theme="light"] .card,
[data-theme="light"] .data-table,
[data-theme="light"] .table,
[data-theme="dark"] .card,
[data-theme="dark"] .data-table,
[data-theme="dark"] .table {
    background-color: var(--card) !important;
    border-color: var(--border) !important;
}

[data-bs-theme="light"] .table thead th,
[data-bs-theme="dark"] .table thead th,
[data-theme="light"] .table thead th,
[data-theme="dark"] .table thead th {
    background-color: var(--gold) !important;
    color: var(--sidebar-bg) !important;
    border-bottom: 2px solid var(--gold-line) !important;
    border-color: var(--border) !important;
    font-weight: 600;
}

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

/* Card / panel headers */
[data-bs-theme="light"] .card-header,
[data-bs-theme="dark"] .card-header,
[data-theme="light"] .card-header,
[data-theme="dark"] .card-header {
    background-color: var(--gold-light) !important;
    color: var(--gold-text-on-fill) !important;
    border-bottom: 2px solid var(--gold-line) !important;
}

[data-bs-theme="light"] .card-header .header-title,
[data-bs-theme="dark"] .card-header .header-title,
[data-theme="light"] .card-header .header-title,
[data-theme="dark"] .card-header .header-title {
    color: var(--ink) !important;
}

[data-bs-theme="light"] .card-header .text-muted,
[data-bs-theme="dark"] .card-header .text-muted,
[data-theme="light"] .card-header .text-muted,
[data-theme="dark"] .card-header .text-muted {
    color: var(--text-soft) !important;
}

/* Table active / category rows */
[data-bs-theme="light"] .table-active,
[data-bs-theme="dark"] .table-active,
[data-theme="light"] .table-active,
[data-theme="dark"] .table-active {
    background-color: var(--gold-light) !important;
    color: var(--gold-text-on-fill) !important;
}

[data-bs-theme="light"] .table-active td,
[data-bs-theme="dark"] .table-active td,
[data-theme="light"] .table-active td,
[data-theme="dark"] .table-active td {
    color: var(--gold-text-on-fill) !important;
}

/* GridJS headers */
[data-bs-theme="light"] th.gridjs-th,
[data-bs-theme="dark"] th.gridjs-th,
[data-theme="light"] th.gridjs-th,
[data-theme="dark"] th.gridjs-th {
    background-color: var(--gold) !important;
    color: var(--sidebar-bg) !important;
    border-bottom: 2px solid var(--gold-line) !important;
    border-color: var(--border) !important;
}

[data-bs-theme="dark"] th.gridjs-th,
[data-theme="dark"] th.gridjs-th {
    background-color: var(--gold) !important;
    color: var(--sidebar-bg) !important;
}

/* Bootstrap subtle bg/text utilities — brand palette */
[data-bs-theme="light"] .bg-primary-subtle,
[data-bs-theme="dark"] .bg-primary-subtle,
[data-theme="light"] .bg-primary-subtle,
[data-theme="dark"] .bg-primary-subtle {
    background-color: var(--gold-light) !important;
}

[data-bs-theme="light"] .bg-success-subtle,
[data-bs-theme="dark"] .bg-success-subtle,
[data-theme="light"] .bg-success-subtle,
[data-theme="dark"] .bg-success-subtle {
    background-color: var(--get-bg) !important;
}

[data-bs-theme="light"] .bg-info-subtle,
[data-bs-theme="dark"] .bg-info-subtle,
[data-theme="light"] .bg-info-subtle,
[data-theme="dark"] .bg-info-subtle {
    background-color: var(--get-bg) !important;
}

[data-bs-theme="light"] .bg-warning-subtle,
[data-bs-theme="dark"] .bg-warning-subtle,
[data-theme="light"] .bg-warning-subtle,
[data-theme="dark"] .bg-warning-subtle {
    background-color: var(--post-bg) !important;
}

[data-bs-theme="light"] .bg-danger-subtle,
[data-bs-theme="dark"] .bg-danger-subtle,
[data-theme="light"] .bg-danger-subtle,
[data-theme="dark"] .bg-danger-subtle {
    background-color: var(--post-bg) !important;
}

[data-bs-theme="light"] .bg-secondary-subtle,
[data-bs-theme="dark"] .bg-secondary-subtle,
[data-theme="light"] .bg-secondary-subtle,
[data-theme="dark"] .bg-secondary-subtle {
    background-color: var(--card-2) !important;
}

[data-bs-theme="light"] .bg-light,
[data-bs-theme="dark"] .bg-light,
[data-theme="light"] .bg-light,
[data-theme="dark"] .bg-light {
    background-color: var(--gold-light) !important;
}

[data-bs-theme="light"] .text-primary,
[data-bs-theme="dark"] .text-primary,
[data-theme="light"] .text-primary,
[data-theme="dark"] .text-primary {
    color: var(--gold) !important;
}

[data-bs-theme="light"] .text-success,
[data-bs-theme="dark"] .text-success,
[data-theme="light"] .text-success,
[data-theme="dark"] .text-success {
    color: var(--get) !important;
}

[data-bs-theme="light"] .text-info,
[data-bs-theme="dark"] .text-info,
[data-theme="light"] .text-info,
[data-theme="dark"] .text-info {
    color: var(--get) !important;
}

[data-bs-theme="light"] .text-warning,
[data-bs-theme="dark"] .text-warning,
[data-theme="light"] .text-warning,
[data-theme="dark"] .text-warning {
    color: var(--post) !important;
}

[data-bs-theme="light"] .text-danger,
[data-bs-theme="dark"] .text-danger,
[data-theme="light"] .text-danger,
[data-theme="dark"] .text-danger {
    color: var(--post) !important;
}

[data-bs-theme="light"] .text-secondary,
[data-bs-theme="dark"] .text-secondary,
[data-theme="light"] .text-secondary,
[data-theme="dark"] .text-secondary {
    color: var(--text-soft) !important;
}

[data-bs-theme="light"] .table td,
[data-bs-theme="light"] .table tbody td,
[data-bs-theme="dark"] .table td,
[data-bs-theme="dark"] .table tbody td,
[data-theme="light"] .table td,
[data-theme="light"] .table tbody td,
[data-theme="dark"] .table td,
[data-theme="dark"] .table tbody td {
    border-color: var(--border) !important;
    color: var(--text) !important;
}

[data-bs-theme="light"] .table tbody tr:hover,
[data-bs-theme="dark"] .table tbody tr:hover,
[data-theme="light"] .table tbody tr:hover,
[data-theme="dark"] .table tbody tr:hover {
    background-color: var(--card-2) !important;
}

/* Osen uses secondary color for a lot of muted text in tables/cards; darken it */
[data-bs-theme="light"],
[data-theme="light"] {
    --osen-body-color: var(--text) !important;
    --osen-body-color-rgb: 40, 34, 26 !important;
    --osen-secondary-color: var(--text-soft) !important;
    --osen-secondary-color-rgb: 121, 112, 94 !important;
    --osen-link-color: var(--gold) !important;
    --osen-link-hover-color: var(--gold-dark) !important;
}

[data-bs-theme="dark"],
[data-theme="dark"] {
    --osen-body-color: var(--text) !important;
    --osen-body-color-rgb: 239, 231, 214 !important;
    --osen-secondary-color: var(--text-soft) !important;
    --osen-secondary-color-rgb: 185, 173, 146 !important;
    --osen-link-color: var(--gold) !important;
    --osen-link-hover-color: var(--gold-dark) !important;
}

/* Sidebar text readability */
.sidenav-menu .nav-link,
.leftside-menu .nav-link,
.navbar-vertical .navbar-nav .nav-link,
.side-nav-link,
.side-nav-link .menu-text,
.side-nav-link .menu-icon,
.navbar-vertical-aside-has-menu>.nav-link,
.side-nav .side-nav-item .side-nav-link,
.side-nav .side-nav-title {
    color: var(--sidebar-text) !important;
}

.sidenav-menu .nav-link:hover,
.leftside-menu .nav-link:hover,
.navbar-vertical .navbar-nav .nav-link:hover,
.side-nav-link:hover .menu-text,
.side-nav-link:hover .menu-icon,
.navbar-vertical-aside-has-menu>.nav-link:hover,
.side-nav .side-nav-item .side-nav-link:hover,
.side-nav .side-nav-item .side-nav-link:focus,
.side-nav .side-nav-item .side-nav-link:active {
    color: var(--sidebar-text-strong) !important;
    background-color: transparent !important;
}

.side-nav .side-nav-item .side-nav-link:hover .menu-text,
.side-nav .side-nav-item .side-nav-link:hover .menu-icon,
.side-nav .sub-menu .side-nav-link:hover .menu-text,
.side-nav .sub-menu .side-nav-link:hover .menu-icon {
    color: var(--gold) !important;
}

.navbar-vertical-aside-has-menu.active>.nav-link,
.navbar-vertical-aside-has-menu.show>.nav-link,
.sidenav-menu .nav-link.active,
.side-nav>.side-nav-item.active .side-nav-link.active,
.side-nav>.side-nav-item.active>.side-nav-link,
.side-nav>.side-nav-item.active>a {
    background: var(--gold) !important;
    color: var(--sidebar-bg) !important;
    border-left: 2.5px solid var(--gold-light) !important;
}

.navbar-vertical-aside-has-menu.active>.nav-link .nav-icon,
.navbar-vertical-aside-has-menu.show>.nav-link .nav-icon,
.sidenav-menu .nav-link.active .nav-icon,
.sidenav-menu .nav-link.active .menu-icon,
.side-nav .side-nav-item.active .menu-icon,
.side-nav>.side-nav-item.active .side-nav-link.active .menu-icon,
.side-nav>.side-nav-item.active>.side-nav-link .menu-icon,
.side-nav>.side-nav-item.active>a .menu-icon,
.side-nav>.side-nav-item.active .side-nav-link.active .menu-text,
.side-nav>.side-nav-item.active>.side-nav-link .menu-text,
.side-nav>.side-nav-item.active>a .menu-text {
    color: var(--sidebar-bg) !important;
}

/* Sidebar section labels / muted text */
.navbar-vertical .navbar-vertical-footer,
.sidenav-menu .menu-title,
.leftside-menu .menu-title,
.navbar-vertical-aside .nav-item-header,
.side-nav .side-nav-title {
    color: var(--sidebar-text-faint) !important;
}

/* Submenu items */
.navbar-vertical-aside-submenu .nav-link,
.side-nav .sub-menu .side-nav-link,
.side-nav .sub-menu .side-nav-link::before {
    color: var(--sidebar-text-faint) !important;
}

.navbar-vertical-aside-submenu .nav-link:hover,
.side-nav .sub-menu .side-nav-link:hover {
    color: var(--sidebar-text-strong) !important;
    background-color: transparent !important;
}

.navbar-vertical-aside-submenu .nav-link.active,
.side-nav .sub-menu .side-nav-link.active {
    color: var(--sidebar-text-strong) !important;
    background: var(--gold) !important;
    border-left: 2.5px solid var(--gold-line) !important;
}

.side-nav > .side-nav-item.active .side-nav-link.active,
.side-nav > .side-nav-item.active > .side-nav-link,
.side-nav > .side-nav-item.active > a {
    background: var(--gold) !important;
    color: var(--sidebar-bg) !important;
    border-left: 2.5px solid var(--gold-light) !important;
}

.navbar-vertical-aside-submenu .nav-link.active .menu-text,
.side-nav .sub-menu .side-nav-link.active .menu-text,
.navbar-vertical-aside-submenu .nav-link.active .menu-icon,
.side-nav .sub-menu .side-nav-link.active .menu-icon,
.navbar-vertical-aside-has-menu.active > .nav-link .nav-icon,
.navbar-vertical-aside-has-menu.show > .nav-link .nav-icon,
.sidenav-menu .nav-link.active .nav-icon,
.sidenav-menu .nav-link.active .menu-icon,
.side-nav .side-nav-item.active .menu-icon,
.side-nav > .side-nav-item.active .side-nav-link.active .menu-icon,
.side-nav > .side-nav-item.active > .side-nav-link .menu-icon,
.side-nav > .side-nav-item.active > a .menu-icon,
.side-nav > .side-nav-item.active .side-nav-link.active .menu-text,
.side-nav > .side-nav-item.active > .side-nav-link .menu-text,
.side-nav > .side-nav-item.active > a .menu-text {
    color: var(--sidebar-bg) !important;
}



.side-nav > .side-nav-item.active .side-nav-link.active,
.side-nav > .side-nav-item.active > .side-nav-link,
.side-nav > .side-nav-item.active > a {
    color: var(--sidebar-bg) !important;
    background: var(--gold) !important;
    border-left: 2.5px solid var(--gold-line) !important;
}

.side-nav > .side-nav-item.active .side-nav-link.active .menu-text,
.side-nav > .side-nav-item.active > .side-nav-link .menu-text,
.side-nav > .side-nav-item.active > a .menu-text,
.side-nav > .side-nav-item.active .side-nav-link.active .menu-icon,
.side-nav > .side-nav-item.active > .side-nav-link .menu-icon,
.side-nav > .side-nav-item.active > a .menu-icon {
    color: var(--sidebar-bg) !important;
}

.topbar-link,
.app-topbar .topbar-link,
.app-topbar .dropdown-toggle {
    color: var(--text) !important;
}

.topbar-link:hover,
.app-topbar .topbar-link:hover,
.app-topbar .dropdown-toggle:hover {
    color: var(--gold) !important;
}

/* Token utility classes for views that used text-white/bg-white */
.text-token-card { color: var(--card) !important; }
.text-token-ink { color: var(--ink) !important; }
.bg-token-card { background-color: var(--card) !important; }
.bg-token-ink { background-color: var(--ink) !important; }
.border-token-card { border-color: var(--card) !important; }
.border-token-ink { border-color: var(--ink) !important; }

/* Swal / SweetAlert2 brand theming */
.swal2-popup {
    background: var(--card);
    color: var(--text);
}

.swal2-title {
    color: var(--ink);
}

.swal2-html-container {
    color: var(--text-soft);
}

.swal2-icon.swal2-success {
    border-color: var(--gold);
    color: var(--gold);
}

.swal2-icon.swal2-success .swal2-success-ring {
    border-color: var(--gold);
}

.swal2-icon.swal2-warning {
    border-color: var(--gold);
    color: var(--gold);
}

.swal2-cancel {
    background-color: var(--text-soft) !important;
    border-color: var(--text-soft) !important;
    color: var(--card) !important;
}

/* DataTables pagination / active */
.page-item.active .page-link {
    background-color: var(--gold) !important;
    border-color: var(--gold) !important;
    color: var(--gold-text-on-fill) !important;
}

/* Soft buttons: neutralize Osen semantic tints so all variants look the same */
.btn-soft-primary,
.btn-primary-soft,
.btn-soft-secondary,
.btn-soft-success,
.btn-soft-info,
.btn-soft-warning,
.btn-soft-danger,
.table .btn-icon.btn-soft-primary,
.table .btn-icon.btn-primary-soft,
.table .action-btn.btn-soft-primary,
.table .btn.btn-soft-primary {
    background-color: var(--gold-light) !important;
    border-color: var(--gold-line) !important;
    color: var(--gold-dark) !important;
}

.btn-soft-primary:hover,
.btn-primary-soft:hover,
.btn-soft-secondary:hover,
.btn-soft-success:hover,
.btn-soft-info:hover,
.btn-soft-warning:hover,
.btn-soft-danger:hover,
.btn-soft-primary:focus,
.btn-primary-soft:focus,
.btn-soft-secondary:focus,
.btn-soft-success:focus,
.btn-soft-info:focus,
.btn-soft-warning:focus,
.btn-soft-danger:focus,
.btn-soft-primary:active,
.btn-primary-soft:active,
.btn-soft-secondary:active,
.btn-soft-success:active,
.btn-soft-info:active,
.btn-soft-warning:active,
.btn-soft-danger:active,
.table .btn-icon.btn-soft-primary:hover,
.table .btn-icon.btn-primary-soft:hover,
.table .action-btn.btn-soft-primary:hover,
.table .btn.btn-soft-primary:hover {
    background-color: var(--gold) !important;
    border-color: var(--gold) !important;
    color: var(--gold-text-on-fill) !important;
}

/* Ghost/outline variants too */
.btn-ghost-primary,
.btn-ghost-secondary,
.btn-ghost-success,
.btn-ghost-info,
.btn-ghost-warning,
.btn-ghost-danger {
    background-color: transparent !important;
    border-color: var(--gold-line) !important;
    color: var(--gold-dark) !important;
}

.btn-ghost-primary:hover,
.btn-ghost-secondary:hover,
.btn-ghost-success:hover,
.btn-ghost-info:hover,
.btn-ghost-warning:hover,
.btn-ghost-danger:hover,
.btn-ghost-primary:focus,
.btn-ghost-secondary:focus,
.btn-ghost-success:focus,
.btn-ghost-info:focus,
.btn-ghost-warning:focus,
.btn-ghost-danger:focus,
.btn-ghost-primary:active,
.btn-ghost-secondary:active,
.btn-ghost-success:active,
.btn-ghost-info:active,
.btn-ghost-warning:active,
.btn-ghost-danger:active {
    background-color: var(--gold-light) !important;
    border-color: var(--gold) !important;
    color: var(--gold-text-on-fill) !important;
}

/* Table action buttons */
.table .btn,
.table .btn-icon,
.table .action-btn,
.table a.btn,
.table button.btn {
    border-radius: 0.5rem !important;
    transition: all 0.15s ease-in-out;
}

/* GridJS footer/pagination theming */
.gridjs-footer {
    background-color: var(--card) !important;
    color: var(--text) !important;
    border-color: var(--border) !important;
}

.gridjs-summary {
    color: var(--text-soft) !important;
}

.gridjs-pagination .gridjs-pages button {
    background-color: var(--card-2) !important;
    color: var(--text) !important;
    border-color: var(--border) !important;
}

.gridjs-pagination .gridjs-pages button:hover:not(:disabled),
.gridjs-pagination .gridjs-pages button:focus:not(:disabled) {
    background-color: var(--gold-light) !important;
    color: var(--gold-dark) !important;
    border-color: var(--gold-line) !important;
}

.gridjs-pagination .gridjs-pages button:disabled,
.gridjs-pagination .gridjs-pages button[disabled] {
    background-color: var(--card-2) !important;
    color: var(--text-faint) !important;
    border-color: var(--border) !important;
}

.gridjs-pagination .gridjs-pages button.gridjs-currentPage {
    background-color: var(--gold) !important;
    color: var(--sidebar-bg) !important;
    border-color: var(--gold) !important;
}

.table.dataTable thead th,
.table.dataTable.display thead th,
.dataTables_wrapper .dataTable thead th,
#usersTable thead th,
#usersTable.dataTable thead th {
    background-color: var(--gold) !important;
    color: var(--sidebar-bg) !important;
    border-bottom: 2px solid var(--gold-line) !important;
    border-color: var(--border) !important;
    font-weight: 600;
}

[data-bs-theme="dark"] .table.dataTable thead th,
[data-theme="dark"] .table.dataTable thead th,
[data-bs-theme="dark"] #usersTable thead th,
[data-theme="dark"] #usersTable thead th {
    color: var(--text) !important;
}

/* Add-new / primary table toolbar buttons */
.btn-add-new,
.btn.btn-add-new,
.dataTables_wrapper .btn-add-new {
    background-color: var(--gold) !important;
    border-color: var(--gold) !important;
    color: var(--gold-text-on-fill) !important;
    border-radius: 0.5rem !important;
}

/* Alerts — derived from gold palette, distinguishable by semantic role */
[data-bs-theme="light"] .alert-info,
[data-theme="light"] .alert-info,
[data-bs-theme="light"] .alert-primary,
[data-theme="light"] .alert-primary {
    background-color: var(--gold-light) !important;
    border-color: var(--gold-line) !important;
    color: var(--gold-text-on-fill) !important;
}

[data-bs-theme="dark"] .alert-info,
[data-theme="dark"] .alert-info,
[data-bs-theme="dark"] .alert-primary,
[data-theme="dark"] .alert-primary {
    background-color: var(--gold) !important;
    border-color: var(--gold-line) !important;
    color: var(--sidebar-bg) !important;
}

[data-bs-theme="light"] .alert-info .alert-link,
[data-theme="light"] .alert-info .alert-link,
[data-bs-theme="light"] .alert-primary .alert-link,
[data-theme="light"] .alert-primary .alert-link {
    color: var(--gold-dark) !important;
}

[data-bs-theme="dark"] .alert-info .alert-link,
[data-theme="dark"] .alert-info .alert-link,
[data-bs-theme="dark"] .alert-primary .alert-link,
[data-theme="dark"] .alert-primary .alert-link {
    color: var(--sidebar-bg) !important;
}

[data-bs-theme="light"] .alert-success,
[data-bs-theme="dark"] .alert-success,
[data-theme="light"] .alert-success,
[data-theme="dark"] .alert-success {
    background-color: var(--get-bg) !important;
    border-color: var(--get) !important;
    color: var(--get) !important;
}

[data-bs-theme="light"] .alert-success .alert-link,
[data-bs-theme="dark"] .alert-success .alert-link,
[data-theme="light"] .alert-success .alert-link,
[data-theme="dark"] .alert-success .alert-link {
    color: var(--get) !important;
}

[data-bs-theme="light"] .alert-warning,
[data-bs-theme="dark"] .alert-warning,
[data-theme="light"] .alert-warning,
[data-theme="dark"] .alert-warning,
[data-bs-theme="light"] .alert-danger,
[data-bs-theme="dark"] .alert-danger,
[data-theme="light"] .alert-danger,
[data-theme="dark"] .alert-danger {
    background-color: var(--post-bg) !important;
    border-color: var(--post) !important;
    color: var(--post) !important;
}

[data-bs-theme="light"] .alert-warning .alert-link,
[data-bs-theme="dark"] .alert-warning .alert-link,
[data-theme="light"] .alert-warning .alert-link,
[data-theme="dark"] .alert-warning .alert-link,
[data-bs-theme="light"] .alert-danger .alert-link,
[data-bs-theme="dark"] .alert-danger .alert-link,
[data-theme="light"] .alert-danger .alert-link,
[data-theme="dark"] .alert-danger .alert-link {
    color: var(--post) !important;
}

[data-bs-theme="light"] .alert-secondary,
[data-bs-theme="dark"] .alert-secondary,
[data-theme="light"] .alert-secondary,
[data-theme="dark"] .alert-secondary,
[data-bs-theme="light"] .alert-light,
[data-bs-theme="dark"] .alert-light,
[data-theme="light"] .alert-light,
[data-theme="dark"] .alert-light {
    background-color: var(--card-2) !important;
    border-color: var(--border) !important;
    color: var(--text) !important;
}

/* Search/filter inputs on content cards */
.card .form-control,
.card .form-select,
.dataTables_filter input,
.dataTables_length select {
    background-color: var(--card) !important;
    border-color: var(--border) !important;
    color: var(--text) !important;
}

.card .form-control::placeholder,
.card .form-select::placeholder,
.dataTables_filter input::placeholder {
    color: var(--text-faint) !important;
}

.card .form-control:focus,
.card .form-select:focus,
.dataTables_filter input:focus,
.dataTables_length select:focus {
    border-color: var(--gold) !important;
    outline: 0 !important;
    box-shadow: 0 0 0 2px rgba(174, 135, 50, 0.25) !important;
}

/* Scrollbar thumb hover to match brand */
::-webkit-scrollbar-thumb:hover {
    background: var(--gold-dark);
}

/* Modals / dropdowns */
.modal-content,
.dropdown-menu {
    background-color: var(--card) !important;
    color: var(--text) !important;
    border-color: var(--border) !important;
    box-shadow: var(--shadow) !important;
}

.modal-header,
.modal-footer,
.dropdown-divider {
    border-color: var(--border) !important;
}

/* GridJS */
.gridjs-wrapper,
.gridjs-container,
.gridjs-td,
.gridjs-th {
    background-color: var(--card) !important;
    color: var(--text) !important;
    border-color: var(--border) !important;
}

.gridjs-thead .gridjs-th {
    background-color: var(--gold) !important;
    color: var(--sidebar-bg) !important;
    border-bottom: 2px solid var(--gold-line) !important;
}

.gridjs-thead .gridjs-th-sort:hover,
.gridjs-thead .gridjs-th-sort:focus {
    background-color: var(--gold-dark) !important;
}

.gridjs-tr:not(.gridjs-tr-header):hover .gridjs-td {
    background-color: var(--card-2) !important;
}

/* Toastr */
.toast,
.toast-success,
.toast-error,
.toast-warning,
.toast-info {
    background-color: var(--card) !important;
    color: var(--text) !important;
    box-shadow: var(--shadow) !important;
}

/* Loader neutral filter */
#loading .loader--inner img {
    filter: hue-rotate(-60deg) saturate(1.2);
}

/* Header SVG dropdown arrow */
.__nav-link svg path[stroke="var(--get)"],
.__nav-link svg path[stroke="var(--get)"],
.__nav-link svg path[stroke="var(--get)"] {
    stroke: var(--gold) !important;
}

/* Status badges */
.badge-get,
.badge-soft-get,
.badge-post,
.badge-soft-post {
    border-radius: 9999px;
    padding: 0.25em 0.6em;
    font-size: 0.75em;
    font-weight: 600;
    display: inline-flex;
    align-items: center;
    gap: 0.35em;
}

.badge-get,
.badge-soft-get {
    background-color: var(--get-bg) !important;
    color: var(--get) !important;
}

.badge-post,
.badge-soft-post {
    background-color: var(--post-bg) !important;
    color: var(--post) !important;
}

.badge-get::before,
.badge-soft-get::before,
.badge-post::before,
.badge-soft-post::before {
    content: '';
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: currentColor;
}

/* Ripple material effect */
.ripple:after {
    background-image: radial-gradient(circle, var(--ink) 10%, transparent 10.01%);
}