:root {
    /* Main Colors */
    --la-color-primary: #0d6efd;
    --la-color-primary-soft: rgba(13, 110, 253, 0.1);
    --la-color-secondary: #6c757d;
    --la-color-text-on-primary: #ffffff;

    /* Semantic Colors */
    --la-color-success: #198754;
    --la-color-info: #0dcaf0;
    --la-color-warning: #ffc107;
    --la-color-danger: #dc3545;

    /* Surfaces & Backgrounds */
    --la-color-bg-page: #fdfbfb;
    --la-color-bg-page-alt: #ebedee;
    --la-color-bg-surface: #ffffff;
    --la-color-bg-surface-2: #f8f9fa;
    --la-color-border: #dee2e6;

    /* Typography */
    --la-font-family-body: 'Manrope', sans-serif;
    --la-font-family-headings: 'Manrope', sans-serif;
    --la-font-size-base: 16px;
    --la-line-height-base: 1.5;
    --la-weight-bold: 700;

    /* Texts */
    --la-color-text-base: #212529;
    --la-color-text-muted: #6c757d;

    /* Forms */
    --la-radius-sm: 0.25rem;
    --la-radius-base: 0.375rem;
    --la-radius-lg: 0.5rem;
    --la-border-width: 1px;

    /* Depth */
    --la-shadow-sm: 0 .125rem .25rem rgba(0, 0, 0, .075);
    --la-shadow-md: 0 .5rem 1rem rgba(0, 0, 0, .15);
    --la-shadow-lg: 0 1rem 3rem rgba(0, 0, 0, .175);

    /* Layout */
    --la-content-max-width: 1320px;
    --la-sidebar-width: 280px;
    --la-navbar-height: 70px;

    /* Spacing */
    --la-space-1: 0.25rem;
    --la-space-2: 0.5rem;
    --la-space-3: 1rem;
    --la-space-4: 1.5rem;
}

[data-theme="dark"] {
    --la-color-bg-page: #121212;
    --la-color-bg-page-alt: #1a1a1a;
    --la-color-bg-surface: #1e1e1e;
    --la-color-bg-surface-2: #2c2c2c;
    --la-color-border: #333;
    --la-color-text-base: #e0e0e0;
    --la-color-text-muted: #a0a0a0;

    /* Bootstrap native variable overrides for full dark mode compatibility */
    --bs-body-bg: #121212;
    --bs-body-color: #e0e0e0;
    --bs-secondary-color: #a0a0a0;
    --bs-secondary-bg: #1a1a1a;
    --bs-tertiary-bg: #2c2c2c;
    --bs-border-color: #333;
    --bs-card-bg: #1e1e1e;
    --bs-card-border-color: #333;
    --bs-card-cap-bg: #2c2c2c;
    --bs-card-color: #e0e0e0;
    --bs-input-bg: #2c2c2c;
    --bs-input-color: #e0e0e0;
    --bs-input-border-color: #444;
    --bs-heading-color: #e0e0e0;
    --bs-link-color: #6ea8fe;
    --bs-table-color: #e0e0e0;
    --bs-table-bg: transparent;
    --bs-table-striped-bg: rgba(255, 255, 255, 0.05);
    --bs-table-border-color: #444;
    --bs-modal-bg: #1e1e1e;
    --bs-modal-color: #e0e0e0;
    --bs-dropdown-bg: #1e1e1e;
    --bs-dropdown-color: #e0e0e0;
    --bs-dropdown-border-color: #444;
    --bs-dropdown-link-color: #e0e0e0;
    --bs-dropdown-link-hover-bg: #2c2c2c;
}