/* ══════════════════════════════════════════════════════════════════════════
   NOVA GLASS v10 — true "Liquid Glass" pass.
   Loaded LAST among the glass files (after v9, before nova_layout_fix.css) so it
   wins the glass cascade. Scoped under html[data-theme="glass"] only, so Nova
   Moon (default) is untouched.

   Goal (from the design brief):
     1. Stronger backdrop blur so the colourful background blobs melt behind panels.
     2. Lower panel opacity so the background colours softly shine through.
     3. A thin semi-transparent white border = specular highlight on the glass edge.
     4. A faint, wide-spreading drop shadow so panels float elegantly.
   ══════════════════════════════════════════════════════════════════════════ */

/* ── 1. Re-tune the shared glass tokens (more transparent, deeper blur) ── */
html[data-theme="glass"] {
  --g-surface:        rgba(255, 255, 255, 0.34);  /* was 0.52 — lets blobs through */
  --g-surface-strong: rgba(255, 255, 255, 0.44);  /* was 0.70 — elevated but still glassy */
  --g-border:         rgba(255, 255, 255, 0.60);  /* thin specular edge */
  --g-blur:           30px;                        /* was 18px — blobs melt smoothly */
  --g-shadow:         0 16px 50px rgba(31, 38, 135, 0.18),
                      inset 0 1px 0 rgba(255, 255, 255, 0.60); /* wide float + top sheen */
}

/* ── 2. Core glass surfaces — bump blur + saturation, thin border, float shadow ──
   Listed with the same/greater specificity than the earlier glass files so the
   stronger blur and lower opacity actually take effect. ── */
html[data-theme="glass"] .suggestion-card,
html[data-theme="glass"] #welcomeScreen,
html[data-theme="glass"] .welcome-screen,
html[data-theme="glass"] .input-container,
html[data-theme="glass"] .model-chip,
html[data-theme="glass"] .ai-row .message-bubble,
html[data-theme="glass"] .ai-row .ai-content,
html[data-theme="glass"] .ai-row .message-content {
  background: var(--g-surface) !important;
  -webkit-backdrop-filter: blur(30px) saturate(180%);
  backdrop-filter: blur(30px) saturate(180%);
  border: 1px solid var(--g-border) !important;
  box-shadow: 0 16px 50px rgba(31, 38, 135, 0.18),
              inset 0 1px 0 rgba(255, 255, 255, 0.60) !important;
}

/* The welcome screen is a large backdrop panel: keep its ambient gradient but
   make the glass read clearly. (Its background gradient stays from theme_glass.css.) */
html[data-theme="glass"] #welcomeScreen,
html[data-theme="glass"] .welcome-screen {
  background:
    radial-gradient(120% 80% at 50% -10%, rgba(124,147,247,.14), transparent 60%),
    radial-gradient(100% 70% at 80% 110%, rgba(183,156,247,.12), transparent 55%),
    var(--g-surface) !important;
}

/* ── 3. Chrome surfaces (sidebar / topbar) — frosted near-white wash so the
   background blobs read through, with the same specular edge + float. ── */
html[data-theme="glass"] .sidebar {
  background: linear-gradient(160deg,
              rgba(255,255,255,0.42),
              rgba(244,249,255,0.30) 55%,
              rgba(248,244,255,0.34)) !important;
  -webkit-backdrop-filter: blur(32px) saturate(175%);
  backdrop-filter: blur(32px) saturate(175%);
  border-right: 1px solid var(--g-border) !important;
  box-shadow: inset -1px 0 0 rgba(255,255,255,0.55),
              4px 0 40px rgba(99,102,241,0.08) !important;
}
html[data-theme="glass"] .topbar {
  background: linear-gradient(180deg,
              rgba(255,255,255,0.34),
              rgba(255,255,255,0.16)) !important;
  -webkit-backdrop-filter: blur(28px) saturate(170%);
  backdrop-filter: blur(28px) saturate(170%);
  border-bottom: 1px solid var(--g-border) !important;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.55),
              0 8px 30px rgba(10,14,30,0.08) !important;
}

/* ── 4. Modals / drawers — slightly stronger fill (0.44) for legibility over
   busy content, but the same deep blur + specular edge + wide float. ── */
html[data-theme="glass"] .input-container,
html[data-theme="glass"] .settings-drawer,
html[data-theme="glass"] .account-dialog {
  background: var(--g-surface-strong) !important;
  -webkit-backdrop-filter: blur(32px) saturate(180%);
  backdrop-filter: blur(32px) saturate(180%);
  border: 1px solid var(--g-border) !important;
  box-shadow: 0 18px 55px rgba(31, 38, 135, 0.20),
              inset 0 1px 0 rgba(255, 255, 255, 0.65) !important;
}

/* ── 5. Suggestion cards — a touch more lift + a crisp specular top edge. ── */
html[data-theme="glass"] .suggestion-card {
  border-radius: 18px;
}
html[data-theme="glass"] .suggestion-card:hover {
  background: var(--g-surface-strong) !important;
  box-shadow: 0 22px 60px rgba(31, 38, 135, 0.24),
              inset 0 1px 0 rgba(255, 255, 255, 0.70) !important;
}

/* ── 6. Accessibility: honour reduced-transparency users (fall back to a more
   opaque surface so text never washes out). ── */
@media (prefers-reduced-transparency: reduce) {
  html[data-theme="glass"] {
    --g-surface:        rgba(255, 255, 255, 0.82);
    --g-surface-strong: rgba(255, 255, 255, 0.90);
  }
}
