/*==========================================================
 NEXIA UI FRAMEWORK
 COMPONENT : GLASS
 PURPOSE   : Transparent glass surface
==========================================================*/


/*==========================================================
 GLASS SURFACE
==========================================================*/

.nx-glass{
  background:transparent;

  /*
   * Fully transparent surface.
   * No blur = background remains visible and sharp.
   */
  backdrop-filter:blur(3px) saturate(100%);
  -webkit-backdrop-filter:none;

  /*
   * White glass edge.
   * Alpha is kept low so the boundary remains subtle.
   */
  border:1px solid rgba(255,255,255,.25);

  border-radius:var(--nx-radius-lg);

  /*
   * Soft depth without introducing a filled surface.
   */
  box-shadow:
    0 4px 24px rgba(0,0,0,.06),
    inset 0 1px 0 rgba(255,255,255,.25);
}


/*==========================================================
 DARK MODE
==========================================================*/

html.nx-dark-mode .nx-glass{
  background:transparent;

  border-color:rgba(255,255,255,.12);

  box-shadow:
    0 4px 32px rgba(0,0,0,.35),
    inset 0 1px 0 rgba(255,255,255,.10);
}