/* ==============================
   app-dark.css (Layout-safe)
   Dark theme: Apple-like, soft readable.
   IMPORTANT: no sizing/layout/positioning changes.
   Only colors, backgrounds, borders, shadows, focus states.
   ============================== */

:root[data-bs-theme="dark"]{
  /* Brand */
  --brand: #fbc90b;
  --brand-strong: #ffd55c;

  /* Backgrounds */
  --bg: #0b0c0f;
  --bg-2: #0f1116;
  --panel: #14161c;
  --panel-2: #171a21;

  /* Borders */
  --border: rgba(255,255,255,.10);
  --border-soft: rgba(255,255,255,.075);

  /* Text (soft, not too bright) */
  --ink: #d4d8e0;
  --ink-700: #e2e6ee;
  --ink-600: #c7ccd6;
  --ink-500: #aeb4c2;
  --ink-400: #8e96a6;
  --ink-300: #767f92;

  /* Semantic */
  --success: #32d296;
  --danger:  #ff6b6b;
  --warning: #fbc90b;
  --info:    #7aa7ff;

  /* Focus ring */
  --focus: 0 0 0 .22rem rgba(251, 201, 11, .22);

  /* Shadows */
  --elev-1: 0 1px 8px rgba(0,0,0,.42);
  --elev-2: 0 10px 24px rgba(0,0,0,.55);
  --elev-3: 0 18px 44px rgba(0,0,0,.62);

  /* Bootstrap vars */
  --bs-body-bg: var(--bg);
  --bs-body-color: var(--ink);
  --bs-emphasis-color: var(--ink-700);
  --bs-secondary-color: var(--ink-500);
  --bs-tertiary-color: var(--ink-400);
  --bs-secondary-bg: var(--panel);
  --bs-tertiary-bg: var(--panel-2);
  --bs-border-color: var(--border);
  --bs-border-color-translucent: var(--border-soft);

  --bs-link-color: var(--ink-600);
  --bs-link-hover-color: var(--brand);

  --bs-success: var(--success);
  --bs-danger: var(--danger);
  --bs-warning: var(--warning);
  --bs-info: var(--info);

  --bs-code-color: #ff9ec3;
}

