:root {
    --smart-navy-950: #020617;
    --smart-navy-900: #0f172a;
    --smart-navy-850: #111c31;
    --smart-navy-800: #172033;
    --smart-navy-700: #24324a;
    --smart-slate-500: #64748b;
    --smart-slate-300: #cbd5e1;
    --smart-slate-200: #e2e8f0;
    --smart-slate-100: #f1f5f9;
    --smart-cyan: #22d3ee;
    --smart-blue: #3b82f6;
    --smart-indigo: #6366f1;
    --smart-green: #10b981;
    --smart-amber: #f59e0b;
    --smart-red: #ef4444;
    --smart-page-bg: #edf2f7;
    --smart-card-shadow: 0 8px 24px rgba(15, 23, 42, 0.09);
    --smart-dark-card-shadow: 0 16px 40px rgba(2, 6, 23, 0.30);
}

/* ---------------------------------------------------------
   Main application shell
   --------------------------------------------------------- */
body.smart-dark-theme {
    background: var(--smart-page-bg) !important;
    color: #172033;
}

body.smart-dark-theme .thetop,
body.smart-dark-theme .app-main-shell {
    min-height: 100vh;
}

body.smart-dark-theme .app-main-shell,
body.smart-dark-theme .app-scroll-container {
    background: linear-gradient(180deg, #f4f7fb 0%, #edf2f7 100%) !important;
}

body.smart-dark-theme .content,
body.smart-dark-theme .content-wrapper,
body.smart-dark-theme .right-side {
    background: transparent !important;
}

body.smart-dark-theme .content-header h1,
body.smart-dark-theme .content-header h2,
body.smart-dark-theme .content > h1,
body.smart-dark-theme .content > h2 {
    color: var(--smart-navy-900) !important;
    font-weight: 800 !important;
    letter-spacing: -0.02em;
}

/* ---------------------------------------------------------
   Dark sidebar
   --------------------------------------------------------- */
body.smart-dark-theme .app-sidebar {
    height: 100vh !important;
    position: sticky;
    top: 0;
    z-index: 40;
    background:
        radial-gradient(circle at 20% 0%, rgba(59, 130, 246, 0.18), transparent 34%),
        linear-gradient(180deg, #0b1220 0%, #0f172a 58%, #111827 100%) !important;
    border-right: 1px solid rgba(148, 163, 184, 0.16) !important;
    box-shadow: 10px 0 34px rgba(2, 6, 23, 0.18);
}

body.smart-dark-theme .app-sidebar-brand {
    background: linear-gradient(135deg, #111827 0%, #172554 58%, #0f172a 100%) !important;
    border-right: 0 !important;
    border-bottom: 1px solid rgba(148, 163, 184, 0.16) !important;
    min-height: 60px;
    padding: 8px 14px;
}

body.smart-dark-theme .app-sidebar-brand .side-bar-heading {
    color: #f8fafc !important;
    font-size: 15px !important;
    line-height: 1.25;
    font-weight: 800 !important;
    letter-spacing: 0.01em;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.34);
}

body.smart-dark-theme .app-sidebar #side-bar {
    border-right: 0 !important;
    scrollbar-color: rgba(148, 163, 184, 0.42) transparent;
    scrollbar-width: thin;
    padding: 12px 10px !important;
}

body.smart-dark-theme .app-sidebar #side-bar::-webkit-scrollbar {
    width: 6px;
}

body.smart-dark-theme .app-sidebar #side-bar::-webkit-scrollbar-track {
    background: transparent;
}

body.smart-dark-theme .app-sidebar #side-bar::-webkit-scrollbar-thumb {
    background: rgba(148, 163, 184, 0.36);
    border-radius: 999px;
}

body.smart-dark-theme .app-sidebar #side-bar > a,
body.smart-dark-theme .app-sidebar #side-bar .drop_down {
    min-height: 42px;
    color: #dbe7f5 !important;
    font-size: 13px !important;
    line-height: 1.25;
    font-weight: 700 !important;
    letter-spacing: 0.005em;
    border: 1px solid transparent;
    border-radius: 9px !important;
}

body.smart-dark-theme .app-sidebar #side-bar > a i,
body.smart-dark-theme .app-sidebar #side-bar > a svg,
body.smart-dark-theme .app-sidebar #side-bar .drop_down i,
body.smart-dark-theme .app-sidebar #side-bar .drop_down svg {
    color: #93c5fd !important;
    stroke: currentColor !important;
    opacity: 1 !important;
}

body.smart-dark-theme .app-sidebar #side-bar > a:hover,
body.smart-dark-theme .app-sidebar #side-bar > a:focus,
body.smart-dark-theme .app-sidebar #side-bar .drop_down:hover,
body.smart-dark-theme .app-sidebar #side-bar .drop_down:focus {
    color: #ffffff !important;
    background: linear-gradient(90deg, rgba(37, 99, 235, 0.30), rgba(14, 165, 233, 0.13)) !important;
    border-color: rgba(96, 165, 250, 0.28) !important;
    box-shadow: inset 3px 0 0 #38bdf8;
    transform: translateX(2px);
}

body.smart-dark-theme .app-sidebar #side-bar > a:hover i,
body.smart-dark-theme .app-sidebar #side-bar > a:hover svg,
body.smart-dark-theme .app-sidebar #side-bar .drop_down:hover i,
body.smart-dark-theme .app-sidebar #side-bar .drop_down:hover svg {
    color: #ffffff !important;
}

body.smart-dark-theme .app-sidebar #side-bar .tw-bg-gray-200,
body.smart-dark-theme .app-sidebar #side-bar a.tw-text-primary-700,
body.smart-dark-theme .app-sidebar #side-bar .drop_down.tw-text-primary-700,
body.smart-dark-theme .app-sidebar #side-bar > div.tw-bg-gray-200 {
    color: #ffffff !important;
    background: linear-gradient(90deg, rgba(37, 99, 235, 0.38), rgba(14, 165, 233, 0.18)) !important;
    border-color: rgba(96, 165, 250, 0.36) !important;
    box-shadow: inset 3px 0 0 #22d3ee;
}

body.smart-dark-theme .app-sidebar .chiled {
    margin: 5px 0 9px !important;
    padding-left: 39px !important;
}

body.smart-dark-theme .app-sidebar .chiled > div:first-child {
    left: 19px !important;
    background: rgba(96, 165, 250, 0.28) !important;
}

body.smart-dark-theme .app-sidebar .chiled a {
    position: relative;
    min-height: 28px;
    color: #aebed2 !important;
    font-size: 12.5px !important;
    line-height: 1.3;
    font-weight: 650 !important;
    padding: 4px 8px !important;
    border-radius: 7px;
}

body.smart-dark-theme .app-sidebar .chiled a::before {
    content: "";
    position: absolute;
    left: -22px;
    top: 50%;
    width: 7px;
    height: 7px;
    margin-top: -3.5px;
    border-radius: 50%;
    background: #64748b;
    box-shadow: 0 0 0 3px #0f172a;
}

