/* ===================================
   🎨 CSS VARIABLES SYSTEM
   =================================== */

:root {
    /* ========== 🎨 CORE COLORS ========== */
    --color-primary: #068DA9;
    --color-primary-hover: #004a43;
    --color-primary-light: rgba(6, 141, 169, 0.1);
    --color-primary-dark: #004a43;
    --border-right-color: #FF8E25;

    --bg-color-app-content: #F0F0F0;
    --bg-color-app-header: #FFF;
    --bg-color-app-title: #FFF;
    --bg-color-tile: #FFF;
    --bg-color-mark: #fcf8e3;
    --bg-color-table-primary: #b8e2de;
    --border-color-table-primary: #b8e2de;

    --color-app-title-btn: black;
    --border-color-app-title-btn: #eee;

    --color-secondary: #6c757d;
    --color-success: #28a745;
    --color-info: #17a2b8;
    --color-warning: #ffc107;
    --color-danger: #068DA9;
    --color-delete: #dc3545;

    /* ========== 🌈 BRAND COLORS ========== */
    --color-blue: #007bff;
    --color-indigo: #6610f2;
    --color-purple: #6f42c1;
    --color-pink: #e83e8c;
    --color-red: #068DA9;
    --color-orange: #fd7e14;
    --color-yellow: #ffc107;
    --color-green: #28a745;
    --color-teal: #20c997;
    --color-cyan: #17a2b8;

    /* ========== ⚫ GRAYSCALE COLORS ========== */
    --color-white: #FFF;
    --color-gray-100: #f8f9fa;
    --color-gray-200: #e9ecef;
    --color-gray-300: #dee2e6;
    --color-gray-400: #ced4da;
    --color-gray-500: #adb5bd;
    --color-gray-600: #6c757d;
    --color-gray-700: #495057;
    --color-gray-800: #343a40;
    --color-gray-900: #212529;
    --color-black: #000;

    /* ========== 🌑 BACKGROUND COLORS ========== */
    --bg-body: #171718;
    --bg-light: #f8f9fa;
    --bg-dark: #343a40;
    --bg-white: #FFF;
    --bg-transparent: transparent;

    /* ========== 📝 TEXT COLORS ========== */
    --text-primary: #212529;
    --text-secondary: #6c757d;
    --text-muted: #6c757d;
    --text-white: #FFF;
    --text-dark: #343a40;
    --text-light: #f8f9fa;

    /* ========== 🔗 LINK COLORS ========== */
    --link-color: #068DA9;
    --link-hover-color: #004a43;
    --link-decoration: none;
    --link-hover-decoration: underline;

    /* ========== 🔲 BORDER COLORS ========== */
    --border-color: #dee2e6;
    --border-light: rgba(0, 0, 0, 0.125);
    --border-dark: rgba(255, 255, 255, 0.1);

    /* ========== 📐 SPACING SYSTEM ========== */
    --spacing-0: 0;
    --spacing-1: 0.25rem;    /* 4px */
    --spacing-2: 0.5rem;     /* 8px */
    --spacing-3: 0.75rem;    /* 12px */
    --spacing-4: 1rem;       /* 16px */
    --spacing-5: 1.25rem;    /* 20px */
    --spacing-6: 1.5rem;     /* 24px */
    --spacing-7: 1.75rem;    /* 28px */
    --spacing-8: 2rem;       /* 32px */
    --spacing-9: 2.25rem;    /* 36px */
    --spacing-10: 2.5rem;    /* 40px */
    --spacing-12: 3rem;      /* 48px */
    --spacing-16: 4rem;      /* 64px */
    --spacing-20: 5rem;      /* 80px */
    --spacing-24: 6rem;      /* 96px */

    /* ========== 📏 FONT SYSTEM ========== */
    --font-family-primary: 'Cairo', sans-serif;
    --font-family-sans-serif: "Lato", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    --font-family-monospace: SFMono-Regular, Menlo, Monaco, Consolas, "Liberation Mono", "Courier New", monospace;

    --font-size-xs: 0.75rem;      /* 12px */
    --font-size-sm: 0.875rem;     /* 14px */
    --font-size-base: 0.875rem;   /* 14px */
    --font-size-md: 1rem;         /* 16px */
    --font-size-lg: 1.125rem;     /* 18px */
    --font-size-xl: 1.25rem;      /* 20px */
    --font-size-2xl: 1.5rem;      /* 24px */
    --font-size-3xl: 1.875rem;    /* 30px */
    --font-size-4xl: 2.25rem;     /* 36px */
    --font-size-5xl: 3rem;        /* 48px */
    --font-size-6xl: 3.75rem;     /* 60px */
    --font-size-7xl: 4rem;        /* 64px */

    --font-weight-light: 300;
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    --font-weight-extrabold: 800;

    --line-height-tight: 1.15;
    --line-height-normal: 1.5;
    --line-height-relaxed: 1.75;
    --line-height-loose: 2;

    /* ========== 🔲 BORDER RADIUS ========== */
    --radius-none: 0;
    --radius-sm: 0.125rem;     /* 2px */
    --radius-base: 0.25rem;    /* 4px */
    --radius-md: 0.375rem;     /* 6px */
    --radius-lg: 0.5rem;       /* 8px */
    --radius-xl: 0.75rem;      /* 12px */
    --radius-2xl: 1rem;        /* 16px */
    --radius-3xl: 1.5rem;      /* 24px */
    --radius-full: 9999px;     /* Full circle */

    /* ========== 💫 SHADOWS ========== */
    --shadow-xs: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    --shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, 0.1), 0 1px 2px 0 rgba(0, 0, 0, 0.06);
    --shadow-base: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 0 2px 4px -1px rgba(0, 0, 0, 0.06);
    --shadow-md: 0 10px 15px -3px rgba(0, 0, 0, 0.1), 0 4px 6px -2px rgba(0, 0, 0, 0.05);
    --shadow-lg: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 10px 10px -5px rgba(0, 0, 0, 0.04);
    --shadow-xl: 0 25px 50px -12px rgba(0, 0, 0, 0.25);
    --shadow-2xl: 0 35px 60px -15px rgba(0, 0, 0, 0.3);
    --shadow-inner: inset 0 2px 4px 0 rgba(0, 0, 0, 0.06);
    --shadow-none: none;

    /* ========== ⚡ TRANSITIONS ========== */
    --transition-fast: 0.15s;
    --transition-base: 0.2s;
    --transition-medium: 0.3s;
    --transition-slow: 0.5s;
    --transition-all: all 0.3s ease;
    --transition-colors: color 0.3s ease, background-color 0.3s ease, border-color 0.3s ease;
    --transition-transform: transform 0.3s ease;
    --transition-opacity: opacity 0.3s ease;

    /* ========== 🎬 ANIMATIONS ========== */
    --animation-duration-fast: 0.3s;
    --animation-duration-base: 0.5s;
    --animation-duration-slow: 1s;
    --animation-timing: ease-in-out;

    /* ========== 📱 BREAKPOINTS ========== */
    --breakpoint-xs: 0;
    --breakpoint-sm: 576px;
    --breakpoint-md: 768px;
    --breakpoint-lg: 992px;
    --breakpoint-xl: 1200px;
    --breakpoint-2xl: 1536px;

    /* ========== 📊 Z-INDEX LAYERS ========== */
    --z-dropdown: 1000;
    --z-sticky: 1020;
    --z-fixed: 1030;
    --z-modal-backdrop: 1040;
    --z-modal: 1050;
    --z-popover: 1060;
    --z-tooltip: 1070;
    --z-notification: 1080;

    /* ========== 🎯 STATISTICS CARD COLORS ========== */
    /* Contracts - Blue soft */
    --stat-contracts-bg-start: rgba(99, 146, 207, 0.1);
    --stat-contracts-bg-mid: rgba(141, 174, 223, 0.15);
    --stat-contracts-bg-end: rgba(242, 247, 253, 0.1);
    --stat-contracts-border: rgba(99, 146, 207, 0.2);
    --stat-contracts-border-accent: rgba(99, 146, 207, 0.6);
    --stat-contracts-shadow: rgba(99, 146, 207, 0.08);

    /* Car Movement - Green soft */
    --stat-car-movement-bg-start: rgba(96, 189, 156, 0.1);
    --stat-car-movement-bg-mid: rgba(141, 211, 189, 0.15);
    --stat-car-movement-bg-end: rgba(241, 250, 247, 0.1);
    --stat-car-movement-border: rgba(96, 189, 156, 0.2);
    --stat-car-movement-border-accent: rgba(96, 189, 156, 0.6);
    --stat-car-movement-shadow: rgba(96, 189, 156, 0.08);

    /* Repair Orders - Orange soft */
    --stat-repair-orders-bg-start: rgba(237, 167, 85, 0.1);
    --stat-repair-orders-bg-mid: rgba(243, 195, 135, 0.15);
    --stat-repair-orders-bg-end: rgba(254, 250, 244, 0.1);
    --stat-repair-orders-border: rgba(237, 167, 85, 0.2);
    --stat-repair-orders-border-accent: rgba(237, 167, 85, 0.6);
    --stat-repair-orders-shadow: rgba(237, 167, 85, 0.08);

    /* Last Contract - Purple soft */
    --stat-last-contract-bg-start: rgba(165, 140, 207, 0.1);
    --stat-last-contract-bg-mid: rgba(195, 178, 223, 0.15);
    --stat-last-contract-bg-end: rgba(248, 246, 252, 0.1);
    --stat-last-contract-border: rgba(165, 140, 207, 0.2);
    --stat-last-contract-border-accent: rgba(165, 140, 207, 0.6);
    --stat-last-contract-shadow: rgba(165, 140, 207, 0.08);

    /* Last Car Movement - Teal soft */
    --stat-last-car-movement-bg-start: rgba(102, 182, 191, 0.1);
    --stat-last-car-movement-bg-mid: rgba(148, 207, 214, 0.15);
    --stat-last-car-movement-bg-end: rgba(242, 250, 251, 0.1);
    --stat-last-car-movement-border: rgba(102, 182, 191, 0.2);
    --stat-last-car-movement-border-accent: rgba(102, 182, 191, 0.6);
    --stat-last-car-movement-shadow: rgba(102, 182, 191, 0.08);

    /* Next Maintenance - Light green */
    --stat-next-maintenance-bg-start: rgba(152, 184, 122, 0.1);
    --stat-next-maintenance-bg-mid: rgba(192, 214, 171, 0.15);
    --stat-next-maintenance-bg-end: rgba(245, 250, 242, 0.1);
    --stat-next-maintenance-border: rgba(152, 184, 122, 0.2);
    --stat-next-maintenance-border-accent: rgba(152, 184, 122, 0.6);
    --stat-next-maintenance-shadow: rgba(152, 184, 122, 0.08);

    /* Days Off - Pink soft */
    --stat-days-off-bg-start: rgba(207, 145, 168, 0.1);
    --stat-days-off-bg-mid: rgba(230, 187, 201, 0.15);
    --stat-days-off-bg-end: rgba(252, 245, 248, 0.1);
    --stat-days-off-border: rgba(207, 145, 168, 0.2);
    --stat-days-off-border-accent: rgba(207, 145, 168, 0.6);
    --stat-days-off-shadow: rgba(207, 145, 168, 0.08);

    /* Revenues - Gold soft */
    --stat-revenues-bg-start: rgba(199, 175, 102, 0.1);
    --stat-revenues-bg-mid: rgba(221, 205, 150, 0.15);
    --stat-revenues-bg-end: rgba(251, 249, 240, 0.1);
    --stat-revenues-border: rgba(199, 175, 102, 0.2);
    --stat-revenues-border-accent: rgba(199, 175, 102, 0.6);
    --stat-revenues-shadow: rgba(199, 175, 102, 0.08);

    /* Expenses - Blue gray */
    --stat-expenses-bg-start: rgba(135, 150, 178, 0.1);
    --stat-expenses-bg-mid: rgba(180, 192, 215, 0.15);
    --stat-expenses-bg-end: rgba(245, 247, 251, 0.1);
    --stat-expenses-border: rgba(135, 150, 178, 0.2);
    --stat-expenses-border-accent: rgba(135, 150, 178, 0.6);
    --stat-expenses-shadow: rgba(135, 150, 178, 0.08);

    /* Renew Insurance - Red soft */
    --stat-renew-insurance-bg-start: rgba(184, 113, 122, 0.08);
    --stat-renew-insurance-bg-mid: rgba(210, 154, 162, 0.12);
    --stat-renew-insurance-bg-end: rgba(250, 245, 246, 0.08);
    --stat-renew-insurance-border: rgba(184, 113, 122, 0.15);
    --stat-renew-insurance-border-accent: rgba(184, 113, 122, 0.4);
    --stat-renew-insurance-shadow: rgba(184, 113, 122, 0.06);

    /* Renew Operating Card - Purple gray */
    --stat-renew-operating-card-bg-start: rgba(145, 135, 165, 0.08);
    --stat-renew-operating-card-bg-mid: rgba(180, 173, 195, 0.12);
    --stat-renew-operating-card-bg-end: rgba(247, 246, 250, 0.08);
    --stat-renew-operating-card-border: rgba(145, 135, 165, 0.15);
    --stat-renew-operating-card-border-accent: rgba(145, 135, 165, 0.4);
    --stat-renew-operating-card-shadow: rgba(145, 135, 165, 0.06);

    /* Renew License - Blue gray soft */
    --stat-renew-license-bg-start: rgba(125, 145, 175, 0.08);
    --stat-renew-license-bg-mid: rgba(165, 180, 205, 0.12);
    --stat-renew-license-bg-end: rgba(245, 247, 251, 0.08);
    --stat-renew-license-border: rgba(125, 145, 175, 0.15);
    --stat-renew-license-border-accent: rgba(125, 145, 175, 0.4);
    --stat-renew-license-shadow: rgba(125, 145, 175, 0.06);

    /* Maintenance After - Green gray */
    --stat-maintenance-after-bg-start: rgba(135, 165, 140, 0.08);
    --stat-maintenance-after-bg-mid: rgba(170, 190, 175, 0.12);
    --stat-maintenance-after-bg-end: rgba(246, 249, 247, 0.08);
    --stat-maintenance-after-border: rgba(135, 165, 140, 0.15);
    --stat-maintenance-after-border-accent: rgba(135, 165, 140, 0.4);
    --stat-maintenance-after-shadow: rgba(135, 165, 140, 0.06);

    /* Maintenance Remaining - Brown gray */
    --stat-maintenance-remaining-bg-start: rgba(155, 140, 125, 0.08);
    --stat-maintenance-remaining-bg-mid: rgba(185, 175, 165, 0.12);
    --stat-maintenance-remaining-bg-end: rgba(249, 247, 246, 0.08);
    --stat-maintenance-remaining-border: rgba(155, 140, 125, 0.15);
    --stat-maintenance-remaining-border-accent: rgba(155, 140, 125, 0.4);
    --stat-maintenance-remaining-shadow: rgba(155, 140, 125, 0.06);

    /* Asset Value & Accidents - Silver blue */
    --stat-asset-value-bg-start: rgba(120, 135, 155, 0.08);
    --stat-asset-value-bg-mid: rgba(160, 170, 185, 0.12);
    --stat-asset-value-bg-end: rgba(245, 247, 250, 0.08);
    --stat-asset-value-border: rgba(120, 135, 155, 0.15);
    --stat-asset-value-border-accent: rgba(120, 135, 155, 0.4);
    --stat-asset-value-shadow: rgba(120, 135, 155, 0.06);

    /* Depreciable Value - Green gray soft */
    --stat-depreciable-value-bg-start: rgba(125, 150, 135, 0.08);
    --stat-depreciable-value-bg-mid: rgba(165, 185, 170, 0.12);
    --stat-depreciable-value-bg-end: rgba(246, 249, 247, 0.08);
    --stat-depreciable-value-border: rgba(125, 150, 135, 0.15);
    --stat-depreciable-value-border-accent: rgba(125, 150, 135, 0.4);
    --stat-depreciable-value-shadow: rgba(125, 150, 135, 0.06);

    /* Book Value - Purple gray soft */
    --stat-book-value-bg-start: rgba(140, 130, 155, 0.08);
    --stat-book-value-bg-mid: rgba(175, 170, 190, 0.12);
    --stat-book-value-bg-end: rgba(248, 247, 251, 0.08);
    --stat-book-value-border: rgba(140, 130, 155, 0.15);
    --stat-book-value-border-accent: rgba(140, 130, 155, 0.4);
    --stat-book-value-shadow: rgba(140, 130, 155, 0.06);

    /* Sale Amount - Gold gray */
    --stat-sale-amount-bg-start: rgba(165, 155, 125, 0.08);
    --stat-sale-amount-bg-mid: rgba(195, 185, 165, 0.12);
    --stat-sale-amount-bg-end: rgba(251, 249, 246, 0.08);
    --stat-sale-amount-border: rgba(165, 155, 125, 0.15);
    --stat-sale-amount-border-accent: rgba(165, 155, 125, 0.4);
    --stat-sale-amount-shadow: rgba(165, 155, 125, 0.06);

    /* ========== 🔔 ALARM COLORS ========== */
    --alarm-color: #ff6b6b;
    --alarm-hover-color: #ff4757;

    /* ========== 🎨 OTP CODE COLOR ========== */
    --otp-code-color: #068da9;
    --delete : #ff4757;



    /* ========== 📋 HTML & BODY BASE ========== */
    --html-tap-highlight-color: rgba(0, 0, 0, 0);
    --hr-border-top-color: rgba(0, 0, 0, 0.1);

    /* ========== 📊 TABLES - BASIC ========== */
    --table-striped-bg: rgba(0, 0, 0, 0.05);
    --table-hover-bg: rgba(0, 0, 0, 0.075);
    --table-active-bg: rgba(0, 0, 0, 0.075);
    --table-thead-dark-border: #454d55;

    /* Tables - Dark Mode */
    --table-dark-striped-bg: rgba(255, 255, 255, 0.05);
    --table-dark-hover-bg: rgba(255, 255, 255, 0.075);

    /* Tables - Success */
    --table-success-bg: #c3e6cb;
    --table-success-border: #8fd19e;
    --table-success-hover-bg: #b1dfbb;

    /* Tables - Info */
    --table-info-bg: #bee5eb;
    --table-info-border: #86cfda;
    --table-info-hover-bg: #abdde5;

    /* Tables - Warning */
    --table-warning-bg: #ffeeba;
    --table-warning-border: #ffdf7e;
    --table-warning-hover-bg: #ffe8a1;

    /* Tables - Danger */
    --table-danger-bg: #f5c6cb;
    --table-danger-border: #ed969e;
    --table-danger-hover-bg: #f1b0b7;

    /* Tables - Light */
    --table-light-bg: #fdfdfe;
    --table-light-border: #fbfcfc;
    --table-light-hover-bg: #ececf6;

    /* Tables - Dark */
    --table-dark-bg: #c6c8ca;
    --table-dark-border: #95999c;
    --table-dark-hover-bg: #b9bbbe;

    /* Tables - Statistics */
    --table-statistics-sales-border-bottom: #74bdff;
    --table-statistics-installment-sales-bg: #f0eeff;
    --table-statistics-installment-sales-border-bottom: #675faa;
    --table-statistics-purchases-bg: #fff6f0;
    --table-statistics-purchases-border-bottom: #ffc19b;
    --table-statistics-installment-purchases-bg: #f5fdff;
    --table-statistics-installment-purchases-border-bottom: #2adbff;

    /* ========== 🔘 BUTTONS - SECONDARY ========== */
    --btn-secondary-hover-bg: #5a6268;
    --btn-secondary-hover-border: #545b62;
    --btn-secondary-active-bg: #545b62;
    --btn-secondary-active-border: #4e555b;
    --btn-secondary-focus-shadow: rgba(130, 138, 145, 0.5);

    /* Buttons - Success */
    --btn-success-hover-bg: #218838;
    --btn-success-hover-border: #1e7e34;
    --btn-success-active-bg: #1e7e34;
    --btn-success-active-border: #1c7430;
    --btn-success-focus-shadow: rgba(72, 180, 97, 0.5);

    /* Buttons - Info */
    --btn-info-hover-bg: #138496;
    --btn-info-hover-border: #117a8b;
    --btn-info-active-bg: #117a8b;
    --btn-info-active-border: #10707f;
    --btn-info-focus-shadow: rgba(58, 176, 195, 0.5);

    /* Buttons - Warning */
    --btn-warning-hover-bg: #e0a800;
    --btn-warning-hover-border: #d39e00;
    --btn-warning-active-bg: #d39e00;
    --btn-warning-active-border: #c69500;
    --btn-warning-focus-shadow: rgba(222, 170, 12, 0.5);

    /* Buttons - Danger */
    --btn-danger-focus-bg: #bd2130;
    --btn-danger-focus-shadow: rgba(225, 83, 97, 0.5);

    /* Buttons - Light */
    --btn-light-hover-bg: #e2e6ea;
    --btn-light-hover-border: #dae0e5;
    --btn-light-active-bg: #dae0e5;
    --btn-light-active-border: #d3d9df;
    --btn-light-focus-shadow: rgba(216, 217, 219, 0.5);

    /* Buttons - Dark */
    --btn-dark-hover-bg: #23272b;
    --btn-dark-hover-border: #1d2124;
    --btn-dark-active-bg: #1d2124;
    --btn-dark-active-border: #171a1d;
    --btn-dark-focus-shadow: rgba(82, 88, 93, 0.5);

    /* Buttons - Primary */
    --btn-primary-focus-bg: #00635a;
    --btn-primary-focus-shadow: rgb(38, 136, 206);

    /* Buttons - Orange */
    --btn-orange-focus-shadow: rgb(251, 125, 20);

    /* Buttons - Outline */
    --btn-outline-primary-focus-shadow: rgba(0, 150, 136, 0.5);
    --btn-outline-secondary-focus-shadow: rgba(108, 117, 125, 0.5);
    --btn-outline-success-focus-shadow: rgba(40, 167, 69, 0.5);
    --btn-outline-info-focus-shadow: rgba(23, 162, 184, 0.5);
    --btn-outline-warning-focus-shadow: rgba(255, 193, 7, 0.5);
    --btn-outline-danger-focus-shadow: rgba(220, 53, 69, 0.5);
    --btn-outline-light-focus-shadow: rgba(248, 249, 250, 0.5);
    --btn-outline-dark-focus-shadow: rgba(52, 58, 64, 0.5);

    /* ========== 📝 FORMS & VALIDATION ========== */
    --valid-tooltip-bg: rgba(40, 167, 69, 0.9);
    --invalid-tooltip-bg: rgba(220, 53, 69, 0.9);
    --form-control-valid-shadow: rgba(40, 167, 69, 0.25);
    --form-control-invalid-shadow: rgba(220, 53, 69, 0.25);

    /* Custom Controls */
    --custom-control-valid-checked-bg: #34ce57;
    --custom-control-valid-checked-border: #34ce57;
    --custom-control-invalid-checked-bg: #e4606d;
    --custom-control-invalid-checked-border: #e4606d;
    --custom-control-active-bg: #4affee;
    --custom-control-active-border: #4affee;
    --custom-control-disabled-bg: rgba(0, 150, 136, 0.5);
    --custom-select-focus-shadow: rgba(0, 150, 136, 0.25);

    /* Custom Range */
    --custom-range-thumb-active-bg: #4affee;

    /* ========== 🎴 CARDS ========== */
    --card-border-color: rgba(0, 0, 0, 0.125);
    --card-header-bg: rgba(0, 0, 0, 0.03);
    --card-header-border: rgba(0, 0, 0, 0.125);
    --card-footer-bg: rgba(0, 0, 0, 0.03);
    --card-footer-border: rgba(0, 0, 0, 0.125);

    /* ========== 🚨 ALERTS ========== */
    /* Alert - Primary */
    --alert-primary-color: #004e47;
    --alert-primary-bg: #cceae7;
    --alert-primary-border: #b8e2de;
    --alert-primary-hr: #a6dbd6;
    --alert-primary-link: #001b19;

    /* Alert - Secondary */
    --alert-secondary-color: #383d41;
    --alert-secondary-bg: #e2e3e5;
    --alert-secondary-border: #d6d8db;
    --alert-secondary-hr: #c8cbcf;
    --alert-secondary-link: #202326;

    /* Alert - Success */
    --alert-success-color: #155724;
    --alert-success-bg: #d4edda;
    --alert-success-border: #c3e6cb;
    --alert-success-hr: #b1dfbb;
    --alert-success-link: #0b2e13;

    /* Alert - Info */
    --alert-info-color: #0c5460;
    --alert-info-bg: #d1ecf1;
    --alert-info-border: #bee5eb;
    --alert-info-hr: #abdde5;
    --alert-info-link: #062c33;

    /* Alert - Warning */
    --alert-warning-color: #856404;
    --alert-warning-bg: #fff3cd;
    --alert-warning-border: #ffeeba;
    --alert-warning-hr: #ffe8a1;
    --alert-warning-link: #533f03;

    /* Alert - Danger */
    --alert-danger-color: #721c24;
    --alert-danger-bg: #f8d7da;
    --alert-danger-border: #f5c6cb;
    --alert-danger-hr: #f1b0b7;
    --alert-danger-link: #491217;

    /* Alert - Light */
    --alert-light-color: #818182;
    --alert-light-bg: #fefefe;
    --alert-light-border: #fdfdfe;
    --alert-light-hr: #ececf6;
    --alert-light-link: #686868;

    /* Alert - Dark */
    --alert-dark-color: #1b1e21;
    --alert-dark-bg: #d6d8d9;
    --alert-dark-border: #c6c8ca;
    --alert-dark-hr: #b9bbbe;
    --alert-dark-link: #040505;

    /* ========== 🎯 BADGES ========== */
    --badge-primary-hover-bg: #00635a;
    --badge-secondary-hover-bg: #545b62;
    --badge-success-hover-bg: #1e7e34;
    --badge-info-hover-bg: #117a8b;
    --badge-warning-hover-bg: #d39e00;
    --badge-danger-hover-bg: #bd2130;
    --badge-light-hover-bg: #dae0e5;
    --badge-dark-hover-bg: #1d2124;

    /* ========== 🎨 NAVBAR ========== */
    /* Navbar Light */
    --navbar-light-brand-color: rgba(0, 0, 0, 0.9);
    --navbar-light-link-color: rgba(0, 0, 0, 0.5);
    --navbar-light-link-hover-color: rgba(0, 0, 0, 0.7);
    --navbar-light-link-disabled-color: rgba(0, 0, 0, 0.3);
    --navbar-light-link-active-color: rgba(0, 0, 0, 0.9);
    --navbar-light-toggler-color: rgba(0, 0, 0, 0.5);
    --navbar-light-toggler-border: rgba(0, 0, 0, 0.1);

    /* Navbar Dark */
    --navbar-dark-link-color: rgba(255, 255, 255, 0.5);
    --navbar-dark-link-hover-color: rgba(255, 255, 255, 0.75);
    --navbar-dark-link-disabled-color: rgba(255, 255, 255, 0.25);
    --navbar-dark-toggler-border: rgba(255, 255, 255, 0.1);

    /* ========== 🎭 MODALS ========== */
    --modal-content-border: rgba(0, 0, 0, 0.2);
    --modal-backdrop-bg: rgba(0, 0, 0, 0.5);

    /* Modern Modal */
    --modern-modal-header-bg: #f8fbfc;
    --modern-modal-header-border: #e8f1f5;
    --modern-modal-title-color: #2d3748;
    --modern-modal-title-accent: #068DA9;
    --modern-modal-body-bg: #fafbfc;
    --modern-modal-footer-bg: #ffffff;
    --modern-modal-footer-border: #e8f1f5;

    /* Bond Modal */
    --bond-modal-remaining-border: #027891;

    /* ========== 📜 DROPDOWN ========== */
    --dropdown-menu-border: rgba(0, 0, 0, 0.15);
    --dropdown-divider-bg: rgba(0, 0, 0, 0.1);
    --dropdown-item-hover-color: #16181b;

    /* ========== 🗂️ NAV TABS ========== */
    --nav-tabs-active-border-right: #ff8e25;

    /* ========== 📱 APP HEADER ========== */
    --app-header-bg: var(--bg-color-app-header);
    --app-header-border-bottom: #eee;
    --app-header-logo-color: var(--color-black);
    --app-header-logo-bg: var(--color-white);
    --app-header-logo-hover-color: var(--color-primary);

    /* ========== 🔀 APP SIDEBAR TOGGLE ========== */
    --app-sidebar-toggle-color: var(--bg-body);
    --app-sidebar-toggle-hover-color: var(--color-white);
    --app-sidebar-toggle-hover-bg: var(--color-black);

    /* ========== 🗂️ APP NAV ========== */
    --app-nav-item-color: var(--bg-body);
    --app-nav-item-hover-bg: transparent;
    --app-nav-item-hover-color: var(--bg-body);

    /* ========== 🔍 APP SEARCH ========== */
    --app-search-input-bg: rgba(255, 255, 255, 0.8);
    --app-search-input-placeholder: rgba(0, 0, 0, 0.4);
    --app-search-button-color: rgba(0, 0, 0, 0.8);

    /* ========== 🔔 APP NOTIFICATION ========== */
    --app-notification-title-bg: rgb(108, 117, 125);
    --app-notification-title-color: var(--color-white);
    --app-notification-footer-bg: #eee;
    --app-notification-content-scrollbar: rgba(0, 0, 0, 0.2);
    --app-notification-item-border: #ddd;
    --app-notification-item-hover-bg: #e0e0e0;

    /* ========== 🗂️ APP SIDEBAR ========== */
    --app-sidebar-bg: var(--bg-body);
    --app-sidebar-shadow: rgba(0, 0, 0, 0.1);
    --app-sidebar-scrollbar: rgba(0, 0, 0, 0.2);
    --app-sidebar-user-color: var(--color-white);
    --sidebar-mini-toggled-bg: #0d1214;

    /* ========== 📋 APP MENU ========== */
    --app-menu-item-color: var(--color-white);
    --app-menu-item-border: transparent;
    --app-menu-item-active-bg: var(--color-primary);
    --app-menu-item-active-border: var(--border-right-color);
    --app-menu-item-active-color: var(--color-white);
    --app-menu-item-hover-bg: transparent;
    --app-menu-item-hover-color: var(--color-white);

    /* ========== 📄 APP TITLE ========== */
    --app-title-bg: var(--bg-color-app-title);
    --app-title-shadow: rgba(0, 0, 0, 0.1);
    --app-title-btn-border: var(--border-color-app-title-btn);
    --app-title-btn-color: var(--color-app-title-btn);

    /* ========== 🎴 TILE ========== */
    --tile-bg: var(--bg-color-tile);
    --tile-border: #eaeaea;
    --tile-shadow-1: rgba(0, 0, 0, 0.14);
    --tile-shadow-2: rgba(0, 0, 0, 0.12);
    --tile-shadow-3: rgba(0, 0, 0, 0.2);
    --tile-print-border: #ddd;
    --tile-overlay-bg: rgba(255, 255, 255, 0.9);
    --tile-overlay-color: #555;
    --tile-footer-border: #ddd;

    /* ========== 🔍 SELECT2 ========== */
    --select2-rendered-color: #444;
    --select2-placeholder-color: #999;
    --select2-arrow-bg: #e1e1e1;
    --select2-arrow-border: #adadad;
    --select2-arrow-color: #888;
    --select2-disabled-bg: #eee;
    --select2-choice-bg: #e4e4e4;
    --select2-choice-remove-color: #999;
    --select2-choice-remove-hover: #333;
    --select2-search-border: #aaa;
    --select2-option-disabled: #999;
    --select2-option-selected: #ddd;
    --select2-clear-color: #888;

    /* ========== 📅 DATEPICKER ========== */
    --datepicker-dropdown-border: #ccc;
    --datepicker-dropdown-color: #333333;
    --datepicker-table-new-color: #999999;
    --datepicker-table-focused-bg: #eeeeee;
    --datepicker-table-disabled-color: #999999;
    --datepicker-table-highlighted: #d9edf7;
    --datepicker-addon-bg: #eeeeee;
    --datepicker-addon-border: #cccccc;

    /* Datepicker Range */
    --datepicker-range-bg: #eeeeee;
    --datepicker-range-border: #bbbbbb;
    --datepicker-range-focus-bg: #d5d5d5;
    --datepicker-range-focus-border: #7c7c7c;
    --datepicker-range-hover-bg: #d5d5d5;
    --datepicker-range-hover-border: #9d9d9d;
    --datepicker-range-highlighted-bg: #e4eef3;
    --datepicker-range-highlighted-border: #9dc1d3;
    --datepicker-range-today-bg: #f7ca77;
    --datepicker-range-today-border: #f1a417;

    /* ========== 💬 SWEET ALERT ========== */
    --sweet-alert-h2-color: #575757;
    --sweet-alert-p-color: #797979;
    --sweet-alert-input-color: #555;
    --sweet-alert-input-border: #ccc;
    --sweet-alert-error-container-bg: #f1f1f1;
    --sweet-alert-error-icon-color: #ea7d7d;
    --sweet-alert-error-line-color: #F27474;
    --sweet-alert-error-border: #F27474;
    --sweet-alert-error-input: #f06e57;
    --sweet-alert-warning-body-color: #F8BB86;

    /* ========== 📊 LIST GROUP ========== */
    --list-group-item-border: rgba(0, 0, 0, 0.125);

    /* List Group - Primary */
    --list-group-primary-color: #004e47;
    --list-group-primary-bg: #b8e2de;
    --list-group-primary-hover-bg: #a6dbd6;
    --list-group-primary-active-bg: #004e47;
    --list-group-primary-active-border: #004e47;

    /* List Group - Secondary */
    --list-group-secondary-color: #383d41;
    --list-group-secondary-bg: #d6d8db;
    --list-group-secondary-hover-bg: #c8cbcf;
    --list-group-secondary-active-bg: #383d41;
    --list-group-secondary-active-border: #383d41;

    /* List Group - Success */
    --list-group-success-color: #155724;
    --list-group-success-bg: #c3e6cb;
    --list-group-success-hover-bg: #b1dfbb;
    --list-group-success-active-bg: #155724;
    --list-group-success-active-border: #155724;

    /* List Group - Info */
    --list-group-info-color: #0c5460;
    --list-group-info-bg: #bee5eb;
    --list-group-info-hover-bg: #abdde5;
    --list-group-info-active-bg: #0c5460;
    --list-group-info-active-border: #0c5460;

    /* List Group - Warning */
    --list-group-warning-color: #856404;
    --list-group-warning-bg: #ffeeba;
    --list-group-warning-hover-bg: #ffe8a1;
    --list-group-warning-active-bg: #856404;
    --list-group-warning-active-border: #856404;

    /* List Group - Danger */
    --list-group-danger-color: #721c24;
    --list-group-danger-bg: #f5c6cb;
    --list-group-danger-hover-bg: #f1b0b7;
    --list-group-danger-active-bg: #721c24;
    --list-group-danger-active-border: #721c24;

    /* List Group - Light */
    --list-group-light-color: #818182;
    --list-group-light-bg: #fdfdfe;
    --list-group-light-hover-bg: #ececf6;
    --list-group-light-active-bg: #818182;
    --list-group-light-active-border: #818182;

    /* List Group - Dark */
    --list-group-dark-color: #1b1e21;
    --list-group-dark-bg: #c6c8ca;
    --list-group-dark-hover-bg: #b9bbbe;
    --list-group-dark-active-bg: #1b1e21;
    --list-group-dark-active-border: #1b1e21;

    /* ========== 💡 POPOVER ========== */
    --popover-border: rgba(0, 0, 0, 0.2);
    --popover-arrow-color: rgba(0, 0, 0, 0.25);
    --popover-header-bg: #f7f7f7;
    --popover-header-border: #ebebeb;
    --popover-shadow: rgba(0, 0, 0, 0.15);

    /* ========== 🎡 WIDGET ========== */
    --widget-small-shadow: rgba(0, 0, 0, 0.1);
    --widget-small-icon-bg: rgba(0, 0, 0, 0.2);
    --widget-small-primary-icon-color: #2a2a2a;
    --widget-small-info-icon-color: #2a2a2a;
    --widget-small-warning-icon-color: #2a2a2a;
    --widget-small-danger-icon-color: #2a2a2a;

    /* ========== 📈 STATISTICS CARDS ========== */
    --statistics-shadow: rgba(0, 0, 0, 0.04);
    --statistics-border: rgba(255, 255, 255, 0.2);
    --statistics-before-bg: rgba(255, 255, 255, 0.4);
    --statistics-hover-shadow: rgba(0, 0, 0, 0.06);

    /* Statistics - Total Sales */
    --statistics-total-sales-border: #bcdfff;

    /* Statistics - Total Purchases */
    --statistics-total-purchases-bg: #fff6f0;
    --statistics-total-purchases-border: #ffe4d4;

    /* Statistics - Cash Account */
    --statistics-cash-account-bg: #caf6ff;
    --statistics-cash-account-border: #91ecff;

    /* Statistics - Sale Return */
    --statistics-sale-return-bg: #f6efff;
    --statistics-sale-return-border: #d69bff;

    /* Statistics - Operation Cards */
    --statistics-operation-cards-border: rgba(6, 141, 169, 0.2);
    --statistics-operation-cards-border-right: rgba(6, 141, 169, 0.6);
    --statistics-operation-cards-hover-shadow: rgba(6, 141, 169, 0.08);

    /* Statistics - Car Forms */
    --statistics-car-forms-border: rgba(64, 224, 208, 0.2);
    --statistics-car-forms-border-right: rgba(72, 209, 204, 0.6);
    --statistics-car-forms-hover-shadow: rgba(64, 224, 208, 0.08);

    /* Statistics - Car Insurance */
    --statistics-car-insurance-border: rgba(147, 112, 219, 0.2);
    --statistics-car-insurance-border-right: rgba(138, 43, 226, 0.6);
    --statistics-car-insurance-hover-shadow: rgba(147, 112, 219, 0.08);

    /* Statistics - Periodic Inspection */
    --statistics-periodic-inspection-border: rgba(154, 205, 50, 0.2);
    --statistics-periodic-inspection-border-right: rgba(124, 252, 0, 0.6);
    --statistics-periodic-inspection-hover-shadow: rgba(154, 205, 50, 0.08);

    /* Statistics - Tracking Devices */
    --statistics-tracking-devices-border: rgba(255, 142, 37, 0.2);
    --statistics-tracking-devices-border-right: rgba(255, 140, 0, 0.6);
    --statistics-tracking-devices-hover-shadow: rgba(255, 142, 37, 0.08);

    /* Statistics - Cars */
    --statistics-cars-border: rgba(255, 20, 147, 0.2);
    --statistics-cars-border-right: rgba(255, 105, 180, 0.6);
    --statistics-cars-hover-shadow: rgba(255, 20, 147, 0.08);

    /* Statistics - Last Car Movement */
    --statistics-last-car-movement-border: rgba(102, 182, 191, 0.2);
    --statistics-last-car-movement-border-right: rgba(102, 182, 191, 0.6);
    --statistics-last-car-movement-hover-shadow: rgba(102, 182, 191, 0.08);

    /* Statistics - Next Maintenance */
    --statistics-next-maintenance-border: rgba(152, 184, 122, 0.2);
    --statistics-next-maintenance-border-right: rgba(152, 184, 122, 0.6);
    --statistics-next-maintenance-hover-shadow: rgba(152, 184, 122, 0.08);

    /* Statistics - Days Off */
    --statistics-days-off-border: rgba(207, 145, 168, 0.2);
    --statistics-days-off-border-right: rgba(207, 145, 168, 0.6);
    --statistics-days-off-hover-shadow: rgba(207, 145, 168, 0.08);

    /* Statistics - Revenues */
    --statistics-revenues-border: rgba(199, 175, 102, 0.2);
    --statistics-revenues-border-right: rgba(199, 175, 102, 0.6);
    --statistics-revenues-hover-shadow: rgba(199, 175, 102, 0.08);

    /* Statistics - Expenses */
    --statistics-expenses-border: rgba(135, 150, 178, 0.2);
    --statistics-expenses-border-right: rgba(135, 150, 178, 0.6);
    --statistics-expenses-hover-shadow: rgba(135, 150, 178, 0.08);

    /* Statistics - Renew Insurance */
    --statistics-renew-insurance-border: rgba(184, 113, 122, 0.15);
    --statistics-renew-insurance-border-right: rgba(184, 113, 122, 0.4);
    --statistics-renew-insurance-hover-shadow: rgba(184, 113, 122, 0.06);

    /* Statistics - Renew Operating Card */
    --statistics-renew-operating-card-border: rgba(145, 135, 165, 0.15);
    --statistics-renew-operating-card-border-right: rgba(145, 135, 165, 0.4);
    --statistics-renew-operating-card-hover-shadow: rgba(145, 135, 165, 0.06);

    /* Statistics - Renew License */
    --statistics-renew-license-border: rgba(125, 145, 175, 0.15);
    --statistics-renew-license-border-right: rgba(125, 145, 175, 0.4);
    --statistics-renew-license-hover-shadow: rgba(125, 145, 175, 0.06);

    /* Statistics - Maintenance After */
    --statistics-maintenance-after-border: rgba(135, 165, 140, 0.15);
    --statistics-maintenance-after-border-right: rgba(135, 165, 140, 0.4);
    --statistics-maintenance-after-hover-shadow: rgba(135, 165, 140, 0.06);

    /* Statistics - Maintenance Remaining */
    --statistics-maintenance-remaining-border: rgba(155, 140, 125, 0.15);
    --statistics-maintenance-remaining-border-right: rgba(155, 140, 125, 0.4);
    --statistics-maintenance-remaining-hover-shadow: rgba(155, 140, 125, 0.06);

    /* Statistics - Asset Value & Accidents */
    --statistics-accidents-hover-shadow: rgba(120, 135, 155, 0.06);

    /* Statistics - Depreciable Value */
    --statistics-depreciable-value-border: rgba(125, 150, 135, 0.15);
    --statistics-depreciable-value-border-right: rgba(125, 150, 135, 0.4);
    --statistics-depreciable-value-hover-shadow: rgba(125, 150, 135, 0.06);

    /* Statistics - Book Value */
    --statistics-book-value-border: rgba(140, 130, 155, 0.15);
    --statistics-book-value-border-right: rgba(140, 130, 155, 0.4);
    --statistics-book-value-hover-shadow: rgba(140, 130, 155, 0.06);

    /* Statistics - Sale Amount */
    --statistics-sale-amount-border: rgba(165, 155, 125, 0.15);
    --statistics-sale-amount-border-right: rgba(165, 155, 125, 0.4);
    --statistics-sale-amount-hover-shadow: rgba(165, 155, 125, 0.06);

    /* ========== 📧 MAIL ========== */
    --mailbox-controls-border-bottom: #ddd;
    --mail-nav-link-color: #2a2a2a;

    /* ========== 💬 MESSAGES ========== */
    --dropzone-message-color: rgba(0, 0, 0, 0.3);
    --dropzone-error-message-bg: #be2626;
    --dropzone-error-message-border: #be2626;
    --messenger-message-info-bg: #ddd;
    --messenger-message-info-border: #ddd;

    /* ========== 🔐 LOGIN ========== */
    --login-box-shadow: rgba(128, 128, 128, 0.04);
    --login-head-border-bottom: #ddd;
    --login-label-color: #666;

    /* ========== 📋 PAGINATION ========== */
    --pagination-nav-border: #ccc;

    /* ========== 🎯 NAV HEAD ========== */
    --nav-head-color: #eee;
    --nav-head-bg: #eee;
    --nav-head-link-color: #1f2224;

    /* ========== 💻 CODEMIRROR ========== */
    --codemirror-border: #ddd;

    /* ========== 📁 DROPZONE ========== */
    --dropzone-preview-file-bg: #999;
    --dropzone-progress-border: #aaa;
    --dropzone-progress-bg: rgba(255, 255, 255, 0.9);
    --dropzone-progress-upload-bg: #333;
    --dropzone-filename-hover-border: rgba(200, 200, 200, 0.8);
    --dropzone-filename-hover-bg: rgba(255, 255, 255, 0.8);
    --dropzone-filename-span-bg: rgba(255, 255, 255, 0.4);

    /* ========== ✅ CHECKBOX & RADIO ========== */
    --checkbox-disabled-color: #ccc;
    --radio-disabled-color: #ccc;
    --toggle-disabled-color: #ccc;
    --toggle-flip-bg: #ddd;
    --toggle-flip-disabled-color: #ccc;

    /* ========== 👤 USER PROFILE ========== */
    --user-profile-info-bg: #404040;
    --user-timeline-post-shadow: rgba(0, 0, 0, 0.14);
    --user-timeline-post-utility-color: #555;

    /* ========== 🎨 FULLCALENDAR POPOVER ========== */
    --fc-unthemed-popover-border: #ddd;
    --fc-unthemed-popover-header-bg: #eee;
    --fc-unthemed-popover-close-color: #666;
}