/* ---------------------------------------
   Base (no layout changes)
---------------------------------------- */
:root[data-bs-theme="dark"] body,
:root[data-bs-theme="dark"] .site-body{
  background:
    radial-gradient(900px 560px at 12% 0%, rgba(255,255,255,.032) 0%, rgba(255,255,255,0) 55%),
    radial-gradient(720px 480px at 90% 8%, rgba(255,255,255,.024) 0%, rgba(255,255,255,0) 55%),
    linear-gradient(180deg, #0b0c0f 0%, #0b0c0f 45%, #090a0d 100%);
  background-color: var(--bg);
  color: var(--ink);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

:root[data-bs-theme="dark"] ::selection{
  background: rgba(251,201,11,.24);
  color: #101216;
}

:root[data-bs-theme="dark"] hr{
  border-color: var(--border-soft);
  opacity: 1;
}

:root[data-bs-theme="dark"] .text-muted,
:root[data-bs-theme="dark"] .small{
  color: var(--ink-400) !important;
}

:root[data-bs-theme="dark"] a{
  color: var(--ink-600);
  text-decoration: none;
}
:root[data-bs-theme="dark"] a:hover{ color: var(--brand); }

:root[data-bs-theme="dark"] h1,
:root[data-bs-theme="dark"] h2,
:root[data-bs-theme="dark"] h3,
:root[data-bs-theme="dark"] h4,
:root[data-bs-theme="dark"] h5,
:root[data-bs-theme="dark"] h6{
  color: var(--ink-700) !important;
}

/* Code / pre / kbd (no padding/radius changes) */
:root[data-bs-theme="dark"] code{
  color: var(--bs-code-color);
  background: rgba(255,255,255,.04);
  border: 1px solid var(--border-soft);
}
:root[data-bs-theme="dark"] pre{
  background: rgba(255,255,255,.03);
  border: 1px solid var(--border);
  color: var(--ink);
  box-shadow: var(--elev-1);
}
:root[data-bs-theme="dark"] kbd{
  background: rgba(255,255,255,.07);
  border: 1px solid var(--border);
  color: var(--ink-700);
  box-shadow: none;
}

/* ---------------------------------------
   Header / Dropdown
---------------------------------------- */
:root[data-bs-theme="dark"] .site-header{
  background: rgba(11,12,15,.74);
  backdrop-filter: saturate(135%) blur(14px);
  -webkit-backdrop-filter: saturate(135%) blur(14px);
  box-shadow: 0 1px 0 var(--border), 0 14px 26px rgba(0,0,0,.30);
}

:root[data-bs-theme="dark"] .app-bar{
  background: rgba(20,22,28,.78) !important;
  border: 1px solid var(--border) !important;
  box-shadow: var(--elev-2) !important;
  backdrop-filter: saturate(135%) blur(12px);
  -webkit-backdrop-filter: saturate(135%) blur(12px);
}

:root[data-bs-theme="dark"] .app-bar.is-glass{
  background: rgba(20,22,28,.58) !important;
  border-color: rgba(255,255,255,.07) !important;
  box-shadow: none !important;
  backdrop-filter: saturate(135%) blur(14px);
  -webkit-backdrop-filter: saturate(135%) blur(14px);
}

:root[data-bs-theme="dark"] .dropdown-menu{
  background: var(--panel) !important;
  border: 1px solid var(--border) !important;
  box-shadow: var(--elev-2) !important;
}
:root[data-bs-theme="dark"] .dropdown-item{
  color: var(--ink-600) !important;
}
:root[data-bs-theme="dark"] .dropdown-item:hover,
:root[data-bs-theme="dark"] .dropdown-item:focus{
  background: rgba(255,255,255,.055) !important;
  color: var(--ink-700) !important;
}
:root[data-bs-theme="dark"] .dropdown-divider{
  border-top-color: var(--border-soft) !important;
  opacity: 1;
}

/* ---------------------------------------
   Cards / panels (color-only)
---------------------------------------- */
:root[data-bs-theme="dark"] .card,
:root[data-bs-theme="dark"] .kpi,
:root[data-bs-theme="dark"] .dashboard-section,
:root[data-bs-theme="dark"] .news-card,
:root[data-bs-theme="dark"] .chart-card,
:root[data-bs-theme="dark"] .accordion-item,
:root[data-bs-theme="dark"] .empty-state,
:root[data-bs-theme="dark"] .gallery .gallery-item,
:root[data-bs-theme="dark"] .status-item{
  background: linear-gradient(180deg, rgba(20,22,28,.98) 0%, rgba(18,20,26,.98) 100%) !important;
  border: 1px solid var(--border) !important;
  box-shadow: var(--elev-2) !important;
  color: var(--ink);
}

:root[data-bs-theme="dark"] .card .card-header{
  background: rgba(255,255,255,.025) !important;
  border-bottom: 1px solid var(--border-soft) !important;
}
:root[data-bs-theme="dark"] .card-title{ color: var(--ink-700) !important; }

/* =========================================================
   TABLES — Bootstrap-friendly (no radius/overflow/padding)
   ========================================================= */
:root[data-bs-theme="dark"] .table{
  --bs-table-bg: transparent;
  --bs-table-color: var(--ink);
  --bs-table-striped-bg: rgba(255,255,255,.02);
  --bs-table-striped-color: var(--ink);
  --bs-table-active-bg: rgba(255,255,255,.06);
  --bs-table-active-color: var(--ink-700);
  --bs-table-hover-bg: rgba(255,255,255,.045);
  --bs-table-hover-color: var(--ink-700);
  --bs-table-border-color: var(--border-soft);

  color: var(--ink) !important;
}

:root[data-bs-theme="dark"] .table th,
:root[data-bs-theme="dark"] .table td{
  color: var(--ink) !important;
  border-color: var(--border-soft) !important;
}

:root[data-bs-theme="dark"] .table > :not(caption) > * > *{
  background: transparent !important;
  border-color: var(--border-soft) !important;
  color: var(--ink) !important;
}

:root[data-bs-theme="dark"] .table caption{
  color: var(--ink-400) !important;
}

:root[data-bs-theme="dark"] .table thead th{
  background: rgba(255,255,255,.03) !important;
  color: var(--ink-600) !important;
  border-bottom-color: rgba(255,255,255,.12) !important;
}

:root[data-bs-theme="dark"] .table-striped > tbody > tr:nth-of-type(odd) > *{
  background: rgba(255,255,255,.02) !important;
}
:root[data-bs-theme="dark"] .table-hover > tbody > tr:hover > *{
  background: rgba(255,255,255,.045) !important;
}
:root[data-bs-theme="dark"] .table-active > * > * ,
:root[data-bs-theme="dark"] .table tbody tr.table-active > *{
  background: rgba(255,255,255,.06) !important;
  color: var(--ink-700) !important;
}

:root[data-bs-theme="dark"] .table-bordered{
  border-color: var(--border) !important;
}
:root[data-bs-theme="dark"] .table-bordered > :not(caption) > *{
  border-color: var(--border-soft) !important;
}

:root[data-bs-theme="dark"] .table.table-dark{
  --bs-table-bg: transparent;
  --bs-table-color: var(--ink);
  --bs-table-border-color: var(--border-soft);
}

:root[data-bs-theme="dark"] .table a{ color: var(--ink-600) !important; }
:root[data-bs-theme="dark"] .table a:hover{ color: var(--brand) !important; }
:root[data-bs-theme="dark"] .table .text-muted{ color: var(--ink-400) !important; }

/* Inputs inside tables (color only) */
:root[data-bs-theme="dark"] .table .form-control,
:root[data-bs-theme="dark"] .table .form-select{
  background: rgba(255,255,255,.03) !important;
  border-color: var(--border) !important;
  color: var(--ink-700) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.03), var(--elev-1) !important;
}

/* Bootstrap table-light override */
:root[data-bs-theme="dark"] .table-light{
  --bs-table-bg: rgba(255,255,255,.03) !important;
  --bs-table-color: var(--ink-600) !important;
  --bs-table-striped-bg: rgba(255,255,255,.02) !important;
  --bs-table-striped-color: var(--ink) !important;
  --bs-table-active-bg: rgba(255,255,255,.06) !important;
  --bs-table-active-color: var(--ink-700) !important;
  --bs-table-hover-bg: rgba(255,255,255,.045) !important;
  --bs-table-hover-color: var(--ink-700) !important;
  --bs-table-border-color: var(--border-soft) !important;

  background: rgba(255,255,255,.03) !important;
  color: var(--ink-600) !important;
  border-color: var(--border-soft) !important;
}
:root[data-bs-theme="dark"] .table thead.table-light th{
  background: rgba(255,255,255,.03) !important;
  color: var(--ink-600) !important;
  border-bottom-color: rgba(255,255,255,.12) !important;
}
:root[data-bs-theme="dark"] .table tbody tr.table-light > *,
:root[data-bs-theme="dark"] .table td.table-light,
:root[data-bs-theme="dark"] .table th.table-light{
  background: rgba(255,255,255,.02) !important;
  color: var(--ink) !important;
}

/* =========================================================
   Forms — full pack (color-only)
   ========================================================= */
:root[data-bs-theme="dark"] .form-label,
:root[data-bs-theme="dark"] label{
  color: var(--ink-600) !important;
}
:root[data-bs-theme="dark"] .form-text{
  color: var(--ink-400) !important;
}

:root[data-bs-theme="dark"] .form-control,
:root[data-bs-theme="dark"] textarea.form-control,
:root[data-bs-theme="dark"] .form-select,
:root[data-bs-theme="dark"] .input-group-text{
  background: rgba(255,255,255,.035) !important;
  border: 1px solid var(--border) !important;
  color: var(--ink-700) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.035), var(--elev-1) !important;
}

:root[data-bs-theme="dark"] .form-control:focus,
:root[data-bs-theme="dark"] textarea.form-control:focus,
:root[data-bs-theme="dark"] .form-select:focus{
  border-color: rgba(251,201,11,.45) !important;
  box-shadow: var(--focus) !important;
}

:root[data-bs-theme="dark"] .form-control::placeholder,
:root[data-bs-theme="dark"] textarea::placeholder{
  color: var(--ink-300) !important;
}

:root[data-bs-theme="dark"] .form-control[readonly],
:root[data-bs-theme="dark"] .form-select[readonly]{ opacity: .88; }

:root[data-bs-theme="dark"] .form-control:disabled,
:root[data-bs-theme="dark"] .form-select:disabled,
:root[data-bs-theme="dark"] .input-group-text:disabled{
  opacity: .55;
  cursor: not-allowed;
}

