/* CompareSmartDevice — catalog-futurist layer.
   Injected at serve-time into the pre-rendered static catalog artifacts
   (resources/catalog/*.html) by CatalogPageController. Those pages carry
   their own embedded cool theme with short token names; this sheet aligns
   them with the home v3 instrument system: same blue-black surfaces,
   electric cyan accent, geometric type. Loads after their inline <style>,
   so the cascade wins without touching the artifacts. */

:root {
  --bg: #07090d;
  --card: #0d1117;
  --card2: #111823;
  --line: rgba(154, 190, 255, 0.14);
  --tx: #eaf2fb;
  --dim: #8fa0b3;
  --acc: #2fd6f4;
  --acc2: #7ce9fb;
  --ok: #39e0a4;
  --warn: #e5c072;
}

body {
  background: #07090d;
  color: #eaf2fb;
}

h1, h2, h3, h4 {
  font-family: InterVariable, Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
  letter-spacing: -0.018em;
}

a { color: #7ce9fb; }
a:hover { color: #2fd6f4; }

:focus-visible { outline: 2px solid #2fd6f4; outline-offset: 2px; }
::selection { background: rgba(47, 214, 244, 0.28); color: #eaf2fb; }

::-webkit-scrollbar { width: 10px; height: 10px; }
::-webkit-scrollbar-track { background: #07090d; }
::-webkit-scrollbar-thumb { background: #1d2632; border-radius: 8px; }
::-webkit-scrollbar-thumb:hover { background: #28374a; }

/* form controls the embedded themes never styled (native white/gray
   chrome) — themed defaults; classed controls keep winning over these */
select, input {
  background: #0d1117;
  color: #eaf2fb;
  border: 1px solid rgba(154, 190, 255, 0.25);
  border-radius: 8px;
  padding: 6px 10px;
  font: inherit;
}
select:focus-visible, input:focus-visible { outline: 2px solid #2fd6f4; outline-offset: 1px; }
option { background: #0d1117; color: #eaf2fb; }

button {
  font: inherit;
  background: #111823;
  color: #eaf2fb;
  border: 1px solid rgba(154, 190, 255, 0.28);
  border-radius: 8px;
  padding: 6px 12px;
  cursor: pointer;
}
button:hover { border-color: #2fd6f4; color: #7ce9fb; }
button:disabled { opacity: 0.6; cursor: not-allowed; }

.buy-btn--unavailable { color: #a9b8cb; }
