:root {
    /* Colors - Blue Tones as requested */
    --primary: #0056b3;
    /* Deep Blue */
    --primary-hover: #004494;
    --secondary: #00a8e8;
    /* Bright Blue */
    --accent: #ffb703;
    /* Yellow/Orange for contrast */

    --bg-body: #f4f7fa;
    --bg-card: #ffffff;
    --text-main: #1a1a1a;
    --text-muted: #6c757d;
    --border: #dee2e6;

    --success: #28a745;
    --danger: #dc3545;
    --warning: #ffc107;

    /* Fonts */
    --font-heading: 'League Spartan', 'Kanit', sans-serif;
    --font-body: 'Kanit', sans-serif;

    /* Spacing & Layout */
    --container-width: 1200px;
    --radius-sm: 12px;
    --radius-md: 20px;
    --radius-lg: 32px;
    --radius-full: 9999px;

    --shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.05);
    --shadow-md: 0 4px 6px rgba(0, 0, 0, 0.1);
    --shadow-lg: 0 10px 15px rgba(0, 0, 0, 0.1);

    --transition: all 0.3s ease;
}

/* Dark Mode Support (optional, can be expanded later) */
@media (prefers-color-scheme: dark_TODO) {
    :root {
        --bg-body: #121212;
        --bg-card: #1e1e1e;
        --text-main: #e0e0e0;
    }
}