@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700;800&display=swap');

@tailwind base;
@tailwind components;
@tailwind utilities;

@keyframes slideUp { from { opacity: 0; transform: translateY(40px); } to { opacity: 1; transform: translateY(0); } }
.animate-slide-up { animation: slideUp 0.5s cubic-bezier(0.16, 1, 0.3, 1) forwards; }

.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

/* --- THEME ENGINE --- */
:root {
    --color-primary: #003B5C; 
    --color-accent: #C29B40; 
}

.theme-cyber  { --color-primary: #06b6d4; --color-accent: #22d3ee; }
.theme-forest { --color-primary: #10b981; --color-accent: #34d399; }
.theme-royal  { --color-primary: #7c3aed; --color-accent: #a78bfa; }
.theme-sunset { --color-primary: #ea580c; --color-accent: #fb923c; }

body { 
    font-family: 'Inter', sans-serif;
    -webkit-font-smoothing: antialiased;
}
body.no-scroll { overflow: hidden; }

/* Apple-Style Glass Panel - UPDATED RADIUS */
.glass-panel {
    background-color: #ffffff;
    border-radius: 2rem; /* 32px - Matching Dashboard Cards */
    box-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.05);
    border: 1px solid rgba(0,0,0,0.02);
}

.dark .glass-panel {
    background-color: #1c1c1e; /* Apple Dark Gray */
    border: 1px solid rgba(255,255,255,0.08);
    box-shadow: 0 10px 30px -10px rgba(0, 0, 0, 0.3);
}

/* Sidebar Button Styling */
.nav-item {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 1rem;
    padding: 0.875rem 1rem;
    font-size: 0.9rem;
    font-weight: 600;
    border-radius: 1rem;
    transition: all 0.2s ease;
    color: #64748b;
    margin-bottom: 0.25rem;
}
.dark .nav-item { color: #94a3b8; }

.nav-item:hover { background-color: #f1f5f9; color: var(--color-primary); transform: translateX(4px); }
.dark .nav-item:hover { background-color: #27272a; color: white; }

.nav-item.active {
    background-color: var(--color-primary);
    color: white;
    box-shadow: 0 8px 20px -6px rgba(0, 59, 92, 0.4);
    transform: translateX(4px);
}
.dark .nav-item.active { box-shadow: 0 8px 20px -6px rgba(0, 0, 0, 0.4); }

/* Header Buttons */
.btn-icon {
    padding: 0.75rem;
    border-radius: 9999px;
    background-color: white;
    color: #64748b;
    transition: all 0.2s;
    box-shadow: 0 4px 12px rgba(0,0,0,0.05);
}
.dark .btn-icon { background-color: #1c1c1e; color: #94a3b8; border: 1px solid rgba(255,255,255,0.1); }
.btn-icon:hover { color: var(--color-primary); transform: scale(1.1); }

/* Bottom Nav Items */
.bottom-nav-item { color: #9ca3af; }
.bottom-nav-item.active { color: var(--color-primary); background-color: rgba(0,59,92,0.05); }
.dark .bottom-nav-item.active { color: white; background-color: rgba(255,255,255,0.1); }

/* Tooltip */
#chart-tooltip {
    position: fixed;
    background-color: rgba(0,0,0,0.8);
    backdrop-filter: blur(8px);
    color: white;
    padding: 8px 12px;
    border-radius: 12px;
    font-size: 12px;
    font-weight: 600;
    pointer-events: none;
    z-index: 100;
    transform: translate(-50%, -120%);
    opacity: 0;
    transition: opacity 0.15s ease;
    box-shadow: 0 10px 20px rgba(0,0,0,0.2);
}
#chart-tooltip.visible { opacity: 1; }

@media (max-width: 768px) {
    #content-area { padding-bottom: 7rem; }
}

/* Toast Animation */
@keyframes slideDown { from { transform: translateY(-100%) scale(0.9); opacity: 0; } to { transform: translateY(0) scale(1); opacity: 1; } }
@keyframes fadeOut { from { opacity: 1; } to { opacity: 0; transform: scale(0.95); } }
.toast-enter { animation: slideDown 0.4s cubic-bezier(0.19, 1, 0.22, 1) forwards; }
.toast-exit { animation: fadeOut 0.3s ease forwards; }