/* Custom color overrides - maps Tailwind custom theme tokens to actual CSS */
:root {
    --color-primary: #002444;
    --color-on-primary: #ffffff;
    --color-primary-container: #1a3a5c;
    --color-on-primary-container: #87a4cc;
    --color-secondary: #755b00;
    --color-tertiary: #755b00;
    --color-tertiary-container: #c9a84c;
    --color-background: #f8f9fa;
    --color-on-background: #191c1d;
    --color-surface: #f8f9fa;
    --color-on-surface: #191c1d;
    --color-outline-variant: #c3c6cf;
    --color-surface-container-low: #f3f4f5;
    --color-surface-container-high: #e7e8e9;
    --color-surface-container-highest: #e1e3e4;
}

/* Background color utilities */
.bg-primary { background-color: #002444 !important; }
.bg-primary-container { background-color: #1a3a5c !important; }
.bg-secondary { background-color: #755b00 !important; }
.bg-secondary-container { background-color: #fed977 !important; }
.bg-tertiary { background-color: #755b00 !important; }
.bg-tertiary-container { background-color: #c9a84c !important; }
.bg-background { background-color: #f8f9fa !important; }
.bg-surface { background-color: #f8f9fa !important; }
.bg-surface-variant { background-color: #e1e3e4 !important; }
.bg-surface-container { background-color: #edeeef !important; }
.bg-surface-container-low { background-color: #f3f4f5 !important; }
.bg-surface-container-high { background-color: #e7e8e9 !important; }
.bg-surface-container-highest { background-color: #e1e3e4 !important; }
.bg-surface-container-lowest { background-color: #ffffff !important; }
.bg-error { background-color: #ba1a1a !important; }
.bg-error-container { background-color: #ffdad6 !important; }

/* Text color utilities */
.text-primary { color: #002444 !important; }
.text-on-primary { color: #ffffff !important; }
.text-on-primary-container { color: #87a4cc !important; }
.text-secondary { color: #755b00 !important; }
.text-tertiary { color: #755b00 !important; }
.text-tertiary-container { color: #c9a84c !important; }
.text-on-tertiary-container { color: #503d00 !important; }
.text-on-secondary-fixed { color: #241a00 !important; }
.text-on-background { color: #191c1d !important; }
.text-on-surface { color: #191c1d !important; }
.text-on-surface-variant { color: #43474e !important; }
.text-on-secondary-container { color: #785d00 !important; }

/* Border utilities */
.border-outline-variant { border-color: #c3c6cf !important; }
.border-outline { border-color: #73777f !important; }
.border-primary { border-color: #002444 !important; }

/* Hover states */
.hover\:bg-surface-container-low:hover { background-color: #f3f4f5 !important; }
.hover\:text-tertiary:hover { color: #755b00 !important; }
.group:hover .group-hover\:text-tertiary { color: #755b00 !important; }

/* Font families */
.font-body, .font-headline, .font-label { font-family: 'Poppins', sans-serif; }

/* SPA View Animations */
.animate-fade-in {
    animation: fadeIn 0.3s cubic-bezier(0.4, 0, 0.2, 1) forwards;
}

@keyframes fadeIn {
    0% {
        opacity: 0.4;
        transform: translateY(10px);
    }
    100% {
        opacity: 1;
        transform: translateY(0);
    }
}