:root[data-bs-theme="dark"] .form-control-plaintext{ color: var(--ink-600) !important; }

:root[data-bs-theme="dark"] .form-floating > label{ color: var(--ink-400) !important; }
:root[data-bs-theme="dark"] .form-floating > .form-control:focus ~ label,
:root[data-bs-theme="dark"] .form-floating > .form-control:not(:placeholder-shown) ~ label,
:root[data-bs-theme="dark"] .form-floating > .form-select ~ label{
  color: var(--ink-500) !important;
}

/* Input group */
:root[data-bs-theme="dark"] .input-group-text{
  color: var(--ink-500) !important;
  background: rgba(255,255,255,.03) !important;
}
:root[data-bs-theme="dark"] .input-group .btn{
  border-color: var(--border) !important;
}

/* Validation */
:root[data-bs-theme="dark"] .is-valid,
:root[data-bs-theme="dark"] .was-validated .form-control:valid,
:root[data-bs-theme="dark"] .was-validated .form-select:valid{
  border-color: rgba(50,210,150,.55) !important;
}
:root[data-bs-theme="dark"] .is-invalid,
:root[data-bs-theme="dark"] .was-validated .form-control:invalid,
:root[data-bs-theme="dark"] .was-validated .form-select:invalid{
  border-color: rgba(255,107,107,.60) !important;
}
:root[data-bs-theme="dark"] .valid-feedback{ color: rgba(50,210,150,.85) !important; }
:root[data-bs-theme="dark"] .invalid-feedback{ color: rgba(255,107,107,.90) !important; }

/* Checkboxes / radios / switches */
:root[data-bs-theme="dark"] .form-check-label{ color: var(--ink-500) !important; }
:root[data-bs-theme="dark"] .form-check-input{
  background-color: rgba(255,255,255,.05);
  border-color: var(--border);
}
:root[data-bs-theme="dark"] .form-check-input:checked{
  background-color: rgba(251,201,11,.92);
  border-color: rgba(251,201,11,.92);
}
:root[data-bs-theme="dark"] .form-check-input:focus{
  box-shadow: var(--focus);
  border-color: rgba(251,201,11,.45);
}

/* File input (color-only) */
:root[data-bs-theme="dark"] .form-control[type="file"]{ color: var(--ink-500) !important; }
:root[data-bs-theme="dark"] .form-control[type="file"]::file-selector-button{
  background: rgba(255,255,255,.06);
  border: 1px solid var(--border);
  color: var(--ink-700);
}
:root[data-bs-theme="dark"] .form-control[type="file"]::file-selector-button:hover{
  background: rgba(255,255,255,.09);
}

/* Datalist */
:root[data-bs-theme="dark"] datalist option{ background: var(--panel); color: var(--ink-700); }

/* Autofill */
:root[data-bs-theme="dark"] input:-webkit-autofill,
:root[data-bs-theme="dark"] textarea:-webkit-autofill,
:root[data-bs-theme="dark"] select:-webkit-autofill{
  -webkit-text-fill-color: var(--ink-700) !important;
  transition: background-color 9999s ease-in-out 0s;
  box-shadow: 0 0 0px 1000px rgba(255,255,255,.035) inset !important;
  border: 1px solid var(--border) !important;
}

/* =========================================================
   SELECT + OPTION (requested)
   ========================================================= */
:root[data-bs-theme="dark"] select,
:root[data-bs-theme="dark"] .form-select{
  background-color: rgba(255,255,255,.035) !important;
  color: var(--ink-700) !important;
}
:root[data-bs-theme="dark"] select option{
  background: var(--panel) !important;
  color: var(--ink-700) !important;
}
:root[data-bs-theme="dark"] select optgroup{
  background: var(--panel-2) !important;
  color: var(--ink-600) !important;
}
:root[data-bs-theme="dark"] select[multiple] option:checked{
  background: rgba(251,201,11,.22) !important;
  color: var(--ink-700) !important;
}

/* =========================================================
   Buttons / badges / pagination (no radius/spacing changes)
   ========================================================= */
:root[data-bs-theme="dark"] .btn{ box-shadow: var(--elev-1); }

:root[data-bs-theme="dark"] .btn-primary{
  background: linear-gradient(180deg, rgba(255,224,113,.95) 0%, rgba(251,201,11,.92) 100%) !important;
  border: 1px solid rgba(251,201,11,.65) !important;
  color: #101216 !important;
}
:root[data-bs-theme="dark"] .btn-primary:hover{ box-shadow: var(--elev-2); }

:root[data-bs-theme="dark"] .btn-dark{
  background: rgba(255,255,255,.05) !important;
  border: 1px solid var(--border) !important;
  color: var(--ink-700) !important;
}
:root[data-bs-theme="dark"] .btn-dark:hover{ background: rgba(255,255,255,.07) !important; }

:root[data-bs-theme="dark"] .btn-outline-dark,
:root[data-bs-theme="dark"] .btn-outline-secondary{
  background: transparent !important;
  border: 1px solid var(--border) !important;
  color: var(--ink-600) !important;
}
:root[data-bs-theme="dark"] .btn-outline-dark:hover,
:root[data-bs-theme="dark"] .btn-outline-secondary:hover{
  background: rgba(255,255,255,.055) !important;
  color: var(--ink-700) !important;
}

/* Pagination */
:root[data-bs-theme="dark"] .pagination .page-link{
  background: rgba(255,255,255,.035) !important;
  border: 1px solid var(--border) !important;
  color: var(--ink-600) !important;
}
:root[data-bs-theme="dark"] .pagination .page-item.active .page-link{
  background: rgba(255,255,255,.085) !important;
  border-color: rgba(251,201,11,.45) !important;
  color: var(--ink-700) !important;
  box-shadow: inset 0 -2px 0 rgba(251,201,11,.62) !important;
}

/* Badges (requested cases) */
:root[data-bs-theme="dark"] .badge{ border: 1px solid transparent; }

/* Generic text-bg-* safety */
:root[data-bs-theme="dark"] .text-bg-primary,
:root[data-bs-theme="dark"] .text-bg-secondary,
:root[data-bs-theme="dark"] .text-bg-success,
:root[data-bs-theme="dark"] .text-bg-danger,
:root[data-bs-theme="dark"] .text-bg-warning,
:root[data-bs-theme="dark"] .text-bg-info,
:root[data-bs-theme="dark"] .text-bg-light,
:root[data-bs-theme="dark"] .text-bg-dark{
  border-color: var(--border) !important;
}