body.smart-dark-theme .app-sidebar .chiled a:hover,
body.smart-dark-theme .app-sidebar .chiled a.tw-text-primary-700 {
    color: #ffffff !important;
    background: rgba(59, 130, 246, 0.16) !important;
}

body.smart-dark-theme .app-sidebar .chiled a:hover::before,
body.smart-dark-theme .app-sidebar .chiled a.tw-text-primary-700::before {
    background: #22d3ee;
}

/* ---------------------------------------------------------
   Dark top bar
   --------------------------------------------------------- */
body.smart-dark-theme .app-topbar {
    background:
        radial-gradient(circle at 82% 20%, rgba(59, 130, 246, 0.24), transparent 30%),
        linear-gradient(90deg, #0b1220 0%, #111827 48%, #172554 100%) !important;
    border-bottom: 1px solid rgba(148, 163, 184, 0.18) !important;
    box-shadow: 0 5px 20px rgba(2, 6, 23, 0.18);
}

body.smart-dark-theme .app-topbar button,
body.smart-dark-theme .app-topbar > div > div > div > a,
body.smart-dark-theme .app-topbar summary {
    font-weight: 700 !important;
}

body.smart-dark-theme .app-topbar .tw-bg-primary-800,
body.smart-dark-theme .app-topbar [class*="tw-bg-"][class*="-800"] {
    background: rgba(255, 255, 255, 0.07) !important;
    border-color: rgba(255, 255, 255, 0.14) !important;
}

body.smart-dark-theme .app-topbar .tw-bg-primary-800:hover,
body.smart-dark-theme .app-topbar [class*="tw-bg-"][class*="-800"]:hover {
    background: rgba(59, 130, 246, 0.30) !important;
    border-color: rgba(125, 211, 252, 0.42) !important;
}

/* ---------------------------------------------------------
   Smart surfaces, forms and tables throughout the app
   --------------------------------------------------------- */
body.smart-dark-theme .box,
body.smart-dark-theme .panel,
body.smart-dark-theme .nav-tabs-custom,
body.smart-dark-theme .well,
body.smart-dark-theme .modal-content,
body.smart-dark-theme .card,
body.smart-dark-theme .report-parameters-card,
body.smart-dark-theme .report-summary-card {
    border: 1px solid #dde5ef !important;
    border-radius: 12px !important;
    box-shadow: var(--smart-card-shadow) !important;
    overflow: hidden;
}

body.smart-dark-theme .box-header,
body.smart-dark-theme .panel-heading,
body.smart-dark-theme .modal-header,
body.smart-dark-theme .nav-tabs-custom > .nav-tabs {
    border-color: #e2e8f0 !important;
}

body.smart-dark-theme .box-header .box-title,
body.smart-dark-theme .panel-title,
body.smart-dark-theme .modal-title {
    color: #0f172a;
    font-weight: 800 !important;
}

body.smart-dark-theme .form-control,
body.smart-dark-theme .select2-container--default .select2-selection--single,
body.smart-dark-theme .select2-container--default .select2-selection--multiple,
body.smart-dark-theme .input-group-addon {
    border-color: #cbd5e1 !important;
    border-radius: 7px;
}

body.smart-dark-theme .form-control:focus,
body.smart-dark-theme .select2-container--focus .select2-selection,
body.smart-dark-theme .select2-container--open .select2-selection {
    border-color: #3b82f6 !important;
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.13) !important;
}

body.smart-dark-theme label,
body.smart-dark-theme .control-label {
    color: #162033;
    font-weight: 700 !important;
}

