/* Stile3D native-app polish layer (additive, no rebuild) */
* { -webkit-tap-highlight-color: transparent; }
html { -webkit-text-size-adjust: 100%; }
body { overflow-x: hidden; }

/* Sticky translucent header (class added by native-app.js) */
.native-sticky {
  position: sticky !important;
  top: 0;
  z-index: 50 !important;
  background: rgba(255,255,255,.82) !important;
  -webkit-backdrop-filter: saturate(1.6) blur(14px);
  backdrop-filter: saturate(1.6) blur(14px);
  padding-top: max(0.875rem, env(safe-area-inset-top));
}

/* Press feedback on tappable things */
a:active, button:active, [role="button"]:active { transform: scale(.97); transition: transform .08s ease; }

@media (max-width: 767px) {
  /* No iOS zoom on focus + comfortable touch targets */
  input, select, textarea { font-size: 16px !important; min-height: 44px; }
  /* Room for the bottom tab bar */
  body { padding-bottom: calc(64px + env(safe-area-inset-bottom)); }
  body.native-no-tabbar { padding-bottom: 0; }
}
@media (min-width: 768px) { #native-tabbar { display: none !important; } }

/* Bottom tab bar */
#native-tabbar {
  position: fixed; left: 0; right: 0; bottom: 0; z-index: 60;
  display: flex; justify-content: space-around; align-items: stretch;
  background: rgba(255,255,255,.88);
  -webkit-backdrop-filter: saturate(1.6) blur(16px);
  backdrop-filter: saturate(1.6) blur(16px);
  border-top: 1px solid #e2e5ec;
  padding-bottom: env(safe-area-inset-bottom);
  box-shadow: 0 -4px 20px rgba(20,25,40,.06);
}
#native-tabbar a {
  flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: 2px; min-height: 56px; text-decoration: none;
  font: 600 10px/1.2 "Inter", system-ui, sans-serif; color: #8a8ea3;
}
#native-tabbar a svg { width: 22px; height: 22px; }
#native-tabbar a.active { color: #0f9aa6; }
#native-tabbar .tab-cart { position: relative; }
#native-tabbar .tab-cart .badge {
  position: absolute; top: 6px; right: calc(50% - 20px);
  min-width: 16px; height: 16px; padding: 0 4px; border-radius: 8px;
  background: #f26b2e; color: #fff; font-size: 9.5px; font-weight: 700;
  display: flex; align-items: center; justify-content: center;
}

/* Desktop refinement */
@media (min-width: 768px) {
  ::selection { background: rgba(15,154,166,.2); }
}