/**
 * PWA & Mobile Browser Styles v1.3
 * Makes PWA and mobile browser behave like a native mobile app
 * Fixed: Header 25px uniform on all pages
 * Added: .mobile-browser class support for browser mode
 */

/* Prevent zoom and bouncing in PWA mode and mobile browser */
body.pwa-mode,
body.mobile-browser {
  /* Prevent overscroll/bounce effect */
  overscroll-behavior: none;
  overscroll-behavior-y: none;
  overscroll-behavior-x: none;
  
  /* Prevent pull-to-refresh */
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  
  /* Prevent text selection on long press */
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  
  /* Prevent touch callout (iOS) */
  -webkit-touch-callout: none;
  
  /* Prevent zoom on double-tap */
  touch-action: manipulation;
  
  /* Prevent highlight on tap */
  -webkit-tap-highlight-color: transparent;
}

/* Allow text selection only in input fields */
body.pwa-mode input,
body.pwa-mode textarea,
body.pwa-mode [contenteditable="true"],
body.mobile-browser input,
body.mobile-browser textarea,
body.mobile-browser [contenteditable="true"] {
  -webkit-user-select: text;
  -moz-user-select: text;
  -ms-user-select: text;
  user-select: text;
  -webkit-touch-callout: default;
}

/* Prevent zoom on inputs (iOS) */
body.pwa-mode input[type="text"],
body.pwa-mode input[type="email"],
body.pwa-mode input[type="password"],
body.pwa-mode input[type="number"],
body.pwa-mode input[type="tel"],
body.pwa-mode input[type="url"],
body.pwa-mode input[type="search"],
body.pwa-mode textarea,
body.pwa-mode select,
body.mobile-browser input[type="text"],
body.mobile-browser input[type="email"],
body.mobile-browser input[type="password"],
body.mobile-browser input[type="number"],
body.mobile-browser input[type="tel"],
body.mobile-browser input[type="url"],
body.mobile-browser input[type="search"],
body.mobile-browser textarea,
body.mobile-browser select {
  font-size: 16px !important; /* Prevents iOS zoom on focus */
}

/* Prevent horizontal scroll */
body.pwa-mode,
body.mobile-browser {
  overflow-x: hidden;
  max-width: 100vw;
}

/* Smooth scrolling for content */
body.pwa-mode .content,
body.pwa-mode main,
body.pwa-mode .main-content,
body.pwa-mode section,
body.mobile-browser .content,
body.mobile-browser main,
body.mobile-browser .main-content,
body.mobile-browser section {
  -webkit-overflow-scrolling: touch;
}

/* Prevent image dragging */
body.pwa-mode img,
body.mobile-browser img {
  -webkit-user-drag: none;
  -khtml-user-drag: none;
  -moz-user-drag: none;
  -o-user-drag: none;
  user-drag: none;
  pointer-events: none;
}

/* Allow clicks on images that are links */
body.pwa-mode a img,
body.pwa-mode button img,
body.mobile-browser a img,
body.mobile-browser button img {
  pointer-events: auto;
}

/* Disable context menu on long press */
body.pwa-mode *,
body.mobile-browser * {
  -webkit-touch-callout: none;
}

/* Re-enable for inputs */
body.pwa-mode input,
body.pwa-mode textarea,
body.mobile-browser input,
body.mobile-browser textarea {
  -webkit-touch-callout: default;
}

/* ===========================================
   PWA & Mobile Browser Header Positioning
   =========================================== */

/* All pages - NO extra padding in PWA mode and mobile browser */
html.pwa-mode .header,
body.pwa-mode .header,
html.mobile-browser .header,
body.mobile-browser .header {
  padding-top: 0px !important;
  box-sizing: content-box !important;
}

/* Mobile menu - standard position */
html.pwa-mode .g_menu,
body.pwa-mode .g_menu,
html.mobile-browser .g_menu,
body.mobile-browser .g_menu {
  top: 77px !important;
}

@media (max-width: 1050px) {
  html.pwa-mode .header__menu,
  body.pwa-mode .header__menu,
  html.mobile-browser .header__menu,
  body.mobile-browser .header__menu {
    top: 77px !important;
  }
}