/* ==========================================================================
   FileSeb — mobile / installed-app layer.
   Loaded everywhere but only does anything when the site is running as an
   installed app (PWA standalone or the Capacitor native shell). The browser
   view is untouched.
   ========================================================================== */

/* ---------- safe areas: never hide content under the notch or home bar ---- */
@supports (padding: env(safe-area-inset-top)) {
  .taskbar { padding-top: env(safe-area-inset-top); }
  .site-footer, .fileseb-cta, .bmc-section { padding-bottom: env(safe-area-inset-bottom); }
  .workspace { padding-bottom: env(safe-area-inset-bottom); }
  /* Keep the support pill on the right edge, vertically centred. Do NOT set
     `bottom` here: style.css already sets `top: 50%`, and a fixed element with
     both top and bottom set stretches to fill the gap — the pill rendered
     ~366px tall before this was fixed. `bottom: auto` pins it back to its
     content height. */
  .floating-kofi { top: 50%; bottom: auto; }
}

/* ---------- app-like feel (standalone / native only) ---------------------- */
@media (display-mode: standalone), (display-mode: fullscreen), (display-mode: minimal-ui) {
  html { overscroll-behavior-y: contain; }
  body { -webkit-tap-highlight-color: transparent; }
  .skip-link { display: none; }
}

html.capacitor-native { overscroll-behavior-y: contain; }
html.capacitor-native body { -webkit-tap-highlight-color: transparent; }
/* the install section is pointless once you are already in the app */
html.capacitor-native #install { display: none !important; }
/* one-time "press back to close" hint */
.app-backhint {
  position: fixed; left: 50%; transform: translateX(-50%);
  bottom: calc(18px + env(safe-area-inset-bottom));
  z-index: 2147482000; padding: 10px 16px; border-radius: 999px;
  background: var(--ink); color: var(--bg); font-size: 13px; font-weight: 600;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .28); opacity: 0;
  transition: opacity .25s ease; pointer-events: none;
}
.app-backhint.show { opacity: 1; }

/* ---------- connectivity badge ------------------------------------------- */
.app-net {
  position: fixed; left: 50%; transform: translateX(-50%);
  top: calc(8px + env(safe-area-inset-top));
  z-index: 2147482500; display: none; align-items: center; gap: 8px;
  padding: 8px 14px; border-radius: 999px;
  background: var(--ink); color: var(--bg); font-size: 12.5px; font-weight: 600;
  box-shadow: 0 8px 24px rgba(0, 0, 0, .25);
}
.app-net.show { display: inline-flex; }
.app-net i { font-size: 12px; }

/* ---------- touch ergonomics -------------------------------------------- */
@media (hover: none) and (pointer: coarse) {
  .btn, .tool-card, .popular-card, .related-links a, .bt-item { min-height: 44px; }
  .tool-card, .popular-card { touch-action: manipulation; }
}
/* iOS zooms the page when a control under 16px receives focus */
@media (max-width: 820px) {
  input[type="text"], input[type="search"], input[type="number"], input[type="email"],
  input[type="url"], textarea, select, #searchInput, .ws-textinput textarea {
    font-size: 16px;
  }
}

/* ---------- ads: AdMob only inside the native shell ----------------------- */
/* The packaged app shows its own native AdMob units, so the web AdSense slots
   are hidden there — running two ad networks inside one app is what the stores
   and Google both flag. The browser site keeps its AdSense units untouched. */
html.capacitor-native .ad-section,
html.capacitor-native .ad-slot,
html.capacitor-native ins.adsbygoogle { display: none !important; }
