@layer base {
    :root {
        --font-sans: 'Montserrat', sans-serif;
        --radius-sm: 8px;
        --radius-md: 12px;
        --radius-lg: 16px;
        --radius-xl: 20px;

        /* Standardized Component Sizes */
        --icon-circle-sm: 48px;
        --icon-circle-md: 60px;
        --icon-circle-lg: 80px;
        --icon-circle-xl: 100px;

        --shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.1);

        --transition-fast: 150ms ease;
        --transition-base: 300ms ease;

        /* Primary Blue Shades */
        --color-primary: #0040D0;
        --color-primary-rgb: 0, 64, 208;
        --color-primary-dark: #0035B5;
        --color-primary-mid: #3366E0;
        --color-primary-mid-rgb: 51, 102, 224;
        --color-primary-light: #A3BDF7;
        --color-primary-light-rgb: 163, 189, 247;
        --color-primary-pale: #EDF2FF;

        /* Secondary */
        --color-secondary-blue-magenta: #4F46E5;
        --color-secondary-turquoise: #06B6D4;
        --color-secondary-turquoise-rgb: 6, 182, 212;

        /* Neutrals */
        --color-text-dark: #1D1D1F;
        --color-text-dark-rgb: 29, 29, 31;
        --color-text-secondary: #6D6D6D;
        --color-background: #F9FAFB;
        --color-background-rgb: 249, 250, 251;
        --color-border: #D1D5DB;

        --color-white: #FFFFFF;
        --color-white-rgb: 255, 255, 255;

        /* Status Tags */
        --color-success: var(--color-secondary-turquoise);
        /* Turquoise as per requirements */
        --color-success-rgb: var(--color-secondary-turquoise-rgb);
        --color-success-light: #CFFAFE;
        --color-danger: #DC2626;
        --color-danger-rgb: 220, 38, 38;
        --color-danger-light: #FEE2E2;
        --color-warning-pale: #FFF4E6;

        /* Alert/CTA */
        --color-alert: #F4A261;
        --color-alert-rgb: 244, 162, 97;
        --color-cta: var(--color-alert);
        --color-cta-hover: #E8935A;

        --color-warning: var(--color-alert);
        --color-warning-rgb: var(--color-alert-rgb);

        --color-info: var(--color-primary);
        --color-info-rgb: var(--color-primary-rgb);
        --color-info-light: var(--color-primary-pale);

        --color-chart-1: #4F46E5;
        --color-chart-1-rgb: 79, 70, 229;
        --color-chart-2: var(--color-secondary-turquoise);
        --color-chart-2-rgb: var(--color-secondary-turquoise-rgb);
    }

    :root {
        --app-font-family: var(--font-sans);
        --app-primary: var(--color-primary);
        --app-primary-dark: var(--color-primary-dark);
        --app-accent: var(--color-cta);
        --app-background: var(--color-background);
        --app-text-dark: var(--color-text-dark);
        --app-text-secondary: var(--color-text-secondary);
        --app-border: var(--color-border);
        --app-white: var(--color-white);
        --app-white-rgb: var(--color-white-rgb);

        /* Compatibility aliases for public pages */
        --app-primary-mid: var(--color-primary-mid);
        --app-primary-mid-rgb: var(--color-primary-mid-rgb);
        --app-primary-dark: var(--color-primary-dark);
        --app-primary-light: var(--color-primary-light);
        --app-primary-rgb: var(--color-primary-rgb);
        --app-primary-light-rgb: var(--color-primary-light-rgb);
        --app-info: var(--color-secondary-turquoise);
        --app-info-rgb: var(--color-success-rgb);
        --app-success: var(--color-secondary-turquoise);

        /* Bootstrap Variable Overrides */
        --bs-font-sans-serif: var(--font-sans);

        /* Bootstrap Color System */
        --bs-primary: var(--color-primary-mid);
        --bs-primary-rgb: var(--color-primary-mid-rgb);
        --bs-secondary: var(--color-text-secondary);
        --bs-secondary-rgb: 109, 109, 109;
        --bs-success: var(--color-success);
        --bs-success-rgb: var(--color-success-rgb);
        --bs-info: var(--color-info);
        --bs-info-rgb: var(--color-info-rgb);
        --bs-warning: var(--color-warning);
        --bs-warning-rgb: var(--color-warning-rgb);
        --bs-danger: var(--color-danger);
        --bs-danger-rgb: var(--color-danger-rgb);
        --bs-light: var(--color-background);
        --bs-light-rgb: var(--color-background-rgb);
        --bs-dark: var(--color-text-dark);
        --bs-dark-rgb: var(--color-text-dark-rgb);

        /* Bootstrap Base Styles */
        --bs-body-bg: var(--color-background);
        --bs-body-color: var(--color-text-dark);
        --bs-body-font-family: var(--font-sans);
        --bs-border-color: var(--color-border);
        --bs-border-radius: var(--radius-md);
        --bs-border-radius-sm: var(--radius-sm);
        --bs-border-radius-lg: var(--radius-lg);
        --bs-border-radius-xl: var(--radius-xl);

        /* Links */
        --bs-link-color: var(--color-primary-mid);
        --bs-link-hover-color: var(--app-primary-mid);
        --bs-link-decoration: none;

        /* Button Overrides */
        --bs-btn-border-radius: var(--radius-md);
        --bs-btn-font-weight: 600;

        /* Form Control Overrides */
        --bs-form-control-border-radius: var(--radius-md);
    }

    body {
        font-family: var(--app-font-family) !important;
        background-color: var(--bs-body-bg) !important;
        color: var(--bs-body-color) !important;
    }

    /* --- Bootstrap Component Overrides --- */

    /* Buttons */
    .btn {
        border-radius: var(--radius-md);
        padding: 0.6rem 1.25rem;
        font-weight: 600;
        transition: var(--transition-base);
    }

    /* Button Variants */
    .btn-primary {
        --bs-btn-bg: var(--color-primary-mid) !important;
        --bs-btn-border-color: var(--color-primary-mid) !important;
        --bs-btn-hover-bg: var(--color-primary-dark) !important;
        --bs-btn-hover-border-color: var(--color-primary-dark) !important;
        --bs-btn-active-bg: var(--color-primary-dark) !important;
        --bs-btn-active-border-color: var(--color-primary-dark) !important;
        --bs-btn-color: var(--color-white) !important;
        --bs-btn-hover-color: var(--color-white) !important;
        --bs-btn-active-color: var(--color-white) !important;
    }

    .btn-secondary {
        --bs-btn-bg: var(--color-text-secondary) !important;
        --bs-btn-border-color: var(--color-text-secondary) !important;
        --bs-btn-color: var(--color-white) !important;
    }

    .btn-success {
        --bs-btn-bg: var(--color-success) !important;
        --bs-btn-border-color: var(--color-success) !important;
        --bs-btn-color: var(--color-white) !important;
    }

    .btn-info {
        --bs-btn-bg: var(--color-info) !important;
        --bs-btn-border-color: var(--color-info) !important;
        --bs-btn-color: var(--color-white) !important;
    }

    .btn-warning {
        --bs-btn-bg: var(--color-warning) !important;
        --bs-btn-border-color: var(--color-warning) !important;
        --bs-btn-color: var(--color-white) !important;
    }

    .btn-danger {
        --bs-btn-bg: var(--color-danger) !important;
        --bs-btn-border-color: var(--color-danger) !important;
        --bs-btn-color: var(--color-white) !important;
    }

    .btn-light {
        --bs-btn-bg: var(--color-background) !important;
        --bs-btn-border-color: var(--color-border) !important;
        --bs-btn-color: var(--color-text-dark) !important;
    }

    .btn-dark {
        --bs-btn-bg: var(--color-text-dark) !important;
        --bs-btn-border-color: var(--color-text-dark) !important;
        --bs-btn-color: var(--color-white) !important;
    }

    /* Outline Button Variants */
    .btn-outline-primary {
        --bs-btn-color: var(--color-primary-mid) !important;
        --bs-btn-border-color: var(--color-primary-mid) !important;
        --bs-btn-hover-bg: var(--color-primary) !important;
        --bs-btn-hover-color: var(--color-white) !important;
    }

    .btn-outline-secondary {
        --bs-btn-color: var(--color-text-secondary) !important;
        --bs-btn-border-color: var(--color-text-secondary) !important;
        --bs-btn-hover-bg: var(--color-text-secondary) !important;
        --bs-btn-hover-color: var(--color-white) !important;
    }

    .btn-outline-light {
        --bs-btn-color: var(--color-text-light) !important;
        --bs-btn-border-color: var(--color-border) !important;
        --bs-btn-hover-bg: var(--color-white) !important;
        --bs-btn-hover-color: var(--color-text-dark) !important;
    }

    /* Cards */
    .card {
        border-radius: var(--radius-lg);
        border: none;
        background-color: var(--color-white);
    }

    .shadow-lg {
        box-shadow: var(--shadow-lg) !important;
    }

    .rounded-4 {
        border-radius: var(--radius-xl) !important;
    }

    /* Forms */
    .form-control,
    .form-select {
        border-radius: var(--radius-md) !important;
        border: 1px solid var(--color-border) !important;
        background-color: var(--color-white) !important;
        color: var(--color-text-dark) !important;
        transition: var(--transition-fast) !important;
    }

    .form-control::placeholder {
        color: var(--color-text-secondary) !important;
    }

    .form-control:focus,
    .form-select:focus {
        border-color: var(--app-primary-mid) !important;
        border-width: 2px !important;
        box-shadow: 0 0 0 4px rgba(var(--color-primary-rgb), 0.1) !important;
        outline: none !important;
    }

    .input-group-text {
        border-radius: var(--radius-md);
        background-color: var(--color-white);
        border: 1px solid var(--color-border);
        color: var(--color-text-secondary);
    }

    .form-icon-wrapper {
        position: relative;
    }

    .form-control-with-icon {
        padding-left: 2.5rem !important;
    }

    .form-icon {
        position: absolute;
        left: 0.875rem;
        top: 50%;
        transform: translateY(-50%);
        color: var(--color-text-secondary);
        z-index: 5;
        pointer-events: none;
        font-size: 0.875rem;
    }

    .password-toggle-btn {
        right: 0.5rem;
        top: 50%;
        transform: translateY(-50%);
        z-index: 10;
        border: none !important;
        background: transparent !important;
        padding: 0.25rem 0.5rem;
    }

    .form-control-with-icon+.password-toggle-btn {
        right: 0.5rem;
    }

    /* Bootstrap 5 Input Group Best Practices */
    .input-group .input-group-text+.form-control {
        border-left: 0;
    }

    .input-group .input-group-text i {
        color: var(--color-text-secondary);
    }



    /* --- Bootstrap Utility Class Overrides --- */

    .bg-primary {
        background-color: rgba(var(--app-primary-mid-rgb), var(--bs-bg-opacity, 1)) !important;
    }

    .bg-info {
        background-color: rgba(var(--app-primary-light-rgb), var(--bs-bg-opacity, 1)) !important;
    }

    .bg-secondary {
        background-color: var(--color-text-secondary) !important;
    }

    .bg-success {
        background-color: rgba(var(--color-success-rgb), var(--bs-bg-opacity, 1)) !important;
    }

    .bg-warning {
        background-color: rgba(var(--color-warning-rgb), var(--bs-bg-opacity, 1)) !important;
    }

    .bg-danger {
        background-color: rgba(var(--color-danger-rgb), var(--bs-bg-opacity, 1)) !important;
    }

    .bg-light {
        background-color: var(--color-background) !important;
    }

    .bg-dark {
        background-color: var(--color-text-dark) !important;
    }

    /* Text Colors */
    .text-primary {
        color: var(--color-primary-mid) !important;
    }

    .text-secondary {
        color: var(--color-text-secondary) !important;
    }

    .text-success {
        color: var(--color-success) !important;
    }

    .text-info {
        color: var(--color-info) !important;
    }

    .text-warning {
        color: var(--color-warning) !important;
    }

    .text-danger {
        color: var(--color-danger) !important;
    }

    .text-light {
        color: var(--color-background) !important;
    }

    .text-dark {
        color: var(--color-text-dark) !important;
    }

    .text-muted {
        color: var(--color-text-secondary) !important;
    }

    .text-white {
        color: var(--color-white) !important;
    }



    /* Language Switcher Dropdown Arrow */
    .dropdown-toggle::after {
        color: var(--color-white) !important;
    }

    /* Border Colors */
    .border-primary {
        border-color: var(--color-primary-mid) !important;
    }

    .border-secondary {
        border-color: var(--color-text-secondary) !important;
    }

    .border-success {
        border-color: var(--color-success) !important;
    }

    .border-info {
        border-color: var(--color-info) !important;
    }

    .border-warning {
        border-color: var(--color-warning) !important;
    }

    .border-danger {
        border-color: var(--color-danger) !important;
    }

    .border-light {
        border-color: var(--color-border) !important;
    }

    .border-dark {
        border-color: var(--color-text-dark) !important;
    }

    /* Alert Components */
    .alert-primary {
        background-color: var(--color-primary-pale);
        border-color: var(--color-primary-light);
        color: var(--color-primary-dark);
    }

    .alert-success {
        background-color: var(--color-success-light);
        border-color: var(--color-success);
        color: var(--color-text-dark);
    }

    .alert-info {
        background-color: var(--color-info-light);
        border-color: var(--color-primary-light);
        color: var(--color-primary-dark);
    }

    .alert-warning {
        background-color: var(--color-warning-pale);
        border-color: var(--color-warning);
        color: var(--color-text-dark);
    }

    .alert-danger {
        background-color: var(--color-danger-light);
        border-color: var(--color-danger);
        color: var(--color-danger);
    }

    /* Badge Components */
    .badge.bg-primary {
        background-color: var(--color-primary-mid) !important;
        color: var(--color-white);
    }

    .badge.bg-success {
        background-color: var(--color-success) !important;
        color: var(--color-white);
    }

    .badge.bg-info {
        background-color: var(--color-info) !important;
        color: var(--color-white);
    }

    .badge.bg-warning {
        background-color: var(--color-warning) !important;
        color: var(--color-white);
    }

    .badge.bg-danger {
        background-color: var(--color-danger) !important;
        color: var(--color-white);
    }

    /* Progress Bar */
    .progress {
        background-color: var(--color-background);
        border-radius: var(--radius-sm);
    }

    .progress-bar {
        background-color: var(--color-primary-mid);
    }

    .progress-bar.bg-success {
        background-color: var(--color-success) !important;
    }

    .progress-bar.bg-warning {
        background-color: var(--color-warning) !important;
    }

    .progress-bar.bg-danger {
        background-color: var(--color-danger) !important;
    }

    /* Spinner */
    .spinner-border {
        color: var(--color-primary-mid);
    }

    .spinner-border.text-primary {
        color: var(--color-primary-mid) !important;
    }

    .spinner-border.text-success {
        color: var(--color-success) !important;
    }

    .spinner-border.text-warning {
        color: var(--color-warning) !important;
    }
}