/* LifeVed Devotional — Responsive Overrides (Mobile-First, Desktop Enhanced) */

/* === BOTTOM NAV (Mobile) === */
.bottom-nav {
    position: fixed;
    bottom: 0; left: 0; right: 0;
    height: var(--nav-height);
    background: var(--glass);
    backdrop-filter: blur(16px) saturate(1.5);
    -webkit-backdrop-filter: blur(16px) saturate(1.5);
    border-top: 1px solid var(--border);
    display: flex;
    align-items: center;
    justify-content: space-around;
    padding: 0 8px;
    padding-bottom: var(--safe-bottom);
    z-index: var(--z-nav);
    box-shadow: 0 -4px 20px rgba(26,15,5,0.06);
}
.nav-item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 3px;
    padding: 8px 12px;
    font-size: 0.65rem;
    font-weight: 600;
    color: var(--text-muted);
    text-decoration: none;
    border-radius: var(--radius-sm);
    transition: all var(--duration);
    min-width: 52px;
    position: relative;
}
.nav-item svg { width: 22px; height: 22px; transition: transform var(--duration); }
.nav-item.active { color: var(--accent); }
.nav-item.active svg { transform: scale(1.1); }
.nav-item:hover { color: var(--accent); }

/* Center nav item (Japa) — elevated */
.nav-center {
    position: relative;
    margin-top: -18px;
}
.nav-center-icon {
    width: 52px; height: 52px;
    border-radius: 50%;
    background: var(--accent-gradient);
    display: flex; align-items: center; justify-content: center;
    box-shadow: 0 6px 20px rgba(212,82,10,0.3);
}
.nav-center-icon svg { color: #fff; width: 24px; height: 24px; stroke: #fff; }
.nav-center span { margin-top: 4px; }

/* === FOOTER === */
.site-footer {
    background: var(--bg-secondary);
    border-top: 1px solid var(--border);
    padding: var(--space-2xl) 0 var(--space-lg);
    text-align: center;
}
.footer-disclaimer {
    font-size: var(--fs-xs);
    color: var(--text-muted);
    line-height: 1.7;
    max-width: 600px;
    margin: 0 auto var(--space-md);
    padding: var(--space-md);
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: var(--radius);
}
.footer-links {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px 20px;
    margin-bottom: var(--space-md);
}
.footer-links a {
    font-size: var(--fs-xs);
    color: var(--text-muted);
    text-decoration: none;
    transition: color var(--duration);
}
.footer-links a:hover { color: var(--accent); }
.footer-copy { font-size: var(--fs-xs); color: var(--text-muted); }
.footer-tagline {
    font-family: var(--font-heading);
    font-size: var(--fs-sm);
    color: var(--temple-gold);
    margin-top: var(--space-sm);
    opacity: 0.7;
}

/* === DESKTOP ENHANCEMENTS (768px+) === */
@media (min-width: 768px) {
    body { padding-bottom: 0; }
    .bottom-nav {
        position: fixed;
        top: 0; bottom: auto;
        height: auto;
        padding: 10px 24px;
        border-top: none;
        border-bottom: 1px solid var(--border);
        justify-content: center;
        gap: 8px;
        box-shadow: 0 4px 20px rgba(26,15,5,0.04);
    }
    .nav-item {
        flex-direction: row;
        gap: 6px;
        padding: 10px 16px;
        font-size: var(--fs-sm);
        border-radius: var(--radius-full);
    }
    .nav-item svg { width: 18px; height: 18px; }
    .nav-item.active { background: var(--accent-glow); }
    .nav-center { margin-top: 0; }
    .nav-center-icon { width: 40px; height: 40px; }

    .hub-hero { padding: var(--space-3xl) 0 var(--space-2xl); }
    .hub-title { font-size: 3rem; }
    .hub-subtitle { font-size: var(--fs-base); }

    .container { padding: 0 24px; }
    .page-content { padding-top: var(--space-md); }
}

/* === LARGE DESKTOP (1024px+) === */
@media (min-width: 1024px) {
    .container { padding: 0 32px; }

    .content-list {
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 12px;
    }
}

/* === SMALL MOBILE (<400px) === */
@media (max-width: 400px) {
    :root {
        --fs-base: 0.9rem;
        --fs-lg: 1.15rem;
        --fs-xl: 1.35rem;
        --fs-2xl: 1.6rem;
    }
    .container { padding: 0 12px; }
    .tool-header-title { font-size: var(--fs-md); }
    .panchang-bar { font-size: 0.7rem; padding: 8px 12px; gap: 6px; }
}

/* === iOS Safe Area === */
@supports (padding-bottom: env(safe-area-inset-bottom)) {
    .bottom-nav { padding-bottom: env(safe-area-inset-bottom); }
    body { padding-bottom: calc(var(--nav-height) + env(safe-area-inset-bottom) + 8px); }
    @media (min-width: 768px) { body { padding-bottom: 0; } }
}

/* === PRINT === */
@media print {
    .bottom-nav, .lang-bar, .tool-header-actions, .share-bar, .cross-links,
    .quick-tools, .hub-search, .pwa-banner, .scroll-top { display: none !important; }
    body { padding-bottom: 0; background: #fff; }
    .container { max-width: 100%; }
}

/* === Language toggle in nav bar === */
.nav-lang-toggle { display: flex; align-items: center; padding: 0 8px; }
@media (max-width: 767px) { .nav-lang-toggle { display: none; } }