/**
 * Mobile App Fixes for Capacitor
 * Fixes touch scrolling, click issues, and status bar overlap
 * These styles only apply to Capacitor native apps (plt-capacitor, plt-android)
 */

/* Enable smooth scrolling on iOS */
html, body {
    -webkit-overflow-scrolling: touch;
}

/* Fix for touch events */
* {
    -webkit-tap-highlight-color: transparent;
}

/* Ensure buttons and links are clickable */
button, a, input, select, textarea, [onclick], [role="button"] {
    touch-action: manipulation;
    cursor: pointer;
}

/* Fix scrollable containers */
.overflow-y-auto,
.overflow-auto,
[style*="overflow"] {
    -webkit-overflow-scrolling: touch;
}

/* ============================================
   CAPACITOR/MOBILE ONLY STYLES
   These only apply when running as native app
   ============================================ */

/* Safe area padding for Capacitor native apps only */
html.plt-capacitor body,
html.plt-android body {
    padding-top: 0 !important;
    padding-bottom: env(safe-area-inset-bottom);
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
}

/* Header gets padding inside to push content below status bar, but stays at top:0 */
html.plt-capacitor header.sticky,
html.plt-android header.sticky,
html.plt-capacitor .sticky.top-0,
html.plt-android .sticky.top-0 {
    top: 0 !important;
    padding-top: 32px !important;
}

/* Non-sticky headers just need padding */
html.plt-capacitor header:not(.sticky),
html.plt-android header:not(.sticky) {
    padding-top: 32px !important;
}

/* Make sure touch events work */
html.plt-capacitor header *,
html.plt-android header * {
    pointer-events: auto !important;
}

/* Fix modal overlays in Capacitor */
html.plt-capacitor .fixed.inset-0,
html.plt-android .fixed.inset-0 {
    padding-top: 32px;
}

/* ============================================
   GENERAL MOBILE STYLES (Web + Native)
   ============================================ */

/* Prevent text selection on buttons */
button {
    -webkit-user-select: none;
    user-select: none;
}

/* Fix for keyboard showing (Capacitor only) */
html.plt-capacitor .keyboard-visible,
html.plt-android .keyboard-visible {
    height: calc(100% - var(--keyboard-height, 0px));
}

/* Ensure main content is scrollable */
main,
section,
.container {
    touch-action: pan-y;
}