:root {
    --primary-color: #049DA7;
    --secondary-color: #5F81C1;
    --accent-color: #5F81C1;
    --warning-color: #fd7e14;
    --background-color: #141921;
    --text-color: #f0f6fc;

    /* Dark theme surface tokens (aligned with marketing site) */
    --color-bg: #0e1117;
    --color-surface: #141921;
    --color-surface-2: #1a2133;
    --color-text: #f0f6fc;
    --color-muted: rgba(240, 246, 252, 0.6);
    --color-border: rgba(4, 157, 167, 0.2);
    --color-border-subtle: rgba(240, 246, 252, 0.08);

    /* Brand gradient (brand teal→slate, replaces off-brand purple) */
    --gradient: linear-gradient(135deg, #049DA7 0%, #5F81C1 100%);
    --gradient-start: #049DA7;
    --gradient-end: #5F81C1;

    /* Border radius scale */
    --radius: 8px;
    --radius-lg: 16px;

    /* Extended palette for existing colors */
    --error-color: #b32121;
    --border-color: #929292;

    /* Bootstrap-style colors */
    --light-gray: #e9ecef;
    --dark-gray: #495057;
    --medium-gray: #6c757d;
    --success-bg: #d4edda;
    --success-text: #155724;
    --success-border: #28a745;
    --info-bg: #d1ecf1;
    --info-text: #0c5460;
    --info-border: #17a2b8;

    /* Additional colors for danger/warning states */
    --danger-color: #dc3545;
    --danger-hover: #c82333;
    --danger-bg: #f8d7da;
    --warning-bg: #fff3cd;

    /* Dark-mode error tokens (replaces Bootstrap danger colours in dark theme) */
    --color-error-bg: rgba(220, 53, 69, 0.15);
    --color-error-text: #ea868f;
    --color-error-border: rgba(220, 53, 69, 0.35);
    --warning-text: #856404;
    --warning-hover: #b8860b;

    /* Primary color hover state */
    --primary-hover: #038891;

    /* Event colors for event cards */
    --success-color: #28a745;    /* Green */
    --info-color: #17a2b8;       /* Cyan */
    --dark-color: #495057;       /* Charcoal */
    --light-color: #e9ecef;      /* Light Gray */

    /* White */
    --color-white: #fff;

    /* Overlay colors */
    --overlay-light: rgba(255, 255, 255, 0.5);
    --overlay-dark: rgba(20, 25, 33, 0.8);
    --primary-overlay-light: rgba(4, 157, 167, 0.1);
    --primary-overlay-medium: rgba(4, 157, 167, 0.2);
    --shadow-color: rgba(0, 0, 0, 0.15);

    /* Text colors for light backgrounds */
    --text-on-light: #2d3748;
    --text-muted-on-light: #4a5568;
}