/* PWA Standalone Mode Styles */
/* These styles only apply when the app is installed and running standalone */
/* Uses CSS custom properties from app.css :root for consistency */

/* Core PWA standalone mode */
@media (display-mode: standalone) {
    /* Hide top navigation bar -- bottom nav replaces it */
    .main-nav {
        display: none !important;
    }

    /* Remove body top padding since nav is hidden */
    body {
        padding-top: 0 !important;
    }

    /* Hide browser navigation, show PWA bottom nav */
    .browser-navigation {
        display: none !important;
    }

    .pwa-navigation {
        display: block !important;
    }

    /* Adjust main content for bottom navigation clearance */
    .main-content {
        padding-bottom: 80px !important;
        padding-top: 1% !important;
    }

    /* Touch-friendly buttons (44px minimum tap target per WCAG) */
    .btn {
        min-height: 44px;
    }

    /* Enhanced bottom navigation */
    .bottom-nav {
        background: rgba(255, 255, 255, 0.95);
        backdrop-filter: blur(10px);
        -webkit-backdrop-filter: blur(10px);
        border-top: 1px solid var(--hover-bg);
    }

    .bottom-nav-item {
        transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    }

    .bottom-nav-item:active {
        transform: scale(0.9);
        background-color: var(--active-bg);
    }

    .bottom-nav-item.active {
        background-color: var(--hover-bg);
    }

    /* Adjust footer for PWA mode (above bottom nav) */
    .site-footer {
        margin-bottom: 80px;
    }

    /* Prevent zoom on input focus (iOS) */
    input, select, textarea {
        font-size: 16px !important;
    }
}

/* iOS standalone: disable text selection on non-input elements */
@media (display-mode: standalone) and (-webkit-touch-callout: none) {
    body {
        -webkit-user-select: none;
        -webkit-touch-callout: none;
    }

    /* Re-enable selection for text content */
    p, span, td, th, li, h1, h2, h3, h4, h5, h6,
    input, select, textarea {
        -webkit-user-select: auto;
    }
}

/* Mobile PWA: safe area adjustments for devices with notches/gesture bars */
@media (display-mode: standalone) and (max-width: 768px) {
    .bottom-nav {
        padding-bottom: env(safe-area-inset-bottom, 0);
        height: calc(70px + env(safe-area-inset-bottom, 0));
    }

    .main-content {
        padding-bottom: calc(80px + env(safe-area-inset-bottom, 0)) !important;
    }

    .site-footer {
        margin-bottom: calc(80px + env(safe-area-inset-bottom, 0));
    }
}