/* Fix: badge rounded-pill text-bg-success */
:root[data-bs-theme="dark"] .badge.rounded-pill.text-bg-success{
  background: rgba(50,210,150,.18) !important;
  color: rgba(50,210,150,.96) !important;
  border: 1px solid rgba(50,210,150,.38) !important;
  box-shadow: var(--elev-1) !important;
}

:root[data-bs-theme="dark"] .badge.bg-dark,
:root[data-bs-theme="dark"] .badge.text-bg-dark{
  background: rgba(255,255,255,.095) !important;
  color: var(--ink-700) !important;
  border: 1px solid var(--border) !important;
}

:root[data-bs-theme="dark"] .badge.bg-light,
:root[data-bs-theme="dark"] .badge.text-bg-light{
  background: rgba(255,255,255,.07) !important;
  color: var(--ink-600) !important;
  border: 1px solid var(--border) !important;
}

/* =========================================================
   Navs / tabs / breadcrumbs (color-only)
   ========================================================= */
:root[data-bs-theme="dark"] .nav-tabs{
  border-bottom: 1px solid var(--border-soft) !important;
}
:root[data-bs-theme="dark"] .nav-tabs .nav-link{
  color: var(--ink-500) !important;
  background: transparent !important;
  border-color: transparent !important;
}
:root[data-bs-theme="dark"] .nav-tabs .nav-link:hover{
  color: var(--ink-700) !important;
  background: rgba(255,255,255,.035) !important;
}
:root[data-bs-theme="dark"] .nav-tabs .nav-link.active{
  color: var(--ink-700) !important;
  background: rgba(255,255,255,.055) !important;
  border-color: var(--border) var(--border) transparent !important;
  box-shadow: inset 0 -2px 0 rgba(251,201,11,.55) !important;
}

:root[data-bs-theme="dark"] .nav-pills .nav-link{
  color: var(--ink-500) !important;
}
:root[data-bs-theme="dark"] .nav-pills .nav-link:hover{
  background: rgba(255,255,255,.04) !important;
  color: var(--ink-700) !important;
}
:root[data-bs-theme="dark"] .nav-pills .nav-link.active{
  background: rgba(251,201,11,.18) !important;
  color: var(--ink-700) !important;
  box-shadow: inset 0 0 0 1px rgba(251,201,11,.20);
}

:root[data-bs-theme="dark"] .breadcrumb{
  background: transparent !important;
}
:root[data-bs-theme="dark"] .breadcrumb-item,
:root[data-bs-theme="dark"] .breadcrumb-item.active{
  color: var(--ink-400) !important;
}
:root[data-bs-theme="dark"] .breadcrumb-item a{
  color: var(--ink-600) !important;
}
:root[data-bs-theme="dark"] .breadcrumb-item a:hover{
  color: var(--brand) !important;
}

/* =========================================================
   Alerts / accordion (color-only)
   ========================================================= */
:root[data-bs-theme="dark"] .alert{
  background: rgba(255,255,255,.035) !important;
  border: 1px solid var(--border) !important;
  color: var(--ink-600) !important;
  box-shadow: var(--elev-2);
}
:root[data-bs-theme="dark"] .alert-warning{ border-left-color: rgba(251,201,11,.75) !important; }
:root[data-bs-theme="dark"] .alert-success{ border-left-color: rgba(50,210,150,.55) !important; }
:root[data-bs-theme="dark"] .alert-danger{ border-left-color: rgba(255,107,107,.55) !important; }

:root[data-bs-theme="dark"] .accordion-button{
  background: rgba(255,255,255,.025) !important;
  color: var(--ink-700) !important;
}
:root[data-bs-theme="dark"] .accordion-button:not(.collapsed){
  background: rgba(251,201,11,.085) !important;
  box-shadow: inset 0 -1px 0 rgba(255,255,255,.03);
}

/* =========================================================
   Modals / offcanvas / toasts / popovers / tooltips (color-only)
   ========================================================= */
:root[data-bs-theme="dark"] .modal-content{
  background: linear-gradient(180deg, rgba(20,22,28,.98) 0%, rgba(18,20,26,.98) 100%) !important;
  border: 1px solid var(--border) !important;
  box-shadow: var(--elev-3) !important;
}
:root[data-bs-theme="dark"] .modal-header{
  background: rgba(255,255,255,.025) !important;
  border-bottom: 1px solid var(--border-soft) !important;
}
:root[data-bs-theme="dark"] .modal-footer{
  border-top: 1px solid var(--border-soft) !important;
}

:root[data-bs-theme="dark"] .offcanvas{
  background: var(--bg-2) !important;
  border-color: var(--border) !important;
  box-shadow: var(--elev-3) !important;
  color: var(--ink);
}
:root[data-bs-theme="dark"] .offcanvas-header{
  background: rgba(255,255,255,.025) !important;
  border-bottom: 1px solid var(--border-soft) !important;
}
:root[data-bs-theme="dark"] .offcanvas .list-group-item{
  background: transparent !important;
  color: var(--ink-600) !important;
}
:root[data-bs-theme="dark"] .offcanvas .list-group-item:hover{
  background: rgba(255,255,255,.055) !important;
  color: var(--ink-700) !important;
}

:root[data-bs-theme="dark"] .toast{
  background: rgba(20,22,28,.92) !important;
  border: 1px solid var(--border) !important;
  color: var(--ink) !important;
  box-shadow: var(--elev-2) !important;
}
:root[data-bs-theme="dark"] .toast-header{
  background: rgba(255,255,255,.03) !important;
  color: var(--ink-600) !important;
  border-bottom: 1px solid var(--border-soft) !important;
}

:root[data-bs-theme="dark"] .popover{
  --bs-popover-bg: var(--panel);
  --bs-popover-border-color: var(--border);
  --bs-popover-header-bg: rgba(255,255,255,.03);
  --bs-popover-header-color: var(--ink-700);
  --bs-popover-body-color: var(--ink);
  box-shadow: var(--elev-2);
}
:root[data-bs-theme="dark"] .tooltip{
  --bs-tooltip-bg: rgba(20,22,28,.98);
  --bs-tooltip-color: var(--ink-700);
}

/* =========================================================
   List groups / sidebar / footer (color-only)
   ========================================================= */
