/* ==========================================================================
   DARK LAYOUT - OPTIMIZED STYLESHEET
   ================================================================********** */

.dark-layout {
  /********* COMPONENTS *********/
  /********** FORMS **********/
  /********** TABLE **********/
  /********** PAGES **********/
  /********** APPLICATIONS *********/
  /********** CUSTOMIZER *********/
  /********** HORIZONTAL LAYOUT **********/
}

/* Base Body & Typography */
body.dark-layout,
.dark-layout body {
  color: #c9c9c9;
  background-color: #d4af37;
  background-image: none;
  transition: background .2s;
}

.dark-layout h1,
.dark-layout h2,
.dark-layout h3,
.dark-layout h4,
.dark-layout h5,
.dark-layout h6 {
  color: #f3f3f3;
}

.dark-layout a:hover {
  color: #f3e5ab;
}

.dark-layout label {
  color: #dcdcdc;
}

.dark-layout hr,
.dark-layout .border,
.dark-layout .border-top,
.dark-layout .border-right,
.dark-layout .border-bottom,
.dark-layout .border-left {
  border-color: #3b2e10 !important;
}

/* Code & Preformatted Text */
.dark-layout pre,
.dark-layout code,
.dark-layout kbd,
.dark-layout pre code .url {
  background-color: #111111 !important;
}

.dark-layout pre {
  border: 0;
}

.dark-layout pre code {
  background-color: inherit;
  text-shadow: none;
}

/* Text Utilities */
.dark-layout .text-dark {
  color: #dcdcdc !important;
}

.dark-layout .text-muted {
  color: #9e9e9e !important;
}

.dark-layout .text-body {
  color: #c9c9c9 !important;
}

.dark-layout .text-body-heading {
  color: #f3f3f3;
}

.dark-layout .section-label,
.dark-layout .blockquote-footer {
  color: #8c7b4e;
}

.dark-layout .shadow {
  box-shadow: 0 4px 24px 0 rgba(0, 0, 0, 0.6) !important;
}

/* Header & Navbar */
.dark-layout .header-navbar-shadow {
  background: linear-gradient(180deg, rgba(10, 10, 10, 0.9) 44%, rgba(10, 10, 10, 0.43) 73%, rgba(10, 10, 10, 0));
}

.dark-layout .horizontal-layout .header-navbar {
  background-color: #141414;
}

.dark-layout .horizontal-layout.navbar-sticky .header-navbar,
.dark-layout .horizontal-layout.navbar-static .header-navbar {
  background-color: #0d0d0d;
}

.dark-layout .navbar-sticky .header-navbar.navbar-shadow {
  box-shadow: 0 4px 24px 0 rgba(0, 0, 0, 0.8);
}

