/* styles/main.css */

.light-theme {
    --bg-primary: #f0f2f5;
    --bg-secondary: #ffffff;
    --text-primary: #2d3748;
    --text-secondary: #4a5568;
    --text-accent: var(--emphasis-forest-floor);
    --bg-highlight: rgba(0, 0, 0, 0.05);
}

:root {
    /* Original Brand Colors */
    --primary-sky-diver-blue: #08D8E4;
    --primary-wild-vine-green: #A3D100;
    --primary-sunset-blaze: #F05A00;
    --emphasis-twilight-sky: #004E5F;
    --emphasis-forest-floor: #004E42;

    /* Dark Theme Variables */
    --bg-primary: #1a202c;
    --bg-secondary: #2d3748;
    --text-primary: #edf2f7;
    --text-secondary: #a0aec0;
    --accent-primary: var(--primary-sky-diver-blue);
    --accent-secondary: var(--primary-sunset-blaze);
    --accent-tertiary: var(--primary-wild-vine-green);
    --text-accent: var(--emphasis-twilight-sky);
    --bg-highlight: #4a5568; /* text-secondary in dark mode */
}

body {
    font-family: 'Inter', sans-serif;
    background-color: var(--bg-primary);
    color: var(--text-primary);
}

/* Backgrounds */
.bg-primary { background-color: var(--bg-primary); }
.bg-secondary { background-color: var(--bg-secondary); }
.bg-accent-secondary { background-color: var(--accent-secondary); }

/* Text Colors */
.text-primary { color: var(--text-primary); }
.text-secondary { color: var(--text-secondary); }
.text-accent { color: var(--text-accent); }
.text-accent-primary { color: var(--accent-primary); }
.text-accent-secondary { color: var(--accent-secondary); }
.text-accent-tertiary { color: var(--accent-tertiary); }

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

/* Hover States */
.hover-text-accent:hover {
    color: var(--accent-secondary);
}

.hover-bg-highlight:hover {
    background-color: var(--bg-highlight);
}

.nav-link {
    padding: 0.5rem 1rem;
    border-radius: 0.375rem;
    transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
}

.nav-link:hover {
    background-color: var(--bg-highlight);
    color: var(--accent-secondary);
}

.hover-opacity-90:hover {
    opacity: 0.9;
}

/* Prose Override for Dark Theme */
.prose {
    color: var(--text-secondary);
}

/* Hero Section */
.hero img {
    height: 12rem;
    filter: drop-shadow(0 5px 15px rgba(0,0,0,0.3));
}

/* 5-Tile Grid */
.tile-grid > div {
    transition: transform 0.3s ease-in-out;
}

.tile-grid > div:hover {
    transform: translateY(-5px);
}

.team-img-border {
    border: 4px solid var(--text-primary);
}

.bio-overlay {
    overflow-y: auto;
    scrollbar-width: thin;
    scrollbar-color: var(--accent-primary) transparent;
}

/* Custom Form Input Styling */
.form-input-custom {
    background-color: var(--bg-primary);
    border: 1px solid var(--text-secondary);
    color: var(--text-primary);
    border-radius: 0.375rem; /* 6px */
    padding: 0.75rem 1rem; /* 12px 16px */
    width: 100%;
}

.form-input-custom:focus {
    border-color: var(--accent-primary);
    outline: none;
    box-shadow: 0 0 0 2px var(--accent-primary);
}