:root[data-bs-theme="dark"] .list-group-item{
  background: rgba(255,255,255,.02) !important;
  border-color: var(--border-soft) !important;
  color: var(--ink) !important;
}
:root[data-bs-theme="dark"] .list-group-item-action:hover,
:root[data-bs-theme="dark"] .list-group-item-action:focus{
  background: rgba(255,255,255,.045) !important;
  color: var(--ink-700) !important;
}

:root[data-bs-theme="dark"] .fixed-aside{
  background: var(--bg-2) !important;
  border-right: 1px solid var(--border) !important;
  box-shadow: none !important;
}
:root[data-bs-theme="dark"] .fixed-aside .nav-link{
  color: var(--ink-400) !important;
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
}
:root[data-bs-theme="dark"] .fixed-aside .nav-link:hover{
  background: rgba(255,255,255,.055) !important;
  color: var(--ink-700) !important;
}
:root[data-bs-theme="dark"] .fixed-aside .nav-link.active{
  background: rgba(255,255,255,.075) !important;
  color: var(--ink-700) !important;
  box-shadow: inset 0 0 0 1px rgba(251,201,11,.18) !important;
}

:root[data-bs-theme="dark"] .site-footer{
  background: rgba(20,22,28,.62) !important;
  border-top: 1px solid var(--border) !important;
  box-shadow: 0 -10px 26px rgba(0,0,0,.28) inset;
  color: var(--ink);
}
:root[data-bs-theme="dark"] .footer-title{ color: var(--ink-700) !important; }
:root[data-bs-theme="dark"] .footer-link{ color: var(--ink-500) !important; }
:root[data-bs-theme="dark"] .footer-link:hover{ color: var(--brand) !important; }

/* =========================================================
   bg-light / bg-white overrides (requested)
   ========================================================= */
:root[data-bs-theme="dark"] .bg-light,
:root[data-bs-theme="dark"] .text-bg-light,
:root[data-bs-theme="dark"] .bg-white,
:root[data-bs-theme="dark"] .text-bg-white{
  background: rgba(20,22,28,.92) !important;
  color: var(--ink) !important;
  border-color: var(--border) !important;
}
:root[data-bs-theme="dark"] .bg-light .text-dark,
:root[data-bs-theme="dark"] .text-bg-light .text-dark,
:root[data-bs-theme="dark"] .bg-white .text-dark,
:root[data-bs-theme="dark"] .text-bg-white .text-dark{
  color: var(--ink) !important;
}

/* =========================================================
   Small polish (color-only)
   ========================================================= */
:root[data-bs-theme="dark"] .progress{
  background: rgba(255,255,255,.05) !important;
  border: 1px solid var(--border) !important;
}
:root[data-bs-theme="dark"] .progress-bar{
  background: linear-gradient(90deg, rgba(251,201,11,.86) 0%, rgba(255,224,113,.86) 100%) !important;
  color: #101216 !important;
}

:root[data-bs-theme="dark"] .news-card .category{
  background: rgba(251,201,11,.86) !important;
  border-color: rgba(251,201,11,.60) !important;
  color: #101216 !important;
}

/* Scrollbars: ONLY color (no sizing) */
:root[data-bs-theme="dark"] *{
  scrollbar-color: rgba(255,255,255,.20) transparent;
}
/* =========================================================
   DARK THEME — Public tables & filters (color-only)
   Без изменения размеров и layout
   ========================================================= */

:root[data-bs-theme="dark"] {

  /* ===== Общие токены для public-таблиц ===== */
  --pub-surface: #1c1c1e;          /* основной фон (Apple dark) */
  --pub-surface-2: #232326;        /* вторичный фон */
  --pub-border: #2f2f33;           /* границы */
  --pub-border-soft: #3a3a3f;
  --pub-text: #e5e5e7;             /* основной текст */
  --pub-text-muted: #a1a1a6;       /* вторичный текст */
  --pub-head-bg: #2a2a2e;          /* thead / header */
  --pub-hover: #2c2c30;            /* hover строк */
}

/* =========================================================
   PUB FILTER HEAD
   ========================================================= */

:root[data-bs-theme="dark"] .pub-filter__head {
  background: var(--pub-surface);
  color: var(--pub-text);
  border: 1px solid var(--pub-border);
}

:root[data-bs-theme="dark"] .pub-filter__head .text-muted,
:root[data-bs-theme="dark"] .pub-filter__head small {
  color: var(--pub-text-muted) !important;
}

/* =========================================================
   TABLE RESPONSIVE (контейнер)
   ========================================================= */

:root[data-bs-theme="dark"] .table-responsive {
  background: transparent;
}

/* =========================================================
   TABLE BASE
   ========================================================= */

:root[data-bs-theme="dark"] .table {
  color: var(--pub-text);
  background-color: var(--pub-surface);
  border-color: var(--pub-border);
}

/* Убираем светлый bootstrap-bg */
:root[data-bs-theme="dark"] .table-light {
  --bs-table-bg: var(--pub-surface);
  --bs-table-color: var(--pub-text);
  --bs-table-border-color: var(--pub-border);
}

/* =========================================================
   TABLE HEAD
   ========================================================= */

:root[data-bs-theme="dark"] .table thead th {
  background: var(--pub-head-bg);
  color: var(--pub-text);
  border-bottom: 1px solid var(--pub-border-soft);
  border-top: none;
}

/* =========================================================
   TABLE BODY
   ========================================================= */

:root[data-bs-theme="dark"] .table tbody td,
:root[data-bs-theme="dark"] .table tbody th {
  color: var(--pub-text);
  border-top: 1px solid var(--pub-border);
}

/* Hover строки — мягкий, без скачков */
:root[data-bs-theme="dark"] .table tbody tr:hover {
  background-color: var(--pub-hover);
}

/* =========================================================
   LINKS / MUTED INSIDE TABLE
   ========================================================= */

:root[data-bs-theme="dark"] .table a {
  color: #8ab4f8;
}

:root[data-bs-theme="dark"] .table a:hover {
  color: #a8c7ff;
}

:root[data-bs-theme="dark"] .table .text-muted {
  color: var(--pub-text-muted) !important;
}

/* =========================================================
   EMPTY / NO DATA
   ========================================================= */

:root[data-bs-theme="dark"] .table td.text-center,
:root[data-bs-theme="dark"] .table td.text-center.text-muted {
  color: var(--pub-text-muted) !important;
}
/* =========================================================
   DARK THEME — Bootstrap table ecosystem (color-only)
   Filters (.row.g-2.align-items-end), controls, pagination, dropdowns
   ========================================================= */

