/* ============================================================
   liquid.css: refraction, a specular rim and depth on top of the
   glass.css material. Ported from R3-eDash css/liquid.css with the
   eDash selectors renamed to the stockflow shell. Links BEFORE
   glass.css and out-specifies it on purpose.

   Only js/liquid.js writes the .liquid class, onto the fixed list in
   its LIQUID_SURFACES block (the header pill, the rail, the user
   menu, the login card, the tracking header). Never a table, a chart,
   a map or running text. No pointer-reactive light (Kemal, 29
   September 2026).

   Attribution (MIT): the feTurbulence into feDisplacementMap graph
   follows dpawlikowski/liquid-glass. See the eDash file header.
   ============================================================ */

/* 1. Rim and depth, on the glass and glass-hd tiers. Pure box-shadow. */
html.glass body :is(.sf-hpill, .sf-side, .trk-h).liquid,
html.glass-hd body :is(.sf-hpill, .sf-side, .trk-h).liquid {
  box-shadow:
    inset 0 1px 0 var(--liquid-rim-hi),
    inset 0 -1px 0 var(--liquid-rim-lo),
    inset 0 0 0 1px rgba(255, 255, 255, .08),
    var(--gl-pill-depth),
    0 18px 36px -16px var(--liquid-depth-shadow);
}
html.glass body :is(.sf-menu, .auth-card).liquid,
html.glass-hd body :is(.sf-menu, .auth-card).liquid {
  box-shadow:
    inset 0 1px 0 var(--liquid-rim-hi),
    inset 0 -1px 0 var(--liquid-rim-lo),
    var(--mat-shadow-2),
    0 18px 36px -14px var(--liquid-depth-shadow);
}

/* 2. Refraction: html.glass-hd, desktop width, and only after
   liquid.js confirmed backdrop-filter: url() works and no reduced
   motion, transparency or contrast preference is set. The rail keeps
   rim and depth only: the displacement samples outside its edge and
   paints a band (the eDash finding of 26 September). */
@media (min-width: 861px) {
  html.glass-hd.liquid-refract body .sf-hpill.liquid {
    -webkit-backdrop-filter: var(--gl-pill-blur);
            backdrop-filter: url(#sf-liquid) var(--gl-pill-blur);
  }
  html.glass-hd.liquid-refract body :is(.sf-menu, .auth-card).liquid {
    -webkit-backdrop-filter: var(--mat-filter-thick);
            backdrop-filter: url(#sf-liquid) var(--mat-filter-thick);
  }
}

/* 3. The escape hatch: a stale class never beats a preference. */
html.glass-lite body :is(.sf-hpill, .sf-side, .sf-menu, .auth-card, .trk-h).liquid {
  -webkit-backdrop-filter: none;
          backdrop-filter: none;
}
@media (prefers-reduced-transparency: reduce), (prefers-contrast: more), (forced-colors: active) {
  html body :is(.sf-hpill, .sf-side, .sf-menu, .auth-card, .trk-h).liquid {
    -webkit-backdrop-filter: none !important;
            backdrop-filter: none !important;
  }
}