body.smart-dark-theme .table > thead > tr > th,
body.smart-dark-theme table.dataTable > thead > tr > th {
    color: #162033 !important;
    background: linear-gradient(180deg, #edf3f9 0%, #e5edf6 100%) !important;
    border-color: #d4deea !important;
    font-weight: 800 !important;
    vertical-align: middle;
}

body.smart-dark-theme .table > tbody > tr > td,
body.smart-dark-theme table.dataTable > tbody > tr > td {
    border-color: #e6ebf1 !important;
}

body.smart-dark-theme .btn-primary,
body.smart-dark-theme [class*="tw-dw-btn-primary"] {
    color: #ffffff !important;
    background: linear-gradient(135deg, #2563eb, #0891b2) !important;
    border-color: #2563eb !important;
    font-weight: 700 !important;
    box-shadow: 0 4px 12px rgba(37, 99, 235, 0.24);
}

body.smart-dark-theme .btn-primary:hover,
body.smart-dark-theme [class*="tw-dw-btn-primary"]:hover {
    background: linear-gradient(135deg, #1d4ed8, #0e7490) !important;
}

body.smart-dark-theme .dropdown-menu,
body.smart-dark-theme .select2-dropdown {
    border: 1px solid #d7e0ea !important;
    border-radius: 9px !important;
    box-shadow: 0 14px 36px rgba(15, 23, 42, 0.18) !important;
}

body.smart-dark-theme .tw-mt-auto p {
    color: #64748b !important;
    font-weight: 600 !important;
}

/* ---------------------------------------------------------
   Dark dashboard/home with colorful metric cards
   --------------------------------------------------------- */
body.smart-dark-theme .dashboard-page {
    min-height: 100%;
    color: #dbe5f2;
    background:
        radial-gradient(circle at 8% 8%, rgba(37, 99, 235, 0.24), transparent 26%),
        radial-gradient(circle at 95% 26%, rgba(6, 182, 212, 0.15), transparent 24%),
        linear-gradient(145deg, #020617 0%, #0b1220 42%, #111827 100%) !important;
}

body.smart-dark-theme .dashboard-page > div:first-child,
body.smart-dark-theme .dashboard-page > div:first-child > div {
    background-color: transparent !important;
    background-image: none !important;
}

body.smart-dark-theme .dashboard-page h1,
body.smart-dark-theme .dashboard-page h2,
body.smart-dark-theme .dashboard-page h3 {
    color: #f8fafc !important;
}

body.smart-dark-theme .dashboard-page .dashboard-stat-grid > div {
    background: linear-gradient(145deg, rgba(17, 24, 39, 0.98), rgba(30, 41, 59, 0.98)) !important;
    border-color: rgba(148, 163, 184, 0.20) !important;
    box-shadow: var(--smart-dark-card-shadow) !important;
}

body.smart-dark-theme .dashboard-page .dashboard-stat-grid > div:hover {
    border-color: rgba(96, 165, 250, 0.55) !important;
    box-shadow: 0 18px 42px rgba(2, 6, 23, 0.42), 0 0 0 1px rgba(59, 130, 246, 0.16) !important;
}

body.smart-dark-theme .dashboard-page .dashboard-stat-grid > div > div > div > div:last-child > p:first-child {
    color: #aebdd0 !important;
    font-weight: 700 !important;
}

body.smart-dark-theme .dashboard-page .dashboard-stat-grid > div > div > div > div:last-child > p:last-child {
    color: #ffffff !important;
    font-size: 16px !important;
    font-weight: 800 !important;
}

body.smart-dark-theme .dashboard-page .dashboard-stat-grid > div > div > div > div:first-child {
    box-shadow: inset -1px 0 0 rgba(255, 255, 255, 0.20);
}

body.smart-dark-theme .dashboard-page .dashboard-stat-grid .tw-bg-sky-100,
body.smart-dark-theme .dashboard-page .dashboard-stat-grid .bg-sky-100 {
    background: linear-gradient(145deg, #06b6d4, #0284c7) !important;
}

body.smart-dark-theme .dashboard-page .dashboard-stat-grid .tw-bg-green-100,
body.smart-dark-theme .dashboard-page .dashboard-stat-grid .bg-green-100 {
    background: linear-gradient(145deg, #10b981, #059669) !important;
}

body.smart-dark-theme .dashboard-page .dashboard-stat-grid .tw-bg-yellow-100,
body.smart-dark-theme .dashboard-page .dashboard-stat-grid .bg-yellow-100 {
    background: linear-gradient(145deg, #f59e0b, #d97706) !important;
}

body.smart-dark-theme .dashboard-page .dashboard-stat-grid .tw-bg-red-100,
body.smart-dark-theme .dashboard-page .dashboard-stat-grid .bg-red-100 {
    background: linear-gradient(145deg, #fb7185, #e11d48) !important;
}

body.smart-dark-theme .dashboard-page .dashboard-stat-grid .tw-bg-blue-100,
body.smart-dark-theme .dashboard-page .dashboard-stat-grid .bg-blue-100,
body.smart-dark-theme .dashboard-page .dashboard-stat-grid .tw-bg-indigo-100,
body.smart-dark-theme .dashboard-page .dashboard-stat-grid .bg-indigo-100 {
    background: linear-gradient(145deg, #6366f1, #4338ca) !important;
}

body.smart-dark-theme .dashboard-page .dashboard-stat-grid .tw-bg-purple-100,
body.smart-dark-theme .dashboard-page .dashboard-stat-grid .bg-purple-100 {
    background: linear-gradient(145deg, #a855f7, #7e22ce) !important;
}

body.smart-dark-theme .dashboard-page .dashboard-stat-grid .tw-bg-orange-100,
body.smart-dark-theme .dashboard-page .dashboard-stat-grid .bg-orange-100 {
    background: linear-gradient(145deg, #f97316, #ea580c) !important;
}

body.smart-dark-theme .dashboard-page .dashboard-stat-grid .tw-bg-gray-100,
body.smart-dark-theme .dashboard-page .dashboard-stat-grid .bg-gray-100 {
    background: linear-gradient(145deg, #64748b, #334155) !important;
}

/* Dashboard charts and report panels stay light for graph/table readability. */
body.smart-dark-theme .dashboard-page .tw-bg-white,
body.smart-dark-theme .dashboard-page .box,
body.smart-dark-theme .dashboard-page .nav-tabs-custom {
    border-color: rgba(148, 163, 184, 0.24) !important;
    box-shadow: 0 15px 38px rgba(2, 6, 23, 0.26) !important;
}

body.smart-dark-theme .dashboard-page #dashboard_date_filter {
    color: #e2e8f0 !important;
    background: rgba(15, 23, 42, 0.76) !important;
    border: 1px solid rgba(148, 163, 184, 0.34) !important;
    font-weight: 700 !important;
}

body.smart-dark-theme .dashboard-page #dashboard_date_filter:hover {
    color: #ffffff !important;
    background: rgba(37, 99, 235, 0.44) !important;
    border-color: rgba(96, 165, 250, 0.60) !important;
}

/* ---------------------------------------------------------
   Dark login/auth screens
   --------------------------------------------------------- */
html.smart-dark-auth-html {
    min-height: 100%;
    background:
        radial-gradient(circle at 10% 6%, rgba(37, 99, 235, 0.30), transparent 30%),
        radial-gradient(circle at 92% 86%, rgba(6, 182, 212, 0.18), transparent 28%),
        linear-gradient(135deg, #020617 0%, #0b1220 48%, #111827 100%) !important;
}

body.smart-dark-auth {
    min-height: 100vh;
    color: #e2e8f0;
    background: transparent !important;
}

body.smart-dark-auth::before {
    content: "";
    position: fixed;
    inset: 0;
    pointer-events: none;
    opacity: 0.22;
    background-image:
        linear-gradient(rgba(148, 163, 184, 0.055) 1px, transparent 1px),
        linear-gradient(90deg, rgba(148, 163, 184, 0.055) 1px, transparent 1px);
    background-size: 34px 34px;
}

body.smart-dark-auth .auth-shell,
body.smart-dark-auth .auth-content {
    min-height: 100vh;
    background: transparent !important;
}

body.smart-dark-auth .smart-login-page {
    position: relative;
    z-index: 2;
    display: flex;
    align-items: center;
    min-height: calc(100vh - 80px);
}

body.smart-dark-auth .smart-login-card {
    color: #e2e8f0 !important;
    background: linear-gradient(145deg, rgba(15, 23, 42, 0.97), rgba(17, 24, 39, 0.96)) !important;
    border: 1px solid rgba(148, 163, 184, 0.24) !important;
    box-shadow: 0 28px 75px rgba(0, 0, 0, 0.46), 0 0 0 1px rgba(59, 130, 246, 0.08) !important;
    backdrop-filter: blur(16px);
}

body.smart-dark-auth .smart-login-card h1,
body.smart-dark-auth .smart-login-card h2,
body.smart-dark-auth .smart-login-card label,
body.smart-dark-auth .smart-login-card span,
body.smart-dark-auth .smart-login-card p {
    color: #e8eef7 !important;
}

body.smart-dark-auth .smart-login-card h1 {
    color: #ffffff !important;
    font-size: 24px !important;
    font-weight: 800 !important;
    letter-spacing: -0.02em;
}

body.smart-dark-auth .smart-login-card h2 {
    color: #94a3b8 !important;
}

body.smart-dark-auth .smart-login-card input[type="text"],
body.smart-dark-auth .smart-login-card input[type="password"],
body.smart-dark-auth .smart-login-card input[type="email"] {
    color: #f8fafc !important;
    background: rgba(2, 6, 23, 0.68) !important;
    border-color: #334155 !important;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.025);
}

body.smart-dark-auth .smart-login-card input::placeholder {
    color: #718096 !important;
}

body.smart-dark-auth .smart-login-card input:focus {
    border-color: #38bdf8 !important;
    box-shadow: 0 0 0 3px rgba(56, 189, 248, 0.14) !important;
}

body.smart-dark-auth .smart-login-card button[type="submit"] {
    background: linear-gradient(135deg, #2563eb, #06b6d4) !important;
    box-shadow: 0 10px 24px rgba(37, 99, 235, 0.30);
}

body.smart-dark-auth .smart-login-card button[type="submit"]:hover {
    background: linear-gradient(135deg, #1d4ed8, #0891b2) !important;
    transform: translateY(-1px);
}

body.smart-dark-auth .smart-login-card a {
    color: #67e8f9 !important;
    font-weight: 700 !important;
}

body.smart-dark-auth #show_hide_icon svg {
    stroke: #cbd5e1 !important;
}

body.smart-dark-auth .right-col > .row > [class*="col-md-"] > .box,
body.smart-dark-auth .right-col > .row > [class*="col-md-"] > .tw-bg-white,
body.smart-dark-auth .wizard > .content {
    border-color: rgba(148, 163, 184, 0.24) !important;
}

/* ---------------------------------------------------------
   Responsive behaviour
   --------------------------------------------------------- */
@media (max-width: 1023px) {
    body.smart-dark-theme .app-sidebar {
        position: fixed !important;
        left: 0;
        top: 0;
        bottom: 0;
        height: 100vh !important;
        box-shadow: 18px 0 50px rgba(0, 0, 0, 0.38);
    }
}

@media (max-width: 767px) {
    body.smart-dark-theme .app-topbar > div {
        padding-left: 12px !important;
        padding-right: 12px !important;
    }

    body.smart-dark-theme .dashboard-page .dashboard-stat-grid > div > div > div > div:last-child > p:last-child {
        font-size: 15px !important;
    }

    body.smart-dark-auth .smart-login-page {
        display: block;
        min-height: auto;
        padding-top: 42px;
    }

    body.smart-dark-auth .smart-login-card {
        margin-left: 4px;
        margin-right: 4px;
    }
}

@media print {
    body.smart-dark-theme,
    body.smart-dark-theme .app-main-shell,
    body.smart-dark-theme .app-scroll-container,
    body.smart-dark-theme .dashboard-page {
        color: #000 !important;
        background: #fff !important;
    }

    body.smart-dark-theme .dashboard-page .dashboard-stat-grid > div {
        color: #000 !important;
        background: #fff !important;
        border: 1px solid #bbb !important;
        box-shadow: none !important;
    }
}

/* ---------------------------------------------------------
   High-visibility hover system
   Every interactive element changes to a clearly different
   surface while keeping text/icons readable.
   --------------------------------------------------------- */
:root {
    --smart-hover-blue: #2563eb;
    --smart-hover-blue-dark: #1d4ed8;
    --smart-hover-cyan: #0891b2;
    --smart-hover-purple: #7c3aed;
    --smart-hover-green: #059669;
    --smart-hover-amber: #d97706;
    --smart-hover-red: #dc2626;
    --smart-hover-row: #dff6ff;
    --smart-hover-row-border: #06b6d4;
    --smart-hover-text: #ffffff;
}

body.smart-dark-theme a,
body.smart-dark-theme button,
body.smart-dark-theme .btn,
body.smart-dark-theme .box,
body.smart-dark-theme .panel,
body.smart-dark-theme .card,
body.smart-dark-theme .report-summary-card,
body.smart-dark-theme .report-parameters-card,
body.smart-dark-theme .dropdown-menu > li > a,
body.smart-dark-theme .nav-tabs > li > a,
body.smart-dark-theme .pagination > li > a,
body.smart-dark-theme .pagination > li > span,
body.smart-dark-theme .product_box,
body.smart-dark-theme .product_list,
body.smart-dark-theme .purchase-product-box,
body.smart-dark-theme .direct-sale-brand,
body.smart-dark-theme .purchase-product-brand,
body.smart-dark-theme .product_category,
body.smart-dark-theme .product_brand {
    transition: color .18s ease, background-color .18s ease, border-color .18s ease,
        box-shadow .18s ease, transform .18s ease !important;
}

/* Sidebar: use a visibly different blue-purple hover, not a subtle tint. */
body.smart-dark-theme .app-sidebar #side-bar > a:hover,
body.smart-dark-theme .app-sidebar #side-bar > a:focus-visible,
body.smart-dark-theme .app-sidebar #side-bar .drop_down:hover,
body.smart-dark-theme .app-sidebar #side-bar .drop_down:focus-visible {
    color: #ffffff !important;
    background: linear-gradient(90deg, #2563eb 0%, #7c3aed 100%) !important;
    border-color: rgba(255, 255, 255, .28) !important;
    box-shadow: inset 4px 0 0 #67e8f9, 0 7px 18px rgba(37, 99, 235, .28) !important;
    transform: translateX(3px) !important;
}

body.smart-dark-theme .app-sidebar .chiled a:hover,
body.smart-dark-theme .app-sidebar .chiled a:focus-visible {
    color: #ffffff !important;
    background: linear-gradient(90deg, rgba(37, 99, 235, .92), rgba(8, 145, 178, .92)) !important;
    box-shadow: 0 5px 14px rgba(2, 132, 199, .24) !important;
    transform: translateX(2px);
}

body.smart-dark-theme .app-sidebar .chiled a:hover::before,
body.smart-dark-theme .app-sidebar .chiled a:focus-visible::before {
    background: #ffffff !important;
    box-shadow: 0 0 0 3px #0891b2, 0 0 12px rgba(103, 232, 249, .85) !important;
}

/* Top bar controls. */
body.smart-dark-theme .app-topbar button:not([disabled]):hover,
body.smart-dark-theme .app-topbar a:hover,
body.smart-dark-theme .app-topbar summary:hover {
    color: #ffffff !important;
    background: linear-gradient(135deg, #2563eb, #7c3aed) !important;
    border-color: rgba(255, 255, 255, .30) !important;
    box-shadow: 0 8px 20px rgba(37, 99, 235, .30) !important;
}

body.smart-dark-theme .app-topbar button:hover i,
body.smart-dark-theme .app-topbar button:hover svg,
body.smart-dark-theme .app-topbar a:hover i,
body.smart-dark-theme .app-topbar a:hover svg {
    color: #ffffff !important;
    stroke: currentColor !important;
}

/* Bootstrap/application buttons with status-specific hover colors. */
body.smart-dark-theme .btn:not(.btn-link):not(.disabled):not([disabled]):hover,
body.smart-dark-theme .btn:not(.btn-link):not(.disabled):not([disabled]):focus-visible,
body.smart-dark-theme .dt-buttons .btn:hover,
body.smart-dark-theme button[class*="tw-dw-btn"]:not([disabled]):hover {
    color: var(--smart-hover-text) !important;
    border-color: transparent !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 18px rgba(15, 23, 42, .24) !important;
}

body.smart-dark-theme .btn-default:not(.disabled):not([disabled]):hover,
body.smart-dark-theme .btn-default:not(.disabled):not([disabled]):focus-visible,
body.smart-dark-theme .dt-buttons .btn-default:hover {
    background: linear-gradient(135deg, #0891b2, #2563eb) !important;
}

body.smart-dark-theme .btn-primary:not(.disabled):not([disabled]):hover,
body.smart-dark-theme .btn-primary:not(.disabled):not([disabled]):focus-visible,
body.smart-dark-theme button[class*="tw-dw-btn-primary"]:not([disabled]):hover {
    background: linear-gradient(135deg, #7c3aed, #2563eb) !important;
}

body.smart-dark-theme .btn-success:not(.disabled):not([disabled]):hover,
body.smart-dark-theme .btn-success:not(.disabled):not([disabled]):focus-visible {
    background: linear-gradient(135deg, #059669, #047857) !important;
}

body.smart-dark-theme .btn-info:not(.disabled):not([disabled]):hover,
body.smart-dark-theme .btn-info:not(.disabled):not([disabled]):focus-visible {
    background: linear-gradient(135deg, #0284c7, #0369a1) !important;
}

body.smart-dark-theme .btn-warning:not(.disabled):not([disabled]):hover,
body.smart-dark-theme .btn-warning:not(.disabled):not([disabled]):focus-visible {
    color: #ffffff !important;
    background: linear-gradient(135deg, #d97706, #b45309) !important;
}

body.smart-dark-theme .btn-danger:not(.disabled):not([disabled]):hover,
body.smart-dark-theme .btn-danger:not(.disabled):not([disabled]):focus-visible {
    background: linear-gradient(135deg, #dc2626, #b91c1c) !important;
}

/* Dropdowns, Select2, autocomplete and context menus. */
body.smart-dark-theme .dropdown-menu > li > a:hover,
body.smart-dark-theme .dropdown-menu > li > a:focus,
body.smart-dark-theme .dropdown-menu > .active > a,
body.smart-dark-theme .dropdown-menu > .active > a:hover,
body.smart-dark-theme .select2-container--default .select2-results__option--highlighted[aria-selected],
body.smart-dark-theme .select2-container--default .select2-results__option[aria-selected="true"]:hover,
body.smart-dark-theme .ui-menu .ui-menu-item-wrapper.ui-state-active,
body.smart-dark-theme .ui-autocomplete .ui-state-focus,
body.smart-dark-theme .autocomplete-suggestion:hover,
body.smart-dark-theme .typeahead.dropdown-menu > .active > a {
    color: #ffffff !important;
    background: linear-gradient(90deg, #2563eb, #0891b2) !important;
    border-color: transparent !important;
}

body.smart-dark-theme .dropdown-menu > li > a:hover i,
body.smart-dark-theme .dropdown-menu > li > a:hover svg,
body.smart-dark-theme .select2-results__option--highlighted i,
body.smart-dark-theme .select2-results__option--highlighted svg {
    color: #ffffff !important;
    stroke: currentColor !important;
}

/* Tables: entire row becomes cyan-tinted and every normal cell stays readable. */
body.smart-dark-theme .table-hover > tbody > tr:hover,
body.smart-dark-theme .table > tbody > tr:hover,
body.smart-dark-theme table.dataTable > tbody > tr:hover,
body.smart-dark-theme table.dataTable.hover > tbody > tr:hover,
body.smart-dark-theme table.dataTable.display > tbody > tr:hover {
    background: var(--smart-hover-row) !important;
    box-shadow: inset 4px 0 0 var(--smart-hover-row-border) !important;
}

body.smart-dark-theme .table-hover > tbody > tr:hover > td,
body.smart-dark-theme .table > tbody > tr:hover > td,
body.smart-dark-theme table.dataTable > tbody > tr:hover > td {
    color: #0f172a !important;
    background: transparent !important;
}

/* Only recolor links that are direct table-cell content. Nested component links
   (especially action dropdowns) must keep their own hover/active colors. */
body.smart-dark-theme .table > tbody > tr:hover > td > a:not(.btn):not(.label):not(.badge),
body.smart-dark-theme table.dataTable > tbody > tr:hover > td > a:not(.btn):not(.label):not(.badge) {
    color: #1d4ed8 !important;
    font-weight: 700 !important;
}

body.smart-dark-theme .table > tbody > tr:hover .text-muted,
body.smart-dark-theme table.dataTable > tbody > tr:hover .text-muted {
    color: #475569 !important;
}

/* Cards, boxes and panels receive a clear border/raise hover. */
body.smart-dark-theme .box:hover,
body.smart-dark-theme .panel:hover,
body.smart-dark-theme .card:hover,
body.smart-dark-theme .report-summary-card:hover,
body.smart-dark-theme .report-parameters-card:hover,
body.smart-dark-theme .info-box:hover,
body.smart-dark-theme .small-box:hover {
    border-color: #38bdf8 !important;
    box-shadow: 0 14px 32px rgba(37, 99, 235, .18) !important;
    transform: translateY(-2px);
}

/* Dashboard cards: visibly brighter surface and white text on hover. */
body.smart-dark-theme .dashboard-page .dashboard-stat-grid > div:hover {
    background: linear-gradient(135deg, #172554 0%, #312e81 52%, #155e75 100%) !important;
    border-color: #67e8f9 !important;
    box-shadow: 0 20px 46px rgba(2, 6, 23, .48), 0 0 0 2px rgba(34, 211, 238, .20) !important;
    transform: translateY(-4px) scale(1.01) !important;
}

body.smart-dark-theme .dashboard-page .dashboard-stat-grid > div:hover p,
body.smart-dark-theme .dashboard-page .dashboard-stat-grid > div:hover span,
body.smart-dark-theme .dashboard-page .dashboard-stat-grid > div:hover i,
body.smart-dark-theme .dashboard-page .dashboard-stat-grid > div:hover svg {
    color: #ffffff !important;
    stroke: currentColor !important;
}

/* POS/Sale/Purchase product, brand and category tiles. */
body.smart-dark-theme .product_box:hover,
body.smart-dark-theme .product_list:hover,
body.smart-dark-theme .purchase-product-box:hover,
body.smart-dark-theme .direct-sale-brand:hover,
body.smart-dark-theme .purchase-product-brand:hover,
body.smart-dark-theme .product_category:hover,
body.smart-dark-theme .product_brand:hover,
body.smart-dark-theme #product_list_body > div:hover,
body.smart-dark-theme #purchase_product_list_body > div:hover {
    color: #ffffff !important;
    background: linear-gradient(135deg, #2563eb, #7c3aed) !important;
    border-color: #67e8f9 !important;
    box-shadow: 0 10px 24px rgba(37, 99, 235, .28) !important;
    transform: translateY(-3px) !important;
}

body.smart-dark-theme .product_box:hover *,
body.smart-dark-theme .product_list:hover *,
body.smart-dark-theme .purchase-product-box:hover *,
body.smart-dark-theme .direct-sale-brand:hover *,
body.smart-dark-theme .purchase-product-brand:hover *,
body.smart-dark-theme .product_category:hover *,
body.smart-dark-theme .product_brand:hover *,
body.smart-dark-theme #product_list_body > div:hover *,
body.smart-dark-theme #purchase_product_list_body > div:hover * {
    color: #ffffff !important;
}

/* Tabs, pills and pagination. */
body.smart-dark-theme .nav-tabs > li > a:hover,
body.smart-dark-theme .nav-pills > li > a:hover,
body.smart-dark-theme .nav-tabs-custom > .nav-tabs > li > a:hover {
    color: #ffffff !important;
    background: linear-gradient(135deg, #7c3aed, #2563eb) !important;
    border-color: transparent !important;
}

body.smart-dark-theme .pagination > li > a:hover,
body.smart-dark-theme .pagination > li > span:hover {
    color: #ffffff !important;
    background: linear-gradient(135deg, #0891b2, #2563eb) !important;
    border-color: #0891b2 !important;
}

/* Inputs show hover readiness, then a stronger focus ring. */
body.smart-dark-theme .form-control:not([disabled]):hover,
body.smart-dark-theme .select2-container--default:not(.select2-container--disabled) .select2-selection:hover,
body.smart-dark-theme .input-group:hover .input-group-addon {
    border-color: #38bdf8 !important;
}

body.smart-dark-theme input[type="checkbox"]:hover,
body.smart-dark-theme input[type="radio"]:hover {
    filter: drop-shadow(0 0 4px rgba(37, 99, 235, .55));
}

/* Inline content links stay readable and get an obvious underline/color. */
body.smart-dark-theme .content a:not(.btn):not(.label):not(.badge):not([class*="tw-dw-btn"]):hover,
body.smart-dark-theme .content-wrapper a:not(.btn):not(.label):not(.badge):not([class*="tw-dw-btn"]):focus-visible {
    color: #1d4ed8 !important;
    text-decoration: underline !important;
    text-decoration-thickness: 2px !important;
    text-underline-offset: 2px;
}

/* Close/delete controls use red so their action is immediately clear. */
body.smart-dark-theme .modal-header .close:hover,
body.smart-dark-theme .box-tools .remove:hover,
body.smart-dark-theme .delete-row:hover,
body.smart-dark-theme .fa-trash:hover,
body.smart-dark-theme .glyphicon-trash:hover {
    color: #ffffff !important;
    background: #dc2626 !important;
    border-radius: 6px;
}

/* Keyboard users get the same visible treatment. */
body.smart-dark-theme :focus-visible {
    outline: 3px solid rgba(34, 211, 238, .72) !important;
    outline-offset: 2px !important;
}

/* Disabled items must not look interactive. */
body.smart-dark-theme .btn.disabled,
body.smart-dark-theme .btn[disabled],
body.smart-dark-theme button[disabled],
body.smart-dark-theme a.disabled {
    transform: none !important;
    box-shadow: none !important;
    cursor: not-allowed !important;
    opacity: .58 !important;
}

@media (hover: none) {
    body.smart-dark-theme .box:hover,
    body.smart-dark-theme .panel:hover,
    body.smart-dark-theme .card:hover,
    body.smart-dark-theme .dashboard-page .dashboard-stat-grid > div:hover {
        transform: none !important;
    }
}

@media print {
    body.smart-dark-theme *:hover {
        color: inherit !important;
        background: inherit !important;
        box-shadow: none !important;
        transform: none !important;
    }
}

/* Final specificity safeguards for tile text and authentication hovers. */
body.smart-dark-theme .content .product_box:hover a,
body.smart-dark-theme .content .product_list:hover a,
body.smart-dark-theme .content .purchase-product-box:hover a,
body.smart-dark-theme .content .direct-sale-brand:hover a,
body.smart-dark-theme .content .purchase-product-brand:hover a,
body.smart-dark-theme .content .product_category:hover a,
body.smart-dark-theme .content .product_brand:hover a,
body.smart-dark-theme .content #product_list_body > div:hover a,
body.smart-dark-theme .content #purchase_product_list_body > div:hover a {
    color: #ffffff !important;
    text-decoration: none !important;
}

body.smart-dark-auth .smart-login-card a:hover,
body.smart-dark-auth .smart-login-card a:focus-visible {
    color: #ffffff !important;
    background: linear-gradient(90deg, rgba(37, 99, 235, .72), rgba(124, 58, 237, .72)) !important;
    border-radius: 6px;
    text-decoration: underline !important;
    text-underline-offset: 3px;
}

body.smart-dark-auth .smart-login-card button:not([disabled]):hover,
body.smart-dark-auth .smart-login-card .btn:not(.disabled):hover {
    color: #ffffff !important;
    border-color: #67e8f9 !important;
    box-shadow: 0 12px 28px rgba(37, 99, 235, .38) !important;
    transform: translateY(-2px) !important;
}

/* ---------------------------------------------------------
   Dashboard light workspace
   Keep the navigation shell dark, but use a bright dashboard
   canvas and light statistic cards for clearer readability.
   --------------------------------------------------------- */
body.smart-dark-theme .dashboard-page {
    color: #1e293b !important;
    background:
        radial-gradient(circle at 8% 2%, rgba(14, 165, 233, 0.10), transparent 26%),
        radial-gradient(circle at 96% 10%, rgba(99, 102, 241, 0.08), transparent 25%),
        linear-gradient(180deg, #f8fbff 0%, #eef4fa 100%) !important;
}

body.smart-dark-theme .dashboard-page > div:first-child,
body.smart-dark-theme .dashboard-page > div:first-child > div,
body.smart-dark-theme .dashboard-page .dashboard-secondary-stats-wrap,
body.smart-dark-theme .dashboard-page .tw-relative,
body.smart-dark-theme .dashboard-page .tw-isolate {
    background-color: transparent !important;
    background-image: none !important;
}

body.smart-dark-theme .dashboard-page h1,
body.smart-dark-theme .dashboard-page h2,
body.smart-dark-theme .dashboard-page h3 {
    color: #0f172a !important;
    text-shadow: none !important;
}

body.smart-dark-theme .dashboard-page .dashboard-stat-grid > div {
    background: linear-gradient(145deg, #ffffff 0%, #f8fafc 100%) !important;
    border-color: #d8e2ee !important;
    box-shadow: 0 7px 20px rgba(15, 23, 42, 0.09) !important;
}

body.smart-dark-theme .dashboard-page .dashboard-stat-grid > div > div > div > div:last-child > p:first-child {
    color: #64748b !important;
    font-weight: 800 !important;
}

body.smart-dark-theme .dashboard-page .dashboard-stat-grid > div > div > div > div:last-child > p:last-child {
    color: #0f172a !important;
    font-size: 16px !important;
    font-weight: 900 !important;
}

body.smart-dark-theme .dashboard-page #dashboard_date_filter {
    color: #0f172a !important;
    background: #ffffff !important;
    border: 1px solid #cbd5e1 !important;
    box-shadow: 0 4px 13px rgba(15, 23, 42, 0.08) !important;
}

body.smart-dark-theme .dashboard-page #dashboard_date_filter svg {
    color: #2563eb !important;
    stroke: currentColor !important;
}

body.smart-dark-theme .dashboard-page #dashboard_date_filter:hover,
body.smart-dark-theme .dashboard-page #dashboard_date_filter:focus-visible {
    color: #ffffff !important;
    background: linear-gradient(135deg, #2563eb, #7c3aed) !important;
    border-color: #2563eb !important;
    box-shadow: 0 9px 22px rgba(37, 99, 235, 0.25) !important;
}

body.smart-dark-theme .dashboard-page #dashboard_date_filter:hover svg,
body.smart-dark-theme .dashboard-page #dashboard_date_filter:focus-visible svg {
    color: #ffffff !important;
}

body.smart-dark-theme .dashboard-page .dashboard-stat-grid > div:hover {
    background: linear-gradient(135deg, #172554 0%, #312e81 52%, #155e75 100%) !important;
    border-color: #22d3ee !important;
    box-shadow: 0 18px 38px rgba(30, 64, 175, 0.24), 0 0 0 2px rgba(34, 211, 238, 0.16) !important;
}

body.smart-dark-theme .dashboard-page .dashboard-stat-grid > div:hover p,
body.smart-dark-theme .dashboard-page .dashboard-stat-grid > div:hover span,
body.smart-dark-theme .dashboard-page .dashboard-stat-grid > div:hover i,
body.smart-dark-theme .dashboard-page .dashboard-stat-grid > div:hover svg {
    color: #ffffff !important;
    stroke: currentColor !important;
}

body.smart-dark-theme .dashboard-page .box,
body.smart-dark-theme .dashboard-page .panel,
body.smart-dark-theme .dashboard-page .nav-tabs-custom,
body.smart-dark-theme .dashboard-page .tw-bg-white {
    background-color: #ffffff !important;
    border-color: #dbe5ef !important;
    box-shadow: 0 8px 24px rgba(15, 23, 42, 0.08) !important;
}

@media (max-width: 767px) {
    body.smart-dark-theme .dashboard-page {
        background: #f3f7fb !important;
    }
}

/* ---------------------------------------------------------
   Dashboard card hover readability — final override
   Keep the dashboard hover clearly visible without losing
   label/value contrast against the light workspace.
   --------------------------------------------------------- */
body.smart-dark-theme .dashboard-page .dashboard-stat-grid > div:hover {
    background: linear-gradient(135deg, #dbeafe 0%, #e0f2fe 52%, #ede9fe 100%) !important;
    border-color: #0ea5e9 !important;
    box-shadow: 0 18px 38px rgba(37, 99, 235, 0.20), 0 0 0 2px rgba(14, 165, 233, 0.16) !important;
}

body.smart-dark-theme .dashboard-page .dashboard-stat-grid > div:hover > div > div > div:last-child,
body.smart-dark-theme .dashboard-page .dashboard-stat-grid > div:hover > div > div > div:last-child * {
    color: #0f172a !important;
    stroke: currentColor !important;
    text-shadow: none !important;
}

body.smart-dark-theme .dashboard-page .dashboard-stat-grid > div:hover > div > div > div:last-child > p:first-child {
    color: #334155 !important;
    font-weight: 800 !important;
}

body.smart-dark-theme .dashboard-page .dashboard-stat-grid > div:hover > div > div > div:last-child > p:last-child,
body.smart-dark-theme .dashboard-page .dashboard-stat-grid > div:hover > div > div > div:last-child > p:last-child * {
    color: #0f172a !important;
    font-weight: 900 !important;
}

body.smart-dark-theme .dashboard-page .dashboard-stat-grid > div:hover > div > div > div:last-child .fa-info-circle,
body.smart-dark-theme .dashboard-page .dashboard-stat-grid > div:hover > div > div > div:last-child .hover-q {
    color: #2563eb !important;
}

body.smart-dark-theme .dashboard-page .dashboard-stat-grid > div:hover > div > div > div:first-child,
body.smart-dark-theme .dashboard-page .dashboard-stat-grid > div:hover > div > div > div:first-child i,
body.smart-dark-theme .dashboard-page .dashboard-stat-grid > div:hover > div > div > div:first-child svg {
    color: #ffffff !important;
    stroke: currentColor !important;
}

/* ---------------------------------------------------------
   Final typography and interaction consistency
   Restores one readable application font and prevents hover
   backgrounds from hiding labels, values, icons or product text.
   --------------------------------------------------------- */
body.smart-dark-theme,
body.smart-dark-theme input,
body.smart-dark-theme select,
body.smart-dark-theme textarea,
body.smart-dark-theme button,
body.smart-dark-theme .form-control,
body.smart-dark-theme .select2-container,
body.smart-dark-theme .dropdown-menu,
body.smart-dark-theme .table,
body.smart-dark-theme table.dataTable {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Noto Sans Bengali", "Nirmala UI", Arial, sans-serif !important;
}

/* Keep ordinary content readable without making every item extra-bold. */
body.smart-dark-theme .table > tbody > tr > td,
body.smart-dark-theme table.dataTable > tbody > tr > td,
body.smart-dark-theme .dropdown-menu > li > a,
body.smart-dark-theme .select2-results__option,
body.smart-dark-theme .product_box,
body.smart-dark-theme .purchase-product-box {
    font-weight: 400 !important;
}

body.smart-dark-theme .table > thead > tr > th,
body.smart-dark-theme table.dataTable > thead > tr > th,
body.smart-dark-theme label,
body.smart-dark-theme .control-label,
body.smart-dark-theme .box-title,
body.smart-dark-theme .panel-title {
    font-weight: 700 !important;
}

/* Dashboard labels use Title Case instead of forced ALL CAPS. */
body.smart-dark-theme .dashboard-page .dashboard-stat-grid > div > div > div > div:last-child > p:first-child {
    color: #475569 !important;
    font-weight: 700 !important;
    letter-spacing: 0 !important;
    text-transform: capitalize !important;
}

body.smart-dark-theme .dashboard-page .dashboard-stat-grid > div:hover > div > div > div:last-child > p:first-child {
    color: #334155 !important;
    text-transform: capitalize !important;
}

/* Action menus: every normal and hovered item keeps strong contrast. */
body.smart-dark-theme .dropdown-menu {
    color: #0f172a !important;
    background: #ffffff !important;
}

body.smart-dark-theme .dropdown-menu > li > a,
body.smart-dark-theme .dropdown-menu > li > a:visited {
    color: #1e40af !important;
    background: #ffffff !important;
    font-weight: 600 !important;
    text-decoration: none !important;
}

body.smart-dark-theme .dropdown-menu > li > a i,
body.smart-dark-theme .dropdown-menu > li > a svg,
body.smart-dark-theme .dropdown-menu > li > a span {
    color: inherit !important;
    stroke: currentColor !important;
}

body.smart-dark-theme .dropdown-menu > li > a:hover,
body.smart-dark-theme .dropdown-menu > li > a:focus,
body.smart-dark-theme .dropdown-menu > .active > a,
body.smart-dark-theme .dropdown-menu > .active > a:hover,
body.smart-dark-theme .dropdown-menu > .active > a:focus {
    color: #ffffff !important;
    background: linear-gradient(90deg, #0284c7 0%, #2563eb 100%) !important;
    text-decoration: none !important;
    text-shadow: none !important;
}

body.smart-dark-theme .dropdown-menu > li > a:hover *,
body.smart-dark-theme .dropdown-menu > li > a:focus *,
body.smart-dark-theme .dropdown-menu > .active > a * {
    color: #ffffff !important;
    stroke: currentColor !important;
}

body.smart-dark-theme .dropdown-menu > .disabled > a,
body.smart-dark-theme .dropdown-menu > .disabled > a:hover,
body.smart-dark-theme .dropdown-menu > .disabled > a:focus {
    color: #94a3b8 !important;
    background: #f8fafc !important;
    cursor: not-allowed !important;
    text-decoration: none !important;
}

body.smart-dark-theme .dropdown-menu .divider {
    background-color: #e2e8f0 !important;
}

/* Select2 options follow the same readable behavior. */
body.smart-dark-theme .select2-results__option {
    color: #0f172a !important;
    background: #ffffff !important;
}

body.smart-dark-theme .select2-container--default .select2-results__option--highlighted[aria-selected],
body.smart-dark-theme .select2-container--default .select2-results__option[aria-selected="true"]:hover {
    color: #ffffff !important;
    background: linear-gradient(90deg, #0284c7 0%, #2563eb 100%) !important;
}

body.smart-dark-theme .select2-container--default .select2-results__option--highlighted[aria-selected] * {
    color: #ffffff !important;
}

/*
 * Sale/POS/Purchase product tiles:
 * apply the hover surface to the actual card only, not the whole grid column.
 */
body.smart-dark-theme #product_list_body > div.product_list:hover,
body.smart-dark-theme #purchase_product_list_body > div.product_list:hover,
body.smart-dark-theme #product_list_body > div[class*="col-"]:hover,
body.smart-dark-theme #purchase_product_list_body > div[class*="col-"]:hover {
    color: inherit !important;
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
    transform: none !important;
}

body.smart-dark-theme #product_list_body > div.product_list:hover > .product_box,
body.smart-dark-theme #purchase_product_list_body > div.product_list:hover > .product_box,
body.smart-dark-theme .product_box:hover,
body.smart-dark-theme .purchase-product-box:hover {
    color: #0f172a !important;
    background: linear-gradient(145deg, #ecfeff 0%, #dbeafe 100%) !important;
    border-color: #0ea5e9 !important;
    box-shadow: 0 10px 24px rgba(2, 132, 199, 0.22), 0 0 0 2px rgba(14, 165, 233, 0.12) !important;
    transform: translateY(-3px) !important;
}

body.smart-dark-theme #product_list_body > div.product_list:hover > .product_box *,
body.smart-dark-theme #purchase_product_list_body > div.product_list:hover > .product_box *,
body.smart-dark-theme .product_box:hover *,
body.smart-dark-theme .purchase-product-box:hover * {
    color: #0f172a !important;
    text-decoration: none !important;
    text-shadow: none !important;
}

body.smart-dark-theme #product_list_body > div.product_list:hover > .product_box .text-muted,
body.smart-dark-theme #purchase_product_list_body > div.product_list:hover > .product_box .text-muted,
body.smart-dark-theme .product_box:hover .text-muted,
body.smart-dark-theme .purchase-product-box:hover .text-muted {
    color: #334155 !important;
}

body.smart-dark-theme .product_box:hover .image-container,
body.smart-dark-theme .purchase-product-box:hover .image-container {
    background-color: rgba(255, 255, 255, 0.72) !important;
}

/* Brand/category buttons use a light hover; active selection stays solid blue. */
body.smart-dark-theme .direct-sale-brand:not(.active):hover,
body.smart-dark-theme .purchase-product-brand:not(.active):hover,
body.smart-dark-theme .product_brand:not(.active):hover,
body.smart-dark-theme .product_category:not(.active):hover {
    color: #0f172a !important;
    background: linear-gradient(135deg, #e0f2fe, #dbeafe) !important;
    border-color: #0284c7 !important;
    box-shadow: 0 6px 14px rgba(2, 132, 199, 0.18) !important;
}

body.smart-dark-theme .direct-sale-brand:not(.active):hover *,
body.smart-dark-theme .purchase-product-brand:not(.active):hover *,
body.smart-dark-theme .product_brand:not(.active):hover *,
body.smart-dark-theme .product_category:not(.active):hover * {
    color: #0f172a !important;
}

body.smart-dark-theme .direct-sale-brand.active,
body.smart-dark-theme .direct-sale-brand.active:hover,
body.smart-dark-theme .purchase-product-brand.active,
body.smart-dark-theme .purchase-product-brand.active:hover,
body.smart-dark-theme .product_brand.active,
body.smart-dark-theme .product_brand.active:hover,
body.smart-dark-theme .product_category.active,
body.smart-dark-theme .product_category.active:hover {
    color: #ffffff !important;
    background: linear-gradient(135deg, #2563eb, #0284c7) !important;
    border-color: #1d4ed8 !important;
}

body.smart-dark-theme .direct-sale-brand.active *,
body.smart-dark-theme .purchase-product-brand.active *,
body.smart-dark-theme .product_brand.active *,
body.smart-dark-theme .product_category.active * {
    color: #ffffff !important;
}

/* Generic content-link hover must never override component-specific colors. */
body.smart-dark-theme .content .dropdown-menu a:hover,
body.smart-dark-theme .content .dropdown-menu a:focus,
body.smart-dark-theme .content-wrapper .dropdown-menu a:hover,
body.smart-dark-theme .content-wrapper .dropdown-menu a:focus {
    color: #ffffff !important;
    text-decoration: none !important;
}

body.smart-dark-theme .content .product_box:hover a,
body.smart-dark-theme .content .purchase-product-box:hover a,
body.smart-dark-theme .content-wrapper .product_box:hover a,
body.smart-dark-theme .content-wrapper .purchase-product-box:hover a {
    color: #0f172a !important;
    text-decoration: none !important;
}

@media print {
    body.smart-dark-theme,
    body.smart-dark-theme input,
    body.smart-dark-theme select,
    body.smart-dark-theme textarea,
    body.smart-dark-theme button,
    body.smart-dark-theme .table {
        font-family: Arial, sans-serif !important;
    }
}