:root[data-bs-theme="dark"]{
  --pub-surface: #1c1c1e;
  --pub-surface-2:#232326;
  --pub-surface-3:#2a2a2e;
  --pub-border:#2f2f33;
  --pub-border-soft:#3a3a3f;
  --pub-text:#e5e5e7;
  --pub-text-muted:#a1a1a6;
  --pub-hover:#2c2c30;
  --pub-focus: 0 0 0 .2rem rgba(255, 214, 98, .18);

  --pub-link:#8ab4f8;
  --pub-link-hover:#a8c7ff;

  /* Bootstrap-compatible */
  --bs-border-color: var(--pub-border);
  --bs-body-color: var(--pub-text);
  --bs-body-bg: #141416;
}

/* =========================
   FILTER ROW (.row.g-2.align-items-end)
   ========================= */

/* Важно: НЕ трогаем display/flex/gap/align — только цветовую “поверхность” */
:root[data-bs-theme="dark"] .row.g-2.align-items-end{
  color: var(--pub-text);
}

/* Часто в таких строках лежат .col-md-* с формами — окрашиваем контролы внутри */
:root[data-bs-theme="dark"] .row.g-2.align-items-end .form-label,
:root[data-bs-theme="dark"] .row.g-2.align-items-end label{
  color: var(--pub-text-muted);
}

:root[data-bs-theme="dark"] .row.g-2.align-items-end .form-control,
:root[data-bs-theme="dark"] .row.g-2.align-items-end .form-select,
:root[data-bs-theme="dark"] .row.g-2.align-items-end .input-group-text{
  background: var(--pub-surface);
  color: var(--pub-text);
  border-color: var(--pub-border);
}

:root[data-bs-theme="dark"] .row.g-2.align-items-end .form-control::placeholder{
  color: var(--pub-text-muted);
}

:root[data-bs-theme="dark"] .row.g-2.align-items-end .form-control:focus,
:root[data-bs-theme="dark"] .row.g-2.align-items-end .form-select:focus{
  border-color: rgba(255,214,98,.55);
  box-shadow: var(--pub-focus);
}

:root[data-bs-theme="dark"] .row.g-2.align-items-end .form-check-label{
  color: var(--pub-text);
}
:root[data-bs-theme="dark"] .row.g-2.align-items-end .form-check-input{
  border-color: var(--pub-border);
  background-color: var(--pub-surface);
}
:root[data-bs-theme="dark"] .row.g-2.align-items-end .form-check-input:checked{
  background-color: #ffd662;
  border-color: #ffd662;
}

/* Кнопки, которые обычно рядом с фильтрами */
:root[data-bs-theme="dark"] .row.g-2.align-items-end .btn{
  border-color: var(--pub-border);
}
:root[data-bs-theme="dark"] .row.g-2.align-items-end .btn-light,
:root[data-bs-theme="dark"] .row.g-2.align-items-end .btn-outline-secondary{
  background: var(--pub-surface-2);
  color: var(--pub-text);
  border-color: var(--pub-border);
}
:root[data-bs-theme="dark"] .row.g-2.align-items-end .btn-light:hover,
:root[data-bs-theme="dark"] .row.g-2.align-items-end .btn-outline-secondary:hover{
  background: var(--pub-surface-3);
}

/* =========================
   TABLE WRAPPERS / TOOLBARS
   ========================= */

:root[data-bs-theme="dark"] .table-responsive{
  background: transparent;
}

/* Типичные “панели” над таблицей (если есть) */
:root[data-bs-theme="dark"] .table-toolbar,
:root[data-bs-theme="dark"] .pub-filter,
:root[data-bs-theme="dark"] .pub-filter__head{
  background: var(--pub-surface);
  color: var(--pub-text);
  border-color: var(--pub-border);
}

/* =========================
   TABLE BASE + VARIANTS
   ========================= */

:root[data-bs-theme="dark"] .table{
  color: var(--pub-text);
  background-color: var(--pub-surface);
  border-color: var(--pub-border);
}

:root[data-bs-theme="dark"] .table-light{
  --bs-table-bg: var(--pub-surface);
  --bs-table-color: var(--pub-text);
  --bs-table-border-color: var(--pub-border);
}

/* Заголовок таблицы */
:root[data-bs-theme="dark"] .table thead th{
  background: var(--pub-surface-3);
  color: var(--pub-text);
  border-bottom-color: var(--pub-border-soft);
}

/* Ячейки */
:root[data-bs-theme="dark"] .table tbody td,
:root[data-bs-theme="dark"] .table tbody th{
  border-top-color: var(--pub-border);
  color: var(--pub-text);
}

/* Hover/striped */
:root[data-bs-theme="dark"] .table-hover tbody tr:hover{
  background-color: var(--pub-hover);
}
:root[data-bs-theme="dark"] .table-striped > tbody > tr:nth-of-type(odd) > *{
  background-color: rgba(255,255,255,.03);
  color: var(--pub-text);
}

/* Bordered */
:root[data-bs-theme="dark"] .table-bordered{
  border-color: var(--pub-border);
}
:root[data-bs-theme="dark"] .table-bordered > :not(caption) > *{
  border-color: var(--pub-border);
}

/* Разделители групп */
:root[data-bs-theme="dark"] .table-group-divider{
  border-top-color: var(--pub-border-soft);
}

/* Caption */
:root[data-bs-theme="dark"] .table caption{
  color: var(--pub-text-muted);
}

/* “Мелкие” таблицы */
:root[data-bs-theme="dark"] .table-sm > :not(caption) > * > *{
  border-color: var(--pub-border);
}

/* =========================
   LINKS / BADGES inside tables
   ========================= */

:root[data-bs-theme="dark"] .table a{
  color: var(--pub-link);
}
:root[data-bs-theme="dark"] .table a:hover{
  color: var(--pub-link-hover);
}
:root[data-bs-theme="dark"] .table .text-muted{
  color: var(--pub-text-muted) !important;
}

