/* ---------- iPhone app: native Liquid Glass ----------
   On iOS 26+ (html.native-glass, set by assets/js/16c-glass.js) the floating controls are drawn
   by GlassPlugin.swift as real UIGlassEffect views over the web view. The elements stay in the
   page for layout and taps, so here they only go see-through and hide their own icons and text.
   Only elements the plugin is showing carry [data-glass]; anything else keeps the CSS glass. */

html.native-glass [data-glass] {
  background: transparent !important;
  border-color: transparent !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  transition: none;
}
html.native-glass [data-glass]::before { display: none; }
html.native-glass [data-glass]:active { transform: none; background: transparent; }

/* The icon, label, dots and the tab lens are drawn natively; keep layout (visibility, not display). */
html.native-glass [data-glass="circle"] > svg,
html.native-glass [data-glass="circle"] > .dot,
html.native-glass [data-glass="tabbar"] svg,
html.native-glass [data-glass="tabbar"] .tab-dot,
html.native-glass [data-glass="tabbar"] .tab-indicator {
  visibility: hidden;
}
html.native-glass [data-glass="pill"] { color: transparent; }

/* The message pill stays in the web view (typing) but is tuned to sit next to the native glass:
   a lighter fill, a heavier blur and a thinner rim, like UIGlassEffect's regular style. */
html.native-glass .composer-pill,
html.native-glass .composer.voice-on {
  background: rgba(255, 255, 255, 0.34);
  -webkit-backdrop-filter: blur(28px) saturate(1.8) brightness(1.06);
  backdrop-filter: blur(28px) saturate(1.8) brightness(1.06);
  border: 0.5px solid rgba(255, 255, 255, 0.75);
  box-shadow:
    inset 0 0.5px 0 rgba(255, 255, 255, 0.9),
    inset 0 -0.5px 0.5px rgba(16, 17, 19, 0.05),
    0 0 0 0.5px rgba(16, 17, 19, 0.05),
    0 6px 20px rgba(16, 17, 19, 0.08),
    0 1px 3px rgba(16, 17, 19, 0.04);
}
html.native-glass .composer-pill::before {
  background: radial-gradient(120% 70% at 50% 0%, rgba(255, 255, 255, 0.55), rgba(255, 255, 255, 0) 60%);
}
html.native-glass .composer-pill:focus-within { box-shadow: inset 0 0.5px 0 rgba(255, 255, 255, 0.9), 0 0 0 0.5px rgba(16, 17, 19, 0.05), 0 6px 20px rgba(16, 17, 19, 0.08); }
