:root {
    /* Font Family - Geist from design project */
    --font-sans: 'Geist', system-ui, -apple-system, sans-serif;
    --font-mono: 'Geist Mono', ui-monospace, monospace;
    --theme-font-family: var(--font-sans);

    /* ===========================================
       DESIGN SYSTEM - Digiclose Dashboard Design
       Based on: dashboard-design.zip + /home/cneise/design
       Updated: 2025-01-09

       All colors are NEUTRAL (0% saturation) except destructive.
       This ensures a professional, clean look.
       =========================================== */

    /* Destructive/Accent - Red (for delete buttons, errors, warnings) */
    --theme-accent: #D42626;
    --theme-accent-hover: #B91C1C;
    --theme-accent-light: #FEE2E2;
    --theme-accent-dark: #991B1B;
    --theme-accent-rgb: 212, 38, 38;

    /* Interactive - Blue (for links, focus states, active elements) */
    --theme-interactive: #2563EB;
    --theme-interactive-hover: #1D4ED8;
    --theme-interactive-light: #DBEAFE;
    --theme-interactive-dark: #1E40AF;
    --theme-interactive-rgb: 37, 99, 235;

    /* Status Colors - Light Mode */
    --theme-status-success: #10B981;       /* emerald-500 */
    --theme-status-success-bg: #D1FAE5;    /* emerald-100 */
    --theme-status-success-text: #065F46;  /* emerald-800 */

    --theme-status-warning: #F97316;       /* orange-500 */
    --theme-status-warning-bg: #FFEDD5;    /* orange-100 */
    --theme-status-warning-text: #9A3412;  /* orange-800 */

    --theme-status-error: #EF4444;         /* red-500 */
    --theme-status-error-bg: #FEE2E2;      /* red-100 */
    --theme-status-error-text: #991B1B;    /* red-800 */

    --theme-status-info: #3B82F6;          /* blue-500 */
    --theme-status-info-bg: #DBEAFE;       /* blue-100 */
    --theme-status-info-text: #1E40AF;     /* blue-800 */

    /* Core Backgrounds - Neutral grays */
    --theme-background: #FCFCFC;
    --theme-background-secondary-bg: #FFFFFF;
    --theme-tertiary-bg: #F5F5F5;
    --theme-subtle-background: #F2F2F2;
    --theme-dark-bg-subtle: #E6E6E6;

    --theme-table-bg: #fff;
    --theme-table-odd-header-bg: #f4f4f4;
    --theme-table-odd-body-bg: #f4f4f4;
    --theme-table-color: #000;

    --theme-table-highlight-bg: #9de6f2;
    --theme-table-highlight-color: #000;
    --theme-table-highlight-border-color: #84c8d4;

    --theme-table-blocked-bg: #f9b4b4;
    --theme-table-blocked-color: #000;
    --theme-table-blocked-border-color: #dd9393;

    --theme-table-info-bg: #9de6f2;
    --theme-table-info-even-bg: #adebf8;
    --theme-table-info-color: #000;
    --theme-table-info-border-color: #7bbeca;

    --theme-table-warning-bg: #fbeda7;
    --theme-table-warning-color: #000;
    --theme-table-warning-border-color: #c8b878;

    --theme-table-danger-bg: #f9b4b4;
    --theme-table-danger-color: #000;
    --theme-table-danger-border-color: #e39999;

    --theme-table-success-bg: #94e795;
    --theme-table-success-color: #000;
    --theme-table-success-border-color: #7dd17e;

    --theme-table-hover-bg: #ededed;

    --theme-tertiary-color: rgba(33, 37, 41, 0.5);

    --theme-dashboard-bg: #eef2ff;

    --theme-secondary-bg: #e9ecef;

    --theme-backdrop-bg: #c4cad0;

    /* Text Colors - Neutral (from dashboard-design.zip) */
    --theme-foreground: #262626;
    --theme-subtle-foreground: #666666;

    --theme-placeholder-color: #666666;

    /* Borders - Neutral grays */
    --theme-border-color: #E6E6E6;
    --theme-border-color-strong: #D4D4D4;
    --theme-table-border-color: #ebebeb;

    --theme-navbar-background: #F4F4F5;
    --theme-nav-link-color: #3F3F46;

    --theme-dropdown-link-color: #000000;
    --theme-dropdown-link-hover-color: #222222;
    --theme-dropdown-link-hover-bg: #F8F9FAFF;

    --theme-select-link-hover-bg: #e6e6e6;

    --theme-pagination-disabled-bg: #D9D9D9;
    --theme-pagination-disabled-border-color: #D9D9D9;
    --theme-pagination-disabled-color: #8F9193;

    --theme-pagination-hover-color: var(--theme-interactive);
    --theme-pagination-hover-bg: #f8f9fa;
    --theme-pagination-hover-border-color: #dee2e6;

    --theme-switch-color: #000000;
    --theme-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%280, 0, 0, 0.25%29'/%3e%3c/svg%3e");
    --theme-form-switch-checked-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e");
    --theme-form-switch-focus-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23bbb'/%3e%3c/svg%3e");
    --theme-form-switch-focus-checked-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23fff'/%3e%3c/svg%3e");

    --theme-form-check-bg: #ffffff;

    --theme-tab-background: #f8f8f8;

    --theme-loading-overlay-bg-rgb: 255, 255, 255;

    --theme-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23212529' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='m2 5 6 6 6-6'/%3e%3c/svg%3e");

    --theme-card-border-radius: 0.375rem;
    --theme-card-border-hover-color: #b0b0b0;

    --theme-modal-header-border-color: #D9D9D9;
    --theme-modal-footer-border-color: #D9D9D9;

    --theme-modal-box-shadow: 0 3px 14px #0000003e;

    --theme-form-label-color: #868e96;

    --theme-signature-background: #ffead1;
    --theme-signature-border-color: #da6b6b;

    --theme-input-bg: #fff;
    --theme-input-color: #212529;
    --theme-input-border-color: #D9D9D9;

    --theme-input-disabled-bg: #e9ecef;
    --theme-input-disabled-color: #212529;

    /* Primary/Interactive color - Blue (for focus states, active elements) */
    --theme-primary-color: var(--theme-interactive);
    --theme-primary-color-rgb: var(--theme-interactive-rgb);
    --theme-primary-color-dark: var(--theme-interactive-dark);
    --theme-primary-color-hover: var(--theme-interactive-hover);
    --theme-primary-color-active: var(--theme-interactive-hover);
    --theme-primary-color-light: var(--theme-interactive-light);
    --theme-primary-color-disabled: #93C5FD;
    --theme-secondary-color: #27272A;
    --theme-secondary-color-hover: #3F3F46;
    --theme-secondary-color-active: #3F3F46;
    --theme-secondary-color-disabled: #71717A;
    --theme-secondary-text-on-bg: #FFFFFF;

    --theme-success: #10B981;
    --theme-warning: #F59E0B;
    --theme-danger: #EF4444;
    --theme-info: #3B82F6;
    --theme-light: #f8f9fa;

    /* Primary Button - Blue (interactive color)
       Light: bg #2563EB (blue-600), text #FFFFFF
       Hover: bg #1D4ED8 (blue-700)
       Active: bg #1E40AF (blue-800) */
    --theme-primary-btn-color: #FFFFFF;
    --theme-primary-btn-bg: var(--theme-interactive, #2563EB);
    --theme-primary-btn-border-color: var(--theme-interactive, #2563EB);
    --theme-primary-btn-hover-color: #FFFFFF;
    --theme-primary-btn-hover-bg: var(--theme-interactive-hover, #1D4ED8);
    --theme-primary-btn-hover-border-color: var(--theme-interactive-hover, #1D4ED8);
    --theme-primary-btn-active-color: #FFFFFF;
    --theme-primary-btn-active-bg: var(--theme-interactive-dark, #1E40AF);
    --theme-primary-btn-active-border-color: var(--theme-interactive-dark, #1E40AF);
    --theme-primary-btn-disabled-color: #FFFFFF;
    --theme-primary-btn-disabled-bg: #93C5FD;
    --theme-primary-btn-disabled-border-color: #93C5FD;

    /* Secondary Button - Outline style (from dashboard-design.zip)
       Transparent bg with neutral border */
    --theme-secondary-btn-color: #262626;
    --theme-secondary-btn-bg: transparent;
    --theme-secondary-btn-border-color: #E6E6E6;
    --theme-secondary-btn-hover-color: #262626;
    --theme-secondary-btn-hover-bg: #F2F2F2;
    --theme-secondary-btn-hover-border-color: #D4D4D4;
    --theme-secondary-btn-active-color: #262626;
    --theme-secondary-btn-active-bg: #E6E6E6;
    --theme-secondary-btn-active-border-color: #A3A3A3;
    --theme-secondary-btn-disabled-color: #A3A3A3;
    --theme-secondary-btn-disabled-bg: transparent;
    --theme-secondary-btn-disabled-border-color: #E6E6E6;

    /* Minimal/Ghost Button - Transparent with subtle hover */
    --theme-minimal-btn-color: #262626;
    --theme-minimal-btn-bg: transparent;
    --theme-minimal-btn-border-color: var(--theme-border-color);
    --theme-minimal-btn-hover-color: #262626;
    --theme-minimal-btn-hover-bg: #F2F2F2;
    --theme-minimal-btn-hover-border-color: var(--theme-border-color);
    --theme-minimal-btn-active-color: #262626;
    --theme-minimal-btn-active-bg: #E6E6E6;
    --theme-minimal-btn-active-border-color: var(--theme-border-color);
    --theme-minimal-btn-disabled-color: #A3A3A3;
    --theme-minimal-btn-disabled-bg: transparent;
    --theme-minimal-btn-disabled-border-color: #E6E6E6;

    /* Danger/Destructive Button (from dashboard-design.zip) */
    --theme-danger-btn-color: #FFFFFF;
    --theme-danger-btn-bg: #D42626;
    --theme-danger-btn-border-color: #D42626;
    --theme-danger-btn-hover-color: #FFFFFF;
    --theme-danger-btn-hover-bg: #B91C1C;
    --theme-danger-btn-hover-border-color: #B91C1C;
    --theme-danger-btn-active-color: #FFFFFF;
    --theme-danger-btn-active-bg: #991B1B;
    --theme-danger-btn-active-border-color: #991B1B;
    --theme-danger-btn-disabled-color: #FFFFFF;
    --theme-danger-btn-disabled-bg: #F87171;
    --theme-danger-btn-disabled-border-color: #F87171;

    --theme-success-btn-color: #ffffff;
    --theme-success-btn-bg: #28a745;
    --theme-success-btn-border-color: #28a745;
    --theme-success-btn-hover-color: #ffffff;
    --theme-success-btn-hover-bg: #1b742f;
    --theme-success-btn-hover-border-color: #1b742f;
    --theme-success-btn-active-color: #ffffff;
    --theme-success-btn-active-bg: #1b742f;
    --theme-success-btn-active-border-color: #1b742f;
    --theme-success-btn-disabled-color: #ffffff;
    --theme-success-btn-disabled-bg: #51a764;
    --theme-success-btn-disabled-border-color: #51a764;

    --theme-warning-btn-color: #000000;
    --theme-warning-btn-bg: #ffc107;
    --theme-warning-btn-border-color: #ffc107;
    --theme-warning-btn-hover-color: #000000;
    --theme-warning-btn-hover-bg: #cc9a05;
    --theme-warning-btn-hover-border-color: #cc9a05;
    --theme-warning-btn-active-color: #000000;
    --theme-warning-btn-active-bg: #cc9a05;
    --theme-warning-btn-active-border-color: #cc9a05;
    --theme-warning-btn-disabled-color: #000000;
    --theme-warning-btn-disabled-bg: #ffd65e;
    --theme-warning-btn-disabled-border-color: #ffd65e;

    --theme-info-btn-color: #ffffff;
    --theme-info-btn-bg: #17a2b8;
    --theme-info-btn-border-color: #17a2b8;
    --theme-info-btn-hover-color: #ffffff;
    --theme-info-btn-hover-bg: #107584;
    --theme-info-btn-hover-border-color: #107584;
    --theme-info-btn-active-color: #ffffff;
    --theme-info-btn-active-bg: #107584;
    --theme-info-btn-active-border-color: #107584;
    --theme-info-btn-disabled-color: #ffffff;
    --theme-info-btn-disabled-bg: #71aeb8;
    --theme-info-btn-disabled-border-color: #71aeb8;

    --theme-link-color: var(--theme-interactive);
    --theme-link-hover-color: var(--theme-interactive-hover);
    --theme-link-disabled-color: var(--theme-interactive-light);

    --theme-success-text-emphasis: #1a5928;
    --theme-success-bg-subtle: #d4f4dd;
    --theme-success-border-subtle: #a8e6ba;

    --theme-warning-text-emphasis: #7a5c00;
    --theme-warning-bg-subtle: #fff8e1;
    --theme-warning-border-subtle: #ffe4a3;

    --theme-danger-text-emphasis: #8b1a1a;
    --theme-danger-bg-subtle: #ffe6e6;
    --theme-danger-border-subtle: #ffb3b3;

    --theme-info-text-emphasis: #0c4a5a;
    --theme-info-bg-subtle: #e1f5f8;
    --theme-info-border-subtle: #b3e5ec;

    --theme-light-text-emphasis: #353535;
    --theme-light-bg-subtle: #f6f8fa;
    --theme-light-border-subtle: #d2d4d4;

    --theme-highlight-color: #212529;
    --theme-highlight-bg: #fff3cd;

    --theme-border-width: 1px;
    --theme-border-style: solid;

    --border-radius: 0.25rem;
    --border-radius-none: 0px;
    --border-radius-sm: 0.125rem;
    --border-radius-md: 0.375rem;
    --border-radius-lg: 0.5rem;
    --border-radius-xl: 0.75rem;
    --border-radius-2xl: 1rem;
    --border-radius-3xl: 1.5rem;
    --border-radius-full: 50rem;

    --box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
    --box-shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.05);
    --box-shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
    --box-shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
    --box-shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.1), 0 8px 10px -6px rgb(0 0 0 / 0.1);
    --box-shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / 0.25);
    --box-shadow-inner: inset 0 2px 4px 0 rgb(0 0 0 / 0.05);
    --box-shadow-none: none;

    --theme-btn-close-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414'/%3e%3c/svg%3e");
}

.dark {
    /* ===========================================
       DARK MODE - Neutral Grays (NO BLUE TINT!)
       Based on: dashboard-design.zip
       All colors have 0% saturation except destructive.
       =========================================== */

    /* Dark mode accent/destructive - slightly adjusted for dark bg */
    --theme-accent: #BC2222;
    --theme-accent-hover: #D42626;
    --theme-accent-light: #7F1D1D;
    --theme-accent-dark: #991B1B;
    --theme-accent-rgb: 188, 34, 34;

    /* Interactive - Blue for dark mode (balanced for visibility without being too bright) */
    --theme-interactive: #3B82F6;
    --theme-interactive-hover: #60A5FA;
    --theme-interactive-light: #1E3A8A;
    --theme-interactive-dark: #2563EB;
    --theme-interactive-rgb: 59, 130, 246;

    /* Status Colors - Dark Mode */
    --theme-status-success: #34D399;       /* emerald-400 */
    --theme-status-success-bg: #064E3B;    /* emerald-900 */
    --theme-status-success-text: #A7F3D0;  /* emerald-200 */

    --theme-status-warning: #FB923C;       /* orange-400 */
    --theme-status-warning-bg: #7C2D12;    /* orange-900 */
    --theme-status-warning-text: #FED7AA;  /* orange-200 */

    --theme-status-error: #F87171;         /* red-400 */
    --theme-status-error-bg: #7F1D1D;      /* red-900 */
    --theme-status-error-text: #FECACA;    /* red-200 */

    --theme-status-info: #60A5FA;          /* blue-400 */
    --theme-status-info-bg: #1E3A8A;       /* blue-900 */
    --theme-status-info-text: #BFDBFE;     /* blue-200 */

    /* Core Backgrounds - PURE NEUTRAL GRAYS (0% saturation) */
    --theme-background: #121212;
    --theme-background-secondary-bg: #1A1A1A;
    --theme-tertiary-bg: #262626;
    --theme-subtle-background: #1A1A1A;
    --theme-dark-bg-subtle: #2E2E2E;

    /* Tables - Neutral grays */
    --theme-table-bg: #1A1A1A;
    --theme-table-odd-header-bg: #262626;
    --theme-table-odd-body-bg: #1F1F1F;
    --theme-table-color: #F2F2F2;

    /* Table status colors - adjusted for dark mode visibility */
    --theme-table-highlight-bg: #2A5A6B;
    --theme-table-highlight-color: #fff;
    --theme-table-highlight-border-color: #1F4550;

    --theme-table-blocked-bg: #6B2A2A;
    --theme-table-blocked-color: #fff;
    --theme-table-blocked-border-color: #501F1F;

    --theme-table-info-bg: #2A5A6B;
    --theme-table-info-even-bg: #234C5A;
    --theme-table-info-color: #fff;
    --theme-table-info-border-color: #1F4550;

    --theme-table-warning-bg: #6B5A2A;
    --theme-table-warning-color: #fff;
    --theme-table-warning-border-color: #504520;

    --theme-table-danger-bg: #6B2A2A;
    --theme-table-danger-color: #fff;
    --theme-table-danger-border-color: #501F1F;

    --theme-table-success-bg: #2A6B3A;
    --theme-table-success-color: #fff;
    --theme-table-success-border-color: #1F502A;

    --theme-table-hover-bg: #2E2E2E;

    --theme-tertiary-color: rgba(153, 153, 153, 0.5);

    --theme-dashboard-bg: #121212;

    --theme-secondary-bg: #1A1A1A;

    --theme-backdrop-bg: #2E2E2E;

    /* Text Colors - Neutral (0% saturation) */
    --theme-foreground: #F2F2F2;
    --theme-subtle-foreground: #999999;

    /* Prose/Legal content - softer gray for improved readability */
    /* Slightly warmer than pure white for extended reading */
    --theme-prose-foreground: #D4D4D4;
    --theme-prose-foreground-subtle: #A3A3A3;

    --theme-placeholder-color: #737373;

    /* Borders - Neutral grays */
    --theme-border-color: #2E2E2E;
    --theme-border-color-strong: #404040;
    --theme-table-border-color: #1A1A1A;

    --theme-navbar-background: #121212;
    --theme-nav-link-color: #F2F2F2;

    --theme-dropdown-link-color: #F2F2F2;
    --theme-dropdown-link-hover-color: #FFFFFF;
    --theme-dropdown-link-hover-bg: #2E2E2E;

    --theme-select-link-hover-bg: #2E2E2E;

    --theme-pagination-disabled-bg: #2E2E2E;
    --theme-pagination-disabled-border-color: #2E2E2E;
    --theme-pagination-disabled-color: #737373;

    --theme-pagination-hover-color: #FFFFFF;
    --theme-pagination-hover-bg: #2E2E2E;
    --theme-pagination-hover-border-color: #404040;

    --theme-tab-background: #1A1A1A;

    --theme-loading-overlay-bg-rgb: 18, 18, 18;

    --theme-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='%23F2F2F2' stroke-linecap='round' stroke-linejoin='round'%3e%3cpath d='m2 5 6 6 6-6'/%3e%3c/svg%3e");

    --theme-card-border-radius: 0.375rem;
    --theme-card-border-hover-color: #404040;

    --theme-switch-color: #1A1A1A;
    --theme-form-switch-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='rgba%28153, 153, 153, 0.5%29'/%3e%3c/svg%3e");
    --theme-form-switch-checked-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23F2F2F2'/%3e%3c/svg%3e");
    --theme-form-switch-focus-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23F2F2F2'/%3e%3c/svg%3e");
    --theme-form-switch-focus-checked-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='-4 -4 8 8'%3e%3ccircle r='3' fill='%23F2F2F2'/%3e%3c/svg%3e");

    --theme-form-check-bg: #1A1A1A;

    --theme-modal-header-border-color: #2E2E2E;
    --theme-modal-footer-border-color: #2E2E2E;

    --theme-modal-box-shadow: 0 3px 14px rgba(0, 0, 0, 0.5);

    --theme-form-label-color: #999999;

    --theme-signature-background: #4A3520;
    --theme-signature-border-color: #D97706;

    --theme-input-bg: #1A1A1A;
    --theme-input-color: #F2F2F2;
    --theme-input-border-color: var(--theme-border-color);

    --theme-input-disabled-bg: #2E2E2E;
    --theme-input-disabled-color: #737373;

    /* Primary/Interactive color - Blue (for focus states, active elements) */
    --theme-primary-color: var(--theme-interactive);
    --theme-primary-color-rgb: var(--theme-interactive-rgb);
    --theme-primary-color-dark: var(--theme-interactive-dark);
    --theme-primary-color-hover: var(--theme-interactive-hover);
    --theme-primary-color-active: var(--theme-interactive-hover);
    --theme-primary-color-light: var(--theme-interactive-light);
    --theme-primary-color-disabled: #1E3A8A;
    --theme-secondary-color: #F2F2F2;
    --theme-secondary-color-hover: #E6E6E6;
    --theme-secondary-color-active: #E6E6E6;
    --theme-secondary-color-disabled: #999999;
    --theme-secondary-text-on-bg: #27272A;

    /* Semantic colors - Dark mode */
    --theme-success: #34D399;
    --theme-warning: #FBBF24;
    --theme-danger: #F87171;
    --theme-info: #60A5FA;
    --theme-light: #2E2E2E;

    /* Primary Button - Dark Mode Blue
       bg #3B82F6 (blue-500), text #FFFFFF for dark mode - balanced brightness */
    --theme-primary-btn-color: #FFFFFF;
    --theme-primary-btn-bg: var(--theme-interactive, #3B82F6);
    --theme-primary-btn-border-color: var(--theme-interactive, #3B82F6);
    --theme-primary-btn-hover-color: #FFFFFF;
    --theme-primary-btn-hover-bg: var(--theme-interactive-hover, #60A5FA);
    --theme-primary-btn-hover-border-color: var(--theme-interactive-hover, #60A5FA);
    --theme-primary-btn-active-color: #FFFFFF;
    --theme-primary-btn-active-bg: var(--theme-interactive-dark, #2563EB);
    --theme-primary-btn-active-border-color: var(--theme-interactive-dark, #2563EB);
    --theme-primary-btn-disabled-color: #F2F2F2;
    --theme-primary-btn-disabled-bg: #1E3A8A;
    --theme-primary-btn-disabled-border-color: #1E3A8A;

    /* Secondary Button - Dark Mode Outline (neutral grays) */
    --theme-secondary-btn-color: #F2F2F2;
    --theme-secondary-btn-bg: transparent;
    --theme-secondary-btn-border-color: #2E2E2E;
    --theme-secondary-btn-hover-color: #F2F2F2;
    --theme-secondary-btn-hover-bg: #2E2E2E;
    --theme-secondary-btn-hover-border-color: #404040;
    --theme-secondary-btn-active-color: #F2F2F2;
    --theme-secondary-btn-active-bg: #262626;
    --theme-secondary-btn-active-border-color: #404040;
    --theme-secondary-btn-disabled-color: #737373;
    --theme-secondary-btn-disabled-bg: transparent;
    --theme-secondary-btn-disabled-border-color: #2E2E2E;

    /* Minimal/Ghost Button - Dark Mode */
    --theme-minimal-btn-color: #F2F2F2;
    --theme-minimal-btn-bg: transparent;
    --theme-minimal-btn-border-color: #2E2E2E;
    --theme-minimal-btn-hover-color: #F2F2F2;
    --theme-minimal-btn-hover-bg: #2E2E2E;
    --theme-minimal-btn-hover-border-color: #2E2E2E;
    --theme-minimal-btn-active-color: #F2F2F2;
    --theme-minimal-btn-active-bg: #262626;
    --theme-minimal-btn-active-border-color: #2E2E2E;
    --theme-minimal-btn-disabled-color: #737373;
    --theme-minimal-btn-disabled-bg: transparent;
    --theme-minimal-btn-disabled-border-color: #2E2E2E;

    /* Danger/Destructive Button - Dark Mode */
    --theme-danger-btn-color: #FFFFFF;
    --theme-danger-btn-bg: #BC2222;
    --theme-danger-btn-border-color: #BC2222;
    --theme-danger-btn-hover-color: #FFFFFF;
    --theme-danger-btn-hover-bg: #D42626;
    --theme-danger-btn-hover-border-color: #D42626;
    --theme-danger-btn-active-color: #FFFFFF;
    --theme-danger-btn-active-bg: #991B1B;
    --theme-danger-btn-active-border-color: #991B1B;
    --theme-danger-btn-disabled-color: #F2F2F2;
    --theme-danger-btn-disabled-bg: #7F1D1D;
    --theme-danger-btn-disabled-border-color: #7F1D1D;

    --theme-success-btn-color: #ffffff;
    --theme-success-btn-bg: #28a745;
    --theme-success-btn-border-color: #28a745;
    --theme-success-btn-hover-color: #ffffff;
    --theme-success-btn-hover-bg: #1b742f;
    --theme-success-btn-hover-border-color: #1b742f;
    --theme-success-btn-active-color: #ffffff;
    --theme-success-btn-active-bg: #1b742f;
    --theme-success-btn-active-border-color: #1b742f;
    --theme-success-btn-disabled-color: #ffffff;
    --theme-success-btn-disabled-bg: #51a764;
    --theme-success-btn-disabled-border-color: #51a764;

    --theme-warning-btn-color: #000000;
    --theme-warning-btn-bg: #ffc107;
    --theme-warning-btn-border-color: #ffc107;
    --theme-warning-btn-hover-color: #000000;
    --theme-warning-btn-hover-bg: #cc9a05;
    --theme-warning-btn-hover-border-color: #cc9a05;
    --theme-warning-btn-active-color: #000000;
    --theme-warning-btn-active-bg: #cc9a05;
    --theme-warning-btn-active-border-color: #cc9a05;
    --theme-warning-btn-disabled-color: #000000;
    --theme-warning-btn-disabled-bg: #ffd65e;
    --theme-warning-btn-disabled-border-color: #ffd65e;

    --theme-info-btn-color: #ffffff;
    --theme-info-btn-bg: #17a2b8;
    --theme-info-btn-border-color: #17a2b8;
    --theme-info-btn-hover-color: #ffffff;
    --theme-info-btn-hover-bg: #107584;
    --theme-info-btn-hover-border-color: #107584;
    --theme-info-btn-active-color: #ffffff;
    --theme-info-btn-active-bg: #107584;
    --theme-info-btn-active-border-color: #107584;
    --theme-info-btn-disabled-color: #ffffff;
    --theme-info-btn-disabled-bg: #71aeb8;
    --theme-info-btn-disabled-border-color: #71aeb8;

    --theme-link-color: var(--theme-interactive);
    --theme-link-hover-color: var(--theme-interactive-hover);
    --theme-link-disabled-color: var(--theme-interactive-light);

    --theme-success-text-emphasis: #81c784; /* Lighter green for dark background */
    --theme-success-bg-subtle: #1a3e22; /* Darker green background */
    --theme-success-border-subtle: #4caf50; /* Slightly lighter border */

    --theme-warning-text-emphasis: #ffd54f; /* Lighter yellow for dark background */
    --theme-warning-bg-subtle: #4d3d00; /* Darker yellow background */
    --theme-warning-border-subtle: #ffc107; /* Slightly lighter border */

    --theme-danger-text-emphasis: #ef9a9a; /* Lighter red for dark background */
    --theme-danger-bg-subtle: #5a1a1a; /* Darker red background */
    --theme-danger-border-subtle: #f44336; /* Slightly lighter border */

    --theme-info-text-emphasis: #81d4fa; /* Lighter blue for dark background */
    --theme-info-bg-subtle: #11414d; /* Darker blue background */
    --theme-info-border-subtle: #29b6f6; /* Slightly lighter border */

    --theme-light-text-emphasis: #c2c2c2; /* Lighter gray for dark background */
    --theme-light-bg-subtle: #2d2d2d; /* Darker gray background */
    --theme-light-border-subtle: #555555; /* Slightly lighter border */

    --theme-highlight-color: #F2F2F2;
    --theme-highlight-bg: #4A3520;

    --theme-border-width: 1px;
    --theme-border-style: solid;

    --border-radius: 0.25rem;
    --border-radius-none: 0px;
    --border-radius-sm: 0.125rem;
    --border-radius-md: 0.375rem;
    --border-radius-lg: 0.5rem;
    --border-radius-xl: 0.75rem;
    --border-radius-2xl: 1rem;
    --border-radius-3xl: 1.5rem;
    --border-radius-full: 50rem;

    --box-shadow: 0 1px 3px 0 rgb(0 0 0 / 0.3), 0 1px 2px -1px rgb(0 0 0 / 0.3);
    --box-shadow-sm: 0 1px 2px 0 rgb(0 0 0 / 0.2);
    --box-shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.3), 0 2px 4px -2px rgb(0 0 0 / 0.3);
    --box-shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.3), 0 4px 6px -4px rgb(0 0 0 / 0.3);
    --box-shadow-xl: 0 20px 25px -5px rgb(0 0 0 / 0.3), 0 8px 10px -6px rgb(0 0 0 / 0.3);
    --box-shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / 0.5);
    --box-shadow-inner: inset 0 2px 4px 0 rgb(0 0 0 / 0.2);
    --box-shadow-none: none;

    --theme-btn-close-bg: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23F2F2F2'%3e%3cpath d='M.293.293a1 1 0 0 1 1.414 0L8 6.586 14.293.293a1 1 0 1 1 1.414 1.414L9.414 8l6.293 6.293a1 1 0 0 1-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 0 1-1.414-1.414L6.586 8 .293 1.707a1 1 0 0 1 0-1.414'/%3e%3c/svg%3e");

    /* Bootstrap variable overrides - NEUTRAL GRAYS (no blue) */
    --bs-body-color: #F2F2F2;
    --bs-body-bg: #121212;
    --bs-heading-color: #F2F2F2;
    --bs-emphasis-color: #FFFFFF;
    --bs-secondary-color: #999999;
    --bs-tertiary-color: #737373;
    --bs-link-color: var(--theme-interactive);
    --bs-link-hover-color: var(--theme-interactive-hover);
}

:root {
    --color-slate-50: #f8fafc;
    --color-slate-100: #f1f5f9;
    --color-slate-200: #e2e8f0;
    --color-slate-300: #cbd5e1;
    --color-slate-400: #94a3b8;
    --color-slate-500: #64748b;
    --color-slate-600: #52525B;
    --color-slate-700: #3F3F46;
    --color-slate-800: #1e293b;
    --color-slate-900: #0f172a;


    --color-gray-50: #f9fafb;
    --color-gray-100: #f3f4f6;
    --color-gray-200: #e5e7eb;
    --color-gray-300: #d1d5db;
    --color-gray-400: #9ca3af;
    --color-gray-500: #71717a;
    --color-gray-600: #4b5563;
    --color-gray-700: #374151;
    --color-gray-800: #1f2937;
    --color-gray-900: #111827;


    --color-zinc-50: #fafafa;
    --color-zinc-100: #f4f4f5;
    --color-zinc-200: #e4e4e7;
    --color-zinc-300: #d4d4d8;
    --color-zinc-400: #a1a1aa;
    --color-zinc-500: #71717a;
    --color-zinc-600: #52525b;
    --color-zinc-700: #3f3f46;
    --color-zinc-800: #27272a;
    --color-zinc-900: #18181b;


    --color-neutral-50: #fafafa;
    --color-neutral-100: #f5f5f5;
    --color-neutral-200: #e5e5e5;
    --color-neutral-300: #d4d4d4;
    --color-neutral-400: #a3a3a3;
    --color-neutral-500: #737373;
    --color-neutral-600: #525252;
    --color-neutral-700: #404040;
    --color-neutral-800: #262626;
    --color-neutral-900: #171717;


    --color-stone-50: #fafaf9;
    --color-stone-100: #f5f5f4;
    --color-stone-200: #e7e5e4;
    --color-stone-300: #d6d3d1;
    --color-stone-400: #a8a29e;
    --color-stone-500: #78716c;
    --color-stone-600: #57534e;
    --color-stone-700: #44403c;
    --color-stone-800: #292524;
    --color-stone-900: #1c1917;


    --color-red-50: #fef2f2;
    --color-red-100: #fee2e2;
    --color-red-200: #fecaca;
    --color-red-300: #fca5a5;
    --color-red-400: #f87171;
    --color-red-500: #ef4444;
    --color-red-600: #dc2626;
    --color-red-700: #b91c1c;
    --color-red-800: #991b1b;
    --color-red-900: #7f1d1d;


    --color-orange-50: #fff7ed;
    --color-orange-100: #ffedd5;
    --color-orange-200: #fed7aa;
    --color-orange-300: #fdba74;
    --color-orange-400: #fb923c;
    --color-orange-500: #f97316;
    --color-orange-600: #ea580c;
    --color-orange-700: #c2410c;
    --color-orange-800: #9a3412;
    --color-orange-900: #7c2d12;


    --color-amber-50: #fffbeb;
    --color-amber-100: #fef3c7;
    --color-amber-200: #fde68a;
    --color-amber-300: #fcd34d;
    --color-amber-400: #fbbf24;
    --color-amber-500: #f59e0b;
    --color-amber-600: #d97706;
    --color-amber-700: #b45309;
    --color-amber-800: #92400e;
    --color-amber-900: #78350f;


    --color-yellow-50: #fefce8;
    --color-yellow-100: #fef9c3;
    --color-yellow-200: #fef08a;
    --color-yellow-300: #fde047;
    --color-yellow-400: #facc15;
    --color-yellow-500: #eab308;
    --color-yellow-600: #ca8a04;
    --color-yellow-700: #a16207;
    --color-yellow-800: #854d0e;
    --color-yellow-900: #713f12;


    --color-lime-50: #f7fee7;
    --color-lime-100: #ecfccb;
    --color-lime-200: #d9f99d;
    --color-lime-300: #bef264;
    --color-lime-400: #a3e635;
    --color-lime-500: #84cc16;
    --color-lime-600: #65a30d;
    --color-lime-700: #4d7c0f;
    --color-lime-800: #3f6212;
    --color-lime-900: #365314;


    --color-green-50: #f0fdf4;
    --color-green-100: #dcfce7;
    --color-green-200: #bbf7d0;
    --color-green-300: #86efac;
    --color-green-400: #4ade80;
    --color-green-500: #22c55e;
    --color-green-600: #33c38f;
    --color-green-700: #15803d;
    --color-green-800: #166534;
    --color-green-900: #14532d;


    --color-emerald-50: #ecfdf5;
    --color-emerald-100: #d1fae5;
    --color-emerald-200: #a7f3d0;
    --color-emerald-300: #6ee7b7;
    --color-emerald-400: #34d399;
    --color-emerald-500: #10b981;
    --color-emerald-600: #059669;
    --color-emerald-700: #047857;
    --color-emerald-800: #065f46;
    --color-emerald-900: #064e3b;


    --color-teal-50: #f0fdfa;
    --color-teal-100: #ccfbf1;
    --color-teal-200: #99f6e4;
    --color-teal-300: #5eead4;
    --color-teal-400: #2dd4bf;
    --color-teal-500: #14b8a6;
    --color-teal-600: #0d9488;
    --color-teal-700: #0f766e;
    --color-teal-800: #115e59;
    --color-teal-900: #134e4a;


    --color-cyan-50: #ecfeff;
    --color-cyan-100: #cffafe;
    --color-cyan-200: #a5f3fc;
    --color-cyan-300: #67e8f9;
    --color-cyan-400: #22d3ee;
    --color-cyan-500: #06b6d4;
    --color-cyan-600: #0891b2;
    --color-cyan-700: #0e7490;
    --color-cyan-800: #155e75;
    --color-cyan-900: #164e63;


    --color-sky-50: #f0f9ff;
    --color-sky-100: #e0f2fe;
    --color-sky-200: #bae6fd;
    --color-sky-300: #7dd3fc;
    --color-sky-400: #38bdf8;
    --color-sky-500: #0ea5e9;
    --color-sky-600: #0284c7;
    --color-sky-700: #0369a1;
    --color-sky-800: #075985;
    --color-sky-900: #0c4a6e;


    --color-blue-50: #eff6ff;
    --color-blue-100: #dbeafe;
    --color-blue-200: #bfdbfe;
    --color-blue-300: #93c5fd;
    --color-blue-400: #60a5fa;
    --color-blue-500: #3b82f6;
    --color-blue-600: #2563eb;
    --color-blue-700: #1d4ed8;
    --color-blue-800: #1e40af;
    --color-blue-900: #1e3a8a;


    --color-indigo-50: #eef2ff;
    --color-indigo-100: #e0e7ff;
    --color-indigo-200: #c7d2fe;
    --color-indigo-300: #a5b4fc;
    --color-indigo-400: #818cf8;
    --color-indigo-500: #6366f1;
    --color-indigo-600: #4f46e5;
    --color-indigo-700: #4338ca;
    --color-indigo-800: #3730a3;
    --color-indigo-900: #312e81;


    --color-violet-50: #f5f3ff;
    --color-violet-100: #ede9fe;
    --color-violet-200: #ddd6fe;
    --color-violet-300: #c4b5fd;
    --color-violet-400: #a78bfa;
    --color-violet-500: #8b5cf6;
    --color-violet-600: #7c3aed;
    --color-violet-700: #6d28d9;
    --color-violet-800: #5b21b6;
    --color-violet-900: #4c1d95;


    --color-purple-50: #faf5ff;
    --color-purple-100: #f3e8ff;
    --color-purple-200: #e9d5ff;
    --color-purple-300: #d8b4fe;
    --color-purple-400: #c084fc;
    --color-purple-500: #a855f7;
    --color-purple-600: #9333ea;
    --color-purple-700: #7e22ce;
    --color-purple-800: #6b21a8;
    --color-purple-900: #581c87;


    --color-fuchsia-50: #fdf4ff;
    --color-fuchsia-100: #fae8ff;
    --color-fuchsia-200: #f5d0fe;
    --color-fuchsia-300: #f0abfc;
    --color-fuchsia-400: #e879f9;
    --color-fuchsia-500: #d946ef;
    --color-fuchsia-600: #c026d3;
    --color-fuchsia-700: #a21caf;
    --color-fuchsia-800: #86198f;
    --color-fuchsia-900: #701a75;


    --color-pink-50: #fdf2f8;
    --color-pink-100: #fce7f3;
    --color-pink-200: #fbcfe8;
    --color-pink-300: #f9a8d4;
    --color-pink-400: #f472b6;
    --color-pink-500: #ec4899;
    --color-pink-600: #db2777;
    --color-pink-700: #be185d;
    --color-pink-800: #9d174d;
    --color-pink-900: #831843;


    --color-rose-50: #fff1f2;
    --color-rose-100: #ffe4e6;
    --color-rose-200: #fecdd3;
    --color-rose-300: #fda4af;
    --color-rose-400: #fb7185;
    --color-rose-500: #f43f5e;
    --color-rose-600: #e11d48;
    --color-rose-700: #be123c;
    --color-rose-800: #9f1239;
    --color-rose-900: #881337;

    --text-sixteen: 16px;

    --text-xs: 0.75rem;
    --text-sm: 0.875rem;
    --text-base: 1rem;
    --text-lg: 1.125rem;
    --text-xl: 1.25rem;
    --text-2xl: 1.5rem;
    --text-3xl: 1.875rem;
    --text-4xl: 2.25rem;
    --text-5xl: 3rem;
    --text-6xl: 3.75rem;
    --text-7xl: 4.5rem;
    --text-8xl: 6rem;
    --text-9xl: 8rem;

    --line-height-xs: 1rem;
    --line-height-sm: 1.25rem;
    --line-height-base: 1.5rem;
    --line-height-lg: 1.75rem;
    --line-height-xl: 1.75rem;
    --line-height-2xl: 2rem;
    --line-height-3xl: 2.25rem;
    --line-height-4xl: 2.5rem;
    --line-height-5xl: 1;
    --line-height-6xl: 1;
    --line-height-7xl: 1;
    --line-height-8xl: 1;
    --line-height-9xl: 1;

    --bs-secondary-color: var(--theme-subtle-foreground)
}



.py-1-half {
    padding-top: 0.375rem;
    padding-bottom: 0.375rem;
}

.text-sixteen {
    font-size: var(--text-sixteen);
    line-height: var(--line-height-base);
}

.text-xs {
    font-size: var(--text-xs);
    line-height: var(--line-height-xs);
}

.text-sm {
    font-size: var(--text-sm);
    line-height: var(--line-height-sm);
}

.text-base {
    font-size: var(--text-base);
    line-height: var(--line-height-base);
}

.text-lg {
    font-size: var(--text-lg);
    line-height: var(--line-height-lg);
}

.text-xl {
    font-size: var(--text-xl);
    line-height: var(--line-height-xl);
}

.text-2xl {
    font-size: var(--text-2xl);
    line-height: var(--line-height-2xl);
}

.text-3xl {
    font-size: var(--text-3xl);
    line-height: var(--line-height-3xl);
}

.text-4xl {
    font-size: var(--text-4xl);
    line-height: var(--line-height-4xl);
}

.text-5xl {
    font-size: var(--text-5xl);
    line-height: var(--line-height-5xl);
}

.text-6xl {
    font-size: var(--text-6xl);
    line-height: var(--line-height-6xl);
}

.text-7xl {
    font-size: var(--text-7xl);
    line-height: var(--line-height-7xl);
}

.text-8xl {
    font-size: var(--text-8xl);
    line-height: var(--line-height-8xl);
}

.text-9xl {
    font-size: var(--text-9xl);
    line-height: var(--line-height-9xl);
}

.min-w-0 {
    min-width: 0;
}

.border-end-2 {
    border-right: 2px var(--theme-border-style) var(--theme-border-color) !important;
}

.border-bottom-2 {
    border-bottom: 2px var(--theme-border-style) var(--theme-border-color) !important;
}

.border-dashed {
    border: 2px dashed var(--theme-border-color) !important;
}