/* ============================================================
   Ai-Revolution — Effects: elevation, glass, glows, borders
   The Liquid Glass material is the brand's signature surface.
   Per-theme values are overridden in themes.css.
   ============================================================ */
:root {
  /* ---- Border tokens (theme overrides these) ---- */
  --border-width: 1px;
  --hairline: rgba(20, 23, 30, 0.10);
  --hairline-strong: rgba(20, 23, 30, 0.16);

  /* ---- Elevation (soft, cool-tinted — never pure black) ---- */
  --shadow-xs:  0 1px 2px rgba(16, 38, 76, 0.06);
  --shadow-sm:  0 2px 8px rgba(16, 38, 76, 0.08);
  --shadow-md:  0 8px 24px rgba(16, 38, 76, 0.10);
  --shadow-lg:  0 18px 48px rgba(16, 38, 76, 0.14);
  --shadow-xl:  0 32px 80px rgba(16, 38, 76, 0.18);

  /* ---- Brand glows (for focus rings, accent halos) ---- */
  --glow-brand:      0 0 0 4px rgba(29, 132, 223, 0.18);
  --glow-brand-soft: 0 8px 40px rgba(29, 132, 223, 0.28);
  --focus-ring:      0 0 0 3px rgba(29, 132, 223, 0.45);

  /* =========================================================
     LIQUID GLASS — material tokens (light theme defaults)
     A glass surface composes:
       background  : translucent tint
       backdrop    : blur + saturation
       border      : bright specular hairline
       box-shadow  : ambient drop + inner top highlight + inner base shade
     ========================================================= */
  --glass-blur:        20px;
  --glass-blur-strong: 36px;
  --glass-saturate:    180%;

  --glass-tint:        rgba(255, 255, 255, 0.55);
  --glass-tint-strong: rgba(255, 255, 255, 0.72);
  --glass-tint-faint:  rgba(255, 255, 255, 0.32);

  /* specular edge — bright on top, neutral elsewhere */
  --glass-edge:        rgba(255, 255, 255, 0.85);
  --glass-edge-low:    rgba(20, 23, 30, 0.08);

  /* the full liquid-glass shadow stack */
  --glass-shadow:
    0 10px 36px rgba(16, 38, 76, 0.14),
    0 2px 8px rgba(16, 38, 76, 0.08),
    inset 0 1px 0 rgba(255, 255, 255, 0.85),
    inset 0 -1px 1px rgba(16, 38, 76, 0.05);

  /* tint sheet drawn behind content for depth (used by ::before) */
  --glass-sheen:
    linear-gradient(180deg, rgba(255,255,255,0.45) 0%, rgba(255,255,255,0.04) 38%, rgba(255,255,255,0) 100%); /* @kind other */
}