/* ============================================================
   RestartME, Glassmorphism utilities
   ============================================================ */

.glass {
  background: var(--glass-bg);
  -webkit-backdrop-filter: blur(var(--glass-blur)) saturate(135%);
  backdrop-filter: blur(var(--glass-blur)) saturate(135%);
  border: 1px solid var(--glass-border);
  box-shadow: 0 10px 40px var(--glass-shadow);
  border-radius: var(--radius-lg);
}

.glass--subtle {
  -webkit-backdrop-filter: blur(10px) saturate(120%);
  backdrop-filter: blur(10px) saturate(120%);
  box-shadow: 0 6px 24px var(--glass-shadow);
}

.glass--strong {
  -webkit-backdrop-filter: blur(28px) saturate(150%);
  backdrop-filter: blur(28px) saturate(150%);
  box-shadow: 0 22px 60px var(--glass-shadow);
}

/* Subtle top sheen, gives glass a polished, expensive edge */
.glass--sheen { position: relative; overflow: hidden; }
.glass--sheen::before {
  content: "";
  position: absolute; inset: 0;
  background: linear-gradient(135deg, rgba(255,255,255,0.35), rgba(255,255,255,0) 42%);
  pointer-events: none;
}

/* Frosted nav/header bar variant */
.glass-bar {
  background: color-mix(in srgb, var(--bg) 72%, transparent);
  -webkit-backdrop-filter: blur(16px) saturate(140%);
  backdrop-filter: blur(16px) saturate(140%);
  border-bottom: 1px solid var(--divider);
}

/* Performance: soften blur on small screens */
@media (max-width: 768px) {
  .glass, .glass--strong { -webkit-backdrop-filter: blur(12px); backdrop-filter: blur(12px); }
}

/* Graceful fallback where backdrop-filter is unsupported */
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .glass, .glass--subtle, .glass--strong { background: var(--bg-elevated); }
  .glass-bar { background: var(--bg); }
}