:root {
    --ff-body-bg: #f8f8f8;
    --ff-body-color: #6e6b7b;
    --ff-card-bg: #fff;
    --ff-border-color: #ebe9f1;
    --ff-input-bg: #fff;
    --ff-input-color: #6e6b7b;
    --ff-input-border: #d8d6de;
    --ff-table-bg: #fff;
    --ff-table-stripe-bg: #fafafc;
    --ff-sidebar-footer-bg: #fff;
    --ff-loader-bg: rgba(255, 255, 255, 0.5);
    --ff-gray-bg: #f3f2f7;
    --ff-gray-light-bg: #f7f7f7;
    --ff-inner-table-bg: #f4f4f4;
    --ff-order-details-bg: rgb(216 216 216 / 10%);
    --ff-order-details-border: #ccc;
    --ff-dropdown-search-bg: #fff;
}

.dark-layout {
    --ff-body-bg: #161d31;
    --ff-body-color: #b4b7bd;
    --ff-card-bg: #283046;
    --ff-border-color: #3b4253;
    --ff-input-bg: #283046;
    --ff-input-color: #b4b7bd;
    --ff-input-border: #3b4253;
    --ff-table-bg: #283046;
    --ff-table-stripe-bg: #242b3d;
    --ff-sidebar-footer-bg: #283046;
    --ff-loader-bg: rgba(22, 29, 49, 0.5);
    --ff-gray-bg: #242b3d;
    --ff-gray-light-bg: #1e2639;
    --ff-inner-table-bg: #242b3d;
    --ff-order-details-bg: rgba(59, 66, 83, 0.3);
    --ff-order-details-border: #3b4253;
    --ff-dropdown-search-bg: #283046;
}

#loader {
    background: var(--ff-loader-bg);
}

.dark-layout .form-control {
    color: var(--ff-input-color) !important;
    background-color: var(--ff-input-bg);
    border-color: var(--ff-input-border);
}

.dark-layout .form-control:focus {
    border-color: var(--ff-input-border) !important;
}

.dark-layout input:-internal-autofill-selected {
    background-color: var(--ff-input-bg) !important;
}

.dark-layout .bg-gray {
    background: var(--ff-gray-bg) !important;
}

.dark-layout .bg-gray-light {
    background: var(--ff-gray-light-bg) !important;
}

.dark-layout .text-gray {
    color: var(--ff-body-color) !important;
}

.dark-layout .btn-white {
    background: var(--ff-card-bg);
    color: var(--ff-body-color);
}

.dark-layout table.inner-table {
    background-color: var(--ff-inner-table-bg);
}

.dark-layout .order-details {
    background-color: var(--ff-order-details-bg);
    border-color: var(--ff-order-details-border);
}

.dark-layout .sidebar-footer {
    background: var(--ff-sidebar-footer-bg) !important;
    border-color: var(--ff-border-color) !important;
}

.dark-layout .dropdown-search {
    background-color: var(--ff-dropdown-search-bg);
    border-color: var(--ff-border-color);
}

.dark-layout .select2-container--default .select2-selection--single,
.dark-layout .select2-container--default .select2-selection--multiple {
    background-color: var(--ff-input-bg);
    border-color: var(--ff-input-border);
}

.dark-layout .select2-container--default .select2-selection--single .select2-selection__rendered {
    color: var(--ff-input-color);
}

.dark-layout .select2-dropdown {
    background-color: var(--ff-card-bg);
    border-color: var(--ff-border-color);
}

.dark-layout .select2-container--default .select2-results__option--highlighted[aria-selected] {
    background-color: var(--ff-gray-bg);
    color: var(--ff-body-color);
}

.dark-layout .multiple-selection .select2-results__option:before {
    border-color: var(--ff-border-color);
    background-color: var(--ff-input-bg);
}

.dark-layout .multiple-selection .select2-results__option[aria-selected=true]:before {
    color: var(--ff-body-color);
    background-color: var(--ff-input-bg);
}