:root {
    --bg-color-statistics-total-sales: aliceblue;
    --border-color-statistics-total-sales: #bcdfff;

    --bg-color-statistics-total-purchases: #fff6f0;
    --border-color-statistics-total-purchases: #ffe4d4;

    --bg-color-statistics-cash-account: #caf6ff;
    --border-color-statistics-cash-account: #91ecff;

    --bg-color-task: #f9f3f3;
    --border-right-color-task: #ffa0a0;

    --bg-color-completed-task: #f0f7ef;
    --border-right-color-completed-task: #66c858;

    --bg-color-table-statistics-sales: aliceblue;
    --border-right-color-table-statistics-sales: #74bdff;

    --bg-color-table-statistics-installment-sales: #f0eeff;
    --border-right-color-table-statistics-installment-sales: #675faa;

    --bg-color-table-statistics-purchases: #fff6f0;
    --border-right-color-table-statistics-purchases: #ffc19b;

    --bg-color-table-statistics-installment-purchases: #f5fdff;
    --border-right-color-table-statistics-installment-purchases: #2adbff;

    --bg-color-white: #F0F0F0;
    --border-bottom-color: #262626;

    --border-color-contact: #0a333c;
    --bg-color-contact: #1c1c1c;

    --color-color-1: #e6e6e6;
    --color-color-2: #ff8e25;
    --color-color-3: #0eb70e;
    --color-color-4: #da1010;
    --color-color-5: #fafbfc;
    --color-color-6: #ffffff;
    --color-color-7: #f8fbfc;
    --color-color-8: #1e7e34;
    --color-color-9: #117a8b;
    --color-color-10: #1d2124;
    --color-color-11: #494f54;
    --color-color-12: #19692c;
    --color-text-info-hover: #0f6674;
    --color-text-warning-hover: #0f6674;
    --color-text-danger: #a71d2a;
    --color-text-danger-hover: #a71d2a;
    --color-text-light-hover: #cbd3da;
    --color-text-dark-hover: #121416;
    --btn-warning-active-bg: #d39e00;
    --btn-light-active-bg: #dae0e5;
    --badge-warning-hover-bg: #d39e00;
    --badge-light-hover-bg: #dae0e5;
    --alert-primary-hr-border: #a6dbd6;
    --alert-secondary-hr-border: #c8cbcf;
    --alert-success-border: #c3e6cb;
    --alert-success-hr-border: #b1dfbb;
    --alert-info-border: #bee5eb;
    --alert-info-hr-border: #abdde5;
    --alert-warning-border: #ffeeba;
    --alert-warning-hr-border: #ffe8a1;
    --alert-danger-border: #f5c6cb;
    --alert-danger-hr-border: #f1b0b7;
    --alert-light-border: #fdfdfe;
    --alert-light-hr-border: #ececf6;
    --alert-dark-border: #c6c8ca;
    --alert-dark-hr-border: #b9bbbe;
    --list-group-item-primary-bg: #b8e2de;
    --list-group-item-primary-hover-bg: #a6dbd6;
    --list-group-item-secondary-bg: #d6d8db;
    --list-group-item-secondary-hover-bg: #c8cbcf;
    --popover-header-border-bottom: #f7f7f7;
    --popover-header-bg: #f7f7f7;
    --popover-header-border: #ebebeb;
    --bg-warning-hover: #d39e00;
    --bg-light-hover: #dae0e5;
    --datepicker-day-hover-bg: #eeeeee;
    --datepicker-highlighted-bg: #d9edf7;
    --datepicker-highlighted-border: #85c5e5;
    --datepicker-highlighted-focus-bg: #afd9ee;
    --datepicker-highlighted-focus-border: #298fc2;
    --datepicker-highlighted-hover-bg: #afd9ee;
    --datepicker-highlighted-hover-border: #52addb;
    /* Datepicker - Highlighted States */
    --datepicker-highlighted-active-bg: #afd9ee;
    --datepicker-highlighted-active-border: #52addb;
    --datepicker-highlighted-active-hover-bg: #91cbe8;
    --datepicker-highlighted-active-hover-border: #298fc2;
    --datepicker-highlighted-focused-bg: #afd9ee;
    --datepicker-highlighted-disabled-bg: #d9edf7;
    --datepicker-highlighted-disabled-border: #85c5e5;
    --datepicker-highlighted-disabled-color: #999999;

    /* Datepicker - Today States */
    --datepicker-today-bg: #ffdb99;
    --datepicker-today-border: #ffb733;
    --datepicker-today-focus-bg: #ffc966;
    --datepicker-today-focus-border: #b37400;
    --datepicker-today-hover-bg: #ffc966;
    --datepicker-today-hover-border: #f59e00;
    --datepicker-today-active-bg: #ffc966;
    --datepicker-today-active-border: #f59e00;
    --datepicker-today-active-hover-bg: #ffbc42;
    --datepicker-today-active-hover-border: #b37400;
    --datepicker-today-focused-bg: #ffc966;
    --datepicker-today-disabled-bg: #ffdb99;
    --datepicker-today-disabled-color: #999999;

    /* Datepicker - Range States */
    --datepicker-range-bg: #eeeeee;
    --datepicker-range-border: #bbbbbb;
    --datepicker-range-focus-bg: #d5d5d5;
    --datepicker-range-focus-border: #7c7c7c;
    --datepicker-range-hover-bg: #d5d5d5;
    --datepicker-range-hover-border: #9d9d9d;
    --datepicker-range-active-bg: #d5d5d5;
    --datepicker-range-active-border: #9d9d9d;
    --datepicker-range-active-hover-bg: #c3c3c3;
    --datepicker-range-active-hover-border: #7c7c7c;
    --datepicker-range-focused-bg: #d5d5d5;
    --datepicker-range-disabled-bg: #eeeeee;
    --datepicker-range-disabled-color: #999999;

    /* Datepicker - Range Highlighted */
    --datepicker-range-highlighted-bg: #e4eef3;
    --datepicker-range-highlighted-border: #9dc1d3;
    --datepicker-range-highlighted-focus-bg: #c1d7e3;
    --datepicker-range-highlighted-focus-border: #4b88a6;
    --datepicker-range-highlighted-hover-bg: #c1d7e3;
    --datepicker-range-highlighted-hover-border: #73a6c0;
    --datepicker-range-highlighted-active-bg: #c1d7e3;
    --datepicker-range-highlighted-active-border: #73a6c0;
    --datepicker-range-highlighted-active-hover-bg: #a8c8d8;
    --datepicker-range-highlighted-active-hover-border: #4b88a6;
    --datepicker-range-highlighted-focused-bg: #c1d7e3;
    --datepicker-range-highlighted-disabled-bg: #e4eef3;
    --datepicker-range-highlighted-disabled-border: #9dc1d3;
    --datepicker-range-highlighted-disabled-color: #999999;

    /* Datepicker - Range Today */
    --datepicker-range-today-bg: #f7ca77;
    --datepicker-range-today-border: #f1a417;
    --datepicker-range-today-focus-bg: #f4b747;
    --datepicker-range-today-focus-border: #815608;
    --datepicker-range-today-hover-bg: #f4b747;
    --datepicker-range-today-hover-border: #bf800c;
    --datepicker-range-today-active-bg: #f4b747;
    --datepicker-range-today-active-border: #bf800c;
    --datepicker-range-today-active-hover-bg: #f2aa25;
    --datepicker-range-today-active-hover-border: #815608;
    --datepicker-range-today-disabled-bg: #f7ca77;
    --datepicker-range-today-disabled-border: #f1a417;
    --datepicker-range-today-disabled-color: #999999;

    /* Datepicker - Selected */
    --datepicker-selected-bg: #999999;
    --datepicker-selected-border: #555555;
    --datepicker-selected-focus-bg: #808080;
    --datepicker-selected-focus-border: #161616;
    --datepicker-selected-hover-bg: #808080;
    --datepicker-selected-hover-border: #373737;
    --datepicker-selected-active-bg: #808080;
    --datepicker-selected-active-border: #373737;
    --datepicker-selected-active-hover-bg: #6e6e6e;
    --datepicker-selected-active-hover-border: #161616;
    --datepicker-selected-disabled-bg: #999999;
    --datepicker-selected-disabled-border: #555555;

    /* Datepicker - Active */
    --datepicker-active-bg: #428bca;
    --datepicker-active-border: #357ebd;
    --datepicker-active-focus-border: #193c5a;
    --datepicker-active-hover-border: #007d71;
    --datepicker-active-hover-focus-bg: #007d71;
    --datepicker-active-hover-focus-border: #193c5a;

    /* Datepicker - Span */
    --datepicker-span-hover-bg: #eeeeee;
    --datepicker-span-disabled-color: #999999;
    --datepicker-span-active-bg: #428bca;
    --datepicker-span-active-border: #357ebd;
    --datepicker-span-old-new-color: #999999;
    --input-daterange-addon-border: #cccccc;
    --sweet-alert-input-border: #ccc;
    --sweet-alert-button-hover-bg: #00877a;
    --sweet-alert-button-cancel-bg: #C1C1C1;
    --sweet-alert-button-cancel-hover-bg: #b9b9b9;
    --sweet-alert-button-cancel-active-bg: #a8a7a7;
    --sweet-alert-error-line-bg: #F27474;
    --sweet-alert-warning-border: #F8BB86;
    --sweet-alert-warning-body-bg: #F8BB86;
    --sweet-alert-warning-dot-bg: #F8BB86;
    --sweet-alert-info-border: #C9DAE1;
    --sweet-alert-info-body-bg: #C9DAE1;
    --sweet-alert-info-dot-bg: #C9DAE1;
    --sweet-alert-success-border: #A5DC86;
    --sweet-alert-success-line-bg: #A5DC86;
    --sweet-alert-pulse-warning-start: #F8D486;
    --sweet-alert-pulse-warning-end: #F8BB86;
    --notify-alert-warning-bg: #ffce3a;
    --notify-alert-danger-bg: #e04b59;
    --select2-arrow-border: #adadad;
    --select2-arrow-open-color: #888;
    --select2-search-field-border: #aaa;
    --select2-option-selected-bg: #ddd;
    --select2-option-highlighted-color: white;
    --jqvmap-label-bg: #292929;
    --jqvmap-label-color: white;
    --fc-unthemed-border: #ddd;
    --fc-unthemed-divider-bg: #eee;
    --fc-unthemed-close-color: #666;
    --fc-unthemed-today-bg: rgba(0, 150, 136, 0.2);
    --fc-highlight-bg: #bce8f1;
    --fc-highlight-opacity: 0.3;
    --fc-bgevent-bg: #8fdf82;
    --fc-bgevent-opacity: 0.3;
    --fc-nonbusiness-bg: #d7d7d7;
    --fc-state-default-bg: #f5f5f5;
    --fc-state-default-border: #bfbfbf;
    --fc-state-default-shadow-inset: rgba(255, 255, 255, 0.2);
    --fc-state-default-shadow-outer: rgba(0, 0, 0, 0.05);
    --dropzone-progress-border: #aaa;
    --dropzone-file-preview-bg: #999;
    --dropzone-file-preview-gradient-start: #eee;
    --dropzone-file-preview-gradient-end: #ddd;
    --dropzone-upload-bg: #333;
    --dropzone-upload-gradient-start: #666;
    --dropzone-upload-gradient-end: #444;
    --dropzone-error-message-bg: #be2626;
    --dropzone-error-message-gradient-start: #be2626;
    --dropzone-error-message-gradient-end: #a92222;
    --dropzone-error-message-color: white;
    --dropzone-error-message-arrow: #be2626;
    --sidebar-mini-toggled-bg: #0d1214;
    --checkbox-disabled-color: #ccc;
    --radio-disabled-color: #ccc;
    --toggle-disabled-color: #ccc;
    --toggle-flip-bg: #ddd;
    --toggle-flip-disabled-color: #ccc;
    --material-half-bg: #f7f7f7;
    --messenger-message-info-bg: #ddd;
    --messenger-message-info-arrow: #ddd;
    --landing-hero-overlay-bg: #001714;
    --landing-hero-overlay-opacity: 0.5;
    --user-profile-info-bg: #404040;
    --pagination-nav-border: #ccc;
    --btn-extra-bg: #009688;
    --btn-extra-border: #009688;
    --btn-extra-focus-shadow: rgba(130, 138, 145, 0.1);
    --btn-back-hover-bg: #1a1919;
    --btn-back-hover-border: #1a1919;
    --signature-border-color: #919191;
    --nav-head-link-color: #1f2224;
    --legend-title-bg: #1f2224;
    --bond-modal-remaining-border: #027891;
    --statistics-sale-return-bg: #f6efff;
    --statistics-sale-return-border: #d69bff;
    --modern-modal-header-gradient-start: #f8fbfc;
    --modern-modal-header-gradient-end: #ffffff;
    --modern-modal-title-icon-gradient-start: #068DA9;
    --modern-modal-title-icon-gradient-end: #0ab8d9;
    --modern-modal-title-icon-bg-start: #068DA9;
    --modern-modal-title-icon-bg-end: #0ab8d9;
    --modern-modal-title-icon-color: white;
    --modern-modal-title-icon-shadow: rgba(6, 141, 169, 0.15);
}

