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

:root {
    --primary-purple: #7e22ce;
    --sidebar-width: 280px;
    --nav-height: 114px;
}

/* Base Reset */
body { 
    font-family: 'Roboto', sans-serif; 
    background-color: #f3f4f6; 
    scroll-behavior: smooth; 
    overflow-x: hidden; 
}

/* Scrollbar Utility */
.no-scrollbar::-webkit-scrollbar { display: none; }
.no-scrollbar { -ms-overflow-style: none; scrollbar-width: none; }

/* Sidebar Logic */
.sidebar-overlay { 
    background: rgba(0, 0, 0, 0.6); 
    backdrop-filter: blur(3px); 
    display: none; 
    position: fixed;
    inset: 0;
    z-index: 100;
}
.sidebar-overlay.active { display: block; }

#sidebar { 
    transition: transform 0.3s ease-in-out; 
    transform: translateX(-100%); 
    position: fixed;
    left: 0;
    top: 0;
    height: 100%;
    width: var(--sidebar-width);
    background: white;
    z-index: 101;
    box-shadow: 25px 0 50px -12px rgba(0, 0, 0, 0.25);
}
#sidebar.open { transform: translateX(0); }

/* Navigation & Tabs */
.tab-active { 
    border-top: 3px solid var(--primary-purple); 
    background: linear-gradient(180deg, #f3e8ff 0%, #ffffff 100%); 
}

.sub-tab-active {  
    background: var(--primary-purple) !important;  
    color: white !important;  
    border-color: var(--primary-purple) !important;  
}

.sticky-sub-nav {
    position: sticky;
    z-index: 30;
    background: white;
    transition: top 0.3s ease;
    top: var(--nav-height) !important;
}

/* UI Elements */
.timer-box { 
    background: black; 
    color: white; 
    padding: 2px 4px; 
    border-radius: 2px; 
    font-weight: bold; 
    font-size: 10px; 
}

.modal-overlay { 
    background: rgba(0, 0, 0, 0.85); 
    backdrop-filter: blur(3px); 
    position: fixed;
    inset: 0;
    z-index: 150;
}

/* Slider Components */
.slider-container { overflow: hidden; position: relative; width: 100%; border-radius: 12px; }
.slider-track { display: flex; transition: transform 0.5s ease-in-out; }
.slide { min-width: 100%; }