.dark-layout .select2-container--default .multiple-selection .select2-results__option[aria-selected=true] {
    background-color: var(--ff-card-bg);
}

.dark-layout .select2-container--default .multiple-selection .select2-results__option--highlighted[aria-selected] {
    background-color: var(--ff-gray-bg);
    color: var(--ff-body-color);
}

.dark-layout .dataTables_wrapper .dataTables_length select,
.dark-layout .dataTables_wrapper .dataTables_filter input {
    background-color: var(--ff-input-bg);
    border-color: var(--ff-input-border);
    color: var(--ff-input-color);
}

/* ── Dark mode: form validation ── */

.dark-layout .form-control.error,
.dark-layout .form-control.is-invalid,
.dark-layout .was-validated .form-control:invalid,
.dark-layout form select.error,
.dark-layout form select.error:focus,
.dark-layout .form-control.error:focus,
.dark-layout .form-control.is-invalid:focus {
    border-color: #ea5455 !important;
}

.dark-layout .error,
.dark-layout label.error,
.dark-layout .invalid-feedback {
    color: #ea5455 !important;
}

.dark-layout .form-control.is-valid,
.dark-layout .was-validated .form-control:valid,
.dark-layout .form-control.is-valid:focus {
    border-color: #28c76f !important;
}

.dark-layout .valid-feedback {
    color: #28c76f !important;
}

/* ── Dark mode: badges and status text ── */

.dark-layout .badge {
    color: #fff;
}

.dark-layout .badge-light-primary,
.dark-layout .badge-light-secondary,
.dark-layout .badge-light-success,
.dark-layout .badge-light-danger,
.dark-layout .badge-light-warning,
.dark-layout .badge-light-info {
    color: inherit;
}

.dark-layout .badge-light-primary {
    background-color: rgba(241, 191, 10, 0.15) !important;
    color: #f1bf0a !important;
}

.dark-layout .badge-light-success {
    background-color: rgba(40, 199, 111, 0.15) !important;
    color: #28c76f !important;
}

.dark-layout .badge-light-danger {
    background-color: rgba(234, 84, 85, 0.15) !important;
    color: #ea5455 !important;
}

.dark-layout .badge-light-warning {
    background-color: rgba(255, 159, 67, 0.15) !important;
    color: #ff9f43 !important;
}

.dark-layout .badge-light-info {
    background-color: rgba(0, 207, 232, 0.15) !important;
    color: #00cfe8 !important;
}

.dark-layout .badge-light-secondary {
    background-color: rgba(130, 134, 139, 0.15) !important;
    color: #82868b !important;
}

/* ── Dark mode: count cards and label text ── */

.dark-layout .count-card .label,
.dark-layout .label {
    color: #b4b7bd !important;
}

.dark-layout .count-card .count {
    color: #d0d2d6;
}

.dark-layout .card {
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.3);
}

/* ── Dark mode: toastr notifications ── */

.dark-layout #toast-container .toast.toast-error {
    background-color: #ea5455 !important;
    color: #fff !important;
}

.dark-layout #toast-container .toast.toast-error .toast-title,
.dark-layout #toast-container .toast.toast-error .toast-message {
    color: #fff !important;
}

.dark-layout #toast-container .toast.toast-error .toast-close-button {
    color: #fff !important;
}

.dark-layout #toast-container .toast.toast-success {
    background-color: #28c76f !important;
    color: #fff !important;
}

.dark-layout #toast-container .toast.toast-success .toast-title,
.dark-layout #toast-container .toast.toast-success .toast-message {
    color: #fff !important;
}

.dark-layout #toast-container .toast.toast-success .toast-close-button {
    color: #fff !important;
}

.dark-layout #toast-container .toast.toast-warning {
    background-color: #ff9f43 !important;
    color: #fff !important;
}

.dark-layout #toast-container .toast.toast-warning .toast-title,
.dark-layout #toast-container .toast.toast-warning .toast-message {
    color: #fff !important;
}