:root {
    --color-app-nav__item: #13161a;
    --bg-color-dropdown-menu: #FFF;
    --color-dropdown-menu: #212529;
    --bg-color-form-control: #FFF;
}


/* ===================================
   🌙 DARK MODE - PROFESSIONAL THEME
   Modern & Elegant Dark Colors
   =================================== */

.dark-mode {
    /* ========== 🎨 CORE COLORS OVERRIDE ========== */
    --color-primary: #0ab8d9;
    --color-primary-hover: #12d4f7;
    --color-primary-light: rgba(10, 184, 217, 0.15);
    --color-primary-dark: #088fa6;
    --border-right-color: #FF9E44;

    /* ========== 🌑 BACKGROUND COLORS ========== */
    --bg-color-app-content: #1a1d23;
    --bg-color-app-header: #1e2228;
    --bg-color-app-title: #23262d;
    --bg-color-tile: #23262d;
    --bg-color-mark: #3d3416;
    --bg-color-table-primary: #1a3d3a;
    --border-color-table-primary: #2a5d5a;

    --color-app-title-btn: #e4e4e4;
    --border-color-app-title-btn: #3a3d44;

    --bg-body: #13161a;
    --bg-light: #23262d;
    --bg-dark: #0d0f12;
    --bg-white: #23262d;

    /* ========== 📝 TEXT COLORS ========== */
    --text-primary: #e4e6eb;
    --text-secondary: #a8adb8;
    --text-muted: #8a8f9c;
    --text-white: #f5f6f8;
    --text-dark: #e4e6eb;
    --text-light: #a8adb8;

    /* ========== ⚫ GRAYSCALE COLORS ========== */
    --color-white: #e4e6eb;
    --color-gray-100: #2a2d35;
    --color-gray-200: #32353d;
    --color-gray-300: #3a3d45;
    --color-gray-400: #4a4d55;
    --color-gray-500: #5a5d65;
    --color-gray-600: #7a7d85;
    --color-gray-700: #9a9da5;
    --color-gray-800: #babdc5;
    --color-gray-900: #e4e6eb;
    --color-black: #f5f6f8;

    /* ========== 🔗 LINK COLORS ========== */
    --link-color: #0ab8d9;
    --link-hover-color: #12d4f7;

    /* ========== 🔲 BORDER COLORS ========== */
    --border-color: #3a3d45;
    --border-light: rgba(255, 255, 255, 0.08);
    --border-dark: rgba(0, 0, 0, 0.3);

    /* ========== 💫 SHADOWS ========== */
    --shadow-xs: 0 1px 2px 0 rgba(0, 0, 0, 0.3);
    --shadow-sm: 0 1px 3px 0 rgba(0, 0, 0, 0.4), 0 1px 2px 0 rgba(0, 0, 0, 0.3);
    --shadow-base: 0 4px 6px -1px rgba(0, 0, 0, 0.5), 0 2px 4px -1px rgba(0, 0, 0, 0.4);
    --shadow-md: 0 10px 15px -3px rgba(0, 0, 0, 0.5), 0 4px 6px -2px rgba(0, 0, 0, 0.4);
    --shadow-lg: 0 20px 25px -5px rgba(0, 0, 0, 0.6), 0 10px 10px -5px rgba(0, 0, 0, 0.5);
    --shadow-xl: 0 25px 50px -12px rgba(0, 0, 0, 0.7);
    --shadow-2xl: 0 35px 60px -15px rgba(0, 0, 0, 0.8);
    --shadow-inner: inset 0 2px 4px 0 rgba(0, 0, 0, 0.3);

    /* ========== 📋 HTML & BODY BASE ========== */
    --html-tap-highlight-color: rgba(255, 255, 255, 0.1);
    --hr-border-top-color: rgba(255, 255, 255, 0.08);

    /* ========== 📊 TABLES - BASIC ========== */
    --table-striped-bg: rgba(255, 255, 255, 0.02);
    --table-hover-bg: rgba(255, 255, 255, 0.04);
    --table-active-bg: rgba(255, 255, 255, 0.06);
    --table-thead-dark-border: #3a3d45;

    /* Tables - Dark Mode */
    --table-dark-striped-bg: rgba(255, 255, 255, 0.03);
    --table-dark-hover-bg: rgba(255, 255, 255, 0.05);

    /* Tables - Success */
    --table-success-bg: #1a3d2a;
    --table-success-border: #2a5d4a;
    --table-success-hover-bg: #234d36;

    /* Tables - Info */
    --table-info-bg: #1a353d;
    --table-info-border: #2a555d;
    --table-info-hover-bg: #234550;

    /* Tables - Warning */
    --table-warning-bg: #3d3416;
    --table-warning-border: #5d5426;
    --table-warning-hover-bg: #4d4420;

    /* Tables - Danger */
    --table-danger-bg: #3d1a1f;
    --table-danger-border: #5d2a3a;
    --table-danger-hover-bg: #4d242d;

    /* Tables - Light */
    --table-light-bg: #2a2d35;
    --table-light-border: #3a3d45;
    --table-light-hover-bg: #32353d;

    /* Tables - Dark */
    --table-dark-bg: #1a1d23;
    --table-dark-border: #2a2d35;
    --table-dark-hover-bg: #23262d;

    /* ========== 🔘 BUTTONS ========== */
    --btn-secondary-hover-bg: #4a4d55;
    --btn-secondary-hover-border: #3a3d45;
    --btn-secondary-active-bg: #3a3d45;
    --btn-secondary-active-border: #2a2d35;
    --btn-secondary-focus-shadow: rgba(90, 93, 101, 0.5);

    --btn-success-hover-bg: #2a7a47;
    --btn-success-hover-border: #237a3f;
    --btn-success-active-bg: #237a3f;
    --btn-success-active-border: #1d6a35;

    --btn-info-hover-bg: #1a9aaa;
    --btn-info-hover-border: #178a9a;
    --btn-info-active-bg: #178a9a;
    --btn-info-active-border: #147a8a;

    --btn-warning-hover-bg: #e5a900;
    --btn-warning-hover-border: #d59900;
    --btn-warning-active-bg: #d59900;
    --btn-warning-active-border: #c58900;

    --btn-danger-focus-bg: #c52a3a;

    --btn-light-hover-bg: #3a3d45;
    --btn-light-hover-border: #4a4d55;
    --btn-light-active-bg: #4a4d55;
    --btn-light-active-border: #5a5d65;

    --btn-dark-hover-bg: #2a2d35;
    --btn-dark-hover-border: #1a1d23;
    --btn-dark-active-bg: #1a1d23;
    --btn-dark-active-border: #13161a;

    --btn-primary-focus-bg: #0ab8d9;

    /* ========== 📝 FORMS & VALIDATION ========== */
    --valid-tooltip-bg: rgba(42, 167, 89, 0.95);
    --invalid-tooltip-bg: rgba(220, 53, 69, 0.95);

    --custom-control-valid-checked-bg: #3ace67;
    --custom-control-valid-checked-border: #3ace67;
    --custom-control-invalid-checked-bg: #e4707d;
    --custom-control-invalid-checked-border: #e4707d;
    --custom-control-active-bg: #0ab8d9;
    --custom-control-active-border: #0ab8d9;
    --custom-control-disabled-bg: rgba(10, 184, 217, 0.3);
    --custom-range-thumb-active-bg: #0ab8d9;

    /* ========== 🎴 CARDS ========== */
    --card-border-color: rgba(255, 255, 255, 0.08);
    --card-header-bg: rgba(255, 255, 255, 0.02);
    --card-header-border: rgba(255, 255, 255, 0.08);
    --card-footer-bg: rgba(255, 255, 255, 0.02);
    --card-footer-border: rgba(255, 255, 255, 0.08);

    /* ========== 🚨 ALERTS ========== */
    /* Alert - Primary */
    --alert-primary-color: #12d4f7;
    --alert-primary-bg: #1a353d;
    --alert-primary-border: #2a555d;
    --alert-primary-hr: #234550;
    --alert-primary-link: #0ab8d9;

    /* Alert - Secondary */
    --alert-secondary-color: #b8bbc5;
    --alert-secondary-bg: #2a2d35;
    --alert-secondary-border: #3a3d45;
    --alert-secondary-hr: #32353d;
    --alert-secondary-link: #c8cbd5;

    /* Alert - Success */
    --alert-success-color: #4dff88;
    --alert-success-bg: #1a3d2a;
    --alert-success-border: #2a5d4a;
    --alert-success-hr: #234d36;
    --alert-success-link: #3ace67;

    /* Alert - Info */
    --alert-info-color: #4dddff;
    --alert-info-bg: #1a353d;
    --alert-info-border: #2a555d;
    --alert-info-hr: #234550;
    --alert-info-link: #3accee;

    /* Alert - Warning */
    --alert-warning-color: #ffcc44;
    --alert-warning-bg: #3d3416;
    --alert-warning-border: #5d5426;
    --alert-warning-hr: #4d4420;
    --alert-warning-link: #f5bb33;

    /* Alert - Danger */
    --alert-danger-color: #ff5566;
    --alert-danger-bg: #3d1a1f;
    --alert-danger-border: #5d2a3a;
    --alert-danger-hr: #4d242d;
    --alert-danger-link: #ff4455;

    /* Alert - Light */
    --alert-light-color: #e4e6eb;
    --alert-light-bg: #2a2d35;
    --alert-light-border: #3a3d45;
    --alert-light-hr: #32353d;
    --alert-light-link: #f5f6f8;

    /* Alert - Dark */
    --alert-dark-color: #a8adb8;
    --alert-dark-bg: #1a1d23;
    --alert-dark-border: #2a2d35;
    --alert-dark-hr: #23262d;
    --alert-dark-link: #b8bdc8;

    /* ========== 🎯 BADGES ========== */
    --badge-primary-hover-bg: #0ab8d9;
    --badge-secondary-hover-bg: #4a4d55;
    --badge-success-hover-bg: #2a7a47;
    --badge-info-hover-bg: #1a9aaa;
    --badge-warning-hover-bg: #d59900;
    --badge-danger-hover-bg: #c52a3a;
    --badge-light-hover-bg: #4a4d55;
    --badge-dark-hover-bg: #1a1d23;

    /* ========== 🎨 NAVBAR ========== */
    --navbar-light-brand-color: rgba(255, 255, 255, 0.9);
    --navbar-light-link-color: rgba(255, 255, 255, 0.7);
    --navbar-light-link-hover-color: rgba(255, 255, 255, 0.95);
    --navbar-light-link-disabled-color: rgba(255, 255, 255, 0.3);
    --navbar-light-link-active-color: rgba(255, 255, 255, 1);
    --navbar-light-toggler-color: rgba(255, 255, 255, 0.7);
    --navbar-light-toggler-border: rgba(255, 255, 255, 0.08);

    --navbar-dark-link-color: rgba(255, 255, 255, 0.7);
    --navbar-dark-link-hover-color: rgba(255, 255, 255, 0.95);
    --navbar-dark-link-disabled-color: rgba(255, 255, 255, 0.3);
    --navbar-dark-toggler-border: rgba(255, 255, 255, 0.08);

    /* ========== 🎭 MODALS ========== */
    --modal-content-border: rgba(255, 255, 255, 0.12);
    --modal-backdrop-bg: rgba(0, 0, 0, 0.7);

    --modern-modal-header-bg: #23262d;
    --modern-modal-header-border: #3a3d45;
    --modern-modal-title-color: #e4e6eb;
    --modern-modal-title-accent: #0ab8d9;
    --modern-modal-body-bg: #1e2228;
    --modern-modal-footer-bg: #23262d;
    --modern-modal-footer-border: #3a3d45;

    --bond-modal-remaining-border: #0ab8d9;

    /* ========== 📜 DROPDOWN ========== */
    --dropdown-menu-border: rgba(255, 255, 255, 0.12);
    --dropdown-divider-bg: rgba(255, 255, 255, 0.08);
    --dropdown-item-hover-color: #f5f6f8;

    /* ========== 🗂️ NAV TABS ========== */
    --nav-tabs-active-border-right: #FF9E44;

    /* ========== 📱 APP HEADER ========== */
    --app-header-bg: #1e2228;
    --app-header-border-bottom: #3a3d45;
    --app-header-logo-color: #e4e6eb;
    --app-header-logo-bg: #23262d;
    --app-header-logo-hover-color: #0ab8d9;

    /* ========== 🔀 APP SIDEBAR TOGGLE ========== */
    --app-sidebar-toggle-color: #e4e6eb;
    --app-sidebar-toggle-hover-color: #0ab8d9;
    --app-sidebar-toggle-hover-bg: #2a2d35;

    /* ========== 🗂️ APP NAV ========== */
    --app-nav-item-color: #e4e6eb;
    --app-nav-item-hover-bg: rgba(255, 255, 255, 0.05);
    --app-nav-item-hover-color: #0ab8d9;

    /* ========== 🔍 APP SEARCH ========== */
    --app-search-input-bg: rgba(255, 255, 255, 0.08);
    --app-search-input-placeholder: rgba(255, 255, 255, 0.4);
    --app-search-button-color: rgba(255, 255, 255, 0.7);

    /* ========== 🔔 APP NOTIFICATION ========== */
    --app-notification-title-bg: #2a2d35;
    --app-notification-title-color: #e4e6eb;
    --app-notification-footer-bg: #2a2d35;
    --app-notification-content-scrollbar: rgba(255, 255, 255, 0.2);
    --app-notification-item-border: #3a3d45;
    --app-notification-item-hover-bg: #32353d;

    /* ========== 🗂️ APP SIDEBAR ========== */
    --app-sidebar-bg: #13161a;
    --app-sidebar-shadow: rgba(0, 0, 0, 0.5);
    --app-sidebar-scrollbar: rgba(255, 255, 255, 0.2);
    --app-sidebar-user-color: #e4e6eb;
    --sidebar-mini-toggled-bg: #1a1d23;

    /* ========== 📋 APP MENU ========== */
    --app-menu-item-color: #a8adb8;
    --app-menu-item-border: transparent;
    --app-menu-item-active-bg: #0ab8d9;
    --app-menu-item-active-border: #FF9E44;
    --app-menu-item-active-color: #ffffff;
    --app-menu-item-hover-bg: rgba(10, 184, 217, 0.1);
    --app-menu-item-hover-color: #0ab8d9;

    /* ========== 📄 APP TITLE ========== */
    --app-title-bg: #23262d;
    --app-title-shadow: rgba(0, 0, 0, 0.3);
    --app-title-btn-border: #3a3d45;
    --app-title-btn-color: #e4e6eb;

    /* ========== 🎴 TILE ========== */
    --tile-bg: #23262d;
    --tile-border: #3a3d45;
    --tile-shadow-1: rgba(0, 0, 0, 0.3);
    --tile-shadow-2: rgba(0, 0, 0, 0.25);
    --tile-shadow-3: rgba(0, 0, 0, 0.4);
    --tile-print-border: #3a3d45;
    --tile-overlay-bg: rgba(26, 29, 35, 0.95);
    --tile-overlay-color: #e4e6eb;
    --tile-footer-border: #3a3d45;

    /* ========== 🔍 SELECT2 ========== */
    --select2-rendered-color: #e4e6eb;
    --select2-placeholder-color: #8a8f9c;
    --select2-arrow-bg: #3a3d45;
    --select2-arrow-border: #4a4d55;
    --select2-arrow-color: #a8adb8;
    --select2-disabled-bg: #2a2d35;
    --select2-choice-bg: #3a3d45;
    --select2-choice-remove-color: #a8adb8;
    --select2-choice-remove-hover: #e4e6eb;
    --select2-search-border: #4a4d55;
    --select2-option-disabled: #8a8f9c;
    --select2-option-selected: #3a3d45;
    --select2-clear-color: #a8adb8;

    /* ========== 📅 DATEPICKER ========== */
    --datepicker-dropdown-border: #3a3d45;
    --datepicker-dropdown-color: #e4e6eb;
    --datepicker-table-new-color: #8a8f9c;
    --datepicker-table-focused-bg: #2a2d35;
    --datepicker-table-disabled-color: #5a5d65;
    --datepicker-table-highlighted: #1a353d;
    --datepicker-addon-bg: #2a2d35;
    --datepicker-addon-border: #3a3d45;

    --datepicker-range-bg: #2a2d35;
    --datepicker-range-border: #4a4d55;
    --datepicker-range-focus-bg: #32353d;
    --datepicker-range-focus-border: #5a5d65;
    --datepicker-range-hover-bg: #32353d;
    --datepicker-range-hover-border: #5a5d65;
    --datepicker-range-highlighted-bg: #1a353d;
    --datepicker-range-highlighted-border: #2a555d;
    --datepicker-range-today-bg: #3d3416;
    --datepicker-range-today-border: #5d5426;

    /* ========== 💬 SWEET ALERT ========== */
    --sweet-alert-h2-color: #e4e6eb;
    --sweet-alert-p-color: #a8adb8;
    --sweet-alert-input-color: #e4e6eb;
    --sweet-alert-input-border: #3a3d45;
    --sweet-alert-error-container-bg: #2a2d35;
    --sweet-alert-error-icon-color: #ff5566;
    --sweet-alert-error-line-color: #ff5566;
    --sweet-alert-error-border: #ff5566;
    --sweet-alert-error-input: #ff5566;
    --sweet-alert-warning-body-color: #ffcc44;

    /* ========== 📊 LIST GROUP ========== */
    --list-group-item-border: rgba(255, 255, 255, 0.08);

    --list-group-primary-color: #12d4f7;
    --list-group-primary-bg: #1a353d;
    --list-group-primary-hover-bg: #234550;
    --list-group-primary-active-bg: #0ab8d9;
    --list-group-primary-active-border: #0ab8d9;

    --list-group-secondary-color: #b8bbc5;
    --list-group-secondary-bg: #2a2d35;
    --list-group-secondary-hover-bg: #32353d;
    --list-group-secondary-active-bg: #4a4d55;
    --list-group-secondary-active-border: #4a4d55;

    --list-group-success-color: #4dff88;
    --list-group-success-bg: #1a3d2a;
    --list-group-success-hover-bg: #234d36;
    --list-group-success-active-bg: #2a7a47;
    --list-group-success-active-border: #2a7a47;

    --list-group-info-color: #4dddff;
    --list-group-info-bg: #1a353d;
    --list-group-info-hover-bg: #234550;
    --list-group-info-active-bg: #1a9aaa;
    --list-group-info-active-border: #1a9aaa;

    --list-group-warning-color: #ffcc44;
    --list-group-warning-bg: #3d3416;
    --list-group-warning-hover-bg: #4d4420;
    --list-group-warning-active-bg: #d59900;
    --list-group-warning-active-border: #d59900;

    --list-group-danger-color: #ff5566;
    --list-group-danger-bg: #3d1a1f;
    --list-group-danger-hover-bg: #4d242d;
    --list-group-danger-active-bg: #c52a3a;
    --list-group-danger-active-border: #c52a3a;

    --list-group-light-color: #e4e6eb;
    --list-group-light-bg: #2a2d35;
    --list-group-light-hover-bg: #32353d;
    --list-group-light-active-bg: #4a4d55;
    --list-group-light-active-border: #4a4d55;

    --list-group-dark-color: #a8adb8;
    --list-group-dark-bg: #1a1d23;
    --list-group-dark-hover-bg: #23262d;
    --list-group-dark-active-bg: #2a2d35;
    --list-group-dark-active-border: #2a2d35;

    /* ========== 💡 POPOVER ========== */
    --popover-border: rgba(255, 255, 255, 0.12);
    --popover-arrow-color: rgba(255, 255, 255, 0.15);
    --popover-header-bg: #2a2d35;
    --popover-header-border: #3a3d45;
    --popover-shadow: rgba(0, 0, 0, 0.5);

    /* ========== 🎡 WIDGET ========== */
    --widget-small-shadow: rgba(0, 0, 0, 0.3);
    --widget-small-icon-bg: rgba(255, 255, 255, 0.1);
    --widget-small-primary-icon-color: #0ab8d9;
    --widget-small-info-icon-color: #4dddff;
    --widget-small-warning-icon-color: #ffcc44;
    --widget-small-danger-icon-color: #ff5566;

    /* ========== 📈 STATISTICS CARDS ========== */
    --statistics-shadow: rgba(0, 0, 0, 0.15);
    --statistics-border: rgba(255, 255, 255, 0.08);
    --statistics-before-bg: rgba(255, 255, 255, 0.05);
    --statistics-hover-shadow: rgba(0, 0, 0, 0.25);

    /* Statistics - Total Sales */
    --statistics-total-sales-border: #2a4d6d;

    /* Statistics - Total Purchases */
    --statistics-total-purchases-bg: #3d2616;
    --statistics-total-purchases-border: #5d3626;

    /* Statistics - Cash Account */
    --statistics-cash-account-bg: #1a3d4d;
    --statistics-cash-account-border: #2a5d6d;

    /* Statistics - Sale Return */
    --statistics-sale-return-bg: #2d1a3d;
    --statistics-sale-return-border: #4d2a6d;

    /* Statistics - Operation Cards */
    --statistics-operation-cards-border: rgba(10, 184, 217, 0.3);
    --statistics-operation-cards-border-right: rgba(10, 184, 217, 0.8);
    --statistics-operation-cards-hover-shadow: rgba(10, 184, 217, 0.15);

    /* Statistics - Car Forms */
    --statistics-car-forms-border: rgba(100, 255, 218, 0.3);
    --statistics-car-forms-border-right: rgba(100, 255, 218, 0.8);
    --statistics-car-forms-hover-shadow: rgba(100, 255, 218, 0.15);

    /* Statistics - Car Insurance */
    --statistics-car-insurance-border: rgba(177, 132, 255, 0.3);
    --statistics-car-insurance-border-right: rgba(177, 132, 255, 0.8);
    --statistics-car-insurance-hover-shadow: rgba(177, 132, 255, 0.15);

    /* Statistics - Periodic Inspection */
    --statistics-periodic-inspection-border: rgba(184, 255, 80, 0.3);
    --statistics-periodic-inspection-border-right: rgba(184, 255, 80, 0.8);
    --statistics-periodic-inspection-hover-shadow: rgba(184, 255, 80, 0.15);

    /* Statistics - Tracking Devices */
    --statistics-tracking-devices-border: rgba(255, 162, 67, 0.3);
    --statistics-tracking-devices-border-right: rgba(255, 162, 67, 0.8);
    --statistics-tracking-devices-hover-shadow: rgba(255, 162, 67, 0.15);

    /* Statistics - Cars */
    --statistics-cars-border: rgba(255, 80, 177, 0.3);
    --statistics-cars-border-right: rgba(255, 80, 177, 0.8);
    --statistics-cars-hover-shadow: rgba(255, 80, 177, 0.15);

    /* Statistics - Last Car Movement */
    --statistics-last-car-movement-border: rgba(132, 212, 221, 0.3);
    --statistics-last-car-movement-border-right: rgba(132, 212, 221, 0.8);
    --statistics-last-car-movement-hover-shadow: rgba(132, 212, 221, 0.15);

    /* Statistics - Next Maintenance */
    --statistics-next-maintenance-border: rgba(182, 214, 152, 0.3);
    --statistics-next-maintenance-border-right: rgba(182, 214, 152, 0.8);
    --statistics-next-maintenance-hover-shadow: rgba(182, 214, 152, 0.15);

    /* Statistics - Days Off */
    --statistics-days-off-border: rgba(237, 175, 198, 0.3);
    --statistics-days-off-border-right: rgba(237, 175, 198, 0.8);
    --statistics-days-off-hover-shadow: rgba(237, 175, 198, 0.15);

    /* Statistics - Revenues */
    --statistics-revenues-border: rgba(229, 205, 132, 0.3);
    --statistics-revenues-border-right: rgba(229, 205, 132, 0.8);
    --statistics-revenues-hover-shadow: rgba(229, 205, 132, 0.15);

    /* Statistics - Expenses */
    --statistics-expenses-border: rgba(165, 180, 208, 0.3);
    --statistics-expenses-border-right: rgba(165, 180, 208, 0.8);
    --statistics-expenses-hover-shadow: rgba(165, 180, 208, 0.15);

    /* Statistics - Renew Insurance */
    --statistics-renew-insurance-border: rgba(214, 143, 152, 0.25);
    --statistics-renew-insurance-border-right: rgba(214, 143, 152, 0.6);
    --statistics-renew-insurance-hover-shadow: rgba(214, 143, 152, 0.12);

    /* Statistics - Renew Operating Card */
    --statistics-renew-operating-card-border: rgba(175, 165, 195, 0.25);
    --statistics-renew-operating-card-border-right: rgba(175, 165, 195, 0.6);
    --statistics-renew-operating-card-hover-shadow: rgba(175, 165, 195, 0.12);

    /* Statistics - Renew License */
    --statistics-renew-license-border: rgba(155, 175, 205, 0.25);
    --statistics-renew-license-border-right: rgba(155, 175, 205, 0.6);
    --statistics-renew-license-hover-shadow: rgba(155, 175, 205, 0.12);

    /* Statistics - Maintenance After */
    --statistics-maintenance-after-border: rgba(165, 195, 170, 0.25);
    --statistics-maintenance-after-border-right: rgba(165, 195, 170, 0.6);
    --statistics-maintenance-after-hover-shadow: rgba(165, 195, 170, 0.12);

    /* Statistics - Maintenance Remaining */
    --statistics-maintenance-remaining-border: rgba(185, 170, 155, 0.25);
    --statistics-maintenance-remaining-border-right: rgba(185, 170, 155, 0.6);
    --statistics-maintenance-remaining-hover-shadow: rgba(185, 170, 155, 0.12);

    /* Statistics - Asset Value & Accidents */
    --statistics-accidents-hover-shadow: rgba(150, 165, 185, 0.12);

    /* Statistics - Depreciable Value */
    --statistics-depreciable-value-border: rgba(155, 180, 165, 0.25);
    --statistics-depreciable-value-border-right: rgba(155, 180, 165, 0.6);
    --statistics-depreciable-value-hover-shadow: rgba(155, 180, 165, 0.12);

    /* Statistics - Book Value */
    --statistics-book-value-border: rgba(170, 160, 185, 0.25);
    --statistics-book-value-border-right: rgba(170, 160, 185, 0.6);
    --statistics-book-value-hover-shadow: rgba(170, 160, 185, 0.12);

    /* Statistics - Sale Amount */
    --statistics-sale-amount-border: rgba(195, 185, 155, 0.25);
    --statistics-sale-amount-border-right: rgba(195, 185, 155, 0.6);
    --statistics-sale-amount-hover-shadow: rgba(195, 185, 155, 0.12);

    /* ========== 📧 MAIL ========== */
    --mailbox-controls-border-bottom: #3a3d45;
    --mail-nav-link-color: #e4e6eb;

    /* ========== 💬 MESSAGES ========== */
    --dropzone-message-color: rgba(255, 255, 255, 0.4);
    --dropzone-error-message-bg: #c52a3a;
    --dropzone-error-message-border: #c52a3a;
    --messenger-message-info-bg: #2a2d35;
    --messenger-message-info-border: #3a3d45;

    /* ========== 🔐 LOGIN ========== */
    --login-box-shadow: rgba(0, 0, 0, 0.3);
    --login-head-border-bottom: #3a3d45;
    --login-label-color: #a8adb8;

    /* ========== 📋 PAGINATION ========== */
    --pagination-nav-border: #3a3d45;

    /* ========== 🎯 NAV HEAD ========== */
    --nav-head-color: #2a2d35;
    --nav-head-bg: #2a2d35;
    --nav-head-link-color: #e4e6eb;

    /* ========== 💻 CODEMIRROR ========== */
    --codemirror-border: #3a3d45;

    /* ========== 📁 DROPZONE ========== */
    --dropzone-preview-file-bg: #4a4d55;
    --dropzone-progress-border: #5a5d65;
    --dropzone-progress-bg: rgba(42, 45, 53, 0.95);
    --dropzone-progress-upload-bg: #0ab8d9;
    --dropzone-filename-hover-border: rgba(100, 103, 111, 0.8);
    --dropzone-filename-hover-bg: rgba(58, 61, 69, 0.9);
    --dropzone-filename-span-bg: rgba(58, 61, 69, 0.5);

    /* ========== ✅ CHECKBOX & RADIO ========== */
    --checkbox-disabled-color: #5a5d65;
    --radio-disabled-color: #5a5d65;
    --toggle-disabled-color: #5a5d65;
    --toggle-flip-bg: #3a3d45;
    --toggle-flip-disabled-color: #5a5d65;

    /* ========== 👤 USER PROFILE ========== */
    --user-profile-info-bg: #2a2d35;
    --user-timeline-post-shadow: rgba(0, 0, 0, 0.3);
    --user-timeline-post-utility-color: #a8adb8;

    /* ========== 🎨 FULLCALENDAR POPOVER ========== */
    --fc-unthemed-popover-border: #3a3d45;
    --fc-unthemed-popover-header-bg: #2a2d35;
    --fc-unthemed-popover-close-color: #a8adb8;
}

