/* OYB light bulb detail page ([oyb_lb_detail]). Loads after oyb-sl-detail.css, which carries the layout, tokens,
   charts and popovers; these rules only add what bulbs need: the light swatch hero, the legacy note and the
   light-colored dots. */

/* hero: the light itself (no product photos for bulbs) */
.lbd .lbd-light { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 2px; background: radial-gradient(ellipse at 50% 42%, #24202f 0%, #121019 70%); color: #fff; }
.lbd .lbd-light.has-img { background: var(--media); }
.lbd-glow { width: 30%; max-width: 150px; aspect-ratio: 1; border-radius: 50%; margin-bottom: 10px;
  background: radial-gradient(circle at 50% 50%, #fff 0 9%, var(--glow) 42%, transparent 72%);
  box-shadow: 0 0 70px 26px color-mix(in srgb, var(--glow) 50%, transparent); }
.lbd-glows { display: flex; justify-content: center; gap: 4%; width: 100%; margin-bottom: 10px; }
.lbd-glows .lbd-glow { width: 22%; margin-bottom: 0; box-shadow: 0 0 50px 16px color-mix(in srgb, var(--glow) 45%, transparent); }
.lbd .slv-title .lbd-variant { display: block; margin-top: 4px; font-size: 0.48em; font-weight: 800; letter-spacing: 0; color: var(--muted); }
.lbd-k { font-family: var(--head); font-weight: 900; font-size: clamp(1.6rem, 3vw, 2.2rem); line-height: 1; letter-spacing: -0.01em; font-variant-numeric: tabular-nums; }
.lbd-band { font-size: 0.72rem; font-weight: 800; letter-spacing: 0.08em; text-transform: uppercase; color: rgba(255, 255, 255, .72); }
.lbd .slv-flag.is-own { color: var(--accent-deep); }
.lbd .slv-flag.is-own::before { display: none; }
.lbd .lbd-code { font-size: 0.92rem; font-weight: 700; color: var(--muted); }
.lbd .lbd-code b { color: var(--accent-deep); font-weight: 800; letter-spacing: 0.02em; }
.lbd .lbd-own { margin-top: 10px; font-size: 0.88rem; font-weight: 700; color: var(--accent-deep); }

/* legacy data note */
.lbd .lbd-legacy { padding: 14px 18px; border: 1px solid var(--line); border-left: 4px solid #e09a1a; border-radius: 14px; background: var(--surface); color: var(--muted); font-size: 0.93rem; line-height: 1.5; }
.lbd-legacy strong { color: var(--ink); }

/* four question cards: two by two */
.lbd .lbd-q-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); }

/* dark panel: the light color swatch */
.lbd-swatch { display: block; width: 100%; height: 38px; border-radius: 10px; margin: 4px 0 2px; background: var(--glow); box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .12), 0 0 30px -6px var(--glow); }
.lbd .lbd-nospd { display: grid; place-items: center; min-height: 260px; background: #26223a; border-color: #3a3552; }
.lbd .lbd-nospd .slv-empty { color: #c9c3e0; border-color: #4a4466; }
.lbd .lbd-nocvg { grid-template-columns: 1fr; }

/* rank scatter: every dot in its own light color */
.lbd-rank-dot { stroke: rgba(30, 20, 40, .45); stroke-width: 1; }
.lbd-rank-dot.is-disc { fill-opacity: .35; stroke-opacity: .3; }
.lbd-rank-dot:hover { stroke: var(--hover); stroke-width: 2.5; }
.lbd-rank-me { stroke: var(--accent); stroke-width: 4; }
.lbd-rank-me.is-set { stroke: var(--accent); stroke-width: 2; }
.lbd-rank-path { fill: none; stroke: var(--accent); stroke-width: 2; stroke-dasharray: 5 4; }
.lbd .slv-key.lbd-key-me { box-shadow: 0 0 0 2.5px var(--accent); }

/* similar bulbs: light glow + spectrum instead of a photo */
.lbd .lbd-alt-top { position: relative; display: flex; align-items: center; gap: 10px; width: 170px; flex: none; padding: 10px 12px; background: #15131d; }
.lbd-alt-glow { width: 34px; height: 34px; border-radius: 50%; flex: none; background: radial-gradient(circle, #fff 0 10%, var(--glow) 45%, transparent 74%); box-shadow: 0 0 18px 4px color-mix(in srgb, var(--glow) 45%, transparent); }
.lbd .lbd-alt-top .slb-spark { width: 100px; height: 26px; }
.lbd .lbd-alt-top .slv-flag { position: absolute; top: 6px; right: 6px; font-size: 0.62rem; padding: 2px 7px; }
.lbd .lbd-more { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.lbd .lbd-more > .slv-panel:last-child:nth-child(odd) { grid-column: 1 / -1; }

@media (max-width: 900px) {
  .lbd .lbd-q-cards, .lbd .lbd-more { grid-template-columns: 1fr; }
  .lbd .lbd-alt-top { width: 120px; flex-direction: column; justify-content: center; }
  .lbd .lbd-alt-top .slb-spark { width: 96px; }
}

/* The site's dark theme converts light backgrounds; the light swatches keep their real color. */
html[data-oyb-theme="dark"] .lbd .lbd-light:not(.has-img) { background: radial-gradient(ellipse at 50% 42%, #24202f 0%, #0d0c12 70%); }
html[data-oyb-theme="dark"] .lbd .lbd-alt-top { background: #0d0c12; }

/* specs: manufacturer numbers note */
.lbd .lbd-rated { margin: -4px 0 12px; font-size: 0.85rem; color: var(--muted); }

/* Question card strips: this bulb's dot is drawn in its own light color, ringed in navy so it stands out (white at night). */
.lbd .slv-strip-me { stroke: #1a1a2e; stroke-width: 2.5; }
html[data-oyb-theme="dark"] .lbd .slv-strip-me { stroke: #fff; }