.dark-layout #toast-container .toast.toast-warning .toast-close-button {
    color: #fff !important;
}

.dark-layout #toast-container .toast.toast-info {
    background-color: #00cfe8 !important;
    color: #fff !important;
}

.dark-layout #toast-container .toast.toast-info .toast-title,
.dark-layout #toast-container .toast.toast-info .toast-message {
    color: #fff !important;
}

.dark-layout #toast-container .toast.toast-info .toast-close-button {
    color: #fff !important;
}

/* ── Dark mode: tables, pre/code, and DataTable data columns ── */

.dark-layout pre,
.dark-layout code {
    background-color: #1e2639;
    color: #d0d2d6;
    border: 1px solid #3b4253;
    border-radius: 4px;
    padding: 0.75rem;
}

.dark-layout code {
    padding: 0.15rem 0.4rem;
}

.dark-layout table.dataTable tbody td {
    color: #b4b7bd;
}

.dark-layout table.dataTable tbody tr {
    background-color: #283046;
}

.dark-layout table.dataTable tbody tr:nth-of-type(odd) {
    background-color: #242b3d;
}

.dark-layout table.dataTable tbody tr:hover {
    background-color: #242b3d;
}

.dark-layout table.dataTable thead th,
.dark-layout table.dataTable thead td {
    color: #d0d2d6;
    border-bottom-color: #3b4253;
}

.dark-layout table.dataTable tbody td {
    border-color: #3b4253;
}

.dark-layout table.dataTable.table-bordered {
    border-color: #3b4253;
}

.dark-layout .dataTables_wrapper .dataTables_info,
.dark-layout .dataTables_wrapper .dataTables_length label,
.dark-layout .dataTables_wrapper .dataTables_filter label {
    color: #b4b7bd;
}

.dark-layout .dataTables_wrapper .dataTables_paginate .paginate_button {
    color: #b4b7bd !important;
}

.dark-layout .dataTables_wrapper .dataTables_paginate .paginate_button.current {
    background: #f1bf0a !important;
    border-color: #f1bf0a !important;
    color: #1e1e1e !important;
}

.dark-layout .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
    background: #3b4253 !important;
    border-color: #3b4253 !important;
    color: #d0d2d6 !important;
}

.dark-layout table.dataTable > tbody > tr.child ul.dtr-details > li {
    border-bottom-color: #3b4253;
    color: #b4b7bd;
}

.dark-layout table.dataTable > tbody > tr.child span.dtr-title {
    color: #d0d2d6;
}

.dark-layout table.dataTable > tbody > tr.child span.dtr-data {
    color: #b4b7bd;
}

/* ── Dark mode: sidebar active menu (flat, no gradient) ── */

.dark-layout .main-menu.menu-dark .navigation > li.active > a {
    background: #f1bf0a !important;
    background-image: none !important;
    box-shadow: 0 0 6px 0 rgba(241, 191, 10, 0.4) !important;
    color: #1e1e1e !important;
    border-radius: 4px;
}

.dark-layout .main-menu.menu-dark .navigation > li.active > a svg,
.dark-layout .main-menu.menu-dark .navigation > li.active > a i {
    color: #1e1e1e !important;
}

.dark-layout .main-menu.menu-dark .navigation > li ul .active {
    background: #f1bf0a !important;
    background-image: none !important;
    box-shadow: 0 0 6px 0 rgba(241, 191, 10, 0.4) !important;
    border-radius: 4px;
}

.dark-layout .main-menu.menu-dark .navigation > li ul .active > a {
    color: #1e1e1e !important;
}

.dark-layout .main-menu.menu-dark .navigation > li ul .active > a svg,
.dark-layout .main-menu.menu-dark .navigation > li ul .active > a i {
    color: #1e1e1e !important;
}

/* ── Dark mode: unified flat buttons (no gradients) ── */

