/* ============================================================================
   GameMandi — "Refined Liquid Glass" theme.
   Additive layer over the pages' inline styles. Deepens the base, wraps surfaces
   in real frosted glass with hairline specular edges + soft depth, and trades
   the loud cyan→green neon for ONE calm accent.

   NOTE: the DC runtime serialises inline colours as spaced rgb()/rgba(), e.g.
   `rgb(0, 229, 255)` and `rgba(255, 255, 255, 0.02)`. Selectors MUST use that
   exact form to match the style attribute.
   ============================================================================ */

:root {
  --gm-accent: #6CC4FF;            /* one calm cyan */
  --gm-grad: linear-gradient(135deg, #8BD3FF 0%, #4F93FF 100%);  /* refined, single hue family */
  --gm-glass-strong: rgba(13, 17, 27, 0.74);
  --gm-hair: rgba(255, 255, 255, 0.10);
  --gm-hair-bright: rgba(255, 255, 255, 0.18);
  --gm-blur: saturate(150%) blur(22px);
  --gm-depth: 0 24px 60px -32px rgba(0, 0, 0, 0.92);
  --gm-edge: inset 0 1px 0 rgba(255, 255, 255, 0.08);
}

/* ---- deeper, calmer canvas ---- */
body {
  background:
    radial-gradient(1100px 760px at 82% -12%, rgba(70, 120, 210, 0.10), transparent 56%),
    radial-gradient(950px 720px at -12% 112%, rgba(40, 80, 150, 0.09), transparent 55%),
    #05060a !important;
}
/* soften the per-page neon ambient wash so it reads as depth, not glow */
div[style*="position: fixed"][style*="pointer-events: none"][style*="z-index: 0"] { opacity: 0.5 !important; }

/* ---- ONE refined accent instead of the cyan→green gradient ----
   target the gradient by its cyan-start prefix so we never touch product art. */
[style*="linear-gradient(100deg, rgb(0, 229, 255)"],
[style*="linear-gradient(135deg, rgb(0, 229, 255)"],
[style*="linear-gradient(100deg, rgb(0, 230, 118)"] {
  background-image: var(--gm-grad) !important;
}

/* calm the loud accent text — fold both the cyan AND the secondary green
   decorative text into ONE accent (genuine in-stock green dots stay green) */
[style*="color: rgb(0, 229, 255)"],
[style*="color: rgb(0, 230, 118)"],
[style*="color: rgb(155, 235, 255)"],
[style*="color: rgb(184, 255, 217)"],
[style*="color: rgb(143, 240, 192)"] { color: var(--gm-accent) !important; }

/* accent borders (cyan + green tints) → subtle white hairlines */
[style*="rgba(0, 229, 255, 0.2)"],
[style*="rgba(0, 229, 255, 0.25)"],
[style*="rgba(0, 229, 255, 0.3)"],
[style*="rgba(0, 229, 255, 0.35)"],
[style*="rgba(0, 229, 255, 0.4)"],
[style*="rgba(0, 229, 255, 0.45)"],
[style*="rgba(0, 230, 118, 0.18)"],
[style*="rgba(0, 229, 255, 0.18)"],
[style*="rgba(0, 230, 118, 0.2)"],
[style*="rgba(0, 230, 118, 0.25)"],
[style*="rgba(0, 230, 118, 0.3)"],
[style*="rgba(0, 230, 118, 0.35)"],
[style*="rgba(0, 230, 118, 0.4)"],
[style*="rgba(0, 230, 118, 0.45)"],
[style*="rgba(0, 230, 118, 0.5)"] { border-color: var(--gm-hair-bright) !important; }

/* tame the heavy neon glow under CTAs (cyan + green) to a soft, premium shadow */
[style*="rgba(0, 229, 255, 0.5)"],
[style*="rgba(0, 229, 255, 0.55)"],
[style*="rgba(0, 229, 255, 0.6)"],
[style*="rgba(0, 230, 118, 0.5)"],
[style*="rgba(0, 230, 118, 0.55)"],
[style*="rgba(0, 229, 255, 0.45)"] {
  box-shadow: 0 16px 36px -18px rgba(80, 150, 255, 0.5) !important;
}

/* ---- Purge the leftover GREEN: fold every cyan + green BACKGROUND into one
   blue accent tint so selections, tabs, dots and panels are a single hue. ---- */
[style*="background: rgba(0, 229, 255,"],
[style*="background: rgba(0, 230, 118,"] {
  background-color: rgba(108, 196, 255, 0.12) !important;
  background-image: none !important;
}
/* solid accent dots (in-stock LEDs, pulse dots, radios) */
[style*="background: rgb(0, 229, 255)"],
[style*="background: rgb(0, 230, 118)"] {
  background-color: var(--gm-accent) !important;
  background-image: none !important;
}
/* radial accent-glow panels (e.g. the trade-in quote card) → blue glow */
[style*="rgba(0, 230, 118, 0.14)"],
[style*="rgba(0, 229, 255, 0.14)"] {
  background-image: radial-gradient(120% 140% at 100% 0%, rgba(108, 196, 255, 0.14), transparent 60%) !important;
}
/* progress / wear bar (green→cyan) → refined blue */
[style*="linear-gradient(90deg, rgb(0, 230, 118)"],
[style*="linear-gradient(90deg, rgb(0, 229, 255)"] {
  background-image: var(--gm-grad) !important;
}
/* solid accent borders (selection radios) → the calm accent */
[style*="solid rgb(0, 229, 255)"],
[style*="solid rgb(0, 230, 118)"] { border-color: var(--gm-accent) !important; }

/* ============================ GLASS CHROME ============================== */
header[data-screen-label="Rail nav"],
aside,
[data-screen-label="Edit item"],
[data-screen-label="Admin login"] > div {
  background: var(--gm-glass-strong) !important;
  -webkit-backdrop-filter: var(--gm-blur) !important;
  backdrop-filter: var(--gm-blur) !important;
  border-color: var(--gm-hair) !important;
}

/* ====================== GLASS CARDS & PANELS =========================== */
/* product + content cards: hairline specular edge + soft floating depth */
article {
  border: 1px solid var(--gm-hair) !important;
  border-radius: 20px !important;
  box-shadow: var(--gm-depth), var(--gm-edge) !important;
}
/* frost every translucent surface (panels, secondary buttons, search pills,
   trust/stat tiles, floating badges, toasts) so they read as glass */
[style*="background: rgba(255, 255, 255, 0"],
[style*="background: rgba(8, 9, 14, 0"],
[style*="background: rgba(10, 12, 18, 0"],
[style*="background: rgba(11, 13, 20, 0"],
[style*="background: rgba(5, 6, 10, 0"] {
  -webkit-backdrop-filter: var(--gm-blur) !important;
  backdrop-filter: var(--gm-blur) !important;
}
/* glassy translucent panels also get the hairline edge for cohesion */
[style*="background: rgba(255, 255, 255, 0.02"],
[style*="background: rgba(255, 255, 255, 0.025"],
[style*="background: rgba(255, 255, 255, 0.03"],
[style*="background: rgba(255, 255, 255, 0.035"] {
  border-color: var(--gm-hair) !important;
  box-shadow: var(--gm-edge) !important;
}

/* ====================== TYPE & FOCUS POLISH =========================== */
h1, h2 { letter-spacing: -0.01em !important; }
input { caret-color: var(--gm-accent); }
a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible {
  outline: 2px solid var(--gm-accent) !important;
  outline-offset: 2px !important;
}

/* rail / tab-bar labels were 9.5px — nudge to a legible size */
[style*="font-size: 9.5px"] { font-size: 10.5px !important; }