/* 
 * KLTA Mobile Styles v11.66 - THE GHOST MENU PATCH
 */

/* 🛑 GLOBAL SAFETY: Hide mobile elements by default on desktop */
.klta-mobile-toggle, .klta-mobile-dropdown { display: none !important; }

@media (max-width: 768px) {
    
    /* 🐢 TOP BAR */
    .klta-top-bar { font-size: 11px; padding: 15px 10px; text-align: center; }

    /* 🏢 NAV PILL -> MOBILE MODE */
    .klta-menu-card { 
        padding: 10px 25px !important; 
        width: 85% !important; 
        justify-content: space-between !important;
        border-radius: 50px !important;
    }
    .klta-nav-links { display: none !important; } /* Hides desktop links on mobile */
    
    .klta-mobile-toggle { 
        display: flex !important; 
        background: var(--klta-deep-blue); 
        color: white; 
        width: 40px; height: 40px; 
        border-radius: 50%; 
        align-items: center; 
        justify-content: center; 
        cursor: pointer;
    }

    /* 📱 MOBILE DROPDOWN (ACTIVE ON TAP) */
    .klta-mobile-dropdown {
        position: absolute;
        top: 80px; left: 50%;
        transform: translateX(-50%) scale(0.95);
        width: 85%;
        background: white;
        border-radius: 20px;
        box-shadow: 0 20px 40px rgba(0,0,0,0.2);
        display: flex !important; /* Overrides global hide only when active class added */
        flex-direction: column;
        padding: 20px;
        opacity: 0;
        visibility: hidden;
        transition: 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275);
        z-index: 999999;
    }
    .klta-mobile-dropdown.active {
        opacity: 1;
        visibility: visible;
        transform: translateX(-50%) scale(1);
    }
    .mob-link {
        padding: 15px;
        text-decoration: none;
        color: var(--klta-deep-blue);
        font-weight: 900;
        border-bottom: 1px solid #f1f5f9;
        text-align: center;
    }
    .portal-mob {
        color: var(--klta-gold);
        background: var(--klta-deep-blue);
        border-radius: 12px;
        margin-top: 10px;
        border: none;
    }

    /* 🌊 HERO & STACK REDUCTION */
    .hero-nz { padding: 80px 15px 420px !important; }
    .hero-nz h1 { font-size: 28px !important; }
    .klta-task-stack { margin-top: -360px !important; width: 92%; }
    .action-bar-bottom { grid-template-columns: 1fr 1fr !important; }

    /* 📊 STATS STRIP (VERTICAL) */
    .glance-outer-wrap { padding-top: 50px !important; }
    .glance-master-flex { flex-direction: column; gap: 25px; }
    .glance-items-row { flex-direction: column !important; gap: 10px !important; }
}