.dark-layout [class*="btn-gradient-"] {
    background-image: none !important;
}

.dark-layout .btn-primary,
.dark-layout .btn-primary:hover,
.dark-layout .btn-primary:focus,
.dark-layout .btn-primary:active,
.dark-layout .btn-primary:not(:disabled):not(.disabled):active {
    background-color: #f1bf0a !important;
    border-color: #f1bf0a !important;
    color: #1e1e1e !important;
    box-shadow: none !important;
}

.dark-layout .btn-success,
.dark-layout .btn-success:hover,
.dark-layout .btn-success:focus,
.dark-layout .btn-success:active,
.dark-layout .btn-success:not(:disabled):not(.disabled):active {
    background-color: #81b030 !important;
    border-color: #81b030 !important;
    color: #fff !important;
    box-shadow: none !important;
}

.dark-layout .btn-danger,
.dark-layout .btn-danger:hover,
.dark-layout .btn-danger:focus,
.dark-layout .btn-danger:active,
.dark-layout .btn-danger:not(:disabled):not(.disabled):active {
    background-color: #ea5455 !important;
    border-color: #ea5455 !important;
    color: #fff !important;
    box-shadow: none !important;
}

.dark-layout .btn-warning,
.dark-layout .btn-warning:hover,
.dark-layout .btn-warning:focus,
.dark-layout .btn-warning:active,
.dark-layout .btn-warning:not(:disabled):not(.disabled):active {
    background-color: #ff9f43 !important;
    border-color: #ff9f43 !important;
    color: #1e1e1e !important;
    box-shadow: none !important;
}

.dark-layout .btn-info,
.dark-layout .btn-info:hover,
.dark-layout .btn-info:focus,
.dark-layout .btn-info:active,
.dark-layout .btn-info:not(:disabled):not(.disabled):active {
    background-color: #00cfe8 !important;
    border-color: #00cfe8 !important;
    color: #1e1e1e !important;
    box-shadow: none !important;
}

.dark-layout .btn-secondary,
.dark-layout .btn-secondary:hover,
.dark-layout .btn-secondary:focus,
.dark-layout .btn-secondary:active,
.dark-layout .btn-secondary:not(:disabled):not(.disabled):active {
    background-color: #82868b !important;
    border-color: #82868b !important;
    color: #fff !important;
    box-shadow: none !important;
}

.dark-layout .btn-outline-primary {
    color: #f1bf0a !important;
    border-color: #f1bf0a !important;
    background-color: transparent !important;
}
.dark-layout .btn-outline-primary:hover,
.dark-layout .btn-outline-primary:active {
    background-color: #f1bf0a !important;
    color: #1e1e1e !important;
}

.dark-layout .btn-outline-secondary {
    color: #b4b7bd !important;
    border-color: #82868b !important;
    background-color: transparent !important;
}
.dark-layout .btn-outline-secondary:hover,
.dark-layout .btn-outline-secondary:active {
    background-color: #82868b !important;
    color: #fff !important;
}

.dark-layout .btn-outline-success {
    color: #81b030 !important;
    border-color: #81b030 !important;
    background-color: transparent !important;
}
.dark-layout .btn-outline-success:hover,
.dark-layout .btn-outline-success:active {
    background-color: #81b030 !important;
    color: #fff !important;
}

.dark-layout .btn-outline-danger {
    color: #ea5455 !important;
    border-color: #ea5455 !important;
    background-color: transparent !important;
}
.dark-layout .btn-outline-danger:hover,
.dark-layout .btn-outline-danger:active {
    background-color: #ea5455 !important;
    color: #fff !important;
}

.dark-layout .btn-outline-warning {
    color: #ff9f43 !important;
    border-color: #ff9f43 !important;
    background-color: transparent !important;
}
.dark-layout .btn-outline-warning:hover,
.dark-layout .btn-outline-warning:active {
    background-color: #ff9f43 !important;
    color: #1e1e1e !important;
}