/* Пилюли/бейджи (часто в столбцах статуса) */
:root[data-bs-theme="dark"] .table .badge,
:root[data-bs-theme="dark"] .badge.rounded-pill{
  border: 1px solid var(--pub-border);
}
:root[data-bs-theme="dark"] .badge.text-bg-light,
:root[data-bs-theme="dark"] .badge.bg-light{
  background: var(--pub-surface-2) !important;
  color: var(--pub-text) !important;
  border-color: var(--pub-border) !important;
}
:root[data-bs-theme="dark"] .badge.text-bg-dark,
:root[data-bs-theme="dark"] .badge.bg-dark{
  background: #0f0f10 !important;
  color: #fff !important;
  border-color: var(--pub-border) !important;
}

/* =========================
   DROPDOWNS / MENUS (табличные действия)
   ========================= */

:root[data-bs-theme="dark"] .dropdown-menu{
  background: var(--pub-surface-2);
  border: 1px solid var(--pub-border);
  color: var(--pub-text);
}
:root[data-bs-theme="dark"] .dropdown-item{
  color: var(--pub-text);
}
:root[data-bs-theme="dark"] .dropdown-item:hover,
:root[data-bs-theme="dark"] .dropdown-item:focus{
  background: var(--pub-hover);
  color: var(--pub-text);
}
:root[data-bs-theme="dark"] .dropdown-divider{
  border-top-color: var(--pub-border);
}

/* =========================
   PAGINATION (под таблицами)
   ========================= */

:root[data-bs-theme="dark"] .pagination .page-link{
  background: var(--pub-surface);
  color: var(--pub-text);
  border-color: var(--pub-border);
}
:root[data-bs-theme="dark"] .pagination .page-link:hover{
  background: var(--pub-surface-3);
}
:root[data-bs-theme="dark"] .pagination .page-item.active .page-link{
  background: #2a2a2a;
  border-color: #2a2a2a;
  color: #fff;
}
:root[data-bs-theme="dark"] .pagination .page-item.disabled .page-link{
  background: var(--pub-surface);
  color: rgba(229,229,231,.45);
  border-color: var(--pub-border);
}

/* =========================
   INPUT GROUPS (поиск/фильтры)
   ========================= */

:root[data-bs-theme="dark"] .input-group-text{
  background: var(--pub-surface-2);
  color: var(--pub-text-muted);
  border-color: var(--pub-border);
}
:root[data-bs-theme="dark"] .form-control,
:root[data-bs-theme="dark"] .form-select{
  background: var(--pub-surface);
  color: var(--pub-text);
  border-color: var(--pub-border);
}
:root[data-bs-theme="dark"] .form-control:focus,
:root[data-bs-theme="dark"] .form-select:focus{
  border-color: rgba(255,214,98,.55);
  box-shadow: var(--pub-focus);
}
/* =========================================================
   DARK — tables fine-grain: tbody / tr / td + table-light + combos
   (color-only, no layout changes)
   ========================================================= */

:root[data-bs-theme="dark"]{
  --pub-surface: #1c1c1e;
  --pub-surface-2:#232326;
  --pub-surface-3:#2a2a2e;
  --pub-border:#2f2f33;
  --pub-border-soft:#3a3a3f;
  --pub-text:#e5e5e7;
  --pub-text-muted:#a1a1a6;
  --pub-hover:#2c2c30;
}

/* 1) БАЗА таблицы (включая .mb-0 и .align-middle — они не трогаются по layout) */
:root[data-bs-theme="dark"] table.table,
:root[data-bs-theme="dark"] .table{
  background-color: var(--pub-surface);
  color: var(--pub-text);
  border-color: var(--pub-border);
}

/* 2) table-light — принудительно темная в dark режиме */
:root[data-bs-theme="dark"] .table-light,
:root[data-bs-theme="dark"] table.table-light{
  --bs-table-bg: var(--pub-surface) !important;
  --bs-table-color: var(--pub-text) !important;
  --bs-table-border-color: var(--pub-border) !important;
  background-color: var(--pub-surface) !important;
  color: var(--pub-text) !important;
}

/* 3) tbody как “поверхность” (часто Bootstrap оставляет прозрачным) */
:root[data-bs-theme="dark"] .table tbody{
  background-color: var(--pub-surface);
}

/* 4) tr / td / th — границы и текст */
:root[data-bs-theme="dark"] .table tbody tr{
  color: var(--pub-text);
}

:root[data-bs-theme="dark"] .table tbody td,
:root[data-bs-theme="dark"] .table tbody th{
  background-color: transparent;              /* фон задаёт tbody/строка */
  color: var(--pub-text);
  border-top: 1px solid var(--pub-border);
}

/* 5) thead — шапка контрастнее */
:root[data-bs-theme="dark"] .table thead th{
  background: var(--pub-surface-3);
  color: var(--pub-text);
  border-bottom: 1px solid var(--pub-border-soft);
}

/* 6) table-hover — мягкий hover только по цвету */
:root[data-bs-theme="dark"] .table.table-hover tbody tr:hover,
:root[data-bs-theme="dark"] .table-hover tbody tr:hover{
  background-color: var(--pub-hover);
}

/* 7) table-sm — не меняем размеры, но фиксируем цвета/границы */
:root[data-bs-theme="dark"] .table.table-sm > :not(caption) > * > *{
  border-color: var(--pub-border);
}

/* 8) Комбо-класс из твоего примера:
   table table-sm table-hover mb-0 align-middle */
:root[data-bs-theme="dark"] .table.table-sm.table-hover.mb-0.align-middle{
  background-color: var(--pub-surface);
  color: var(--pub-text);
  border-color: var(--pub-border);
}
:root[data-bs-theme="dark"] .table.table-sm.table-hover.mb-0.align-middle tbody{
  background-color: var(--pub-surface);
}
:root[data-bs-theme="dark"] .table.table-sm.table-hover.mb-0.align-middle tbody td,
:root[data-bs-theme="dark"] .table.table-sm.table-hover.mb-0.align-middle tbody th{
  border-top-color: var(--pub-border);
  color: var(--pub-text);
}

/* 9) muted внутри таблиц */
:root[data-bs-theme="dark"] .table .text-muted,
:root[data-bs-theme="dark"] .table small{
  color: var(--pub-text-muted) !important;
}

/* 10) На всякий случай: Bootstrap иногда красит ячейки через --bs-table-accent-bg */
:root[data-bs-theme="dark"] .table{
  --bs-table-bg: var(--pub-surface);
  --bs-table-color: var(--pub-text);
  --bs-table-border-color: var(--pub-border);
  --bs-table-hover-bg: var(--pub-hover);
}
/* =========================================================
   DARK — unify surfaces with page background
   Footer / containers / cards / sidebar nav
   ========================================================= */

