/* =========================================
   ROCKET ENGINES (V2.2 PERFORMANCE + UX)
   ========================================= */

/* 1. NATIVE PUSH SYSTEM */
.push-prompt-overlay {
    position: fixed; bottom: 30px; left: 30px;
    z-index: 9999; display: none;
    background: var(--card-bg);
    padding: 25px; border-radius: 20px;
    box-shadow: var(--shadow-lg); border: 1px solid var(--border-color);
}

/* 2. INFINITE SCROLL & ADS */
.infinite-ad-wrap, .ad-slot, .ad-placeholder {
    text-align: center; margin: 30px 0;
    padding: 20px; background: rgba(0,0,0,0.02);
    border-radius: 12px;
}

.ad-placeholder {
    background: #f1f5f9; border: 2px dashed #cbd5e1;
}

/* 3. ANTI-BOUNCE (EXIT INTENT) */
.exit-intent-overlay {
    position: fixed; inset: 0;
    background: rgba(0,0,0,0.85); z-index: 99999;
    display: none; align-items: center; justify-content: center;
    backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
    padding: 20px; opacity: 0; transition: opacity 0.3s ease;
}
.exit-intent-overlay.active { display: flex; opacity: 1; }

.exit-modal {
    background: #fff; padding: 40px; border-radius: 30px;
    max-width: 500px; width: 100%; text-align: center;
    position: relative; box-shadow: 0 40px 100px rgba(0,0,0,0.6);
}

/* 4. MOBILE BOTTOM NAV */
.mobile-bottom-nav {
    position: fixed; bottom: 0; left: 0;
    width: 100%; height: 70px; background: var(--card-bg);
    border-top: 1px solid var(--border-color);
    display: none; justify-content: space-around;
    align-items: center; z-index: 2000;
}

@media (max-width: 768px) {
    .mobile-bottom-nav { display: flex; }
    body { padding-bottom: 70px; }
}

/* 5. SIDEBAR LAYOUT (V2.2) */
.main-layout-wrapper { display: flex !important; gap: var(--grid-gap, 30px); width: 100%; }
.main-content { flex: 1; min-width: 0; }
.sidebar { width: 320px; flex-shrink: 0; }

.sidebar-right { flex-direction: row-reverse !important; }
.sidebar-left { flex-direction: row !important; }
.sidebar-none .sidebar { display: none !important; }

@media (max-width: 992px) {
    .main-layout-wrapper { flex-direction: column !important; }
    .sidebar { width: 100% !important; }
}
