/* ========================================================================
   ADMIN PRO THEME OVERRIDES
   Palette: White / Black / Gray (main color: white)
   ======================================================================== */

:root {
    --pro-main: #ffffff;
    --pro-white: #ffffff;
    --pro-black: #111111;
    --pro-ink: #17171c;
    --pro-gray-50: #f9f9fb;
    --pro-gray-75: #f4f4f6;
    --pro-gray-100: #efeff2;
    --pro-gray-150: #e6e6ea;
    --pro-gray-200: #d9d9df;
    --pro-gray-300: #c3c3cb;
    --pro-gray-500: #74747f;
    --pro-gray-700: #3f3f49;
    --pro-gray-900: #22222b;
    --pro-ring: rgba(17, 17, 17, 0.12);
    --pro-shadow-xs: 0 1px 2px rgba(18, 18, 24, 0.05);
    --pro-shadow-sm: 0 3px 10px rgba(18, 18, 24, 0.07);
    --pro-shadow-md: 0 12px 28px rgba(18, 18, 24, 0.1);
    --pro-shadow-lg: 0 24px 44px rgba(18, 18, 24, 0.13);

    /* Remap frequent page-level custom variables to monochrome */
    --primary: #23232c !important;
    --primary-light: #3f3f49 !important;
    --success: #2f2f36 !important;
    --success-light: #4a4a55 !important;
    --warning: #5e5e67 !important;
    --info: #2b2b33 !important;
    --danger: #3a3a42 !important;
    --dark: #17171d !important;
    --gray: #74747f !important;
    --light: #f4f4f6 !important;
    --white: #ffffff !important;
    --teal: #23232c !important;
    --teal-light: #3d3d46 !important;

    --art-primary: #23232c !important;
    --art-primary-light: #3d3d46 !important;
    --ab-primary: #23232c !important;
    --ab-primary-dark: #17171d !important;
    --va-primary: #23232c !important;
    --va-primary-dark: #17171d !important;
    --v-primary: #23232c !important;
    --v-primary-dark: #17171d !important;
    --cc-primary: #23232c !important;
    --cb-primary: #23232c !important;
    --add-primary: #23232c !important;
    --add-primary-dark: #17171d !important;
}

html,
body {
    background: var(--pro-main) !important;
    color: var(--pro-gray-900) !important;
}

.admin-layout,
.admin-content,
.container,
.container-fluid,
main {
    background: transparent !important;
}

