/* style.css */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Montserrat:wght@600;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:wght,FILL@100..700,0..1&display=swap');

/* Google Material Icons setup */
.material-symbols-outlined {
    font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
}

/* Hide scrollbar for Chrome, Safari and Opera */
.hide-scrollbar::-webkit-scrollbar {
    display: none;
}
.hide-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

/* Handle safe area for bottom nav on modern mobile devices */
.pb-safe {
    padding-bottom: env(safe-area-inset-bottom);
}
@supports (padding-bottom: env(safe-area-inset-bottom)) {
    nav.fixed.bottom-0 {
        height: calc(4rem + env(safe-area-inset-bottom));
        padding-bottom: env(safe-area-inset-bottom);
    }
}

/* Swiper specific overrides if needed */
.swiper-pagination-bullet-active {
    background: #006b5a !important; /* Secondary color */
}

/* Glassmorphism effects */
.glass-panel {
    background: rgba(255, 255, 255, 0.9);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}
.dark .glass-panel {
    background: rgba(30, 41, 59, 0.8);
}

/* Portfolio Tabs Active State */
.project-tab.active {
    background: linear-gradient(135deg, #2596be, #1a6b8a) !important;
    color: #ffffff !important;
}

.project-tab.active i, 
.project-tab.active span {
    color: #ffffff !important;
}