/* CSS Variables for theming */
:root {
    /* Light theme colors */
    --background: #ffffff;
    --foreground: #1a1a1a;
    --primary: #1a365d;
    --primary-foreground: #ffffff;
    --secondary: #f5f5dc;
    --secondary-foreground: #1a1a1a;
    --muted: #f8f9fa;
    --muted-foreground: #6c757d;
    --accent: #8b4513;
    --accent-foreground: #ffffff;
    --border: #e9ecef;
    --input: #ffffff;
    --ring: #1a365d;

    /* School colors */
    --school-navy: #1a365d;
    --school-brown: #8b4513;
    --school-beige: #f5f5dc;
    --school-light-beige: #fafaf0;
    --school-white: #ffffff;

    /* Spacing */
    --container-padding: 1rem;
    --section-padding: 4rem 0;

    /* Transitions */
    --transition: all 0.3s ease;

    /* Semantic Colors */
    --header-bg: var(--school-navy);
    --header-text: var(--school-white);
    --nav-link-color: var(--school-beige);
    --header-icon-bg: var(--school-white);
    --header-icon-color: var(--school-navy);
    --hero-bg: linear-gradient(135deg, var(--school-navy) 0%, var(--school-brown) 100%);
    --hero-text: var(--school-white);
    --footer-bg: var(--school-navy);
    --footer-text: var(--school-white);
    --nav-active-bg: var(--school-brown);
}

/* Dark theme */
[data-theme="dark"] {
    --background: #111111;
    --foreground: #eeeeee;
    --primary: #ffffff;
    --primary-foreground: #111111;
    --secondary: #2d3748;
    --secondary-foreground: #ffffff;
    --muted: #222222;
    --muted-foreground: #a0aec0;
    --accent: #a0522d;
    /* Slightly more vibrant sienna for dark mode */
    --accent-foreground: #ffffff;
    --border: #333333;
    --input: #1a1a1a;
    --ring: #ffffff;

    /* Semantic Colors - Dark */
    --header-bg: #0a0a0a;
    --header-text: #ffffff;
    --nav-link-color: #a0aec0;
    --header-icon-bg: #222222;
    --header-icon-color: #ffffff;
    --hero-bg: linear-gradient(135deg, #0a0a0a 0%, #3d2a21 100%);
    --hero-text: #ffffff;
    --footer-bg: #050505;
    --footer-text: #ffffff;
    --nav-active-bg: var(--accent);
}