/* Force monochrome on inline themed admin pages */
.articles-container,
.fournisseurs-container,
.ab-page,
.va-page,
.v-page,
.cb-page,
.cc-container {
    background: linear-gradient(180deg, #ffffff 0%, #f7f7f9 100%) !important;
}

/* ===== En-têtes uniformes dark (style articles.html) ===== */
.page-header,
.articles-header,
.ab-header,
.achats-header,
.sa-header,
.entrepots-header,
.caisse-header,
.categories-header,
.ch-header,
.cc-header,
.gr-header,
.cb-header,
.messages-header,
.pl-header,
.dash-header,
.v-header,
.va-header {
    background: #111827 !important;
    border: none !important;
    border-radius: 0 !important;
    box-shadow: 0 4px 16px rgba(0,0,0,0.18) !important;
    padding: 0.3rem 1rem !important;
    margin-bottom: 0.4rem !important;
}

.page-header *,
.articles-header *,
.ab-header *,
.achats-header *,
.sa-header *,
.entrepots-header *,
.caisse-header *,
.categories-header *,
.ch-header *,
.cc-header *,
.gr-header *,
.cb-header *,
.messages-header *,
.pl-header *,
.dash-header *,
.v-header *,
.va-header * {
    color: #ffffff !important;
}

.table-header,
.articles-card-header,
.ab-table-head,
.va-table-head,
.cb-table-head,
.cc-table-head {
    background: linear-gradient(135deg, #f7f7f9 0%, #eeeeF2 100%) !important;
    border-bottom: 1px solid var(--pro-gray-200) !important;
}

/* .v-table-head — fond sombre géré dans ventes.html */
.v-table-head {
    background: linear-gradient(135deg, #0f172a 0%, #1e293b 100%) !important;
    color: rgba(255,255,255,0.62) !important;
    border-bottom: 2px solid rgba(255,255,255,0.07) !important;
}

.table-count,
.ab-badge,
.va-badge,
.v-badge,
.cb-badge,
.cc-badge {
    background: linear-gradient(135deg, #2d2d36, #17171d) !important;
    color: #ffffff !important;
    border-color: #17171d !important;
}

.btn-action,
.btn-action.add,
.btn-achats,
.btn-categories-articles,
.btn-export,
.btn-export-pdf,
.btn-export-excel,
.btn-filter,
.btn-filter-sm,
.btn-sort {
    background: linear-gradient(135deg, #4a4a55, #25252e) !important;
    color: #ffffff !important;
    border: 1px solid rgba(23, 23, 29, 0.65) !important;
    box-shadow: 0 8px 20px rgba(17, 17, 17, 0.2) !important;
}

.btn-action *,
.btn-action.add *,
.btn-achats *,
.btn-categories-articles *,
.btn-export *,
.btn-export-pdf *,
.btn-export-excel *,
.btn-filter *,
.btn-filter-sm *,
.btn-sort * {
    color: #ffffff !important;
}

.btn-action:hover,
.btn-action.add:hover,
.btn-achats:hover,
.btn-categories-articles:hover,
.btn-export:hover,
.btn-export-pdf:hover,
.btn-export-excel:hover,
.btn-filter:hover,
.btn-filter-sm:hover,
.btn-sort:hover {
    background: linear-gradient(135deg, #30303a, #15151b) !important;
    color: #ffffff !important;
    border-color: rgba(17, 17, 17, 0.85) !important;
    box-shadow: 0 12px 26px rgba(17, 17, 17, 0.32) !important;
}

.stat-icon,
.stat-icon.teal,
.stat-icon.info,
.stat-icon.warning,
.stat-icon.success,
.stat-icon.primary,
.stat-icon.danger {
    background: linear-gradient(135deg, #f1f1f4, #e7e7eb) !important;
    color: #2f2f36 !important;
    border: 1px solid var(--pro-gray-200) !important;
}

.filter-input,
.search-input,
.input-filter,
.table-search {
    border-color: var(--pro-gray-300) !important;
    color: var(--pro-gray-900) !important;
    background: #ffffff !important;
}

.filter-input:focus,
.search-input:focus,
.input-filter:focus,
.table-search:focus {
    border-color: var(--pro-gray-700) !important;
    box-shadow: 0 0 0 4px var(--pro-ring) !important;
}

/* Core shell */
.mobile-header,
.sidebar,
.sidebar-header,
.sidebar-footer {
    background: linear-gradient(180deg, #ffffff 0%, #f8f8fa 100%) !important;
    color: var(--pro-gray-900) !important;
    border-color: var(--pro-gray-200) !important;
    box-shadow: var(--pro-shadow-sm) !important;
}

.sidebar {
    border-right: 1px solid var(--pro-gray-200) !important;
}

.mobile-header {
    border-bottom: 1px solid var(--pro-gray-200) !important;
}

.sidebar-header {
    border-left: 4px solid var(--pro-ink) !important;
    border-bottom: 1px solid var(--pro-gray-150) !important;
}

.sidebar-footer {
    border-top: 1px solid var(--pro-gray-150) !important;
}

.mobile-header::before,
.mobile-header::after,
.sidebar-header::before,
.sidebar-header::after,
.sidebar-lang-switcher::before {
    display: none !important;
}

.mobile-header-title,
.sidebar .nav-link,
.sidebar-header,
.sidebar-footer,
.brand-user-name,
.brand-user-role,
.sidebar-lang-label span,
.footer-action-btn,
.logout-btn {
    color: var(--pro-gray-900) !important;
}

.mobile-header-logo,
.brand-logo {
    background: #ffffff !important;
    border: 1px solid var(--pro-gray-200) !important;
    box-shadow: var(--pro-shadow-xs) !important;
}

.brand-admin-badge {
    background: linear-gradient(135deg, #ffffff, var(--pro-gray-75)) !important;
    border: 1px solid var(--pro-gray-200) !important;
    color: var(--pro-gray-900) !important;
    letter-spacing: 2px !important;
}

.brand-admin-badge i {
    color: var(--pro-gray-700) !important;
}

.brand-user-row {
    background: #ffffff !important;
    border: 1px solid var(--pro-gray-200) !important;
    box-shadow: var(--pro-shadow-xs) !important;
}

.brand-user-avatar {
    background: linear-gradient(135deg, var(--pro-gray-150), var(--pro-gray-75)) !important;
    border-color: var(--pro-gray-300) !important;
}

.brand-user-avatar i {
    color: var(--pro-gray-700) !important;
}

.brand-user-status {
    background: var(--pro-black) !important;
    box-shadow: 0 0 0 5px rgba(17, 17, 17, 0.09) !important;
}

/* Navigation */
.nav-dashboard,
.sidebar-nav,
.nav-section,
.nav-section-label,
.nav-section-toggle,
.nav-item,
.nav-link {
    background: transparent !important;
    color: var(--pro-gray-700) !important;
    border-color: var(--pro-gray-200) !important;
}

.nav-dashboard .nav-link,
.nav-link {
    border: 1px solid transparent !important;
    border-radius: 14px !important;
}

.nav-dashboard .nav-link:hover,
.nav-link:hover,
.nav-section-toggle:hover {
    background: #ffffff !important;
    color: var(--pro-black) !important;
    border-color: var(--pro-gray-200) !important;
    box-shadow: var(--pro-shadow-xs) !important;
}

.nav-dashboard .nav-link.active,
.nav-link.active,
.nav-section.open .nav-section-toggle {
    background: linear-gradient(135deg, #ffffff 0%, var(--pro-gray-100) 100%) !important;
    color: var(--pro-black) !important;
    border: 1px solid var(--pro-gray-300) !important;
    box-shadow: var(--pro-shadow-sm) !important;
}

.nav-link::before {
    background: linear-gradient(180deg, var(--pro-black), var(--pro-gray-700)) !important;
}

.nav-icon,
.nav-dashboard .nav-link .nav-icon,
.section-icon {
    background: linear-gradient(145deg, var(--pro-gray-75), #ffffff) !important;
    border: 1px solid var(--pro-gray-200) !important;
    box-shadow: var(--pro-shadow-xs) !important;
}

.nav-icon i,
.nav-dashboard .nav-link .nav-icon i,
.section-icon i {
    color: var(--pro-gray-700) !important;
}

.nav-section.open .nav-section-toggle .section-icon {
    background: linear-gradient(135deg, var(--pro-gray-900), var(--pro-gray-700)) !important;
    box-shadow: none !important;
}

.nav-section.open .nav-section-toggle .section-icon i {
    color: #ffffff !important;
}

.nav-section.open .nav-section-items {
    border-left-color: var(--pro-gray-300) !important;
}

.section-dot,
.nav-badge,
.badge,
.sidebar-lang-indicator {
    background: linear-gradient(135deg, var(--pro-gray-900), var(--pro-gray-700)) !important;
    color: #ffffff !important;
    box-shadow: none !important;
}

/* Footer actions */
.sidebar-lang-switcher {
    background: #ffffff !important;
    border: 1px solid var(--pro-gray-200) !important;
    box-shadow: var(--pro-shadow-xs) !important;
}

.sidebar-lang-label i {
    color: var(--pro-gray-700) !important;
}

.footer-action-btn,
.logout-btn {
    background: #ffffff !important;
    border: 1px solid var(--pro-gray-200) !important;
    box-shadow: var(--pro-shadow-xs) !important;
}

.footer-action-btn:hover,
.logout-btn:hover {
    background: linear-gradient(135deg, var(--pro-gray-100), #ffffff) !important;
    color: var(--pro-black) !important;
    border-color: var(--pro-gray-300) !important;
    box-shadow: var(--pro-shadow-sm) !important;
    transform: translateY(-1px) !important;
}

/* Generic UI */
.card,
.modal-content,
.dropdown-menu,
.list-group-item,
.offcanvas,
.toast {
    background: #ffffff !important;
    border: 1px solid var(--pro-gray-200) !important;
    box-shadow: var(--pro-shadow-sm) !important;
    border-radius: 14px !important;
}

.card-header,
.modal-header {
    background: linear-gradient(180deg, #ffffff, var(--pro-gray-50)) !important;
    border-bottom: 1px solid var(--pro-gray-200) !important;
    color: var(--pro-gray-900) !important;
}

.card-footer,
.modal-footer {
    background: var(--pro-gray-50) !important;
    border-top: 1px solid var(--pro-gray-200) !important;
}

.table {
    --bs-table-bg: #ffffff;
    --bs-table-striped-bg: #f8f8fa;
    --bs-table-hover-bg: #f1f1f4;
    --bs-table-border-color: #dddddf;
}

.table thead th,
.table-dark,
.table-dark th,
.table-dark td,
.table-dark thead th {
    background: #1f1f25 !important;
    color: #ffffff !important;
    border-color: #2d2d36 !important;
}

.form-control,
.form-select,
.select2-container--bootstrap-5 .select2-selection {
    background: #ffffff !important;
    border: 1.5px solid var(--pro-gray-300) !important;
    color: var(--pro-gray-900) !important;
    box-shadow: none !important;
}

.form-control:focus,
.form-select:focus,
.select2-container--bootstrap-5.select2-container--focus .select2-selection {
    border-color: var(--pro-gray-700) !important;
    box-shadow: 0 0 0 4px var(--pro-ring) !important;
}

.form-label,
label,
small,
.text-muted {
    color: var(--pro-gray-500) !important;
}

.btn,
button {
    border-radius: 10px;
}

.btn-primary,
.btn-success,
.btn-info,
.btn-dark {
    background: linear-gradient(135deg, #2b2b36, #17171d) !important;
    border-color: #17171d !important;
    color: #ffffff !important;
    box-shadow: 0 8px 16px rgba(0, 0, 0, 0.2) !important;
}

.btn-primary:hover,
.btn-success:hover,
.btn-info:hover,
.btn-dark:hover {
    background: linear-gradient(135deg, #111111, #2b2b35) !important;
    border-color: #111111 !important;
}

/* Common add buttons in admin templates */
.btn-add,
.btn-add-article,
.btn-add-category,
.btn-add-achat,
.btn-add-entrepot,
.btn-add-gr,
.ab-btn-add,
.va-btn-add,
.v-btn-add,
.cb-btn-primary,
.sa-add-btn,
.add-ab-btn-submit,
.btn-qr-scan,
.v-fab,
a[class*="btn-add"],
button[class*="btn-add"] {
    background: linear-gradient(135deg, #474752, #24242d) !important;
    color: #ffffff !important;
    border: 1px solid rgba(23, 23, 29, 0.65) !important;
    box-shadow: 0 8px 20px rgba(17, 17, 17, 0.26) !important;
}

.btn-add:hover,
.btn-add-article:hover,
.btn-add-category:hover,
.btn-add-achat:hover,
.btn-add-entrepot:hover,
.btn-add-gr:hover,
.ab-btn-add:hover,
.va-btn-add:hover,
.v-btn-add:hover,
.cb-btn-primary:hover,
.sa-add-btn:hover,
.add-ab-btn-submit:hover,
.btn-qr-scan:hover,
.v-fab:hover,
a[class*="btn-add"]:hover,
button[class*="btn-add"]:hover {
    background: linear-gradient(135deg, #2f2f38, #15151c) !important;
    color: #ffffff !important;
    border-color: rgba(17, 17, 17, 0.85) !important;
    box-shadow: 0 12px 26px rgba(17, 17, 17, 0.33) !important;
}

.btn-add *,
.btn-add-article *,
.btn-add-category *,
.btn-add-achat *,
.btn-add-entrepot *,
.btn-add-gr *,
.ab-btn-add *,
.va-btn-add *,
.v-btn-add *,
.cb-btn-primary *,
.sa-add-btn *,
.add-ab-btn-submit *,
.btn-qr-scan *,
.v-fab *,
a[class*="btn-add"] *,
button[class*="btn-add"] * {
    color: #ffffff !important;
}

.btn-add i,
.btn-add-article i,
.btn-add-category i,
.btn-add-achat i,
.btn-add-entrepot i,
.btn-add-gr i,
.ab-btn-add i,
.va-btn-add i,
.v-btn-add i,
.sa-add-btn i,
.add-ab-btn-submit i,
.v-fab i,
a[class*="btn-add"] i,
button[class*="btn-add"] i {
    color: #ffffff !important;
}

.btn-outline-primary,
.btn-outline-success,
.btn-outline-info {
    color: var(--pro-gray-900) !important;
    border-color: var(--pro-gray-700) !important;
    background: #ffffff !important;
}

.btn-outline-primary:hover,
.btn-outline-success:hover,
.btn-outline-info:hover {
    color: #ffffff !important;
    background: var(--pro-gray-900) !important;
    border-color: var(--pro-gray-900) !important;
}

.btn-danger,
.badge.bg-danger,
.bg-danger,
.alert-danger {
    background: #2e2e34 !important;
    border-color: #17171d !important;
    color: #ffffff !important;
}

.alert {
    border: 1px solid var(--pro-gray-200) !important;
    background: #ffffff !important;
    color: var(--pro-gray-900) !important;
}

.alert-success,
.alert-info {
    border-left: 4px solid #2f2f36 !important;
    background: linear-gradient(135deg, #f6f6f8, #ffffff) !important;
    color: #2f2f36 !important;
}

a,
.link-primary,
.text-primary,
.text-success,
.text-info {
    color: var(--pro-gray-900) !important;
}

a:hover,
.link-primary:hover {
    color: var(--pro-black) !important;
}

/* Remove colored traces from previous themes */
[style*="#1e6b32"],
[style*="#2d8a42"],
[style*="#165424"],
[style*="#0d3818"],
[style*="#8b1a1a"],
[style*="#1d4ed8"],
[style*="#2563eb"],
[style*="#2B2D42"] {
    border-color: var(--pro-gray-300) !important;
}

.text-white,
.card-header.text-white,
h1.text-white,
h2.text-white,
h3.text-white,
h4.text-white,
h5.text-white,
h6.text-white {
    color: var(--pro-gray-900) !important;
}

/* Scrollbars */
*::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

*::-webkit-scrollbar-track {
    background: #ececef;
}

*::-webkit-scrollbar-thumb {
    background: #bdbdc6;
    border-radius: 8px;
}

*::-webkit-scrollbar-thumb:hover {
    background: #9d9da8;
}

/* ========================================================================
   MONOCHROME REWORK LAYER (WHITE FIRST)
   ======================================================================== */

:root {
    --mono-white: #ffffff;
    --mono-bg: #f7f8fa;
    --mono-card: #fcfcfd;
    --mono-border: #dee2e8;
    --mono-border-strong: #c9d0d9;
    --mono-text: #151922;
    --mono-muted: #646d79;
    --mono-dark-a: #2b313b;
    --mono-dark-b: #141820;
    --mono-shadow-sm: 0 8px 18px rgba(21, 25, 34, 0.07);
    --mono-shadow-md: 0 16px 34px rgba(21, 25, 34, 0.11);
}

html,
body {
    background:
        radial-gradient(900px 480px at 8% -10%, rgba(21, 25, 34, 0.05), transparent 62%),
        radial-gradient(760px 420px at 100% 0, rgba(90, 99, 112, 0.06), transparent 65%),
        linear-gradient(180deg, #ffffff 0%, #f8f9fb 100%) !important;
    color: var(--mono-text) !important;
}

.admin-layout,
.admin-content,
.container,
.container-fluid,
main {
    background: transparent !important;
}

.sidebar,
.sidebar-header,
.sidebar-footer,
.mobile-header {
    background: linear-gradient(180deg, #ffffff 0%, #f8f9fb 100%) !important;
    border-color: var(--mono-border) !important;
    box-shadow: var(--mono-shadow-sm) !important;
}

.sidebar {
    border-right: 1px solid var(--mono-border) !important;
}

.sidebar-header {
    border-left: 4px solid #171b22 !important;
}

.nav-link,
.nav-dashboard .nav-link,
.nav-section-toggle {
    border-radius: 14px !important;
}

.nav-link:hover,
.nav-dashboard .nav-link:hover,
.nav-section-toggle:hover {
    background: linear-gradient(180deg, #ffffff 0%, #f1f3f6 100%) !important;
    border-color: var(--mono-border-strong) !important;
}

.nav-link.active,
.nav-dashboard .nav-link.active,
.nav-section.open .nav-section-toggle {
    background: linear-gradient(135deg, #ffffff 0%, #eceff3 100%) !important;
    border-color: var(--mono-border-strong) !important;
    box-shadow: 0 10px 20px rgba(21, 25, 34, 0.1) !important;
}

.card,
.modal-content,
.dropdown-menu,
.list-group-item,
.offcanvas,
.toast,
.table-responsive,
.stat-card,
[class*="-card"],
[class*="-panel"] {
    background: linear-gradient(180deg, #ffffff 0%, #fcfcfd 100%) !important;
    border: 1px solid var(--mono-border) !important;
    box-shadow: var(--mono-shadow-sm) !important;
    border-radius: 16px !important;
}

.stat-card:hover,
.card:hover,
[class*="-card"]:hover {
    box-shadow: var(--mono-shadow-md) !important;
    transform: translateY(-2px);
}

.table thead th,
.table-dark,
.table-dark th,
.table-dark td,
.table-dark thead th {
    background: linear-gradient(180deg, #232932 0%, #11151b 100%) !important;
    color: #ffffff !important;
    border-color: #2e3541 !important;
}

.table tbody tr:nth-child(even) {
    background: #f8f9fc !important;
}

.table tbody tr:hover {
    background: #eff2f6 !important;
}

.form-control,
.form-select,
.select2-container--bootstrap-5 .select2-selection,
.filter-input,
.search-input,
.input-filter,
.table-search {
    background: #ffffff !important;
    border: 1.5px solid #c9d0d9 !important;
    border-radius: 12px !important;
    color: var(--mono-text) !important;
}

.form-control:focus,
.form-select:focus,
.select2-container--bootstrap-5.select2-container--focus .select2-selection,
.filter-input:focus,
.search-input:focus,
.input-filter:focus,
.table-search:focus {
    border-color: #2b313b !important;
    box-shadow: 0 0 0 4px rgba(43, 49, 59, 0.14) !important;
}

.btn,
button,
a[class*="btn-"] {
    border-radius: 12px !important;
    font-weight: 700 !important;
    letter-spacing: 0.01em;
}

.btn-primary,
.btn-success,
.btn-info,
.btn-dark,
.btn-action,
.btn-action.add,
.btn-achats,
.btn-categories-articles,
.btn-add,
.btn-add-article,
.btn-add-category,
.btn-add-achat,
.btn-add-entrepot,
.btn-add-gr,
.ab-btn-add,
.va-btn-add,
.v-btn-add,
.cb-btn-primary,
.sa-add-btn,
.add-ab-btn-submit,
.btn-qr-scan,
.v-fab,
a[class*="btn-add"],
button[class*="btn-add"] {
    background: linear-gradient(135deg, var(--mono-dark-a), var(--mono-dark-b)) !important;
    border: 1px solid rgba(20, 24, 32, 0.72) !important;
    color: #ffffff !important;
    box-shadow: 0 10px 24px rgba(21, 25, 34, 0.23) !important;
}

.btn-primary:hover,
.btn-success:hover,
.btn-info:hover,
.btn-dark:hover,
.btn-action:hover,
.btn-action.add:hover,
.btn-achats:hover,
.btn-categories-articles:hover,
.btn-add:hover,
.btn-add-article:hover,
.btn-add-category:hover,
.btn-add-achat:hover,
.btn-add-entrepot:hover,
.btn-add-gr:hover,
.ab-btn-add:hover,
.va-btn-add:hover,
.v-btn-add:hover,
.cb-btn-primary:hover,
.sa-add-btn:hover,
.add-ab-btn-submit:hover,
.btn-qr-scan:hover,
.v-fab:hover,
a[class*="btn-add"]:hover,
button[class*="btn-add"]:hover {
    background: linear-gradient(135deg, #20262f, #0d1015) !important;
    border-color: rgba(13, 16, 21, 0.9) !important;
    box-shadow: 0 14px 28px rgba(21, 25, 34, 0.32) !important;
    transform: translateY(-1px) !important;
}

.btn-outline-primary,
.btn-outline-success,
.btn-outline-info,
.btn-outline-secondary {
    background: #ffffff !important;
    color: var(--mono-text) !important;
    border-color: #b9c1cc !important;
}

.btn-outline-primary:hover,
.btn-outline-success:hover,
.btn-outline-info:hover,
.btn-outline-secondary:hover {
    background: #161b22 !important;
    color: #ffffff !important;
    border-color: #161b22 !important;
}

.badge,
.table-count,
.ab-badge,
.va-badge,
.v-badge,
.cb-badge,
.cc-badge,
.nav-badge {
    background: linear-gradient(135deg, #282f39, #121720) !important;
    color: #ffffff !important;
}

.text-muted,
small,
label,
.form-label,
.categories-title-section p,
.articles-subtitle,
.page-subtitle {
    color: var(--mono-muted) !important;
}

.login-page {
    background: linear-gradient(180deg, #ffffff 0%, #f8f9fb 60%, #eff2f6 100%) !important;
}

.login-page::before {
    background-image:
        radial-gradient(circle at 20% 30%, rgba(43, 49, 59, 0.08) 0%, transparent 50%),
        radial-gradient(circle at 80% 70%, rgba(107, 114, 128, 0.1) 0%, transparent 50%),
        radial-gradient(circle at 50% 50%, rgba(31, 36, 45, 0.06) 0%, transparent 70%) !important;
}

.login-card {
    background: rgba(255, 255, 255, 0.99) !important;
    box-shadow: 0 28px 64px rgba(21, 25, 34, 0.13), 0 0 0 1px rgba(140, 149, 161, 0.18) !important;
}

.login-card::before {
    background: linear-gradient(90deg, #20262f, #4a525f, #20262f) !important;
}

/* ===== MOBILE HEADER DARK OVERRIDE ===== */
@media (max-width: 991.98px) {
    .mobile-header {
        background: #111827 !important;
        border-bottom: 1px solid rgba(255,255,255,0.07) !important;
        box-shadow: 0 4px 24px rgba(0,0,0,0.32) !important;
        height: 60px !important;
    }
    .mobile-header-title {
        display: none !important;
    }
    .mobile-header-logo {
        background: #ffffff !important;
        border: 1px solid rgba(255,255,255,0.15) !important;
        box-shadow: none !important;
    }
    .mobile-header .mobile-menu-toggle {
        background: rgba(255,255,255,0.09) !important;
        border: 1px solid rgba(255,255,255,0.12) !important;
        box-shadow: none !important;
    }
    .mobile-header .mobile-menu-toggle i {
        color: #ffffff !important;
    }
    .mobile-header .mobile-menu-toggle:hover {
        background: rgba(255,255,255,0.16) !important;
    }
    /* FABs circulaires — fond solide uniforme */
    .btn-add-category,
    .btn-add-article,
    .cl-fab,
    .art-fab,
    .v-fab {
        background: #111827 !important;
        border: none !important;
        box-shadow: 0 4px 18px rgba(17,24,39,0.35) !important;
    }
    .btn-add-category i,
    .btn-add-article i,
    .cl-fab i,
    .art-fab i,
    .v-fab i {
        color: #fff !important;
    }
}