/**
 * iOS Safari PWA — фиксы для WebKit quirks.
 *
 * Подключается в public/index.html.
 * Не влияет на нативную сборку (React Native).
 */

/* ── Фиксированный viewport (Safari не сдвигает страницу при фокусе на инпут) ── */
html {
  position: fixed;
  width: 100%;
  height: 100%;
  overflow: hidden;
  touch-action: manipulation;
  -webkit-text-size-adjust: 100%;
}

/* ── Скролл внутри #root, а не на уровне body ──────────────────── */
html, body, #root {
  overscroll-behavior: none;
}

/* ── iOS PWA standalone: разные цвета для верхней и нижней safe-area.
 *    Верхняя (status bar) — primary, как фон хедеров большинства экранов.
 *    Нижняя (home indicator) — белая, как фон таб-бара (colors.surface).
 *    Делаем это через body-gradient: первая полоска высотой
 *    env(safe-area-inset-top) — primary, остальное — белое.
 *    SafeAreaView экранов (с edges=['top']) рендерится ПОВЕРХ body
 *    и закрывает верхнюю зону своим фоном — на экранах с тёмным/синим
 *    хедером цвета совпадают, на экранах с белым хедером SafeAreaView
 *    закрывает синюю полосу своим белым фоном. На сценах, где в JS
 *    safe-area-top «не дотянулся» (баг RN-Web) — тут торчит наша полоса. */
html, #root {
  background-color: transparent;
}

body {
  background:
    linear-gradient(
      to bottom,
      #0EA5E9 0,
      #0EA5E9 env(safe-area-inset-top, 0px),
      #FFFFFF env(safe-area-inset-top, 0px),
      #FFFFFF 100%
    );
}

/* ── Автозум инпутов (Safari зумит при font-size < 16px) ──────── */
input, textarea, select {
  font-size: 16px !important;
}

/* ── Убрать синюю рамку WebKit при фокусе на инпуты ─────────────── */
input:focus, textarea:focus, select:focus {
  outline: none !important;
  box-shadow: none !important;
  -webkit-appearance: none;
}

/* ── Safe area (нотч, home indicator) ─────────────────────────────
 * На iOS PWA отдаём управление safe-area-инсетами React Native
 * (через SafeAreaProvider + env()), иначе body-padding создаёт
 * белые полосы сверху/снизу поверх синего фона экрана.
 */

/* ── Отключить выделение текста при долгом нажатии ───────────────── */
* {
  -webkit-user-select: none;
  user-select: none;
  -webkit-tap-highlight-color: transparent;
}

/* Вернуть выделение для полей ввода */
input, textarea {
  -webkit-user-select: text;
  user-select: text;
}