:root[data-bs-theme="dark"]{
  --pub-bg: #141416;          /* базовый фон страницы */
  --pub-surface: #1c1c1e;    /* стандартная поверхность */
  --pub-text: #e5e5e7;
  --pub-text-muted: #a1a1a6;
}

/* =========================================================
   FOOTER SURFACE
   ========================================================= */

:root[data-bs-theme="dark"] .ac-footer-surface.p-3.p-lg-3{
  background-color: var(--pub-bg) !important;
  color: var(--pub-text);
  border-color: transparent;
}

/* Тексты внутри футера */
:root[data-bs-theme="dark"] .ac-footer-surface p,
:root[data-bs-theme="dark"] .ac-footer-surface span,
:root[data-bs-theme="dark"] .ac-footer-surface .text-muted{
  color: var(--pub-text-muted);
}

/* =========================================================
   CONTAINERS
   ========================================================= */

/* Обычный container */
:root[data-bs-theme="dark"] .container{
  background-color: transparent;
  color: var(--pub-text);
}

/* container-fluid с flex-хедером */
:root[data-bs-theme="dark"]
.container-fluid.d-flex.align-items-center.justify-content-between{
  background-color: var(--pub-bg);
  color: var(--pub-text);
  border-color: transparent;
}

/* =========================================================
   PUBLIC CARD LINK
   ========================================================= */

:root[data-bs-theme="dark"] .pub-card__link{
  background-color: var(--pub-bg);
  color: var(--pub-text);
}

/* hover — только цвет, без анимаций */
:root[data-bs-theme="dark"] .pub-card__link:hover{
  background-color: var(--pub-bg);
  color: var(--pub-text);
}

/* =========================================================
   app-dark.css — Apple-like light dark theme
   COLOR-ONLY. No layout / spacing / sizing changes.
   ========================================================= */

:root[data-bs-theme="dark"]{

  /* ========================
     Apple-like palette
     ======================== */

  --bg: #141416;
  --bg-2: #18181a;

  --surface: #1f1f22;
  --surface-2: #262629;
  --surface-3: #2c2c30;

  --border: #323236;
  --border-soft: #3a3a3f;

  --text: #e6e6e8;
  --text-strong: #f5f5f7;
  --text-muted: #a1a1a6;

  --accent: #ffd86a;
  --accent-soft: rgba(255, 216, 106, .22);

  --success: #3ddc97;
  --danger: #ff6b6b;
  --info: #8ab4f8;

  --focus-ring: 0 0 0 .2rem rgba(255,216,106,.22);

  /* Bootstrap sync */
  --bs-body-bg: var(--bg);
  --bs-body-color: var(--text);
  --bs-border-color: var(--border);
  --bs-secondary-color: var(--text-muted);
}

/* =========================================================
   BASE
   ========================================================= */

:root[data-bs-theme="dark"] body{
  background: linear-gradient(180deg,#141416,#121214);
  color: var(--text);
}

:root[data-bs-theme="dark"] h1,
:root[data-bs-theme="dark"] h2,
:root[data-bs-theme="dark"] h3,
:root[data-bs-theme="dark"] h4,
:root[data-bs-theme="dark"] h5,
:root[data-bs-theme="dark"] h6{
  color: var(--text-strong);
}

:root[data-bs-theme="dark"] .text-muted{
  color: var(--text-muted) !important;
}

/* =========================================================
   SURFACES
   ========================================================= */

:root[data-bs-theme="dark"] .card,
:root[data-bs-theme="dark"] .modal-content,
:root[data-bs-theme="dark"] .dropdown-menu,
:root[data-bs-theme="dark"] .toast,
:root[data-bs-theme="dark"] .offcanvas,
:root[data-bs-theme="dark"] .accordion-item{
  background: var(--surface);
  border-color: var(--border);
  color: var(--text);
}

/* =========================================================
   TABLES (full Bootstrap ecosystem)
   ========================================================= */

:root[data-bs-theme="dark"] .table{
  background-color: var(--surface);
  color: var(--text);
  --bs-table-bg: var(--surface);
  --bs-table-color: var(--text);
  --bs-table-border-color: var(--border);
  --bs-table-hover-bg: var(--surface-2);
}

:root[data-bs-theme="dark"] .table thead th{
  background: var(--surface-3);
  color: var(--text);
  border-bottom-color: var(--border-soft);
}

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

:root[data-bs-theme="dark"] .table-hover tbody tr:hover{
  background-color: var(--surface-2);
}

:root[data-bs-theme="dark"] .table-light{
  --bs-table-bg: var(--surface);
  --bs-table-color: var(--text);
  background-color: var(--surface);
}

/* =========================================================
   FORMS
   ========================================================= */

:root[data-bs-theme="dark"] .form-control,
:root[data-bs-theme="dark"] .form-select,
:root[data-bs-theme="dark"] .input-group-text{
  background: var(--surface);
  color: var(--text);
  border-color: var(--border);
}

:root[data-bs-theme="dark"] .form-control::placeholder{
  color: var(--text-muted);
}

:root[data-bs-theme="dark"] .form-control:focus,
:root[data-bs-theme="dark"] .form-select:focus{
  border-color: rgba(255,216,106,.55);
  box-shadow: var(--focus-ring);
}

/* =========================================================
   BUTTONS / BADGES
   ========================================================= */

:root[data-bs-theme="dark"] .btn-primary{
  background: linear-gradient(180deg,#ffe08a,#ffd86a);
  border-color: #ffd86a;
  color: #111;
}

:root[data-bs-theme="dark"] .badge.rounded-pill.text-bg-success{
  background: rgba(61,220,151,.18);
  color: #3ddc97;
  border: 1px solid rgba(61,220,151,.35);
}

/* =========================================================
   NAV / SIDEBAR / FOOTER
   ========================================================= */

:root[data-bs-theme="dark"] .fixed-aside,
:root[data-bs-theme="dark"] .site-footer{
  background: var(--bg-2);
  border-color: var(--border);
  color: var(--text);
}

:root[data-bs-theme="dark"] .fixed-aside .nav-link{
  color: var(--text-muted);
}

:root[data-bs-theme="dark"] .fixed-aside .nav-link.active{
  color: var(--text);
  background: var(--surface-2);
}

/* =========================================================
   BG-LIGHT / BG-WHITE OVERRIDES
   ========================================================= */

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