.dark-mode {
    /* Statistics Colors - Dark Mode */
    --bg-color-statistics-total-sales: #1a2a3a;
    --border-color-statistics-total-sales: #2d4a6a;

    --bg-color-statistics-total-purchases: #2a1f1a;
    --border-color-statistics-total-purchases: #4a3a2d;

    --bg-color-statistics-cash-account: #1a2a2f;
    --border-color-statistics-cash-account: #2d4a55;

    --bg-color-task: #2a2222;
    --border-right-color-task: #ff6060;

    --bg-color-completed-task: #1f2a1f;
    --border-right-color-completed-task: #4a9c3c;

    --bg-color-table-statistics-sales: #1a2a3a;
    --border-right-color-table-statistics-sales: #4a7dcc;

    --bg-color-table-statistics-installment-sales: #252235;
    --border-right-color-table-statistics-installment-sales: #7d75c7;

    --bg-color-table-statistics-purchases: #2a1f1a;
    --border-right-color-table-statistics-purchases: #cc8a5a;

    --bg-color-table-statistics-installment-purchases: #1a2a2f;
    --border-right-color-table-statistics-installment-purchases: #40b8d8;

    --bg-color-white: #1e1e1e;
    --border-bottom-color: #3a3a3a;

    --border-color-contact: #4a7885;
    --bg-color-contact: #2a2a2a;

    /* Base Colors - Dark Mode */
    --color-color-1: #2a2a2a;
    --color-color-2: #ff8e25;
    --color-color-3: #0eb70e;
    --color-color-4: #ff4444;
    --color-color-5: #1a1a1a;
    --color-color-6: #2d2d2d;
    --color-color-7: #252525;
    --color-color-8: #2ecc71;
    --color-color-9: #3498db;
    --color-color-10: #e8e8e8;
    --color-color-11: #b8b8b8;
    --color-color-12: #27ae60;
    --color-text-info-hover: #5dade0;
    --color-text-warning-hover: #f39c12;
    --color-text-danger: #e74c3c;
    --color-text-danger-hover: #c0392b;
    --color-text-light-hover: #4a4a4a;
    --color-text-dark-hover: #ecf0f1;
    --btn-warning-active-bg: #e67e22;
    --btn-light-active-bg: #3a3a3a;
    --badge-warning-hover-bg: #e67e22;
    --badge-light-hover-bg: #3a3a3a;

    /* Alert Colors - Dark Mode */
    --alert-primary-hr-border: #2d5a55;
    --alert-secondary-hr-border: #3a3e42;
    --alert-success-border: #27642f;
    --alert-success-hr-border: #2a7235;
    --alert-info-border: #2d5a6a;
    --alert-info-hr-border: #357080;
    --alert-warning-border: #5a4a2d;
    --alert-warning-hr-border: #6a5835;
    --alert-danger-border: #6a2d32;
    --alert-danger-hr-border: #7a353a;
    --alert-light-border: #3a3a3a;
    --alert-light-hr-border: #2a2a2a;
    --alert-dark-border: #4a4a4a;
    --alert-dark-hr-border: #555555;

    /* List Group - Dark Mode */
    --list-group-item-primary-bg: #2d5550;
    --list-group-item-primary-hover-bg: #357060;
    --list-group-item-secondary-bg: #3a3e42;
    --list-group-item-secondary-hover-bg: #454a4f;

    /* Popover - Dark Mode */
    --popover-header-border-bottom: #3a3a3a;
    --popover-header-bg: #2a2a2a;
    --popover-header-border: #404040;
    --bg-warning-hover: #e67e22;
    --bg-light-hover: #3a3a3a;

    /* Datepicker - Dark Mode */
    --datepicker-day-hover-bg: #3a3a3a;
    --datepicker-highlighted-bg: #2d4a5a;
    --datepicker-highlighted-border: #4a7090;
    --datepicker-highlighted-focus-bg: #355570;
    --datepicker-highlighted-focus-border: #5a90c0;
    --datepicker-highlighted-hover-bg: #355570;
    --datepicker-highlighted-hover-border: #5090cc;
    --datepicker-highlighted-active-bg: #355570;
    --datepicker-highlighted-active-border: #5090cc;
    --datepicker-highlighted-active-hover-bg: #4070a0;
    --datepicker-highlighted-active-hover-border: #5a90c0;
    --datepicker-highlighted-focused-bg: #355570;
    --datepicker-highlighted-disabled-bg: #2d4a5a;
    --datepicker-highlighted-disabled-border: #4a7090;
    --datepicker-highlighted-disabled-color: #666666;

    /* Datepicker - Today - Dark Mode */
    --datepicker-today-bg: #5a4a2d;
    --datepicker-today-border: #8a6a35;
    --datepicker-today-focus-bg: #6a5535;
    --datepicker-today-focus-border: #aa8545;
    --datepicker-today-hover-bg: #6a5535;
    --datepicker-today-hover-border: #9a7540;
    --datepicker-today-active-bg: #6a5535;
    --datepicker-today-active-border: #9a7540;
    --datepicker-today-active-hover-bg: #7a6040;
    --datepicker-today-active-hover-border: #aa8545;
    --datepicker-today-focused-bg: #6a5535;
    --datepicker-today-disabled-bg: #5a4a2d;
    --datepicker-today-disabled-color: #666666;

    /* Datepicker - Range - Dark Mode */
    --datepicker-range-bg: #3a3a3a;
    --datepicker-range-border: #555555;
    --datepicker-range-focus-bg: #454545;
    --datepicker-range-focus-border: #707070;
    --datepicker-range-hover-bg: #454545;
    --datepicker-range-hover-border: #606060;
    --datepicker-range-active-bg: #454545;
    --datepicker-range-active-border: #606060;
    --datepicker-range-active-hover-bg: #505050;
    --datepicker-range-active-hover-border: #707070;
    --datepicker-range-focused-bg: #454545;
    --datepicker-range-disabled-bg: #3a3a3a;
    --datepicker-range-disabled-color: #666666;

    /* Datepicker - Range Highlighted - Dark Mode */
    --datepicker-range-highlighted-bg: #2d4550;
    --datepicker-range-highlighted-border: #4a6a80;
    --datepicker-range-highlighted-focus-bg: #355060;
    --datepicker-range-highlighted-focus-border: #5a8aa0;
    --datepicker-range-highlighted-hover-bg: #355060;
    --datepicker-range-highlighted-hover-border: #507a90;
    --datepicker-range-highlighted-active-bg: #355060;
    --datepicker-range-highlighted-active-border: #507a90;
    --datepicker-range-highlighted-active-hover-bg: #406070;
    --datepicker-range-highlighted-active-hover-border: #5a8aa0;
    --datepicker-range-highlighted-focused-bg: #355060;
    --datepicker-range-highlighted-disabled-bg: #2d4550;
    --datepicker-range-highlighted-disabled-border: #4a6a80;
    --datepicker-range-highlighted-disabled-color: #666666;

    /* Datepicker - Range Today - Dark Mode */
    --datepicker-range-today-bg: #5a4530;
    --datepicker-range-today-border: #8a6540;
    --datepicker-range-today-focus-bg: #6a5040;
    --datepicker-range-today-focus-border: #aa8555;
    --datepicker-range-today-hover-bg: #6a5040;
    --datepicker-range-today-hover-border: #9a7550;
    --datepicker-range-today-active-bg: #6a5040;
    --datepicker-range-today-active-border: #9a7550;
    --datepicker-range-today-active-hover-bg: #7a5a45;
    --datepicker-range-today-active-hover-border: #aa8555;
    --datepicker-range-today-disabled-bg: #5a4530;
    --datepicker-range-today-disabled-border: #8a6540;
    --datepicker-range-today-disabled-color: #666666;

    /* Datepicker - Selected - Dark Mode */
    --datepicker-selected-bg: #555555;
    --datepicker-selected-border: #888888;
    --datepicker-selected-focus-bg: #707070;
    --datepicker-selected-focus-border: #aaaaaa;
    --datepicker-selected-hover-bg: #707070;
    --datepicker-selected-hover-border: #999999;
    --datepicker-selected-active-bg: #707070;
    --datepicker-selected-active-border: #999999;
    --datepicker-selected-active-hover-bg: #808080;
    --datepicker-selected-active-hover-border: #aaaaaa;
    --datepicker-selected-disabled-bg: #555555;
    --datepicker-selected-disabled-border: #888888;

    /* Datepicker - Active - Dark Mode */
    --datepicker-active-bg: #3498db;
    --datepicker-active-border: #2980b9;
    --datepicker-active-focus-border: #5dade0;
    --datepicker-active-hover-border: #00a896;
    --datepicker-active-hover-focus-bg: #00a896;
    --datepicker-active-hover-focus-border: #5dade0;

    /* Datepicker - Span - Dark Mode */
    --datepicker-span-hover-bg: #3a3a3a;
    --datepicker-span-disabled-color: #666666;
    --datepicker-span-active-bg: #3498db;
    --datepicker-span-active-border: #2980b9;
    --datepicker-span-old-new-color: #666666;
    --input-daterange-addon-border: #555555;

    /* Sweet Alert - Dark Mode */
    --sweet-alert-input-border: #555555;
    --sweet-alert-button-hover-bg: #00a896;
    --sweet-alert-button-cancel-bg: #4a4a4a;
    --sweet-alert-button-cancel-hover-bg: #555555;
    --sweet-alert-button-cancel-active-bg: #606060;
    --sweet-alert-error-line-bg: #e74c3c;
    --sweet-alert-warning-border: #f39c12;
    --sweet-alert-warning-body-bg: #5a4a2d;
    --sweet-alert-warning-dot-bg: #f39c12;
    --sweet-alert-info-border: #3498db;
    --sweet-alert-info-body-bg: #2d4a5a;
    --sweet-alert-info-dot-bg: #3498db;
    --sweet-alert-success-border: #27ae60;
    --sweet-alert-success-line-bg: #27ae60;
    --sweet-alert-pulse-warning-start: #f39c12;
    --sweet-alert-pulse-warning-end: #e67e22;

    /* Notifications - Dark Mode */
    --notify-alert-warning-bg: #e67e22;
    --notify-alert-danger-bg: #e74c3c;

    /* Select2 - Dark Mode */
    --select2-arrow-border: #606060;
    --select2-arrow-open-color: #aaaaaa;
    --select2-search-field-border: #555555;
    --select2-option-selected-bg: #404040;
    --select2-option-highlighted-color: #ffffff;

    /* Maps - Dark Mode */
    --jqvmap-label-bg: #2a2a2a;
    --jqvmap-label-color: #ffffff;

    /* Calendar - Dark Mode */
    --fc-unthemed-border: #404040;
    --fc-unthemed-divider-bg: #2a2a2a;
    --fc-unthemed-close-color: #aaaaaa;
    --fc-unthemed-today-bg: rgba(0, 150, 136, 0.3);
    --fc-highlight-bg: #2d4a5a;
    --fc-highlight-opacity: 0.4;
    --fc-bgevent-bg: #27642f;
    --fc-bgevent-opacity: 0.4;
    --fc-nonbusiness-bg: #2a2a2a;
    --fc-state-default-bg: #3a3a3a;
    --fc-state-default-border: #555555;
    --fc-state-default-shadow-inset: rgba(255, 255, 255, 0.05);
    --fc-state-default-shadow-outer: rgba(0, 0, 0, 0.2);

    /* Dropzone - Dark Mode */
    --dropzone-progress-border: #555555;
    --dropzone-file-preview-bg: #666666;
    --dropzone-file-preview-gradient-start: #3a3a3a;
    --dropzone-file-preview-gradient-end: #2a2a2a;
    --dropzone-upload-bg: #1a1a1a;
    --dropzone-upload-gradient-start: #3a3a3a;
    --dropzone-upload-gradient-end: #2a2a2a;
    --dropzone-error-message-bg: #c0392b;
    --dropzone-error-message-gradient-start: #c0392b;
    --dropzone-error-message-gradient-end: #a93226;
    --dropzone-error-message-color: #ffffff;
    --dropzone-error-message-arrow: #c0392b;

    /* Sidebar - Dark Mode */
    --sidebar-mini-toggled-bg: #1a1a1a;

    /* Form Elements - Dark Mode */
    --checkbox-disabled-color: #555555;
    --radio-disabled-color: #555555;
    --toggle-disabled-color: #555555;
    --toggle-flip-bg: #3a3a3a;
    --toggle-flip-disabled-color: #555555;
    --material-half-bg: #2a2a2a;

    /* Messenger - Dark Mode */
    --messenger-message-info-bg: #3a3a3a;
    --messenger-message-info-arrow: #3a3a3a;

    /* Landing Page - Dark Mode */
    --landing-hero-overlay-bg: #0a1412;
    --landing-hero-overlay-opacity: 0.7;

    /* User Profile - Dark Mode */
    --user-profile-info-bg: #2a2a2a;

    /* Pagination - Dark Mode */
    --pagination-nav-border: #555555;

    /* Buttons - Dark Mode */
    --btn-extra-bg: #009688;
    --btn-extra-border: #009688;
    --btn-extra-focus-shadow: rgba(0, 150, 136, 0.25);
    --btn-back-hover-bg: #2a2a2a;
    --btn-back-hover-border: #2a2a2a;

    /* Signature - Dark Mode */
    --signature-border-color: #606060;

    /* Navigation - Dark Mode */
    --nav-head-link-color: #e8e8e8;
    --legend-title-bg: #2a2a2a;

    /* Bond Modal - Dark Mode */
    --bond-modal-remaining-border: #3498db;

    /* Statistics - Dark Mode */
    --statistics-sale-return-bg: #2a1f35;
    --statistics-sale-return-border: #6a4a9a;

    /* Modern Modal - Dark Mode */
    --modern-modal-header-gradient-start: #2a2a2a;
    --modern-modal-header-gradient-end: #1e1e1e;
    --modern-modal-title-icon-gradient-start: #068DA9;
    --modern-modal-title-icon-gradient-end: #0ab8d9;
    --modern-modal-title-icon-bg-start: #068DA9;
    --modern-modal-title-icon-bg-end: #0ab8d9;
    --modern-modal-title-icon-color: #ffffff;
    --modern-modal-title-icon-shadow: rgba(10, 184, 217, 0.25);
}

.dark-mode {
    --color-app-nav__item: #e4e6eb;
    --bg-color-dropdown-menu: #1e2228;
    --color-dropdown-menu: #e4e6eb;
    --bg-color-form-control: #3a3d42;
}

/* ===================================
   🎨 SMOOTH TRANSITIONS
   =================================== */

* {
    transition: background-color 0.3s ease,
    color 0.3s ease,
    border-color 0.3s ease,
    box-shadow 0.3s ease;
}

.animated-checkbox,
.animated-radio-button,
.a-car-alarm,
[class*="animation-"],
[class*="animate-"] {
    transition: none;
}

*,
*::before,
*::after {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
}