.dark-layout .header-navbar {
  background: linear-gradient(to right, #BF953F, #FCF6BA, #B38728, #FBF5B7, #AA771C);
}

.dark-layout .header-navbar.navbar-static-top {
  background-color: transparent !important;
}

.dark-layout .header-navbar .navbar-container .nav .nav-item .nav-link {
  color: #111111;
  background-color: transparent;
}

.dark-layout .header-navbar .navbar-container .nav .nav-item .nav-link i,
.dark-layout .header-navbar .navbar-container .nav .nav-item .nav-link svg,
.dark-layout .header-navbar .navbar-container .nav li i.ficon,
.dark-layout .header-navbar .navbar-container .nav li svg.ficon {
  color: #c9c9c9;
}

.dark-layout .header-navbar .navbar-container .nav .nav-item .nav-link.bookmark-star i,
.dark-layout .header-navbar .navbar-container .nav .nav-item .nav-link.bookmark-star svg {
  color: #1a1a1a !important;
}

.dark-layout .header-navbar .navbar-container .nav .nav-item.nav-search .search-input.open {
  background-color: #141414;
}

.dark-layout .header-navbar .navbar-container .nav .nav-item.nav-search .search-input.open .input {
  border-color: #3b2e10;
  color: #c9c9c9;
}

.dark-layout .header-navbar .navbar-container .nav .nav-item.nav-search .search-input.open .input::placeholder,
.dark-layout .header-navbar .navbar-container .nav .nav-item.nav-search .search-input.open .search-input-close {
  color: #c9c9c9;
}

.dark-layout .header-navbar .navbar-container .nav .nav-item .bookmark-input,
.dark-layout .header-navbar .navbar-container .nav .nav-item .bookmark-input .form-control,
.dark-layout .header-navbar .navbar-container .nav .nav-item .search-list {
  background-color: #141414;
}

.dark-layout .header-navbar .navbar-container .nav .nav-item .search-list li a {
  color: #c9c9c9;
}

.dark-layout .header-navbar .navbar-container .nav .nav-item .search-list .auto-suggestion.current_item {
  background-color: #0d0d0d;
}

/* Navbar Dropdowns & Media */
.dark-layout .header-navbar .navbar-container .nav .dropdown-cart .dropdown-menu.dropdown-menu-media,
.dark-layout .header-navbar .navbar-container .nav .dropdown-notification .dropdown-menu.dropdown-menu-media {
  overflow: hidden;
}

.dark-layout .header-navbar .navbar-container .nav .dropdown-cart .dropdown-menu.dropdown-menu-media .media,
.dark-layout .header-navbar .navbar-container .nav .dropdown-notification .dropdown-menu.dropdown-menu-media .media {
  border-color: #3b2e10;
}

.dark-layout .header-navbar .navbar-container .nav .dropdown-cart .dropdown-menu.dropdown-menu-media .media .media-meta,
.dark-layout .header-navbar .navbar-container .nav .dropdown-notification .dropdown-menu.dropdown-menu-media .media .media-meta {
  color: #c9c9c9;
}

.dark-layout .header-navbar .navbar-container .nav .dropdown-cart .dropdown-menu.dropdown-menu-media .media:hover,
.dark-layout .header-navbar .navbar-container .nav .dropdown-notification .dropdown-menu.dropdown-menu-media .media:hover {
  background-color: #0d0d0d;
}

.dark-layout .header-navbar .navbar-container .nav .dropdown-cart .dropdown-menu.dropdown-menu-media .dropdown-menu-header,
.dark-layout .header-navbar .navbar-container .nav .dropdown-notification .dropdown-menu.dropdown-menu-media .dropdown-menu-header {
  border-bottom: 1px solid #3b2e10;
}

.dark-layout .header-navbar .navbar-container .nav .dropdown-cart .dropdown-menu.dropdown-menu-media .dropdown-menu-footer,
.dark-layout .header-navbar .navbar-container .nav .dropdown-notification .dropdown-menu.dropdown-menu-media .dropdown-menu-footer {
  background-color: #141414;
  border-top: 1px solid #3b2e10;
}

.dark-layout .header-navbar .navbar-container .nav .dropdown-cart.empty-cart:before {
  background-color: #0d0d0d;
}

.dark-layout .header-navbar .navbar-container .nav .dropdown-cart li,
.dark-layout .header-navbar .navbar-container .nav .dropdown-cart .dropdown-header span {
  color: #fff;
}

.dark-layout .header-navbar .navbar-container .nav .dropdown-cart .cart-item {
  color: #c9c9c9;
}

.dark-layout .header-navbar .navbar-container .nav .dropdown-cart .media img {
  background-color: #0d0d0d;
}

.dark-layout .header-navbar .navbar-container .nav .dropdown-cart .media-heading .cart-item-by,
.dark-layout .header-navbar .navbar-container .nav .dropdown-notification .notification-text {
  color: #8c7b4e;
}

.dark-layout .header-navbar .navbar-container .nav .dropdown-notification .media-body .media-heading {
  color: #f3f3f3;
}

.dark-layout .header-navbar[class*='bg-'] .navbar-nav .nav-item .nav-link {
  background-color: inherit;
}

/* Blank Page */
.dark-layout .blank-page .card.bg-transparent h1,
.dark-layout .blank-page .card.bg-transparent h2,
.dark-layout .blank-page .card.bg-transparent h3,
.dark-layout .blank-page .card.bg-transparent h4,
.dark-layout .blank-page .card.bg-transparent h5,
.dark-layout .blank-page .card.bg-transparent h6 {
  color: #141414;
}

.dark-layout .blank-page .card.bg-transparent p {
  color: #0d0d0d;
}

/* Main Menu / Sidebar */
.dark-layout .main-menu {
  background-color: #111111;
}

.dark-layout .main-menu .shadow-bottom {
  background: linear-gradient(180deg, #161616 44%, rgba(20, 20, 20, 0.51) 73%, rgba(10, 10, 10, 0));
}

.dark-layout .main-menu:not(.expanded) .navigation .sidebar-group-active > a,
.dark-layout .main-menu.menu-dark .navigation > li.open:not(.menu-item-closing) > a,
.dark-layout .main-menu.menu-dark .navigation > li.sidebar-group-active > a {
  background-color: #0d0d0d;
}

.dark-layout .main-menu .collapse-toggle-icon {
  color: #d4af37 !important;
}

.dark-layout .main-menu-content .navigation-main {
  background-color: #141414;
}

.dark-layout .main-menu-content .navigation-main .navigation-header {
  color: #d4af37;
}

.dark-layout .main-menu-content .navigation-main li a {
  color: #c9a858 !important;
}

.dark-layout .main-menu-content .navigation-main .nav-item i,
.dark-layout .main-menu-content .navigation-main .nav-item svg {
  color: #d4af37;
}

.dark-layout .main-menu-content .navigation-main .nav-item.open > a {
  background-color: #1f1b12 !important;
}

.dark-layout .main-menu-content .navigation-main .nav-item a:after {
  color: #f3f3f3;
}

.dark-layout .main-menu-content .navigation-main .nav-item .menu-content {
  background-color: #0d0d0dfc;
}

.dark-layout .main-menu-content .navigation-main .active .menu-title,
.dark-layout .main-menu-content .navigation-main .active i,
.dark-layout .main-menu-content .navigation-main .active svg {
  color: #fff;
}

.dark-layout .menu-collapsed .main-menu:not(.expanded) .navigation-main li.active > a {
  background: #0d0d0d !important;
}

/* Scrollbars (Perfect Scrollbar) */
.dark-layout .ps__thumb-x,
.dark-layout .ps__thumb-y {
  background-color: #c9c9c9;
}

.dark-layout .ps .ps__rail-x.ps--clicking,
.dark-layout .ps .ps__rail-x:focus,
.dark-layout .ps .ps__rail-x:hover,
.dark-layout .ps .ps__rail-y.ps--clicking,
.dark-layout .ps .ps__rail-y:focus,
.dark-layout .ps .ps__rail-y:hover {
  background-color: #3b2e10;
}

/* Alerts, Breadcrumbs & Cards */
.dark-layout .alert .alert-heading,
.dark-layout .alert p {
  color: inherit;
}

.dark-layout .content-header-left .breadcrumbs-top .content-header-title {
  color: #f3f3f3;
  border-color: #3b2e10;
}

.dark-layout .breadcrumb .breadcrumb-item {
  color: #ffffff;
}

.dark-layout .breadcrumb .breadcrumb-item + .breadcrumb-item::before {
  color: #c9c9c9;
}

.dark-layout .card {
  background-color: #111111;
  box-shadow: 0 4px 24px 0 rgba(0, 0, 0, 0.6);
}

.dark-layout .card .card-footer {
  border-color: #3b2e10;
}

/* Buttons */
.dark-layout .btn:not([class*='btn-']) {
  color: #c9c9c9;
}

.dark-layout .btn.btn-dark {
  background-color: #222222 !important;
  color: #dcdcdc;
}

.dark-layout .btn.btn-outline-dark {
  border-color: #222222;
  color: #dcdcdc;
}

.dark-layout .btn-group-toggle label[class*='btn-outline-'] {
  color: #d4af37 !important;
}

/* Dropdowns & Modals */
.dark-layout .dropdown-menu {
  background-color: #121212;
  box-shadow: 0 4px 24px 0 rgba(0, 0, 0, 0.6);
}

.dark-layout .dropdown-menu .dropdown-item {
  color: #c9c9c9;
}

.dark-layout .dropdown-menu .dropdown-item:hover,
.dark-layout .dropdown-menu .dropdown-item:focus {
  background: rgba(212, 175, 55, 0.12);
  color: #f3e5ab;
}

.dark-layout .dropdown-menu .dropdown-item:active,
.dark-layout .dropdown-menu .dropdown-item.active {
  color: #111;
  background-color: #d4af37;
}

.dark-layout .modal .modal-content,
.dark-layout .modal .modal-body,
.dark-layout .modal .modal-footer {
  background-color: #141414;
  border-color: #3b2e10;
}

/* Forms & Inputs */
.dark-layout input.form-control,
.dark-layout .custom-file-label,
.dark-layout textarea.form-control {
  background-color: #141414;
  color: #f3e5ab;
}

.dark-layout input.form-control:not(:focus),
.dark-layout .custom-file-label:not(:focus),
.dark-layout textarea.form-control:not(:focus) {
  border-color: #3b2e10;
}

.dark-layout select.form-control,
.dark-layout .custom-select {
  background-color: #141414;
  color: #c9c9c9;
  border-color: #3b2e10;
}

.dark-layout select.form-control:focus,
.dark-layout .custom-select:focus {
  border-color: #d4af37;
}

/* Tables */
.dark-layout .table {
  background-color: #111111;
}

.dark-layout .table td,
.dark-layout .table th {
  color: #c9c9c9;
  border-color: #3b2e10 !important;
}

.dark-layout .table thead tr th,
.dark-layout .table tfoot tr th {
  border-color: #3b2e10;
  background-color: #181818;
  color: #d4af37;
}

.dark-layout .table.table-hover tbody tr:hover {
  background-color: #1a1a1a;
}

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

/* Visible Breadcrumbs-Top Fix (Fixed and Completed) */
.dark-layout .content-header-left .breadcrumbs-top {
  color: #ffffff !important;
  background: transparent !important;
}

/* Auth Layout Dark-Theme Overrides */
.dark-layout .auth-wrapper.auth-v2 {
  background-color: #111111 !important;
}

.dark-layout .auth-wrapper.auth-v2 .auth-inner {
  background-color: #111111 !important;
}

.dark-layout .auth-wrapper.auth-v2 .auth-bg {
  background-color: #0d0d0d !important;
  border-left: 1px solid #3b2e10;
}

/* Emphasize SweetAlert2 Title in Dark Layout */
.dark-layout .swal2-popup .swal2-title {
  color: #f3f3f3 !important;
  font-weight: 700 !important;
  font-size: 1.6rem !important;
  text-shadow: 0 2px 4px rgba(0, 0, 0, 0.5);
}

/* Optional: Enhance the whole popup container background and border to match your theme */
.dark-layout .swal2-popup {
  background-color: #141414 !important;
  color: #c9c9c9 !important;
  border: 1px solid #3b2e10 !important;
  box-shadow: 0 4px 24px 0 rgba(0, 0, 0, 0.8) !important;
}

/* Optional: Emphasize the alert content text as well */
.dark-layout .swal2-popup .swal2-html-container {
  color: #e5d4a1 !important;
}


/* ==========================================================================
   BUTTONS - DARK LAYOUT & GOLD THEME BLENDING
   ========================================================================== */

/* 1. Default & Generic Buttons */
.dark-layout .btn:not([class*='btn-']) {
  color: #111111 !important;
  background-color: #d4af37;
  border-color: #d4af37;
}

.dark-layout .btn:not([class*='btn-']):hover {
  color: #111111 !important;
  background-color: #f3e5ab;
  border-color: #f3e5ab;
}

/* 2. Solid Theme Buttons (e.g., btn-info, btn-primary, etc.) */
.dark-layout .btn.btn-info,
.dark-layout .btn.btn-primary,
.dark-layout .btn.btn-success,
.dark-layout .btn.btn-warning,
.dark-layout .btn.btn-danger {
  color: #111111 !important;
  font-weight: 600;
  text-shadow: none;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.4);
}

.dark-layout .btn.btn-info:hover,
.dark-layout .btn.btn-primary:hover,
.dark-layout .btn.btn-success:hover,
.dark-layout .btn.btn-warning:hover,
.dark-layout .btn.btn-danger:hover {
  color: #000000 !important;
  filter: brightness(1.1);
}

/* 3. Dark & Secondary Buttons */
.dark-layout .btn.btn-dark {
  background-color: #1a1a1a !important;
  color: #f3f3f3 !important;
  border-color: #3b2e10 !important;
}

.dark-layout .btn.btn-dark:hover {
  background-color: #262010 !important;
  color: #d4af37 !important;
}

/* 4. Outline Buttons */
.dark-layout .btn[class*='btn-outline-'] {
  color: #d4af37 !important;
  border-color: #3b2e10 !important;
  background-color: transparent;
}

.dark-layout .btn[class*='btn-outline-']:hover {
  color: #111111 !important;
  background-color: #d4af37 !important;
  border-color: #d4af37 !important;
}

/* 5. Specific Login Button Adjustments (matches your form button) */
.dark-layout .btn.btn-login,
.dark-layout .btn-block {
  background: linear-gradient(to right, #BF953F, #FCF6BA, #B38728, #FBF5B7, #AA771C) !important;
  color: #111111 !important;
  font-weight: 700;
  border: 1px solid #3b2e10;
}

.dark-layout .btn.btn-login:hover,
.dark-layout .btn-block:hover {
  filter: brightness(1.15);
  color: #000000 !important;
}

/* ==========================================================================
   BADGES & ROUNDED PILLS - DARK LAYOUT & GOLD THEME BLENDING
   ========================================================================== */

/* 1. Base Badge & Rounded Pill Text Contrast */
.dark-layout .badge,
.dark-layout .badge.rounded-pill,
.dark-layout .badge-pill {
  color: #111111 !important;
  font-weight: 600;
  text-shadow: none;
}

/* 2. Theme-Specific Badges (Solid Fills) */
.dark-layout .badge.badge-primary,
.dark-layout .badge.badge-info,
.dark-layout .badge.badge-success,
.dark-layout .badge.badge-warning,
.dark-layout .badge.badge-danger {
  color: #111111 !important;
}

/* 3. Gold Gradient Badge Accent (matches your login button style) */
.dark-layout .badge.badge-gold,
.dark-layout .badge.bg-gold {
  background: linear-gradient(to right, #BF953F, #FCF6BA, #B38728, #FBF5B7, #AA771C) !important;
  color: #111111 !important;
  border: 1px solid #3b2e10;
}

/* 4. Dark & Secondary Badges */
.dark-layout .badge.badge-dark,
.dark-layout .badge.badge-secondary {
  background-color: #1a1a1a !important;
  color: #f3f3f3 !important;
  border: 1px solid #3b2e10;
}

/* 5. Light/Subtle Badges (Soft background tint with readable text) */
.dark-layout .badge.badge-light,
.dark-layout .badge.badge-light-primary,
.dark-layout .badge.badge-light-info,
.dark-layout .badge.badge-light-success,
.dark-layout .badge.badge-light-warning,
.dark-layout .badge.badge-light-danger {
  background-color: rgba(212, 175, 55, 0.15) !important;
  color: #f3e5ab !important;
  border: 1px solid rgba(59, 46, 16, 0.5);
}

/* 6. Outline Badges */
.dark-layout .badge[class*='badge-outline-'] {
  background-color: transparent !important;
  color: #d4af37 !important;
  border-color: #3b2e10 !important;
}

.dark-layout .badge[class*='badge-outline-']:hover {
  background-color: #d4af37 !important;
  color: #111111 !important;
}


/* ==========================================================================
   MODALS - DARK LAYOUT & GOLD THEME BLENDING
   ========================================================================== */

/* 1. Modal Dialog Container & Surface */
.dark-layout .modal .modal-content {
  background-color: #111111 !important;
  color: #c9c9c9 !important;
  border: 1px solid #3b2e10 !important;
  box-shadow: 0 10px 40px 0 rgba(0, 0, 0, 0.8) !important;
}

/* 2. Modal Header */
.dark-layout .modal .modal-header {
  background-color: #141414 !important;
  border-bottom: 1px solid #3b2e10 !important;
  color: #f3f3f3 !important;
}

.dark-layout .modal .modal-header .modal-title {
  color: #f3f3f3 !important;
  font-weight: 700;
}

/* 3. Modal Close Button */
.dark-layout .modal .modal-header .close,
.dark-layout .modal .modal-header .btn-close {
  background-color: #1a1a1a !important;
  color: #c9c9c9 !important;
  border: 1px solid #3b2e10 !important;
  text-shadow: none;
  opacity: 1;
  box-shadow: 0 3px 8px 0 rgba(0, 0, 0, 0.6) !important;
}

.dark-layout .modal .modal-header .close:hover,
.dark-layout .modal .modal-header .btn-close:hover {
  background-color: #d4af37 !important;
  color: #111111 !important;
}

/* 4. Modal Body */
.dark-layout .modal .modal-body {
  background-color: #111111 !important;
  color: #c9c9c9 !important;
}

/* 5. Modal Footer */
.dark-layout .modal .modal-footer {
  background-color: #141414 !important;
  border-top: 1px solid #3b2e10 !important;
}

/* 6. Modal Backdrop / Overlay Dimming */
.dark-layout .modal-backdrop {
  background-color: #000000 !important;
  opacity: 0.75 !important;
}

/* 7. Modal Scrollable & Centered Modals Extra Polish */
.dark-layout .modal-dialog-scrollable .modal-content {
  max-height: calc(100vh - 3.5rem);
}

.dark-layout .modal-dialog-scrollable .modal-body {
  scrollbar-color: #3b2e10 #111111;
}


/* ==========================================================================
   TABLES & DATATABLES - DARK LAYOUT & GOLD THEME BLENDING
   ========================================================================== */

/* 1. Base Table Styling */
.dark-layout .table {
  background-color: #111111 !important;
  color: #c9c9c9 !important;
  border-color: #3b2e10 !important;
}

.dark-layout .table th,
.dark-layout .table td {
  color: #c9c9c9 !important;
  border-color: #3b2e10 !important;
  background-color: transparent;
}

/* 2. Table Headers & Footers */
.dark-layout .table thead th,
.dark-layout .table tfoot th,
.dark-layout .table thead td {
  background-color: #181818 !important;
  color: #d4af37 !important;
  border-bottom: 2px solid #3b2e10 !important;
  font-weight: 700;
}

/* 3. Striped & Hover Rows */
.dark-layout .table.table-striped tbody tr:nth-of-type(odd) {
  background-color: #151515 !important;
}

.dark-layout .table.table-hover tbody tr:hover {
  background-color: #1c1910 !important;
  color: #f3e5ab !important;
}

.dark-layout .table.table-hover tbody tr:hover td {
  color: #f3e5ab !important;
}

/* 4. DataTable Wrapper Elements (Search, Length Menu, Info) */
.dark-layout .dataTables_wrapper {
  color: #c9c9c9 !important;
}

.dark-layout .dataTables_wrapper .dataTables_length select,
.dark-layout .dataTables_wrapper .dataTables_filter input {
  background-color: #141414 !important;
  color: #f3e5ab !important;
  border: 1px solid #3b2e10 !important;
  border-radius: 0.35rem;
  padding: 0.4rem 0.8rem;
}

.dark-layout .dataTables_wrapper .dataTables_length select:focus,
.dark-layout .dataTables_wrapper .dataTables_filter input:focus {
  border-color: #d4af37 !important;
  box-shadow: none !important;
}

.dark-layout .dataTables_wrapper .dataTables_info {
  color: #8c7b4e !important;
}

/* 5. DataTable Buttons (Copy, Excel, PDF, Print, ColVis) */
.dark-layout .dataTables_wrapper .dt-buttons .btn,
.dark-layout .dataTables_wrapper .dt-buttons [class*='buttons-'] {
  background-color: #141414 !important;
  color: #d4af37 !important;
  border: 1px solid #3b2e10 !important;
  font-weight: 600;
}

.dark-layout .dataTables_wrapper .dt-buttons .btn:hover,
.dark-layout .dataTables_wrapper .dt-buttons [class*='buttons-']:hover {
  background-color: #d4af37 !important;
  color: #111111 !important;
  border-color: #d4af37 !important;
}

/* 6. DataTable Pagination */
.dark-layout .dataTables_wrapper .dataTables_paginate .paginate_button {
  background-color: #141414 !important;
  color: #c9c9c9 !important;
  border: 1px solid #3b2e10 !important;
  border-radius: 0.25rem;
}

.dark-layout .dataTables_wrapper .dataTables_paginate .paginate_button:hover {
  background-color: #d4af37 !important;
  color: #111111 !important;
  border-color: #d4af37 !important;
}

.dark-layout .dataTables_wrapper .dataTables_paginate .paginate_button.current,
.dark-layout .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {
  background: linear-gradient(to right, #BF953F, #FCF6BA, #B38728, #FBF5B7, #AA771C) !important;
  color: #111111 !important;
  border-color: #3b2e10 !important;
  font-weight: 700;
}

.dark-layout .dataTables_wrapper .dataTables_paginate .paginate_button.disabled,
.dark-layout .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover {
  background-color: #111111 !important;
  color: #8c7b4e !important;
  border-color: #3b2e10 !important;
  opacity: 0.6;
}

/* 7. DataTable Grouping Rows */
.dark-layout .table.dataTable tr.group {
  background-color: #1a1a1a !important;
  color: #f3f3f3 !important;
  font-weight: 700;
  border-top: 2px solid #3b2e10 !important;
  border-bottom: 2px solid #3b2e10 !important;
}

/* ==========================================================================
   BREADCRUMBS - GOLD BACKGROUND VISibility FIX
   ========================================================================== */

/* 1. Ensure breadcrumb wrapper containers sit correctly without unwanted wrapping or misalignment */
.dark-layout .content-header-left .breadcrumbs-top,
.dark-layout .content-header-left .breadcrumb-wrapper {
  background: transparent !important;
}

/* 2. Force breadcrumb container and items to flow nicely horizontally with strict spacing */
.dark-layout .breadcrumb {
  display: flex;
  flex-wrap: wrap;
  list-style: none;
  background-color: transparent !important;
}

/* 3. Correct item placement & High Contrast text for gold/light backgrounds */
.dark-layout .breadcrumb .breadcrumb-item {
  color: #111111 !important; /* Deep dark color for maximum contrast against gold/light headers */
  font-weight: 600;
  text-shadow: none;
}

/* 4. Breadcrumb Link States (Clickable previous pages) */
.dark-layout .breadcrumb .breadcrumb-item a {
  color: #0d0d0d !important;
  font-weight: 700;
  text-decoration: none;
}

.dark-layout .breadcrumb .breadcrumb-item a:hover {
  color: #ffffff !important;
  text-decoration: underline;
}

/* 5. Active / Current Page Breadcrumb Item */
.dark-layout .breadcrumb .breadcrumb-item.active {
  color: #262010 !important;
  font-weight: 800;
}

/* 6. Fix Separators / Slashes / Chevrons visibility against gold */
.dark-layout .breadcrumb .breadcrumb-item + .breadcrumb-item::before {
  color: #1a1a1a !important;
  font-weight: 900;
  padding-right: 0.5rem;
  padding-left: 0.5rem;
}

/* 7. SVG Chevron Separator color override for absolute clarity */
.dark-layout .breadcrumb:not([class*='breadcrumb-']) .breadcrumb-item + .breadcrumb-item:before,
.dark-layout .breadcrumb-chevron.breadcrumb .breadcrumb-item + .breadcrumb-item:before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23111111' stroke-width='3' stroke-linecap='round' stroke-linejoin='round' class='feather feather-chevron-right'%3E%3Cpolyline points='9 18 15 12 9 6'%3E%3C/polyline%3E%3C/svg%3E") !important;
}

/* 8. Content Header Title next to breadcrumbs */
.dark-layout .content-header-left .breadcrumbs-top .content-header-title {
  color: #111111 !important;
  font-weight: 800;
  border-right-color: #3b2e10 !important;
}