.dark-layout .btn-outline-info {
    color: #00cfe8 !important;
    border-color: #00cfe8 !important;
    background-color: transparent !important;
}
.dark-layout .btn-outline-info:hover,
.dark-layout .btn-outline-info:active {
    background-color: #00cfe8 !important;
    color: #1e1e1e !important;
}

/* ── Dark mode: flat button variants ── */

.dark-layout .btn-flat-primary {
    color: #f1bf0a !important;
    background-color: transparent !important;
}
.dark-layout .btn-flat-primary:hover,
.dark-layout .btn-flat-primary:active {
    background-color: rgba(241, 191, 10, 0.12) !important;
}

.dark-layout .btn-flat-secondary {
    color: #b4b7bd !important;
    background-color: transparent !important;
}
.dark-layout .btn-flat-secondary:hover,
.dark-layout .btn-flat-secondary:active {
    background-color: rgba(130, 134, 139, 0.12) !important;
}

.dark-layout .btn-flat-success {
    color: #81b030 !important;
    background-color: transparent !important;
}
.dark-layout .btn-flat-success:hover,
.dark-layout .btn-flat-success:active {
    background-color: rgba(129, 176, 48, 0.12) !important;
}

.dark-layout .btn-flat-danger {
    color: #ea5455 !important;
    background-color: transparent !important;
}
.dark-layout .btn-flat-danger:hover,
.dark-layout .btn-flat-danger:active {
    background-color: rgba(234, 84, 85, 0.12) !important;
}

.dark-layout .btn-flat-warning {
    color: #ff9f43 !important;
    background-color: transparent !important;
}
.dark-layout .btn-flat-warning:hover,
.dark-layout .btn-flat-warning:active {
    background-color: rgba(255, 159, 67, 0.12) !important;
}

.dark-layout .btn-flat-info {
    color: #00cfe8 !important;
    background-color: transparent !important;
}
.dark-layout .btn-flat-info:hover,
.dark-layout .btn-flat-info:active {
    background-color: rgba(0, 207, 232, 0.12) !important;
}

/* ── Dark mode: unified icon colors ── */

.dark-layout .feather,
.dark-layout [data-feather],
.dark-layout .ficon {
    color: #b4b7bd;
}

.dark-layout .card .feather,
.dark-layout .card [data-feather],
.dark-layout .card .ficon {
    color: #b4b7bd;
}

.dark-layout .btn .feather,
.dark-layout .btn [data-feather],
.dark-layout .btn .ficon {
    color: inherit;
}

.dark-layout .text-primary .feather,
.dark-layout .text-primary [data-feather] {
    color: #f1bf0a;
}

.dark-layout .text-success .feather,
.dark-layout .text-success [data-feather] {
    color: #81b030;
}

.dark-layout .text-danger .feather,
.dark-layout .text-danger [data-feather] {
    color: #ea5455;
}

.dark-layout .text-warning .feather,
.dark-layout .text-warning [data-feather] {
    color: #ff9f43;
}

.dark-layout .text-info .feather,
.dark-layout .text-info [data-feather] {
    color: #00cfe8;
}

/* ── Dark mode: action icons in tables/lists ── */

.dark-layout a .feather,
.dark-layout a [data-feather] {
    color: #b4b7bd;
}

.dark-layout a:hover .feather,
.dark-layout a:hover [data-feather] {
    color: #f1bf0a;
}

.theme-toggle-btn {
    width: 34px;
    height: 34px;
    display: flex !important;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    transition: background-color 0.2s ease;
    cursor: pointer;
    padding: 0 !important;
    color: #5e5873;
}

.theme-toggle-btn:hover {
    background-color: rgba(115, 103, 240, 0.12);
    color: #f1bf0a;
}

.dark-layout .theme-toggle-btn {
    color: #b4b7bd;
}

.dark-layout .theme-toggle-btn:hover {
    background-color: rgba(241, 191, 10, 0.15);
    color: #f1bf0a;
}