/* ==============================================================================
   Mobile PWA Touch Styles for File Manager Pro
   ============================================================================== */

:root {
    --safe-bottom: env(safe-area-inset-bottom, 16px);
}

body {
    -webkit-tap-highlight-color: transparent;
    user-select: none;
    overscroll-behavior-y: contain;
}

/* Bottom Navigation Bar */
.mobile-bottom-nav {
    padding-bottom: calc(var(--safe-bottom) + 8px);
    background: rgba(18, 18, 21, 0.95);
    backdrop-filter: blur(16px);
}

/* Bottom Sheet Modal */
.bottom-sheet {
    transform: translateY(100%);
    transition: transform 0.28s cubic-bezier(0.16, 1, 0.3, 1);
}
.bottom-sheet.active {
    transform: translateY(0);
}

/* Touch Action Target */
.touch-target {
    min-height: 48px;
    display: flex;
    align-items: center;
}

/* Pull to Refresh Indicator */
#ptr-indicator {
    height: 0;
    transition: height 0.2s ease;
    overflow: hidden;
}

/* Light Mode Overrides for Mobile */
html:not(.dark) .mobile-bottom-nav {
    background: rgba(255, 255, 255, 0.95) !important;
    border-color: #e4e4e7 !important;
}

html:not(.dark) .mobile-bottom-nav button,
html:not(.dark) .mobile-bottom-nav label,
html:not(.dark) .mobile-bottom-nav a {
    color: #52525b !important;
}

html:not(.dark) .bottom-sheet {
    background: #ffffff !important;
    color: #18181b !important;
    border-color: #e4e4e7 !important;
}

html:not(.dark) #pwa-install-banner {
    background: #ffffff !important;
    border-color: #e4e4e7 !important;
    color: #18181b !important;
}