/* ENRI app3 theme — supplemental styles + self-hosted fonts.
 * Everything here is served same-origin so privacy browsers (Brave Shields)
 * cannot block it. Tailwind utilities come from /app3-assets/tailwind.js.
 * Phase 4 will replace the Play CDN script with a tree-shaken build.
 */

/* ── Self-hosted fonts (no Google Fonts → Brave-proof) ── */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 100 900;
  font-display: swap;
  src: url('/app3-assets/fonts/inter.woff2') format('woff2');
}
@font-face {
  font-family: 'Material Symbols Outlined';
  font-style: normal;
  font-weight: 100 700;
  font-display: block;
  src: url('/app3-assets/fonts/material-symbols.woff2') format('woff2');
}

:root {
  --accent: #24A0ED;
  --accent-hover: #1F88C9;
  --surface: #f5f5f5;
  --muted: #666666;
}

[x-cloak] { display: none !important; }

.material-symbols-outlined {
  font-family: 'Material Symbols Outlined';
  font-weight: normal;
  font-style: normal;
  line-height: 1;
  letter-spacing: normal;
  text-transform: none;
  display: inline-block;
  white-space: nowrap;
  word-wrap: normal;
  direction: ltr;
  font-variation-settings: 'FILL' 0, 'wght' 400, 'GRAD' 0, 'opsz' 24;
  vertical-align: middle;
}

html { scroll-behavior: smooth; }
body { font-family: 'Inter', system-ui, -apple-system, sans-serif; }

::selection { background: rgba(199, 8, 27, 0.15); color: #111; }

::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: rgba(0,0,0,0.12); border-radius: 10px; }
::-webkit-scrollbar-thumb:hover { background: rgba(0,0,0,0.25); }

/* ─── wv-shell: app-shell layout for the old Cordova app's UIWebView ───────────
   UIWebView doesn't repaint position:fixed elements during scroll (they float
   mid-screen / vanish until the scroll settles). Inside the app we therefore
   never scroll the body: #app3-scroll is the only scrolling element, and the
   header/tabbar are pinned with position:absolute on the non-scrolling body —
   absolute elements can't detach, so the bug class is structurally gone.
   Normal browsers never get the .wv-shell class and are unaffected.          */
html.wv-shell, html.wv-shell body { height: 100%; overflow: hidden; }
html.wv-shell #app3-scroll {
    position: absolute;
    top: 0; right: 0; bottom: 0; left: 0;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
}
html.wv-shell #app3-header { position: absolute !important; }
html.wv-shell #app3-tabbar { position: absolute !important; }
/* In the app, sticky floats (checkout amount bar) live inside the touch-scroll
   layer where UIWebView has the same repaint bug family as position:fixed —
   so they flow with the content instead, matching the classic app behaviour. */
html.wv-shell .sticky { position: static !important; }

/* app: the checkout "Summa / Turpināt" bar is x-teleported into #app3-appbar and
   pinned as a full-width band directly above the bottom tabbar — same absolute-
   on-body mechanism as the tabbar, so it's always visible (customers no longer
   scroll to the end of the list to find "Turpināt"). Web is unaffected: on the
   website the bar is never teleported and keeps its floating sticky behaviour. */
html.wv-shell #app3-appbar {
    position: absolute; left: 0; right: 0;
    bottom: calc(56px + env(safe-area-inset-bottom));
    z-index: 35;
    pointer-events: none;            /* empty slot must not swallow taps */
}
html.wv-shell #app3-appbar > * { pointer-events: auto; }
html.wv-shell #app3-appbar .booking-cta {
    width: 100%;
    box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.08);
}
