/* 
   Midnight Aurora Design System - Tailwind Centralized Edition
*/

:root {
    --brand-primary: #4318FF;
    --brand-secondary: #707EAE;
    --brand-navy: #1B2559;
    --brand-bg: #F4F7FE;
    --brand-accent: #05CD99;
}

/* Base Body Styles */
body {
    background-color: var(--brand-bg);
    color: var(--brand-navy);
}

/* Custom Components - Centralized */
.glass-effect {
    background: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(12px);
    -webkit-backdrop-filter: blur(12px);
    border: 1px solid rgba(255, 255, 255, 0.3);
}

.premium-shadow {
    box-shadow: 0px 20px 50px rgba(112, 144, 176, 0.12);
}

/* Custom Scrollbar */
::-webkit-scrollbar {
    width: 8px;
}
::-webkit-scrollbar-track {
    background: var(--brand-bg);
}
::-webkit-scrollbar-thumb {
    background: #E0E5F2;
    border-radius: 10px;
}
::-webkit-scrollbar-thumb:hover {
    background: #D0D5E2;
}

/* HTMX Transitions */
.htmx-added {
    opacity: 0;
}
.htmx-settling {
    opacity: 1;
    transition: opacity 0.3s ease-in;
}

/* Animation Utilities */
.animate-on-hover {
    transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.animate-on-hover:hover {
    transform: translateY(-4px);
}