/* FILE: assets/css/responsive.css */
/* MOBILE RESPONSIVE FIXES FOR ANKERGAMES DESIGN */

@media (max-width: 1200px) {
    .nav-menu { gap: 10px; }
    .nav-search-bar .nav-search-inner { max-width: 90%; }
}

@media (max-width: 992px) {
    /* Navbar Hamburger */
    .nav-menu {
        display: flex;
        flex-direction: column;
        position: fixed;
        top: 70px;
        left: -100%;
        width: 250px;
        height: calc(100vh - 70px);
        background: rgba(13, 13, 14, 0.98);
        backdrop-filter: blur(15px);
        padding: 20px;
        transition: left 0.3s ease;
        overflow-y: auto;
        box-shadow: 2px 0 10px rgba(0,0,0,0.5);
    }
    
    .nav-menu.open { left: 0; }
    
    .nav-item { border-bottom: 1px solid rgba(255,255,255,0.05); padding-bottom: 10px; margin-bottom: 10px; }
    .nav-item.has-dropdown { flex-direction: column; align-items: flex-start; }
    .nav-dropdown { position: static; transform: none; min-width: 100%; box-shadow: none; border: none; background: rgba(0,0,0,0.2); padding: 10px; margin-top: 10px; display: none; }
    .has-dropdown:hover .nav-dropdown { display: block; }
    
    .nav-hamburger { display: flex; }
    .nav-hamburger.open span:nth-child(1) { transform: translateY(7px) rotate(45deg); }
    .nav-hamburger.open span:nth-child(2) { opacity: 0; }
    .nav-hamburger.open span:nth-child(3) { transform: translateY(-7px) rotate(-45deg); }
    
    /* Layout */
    .main-layout { padding-top: 80px; }
    .hero-slider { height: 400px; flex-direction: column; padding: 20px 0; }
    .slider-text-content { max-width: 100%; text-align: center; }
    .hero-title { font-size: 2.2rem; }
    .slider-cards-container { display: none; /* hide mini cards on mobile */ }
    
    /* Community */
    .community-bar { grid-template-columns: 1fr 1fr; }
    
    /* Top Games */
    .period-tabs { flex-wrap: wrap; justify-content: center; }
}

@media (max-width: 768px) {
    .nav-auth-btns { display: none; /* Hide auth btns on small mobile navbar, user can use menu or modal */ }
    .nav-logo-text { font-size: 1.1rem; }
    
    .community-bar { grid-template-columns: 1fr; }
    .categories-grid-new { grid-template-columns: 1fr 1fr; }
    
    .top-game-row { flex-direction: column; text-align: center; gap: 10px; }
    .top-game-rank { font-size: 1.5rem; }
    .top-game-cover { margin-right: 0; width: 100%; height: 120px; }
    
    .footer-card { grid-template-columns: 1fr; gap: 20px; padding: 30px 20px; text-align: center; }
    .footer-social { justify-content: center; }
}

@media (max-width: 480px) {
    .categories-grid-new { grid-template-columns: 1fr; }
    .section-header { flex-direction: column; align-items: flex-start; gap: 10px; }
    .view-all-btn { align-self: flex-start; }
}