/* Niyya look: DLP Selector Tool (DLPST).
   OEM colours (--oem), the requirement levels and good / warn / bad keep
   their meaning; teal and navy become the site's pink and ink. */

:root {
  --navy: var(--niyya-ink);
  --navy-2: var(--niyya-ink-3);
  --teal: var(--niyya-pink);
  --teal-d: var(--niyya-ink);
  --ink: var(--niyya-ink);
  --ink-2: var(--niyya-text-2);
  --muted: var(--niyya-muted);
  --line: var(--niyya-line);
  --line-2: var(--niyya-line-2);
  --bg: var(--niyya-paper);
  --card: #fff;
  --shadow: 0 1px 2px rgba(11, 11, 11, .04), 0 4px 16px rgba(11, 11, 11, .04);
}
a, a.cite { color: var(--niyya-pink-ink); }
a.cite { border-bottom-color: rgba(184, 48, 110, .4); }
pre { background: var(--niyya-ink-2); }

/* ---- top bar ---- */
.topbar { box-shadow: none; border-bottom: 1px solid var(--niyya-ink); }
.brand-mark svg > rect:first-child { fill: var(--niyya-ink-3); }
.brand-mark svg path[fill] { fill: var(--niyya-pink); }
.brand-mark svg { border-radius: 7px; box-shadow: 0 0 0 1px rgba(255, 255, 255, .16); }
.brand-text small, .who.muted { color: var(--niyya-on-dark-2); }
.topnav a { position: relative; color: var(--niyya-on-dark); }
.topnav a.is-active { background: transparent; box-shadow: none; font-weight: 600; }
.topnav a.is-active::after {
  content: ""; position: absolute; inset-inline: 12px; bottom: 1px; height: 2px; border-radius: 2px;
  background: var(--niyya-rainbow);
}
.topbar .btn-outline:hover { background: var(--niyya-dark-hover); border-color: #fff; }
.topbar .btn-ghost { color: var(--niyya-on-dark); }

/* ---- hero: the site's dark glow ---- */
.hero { background: var(--niyya-hero); color: var(--niyya-on-dark); }
.hero .eyebrow { color: var(--niyya-pink); }
.hero-points span { color: var(--niyya-on-dark); }

/* ---- buttons and fields ---- */
.btn-primary:hover { background: var(--niyya-ink-3); }
.btn-ghost:hover { background: var(--niyya-paper-2); }
input:focus, select:focus { outline-color: rgba(240, 111, 168, .35); border-color: var(--niyya-pink); }
.input-unit em { background: var(--niyya-paper-2); }
.flash-info { background: var(--niyya-paper-2); border-color: var(--niyya-line); color: var(--niyya-text-2); }

/* ---- results ---- */
a.rank-card:hover { box-shadow: 0 6px 20px rgba(11, 11, 11, .1); }
.ring { background: conic-gradient(var(--oem) calc(var(--p) * 1%), var(--niyya-paper-3) 0); }
.band-good .rank-band, .band.band-good { color: var(--niyya-green-ink); }
.band, .grid thead th, .tabs, .lvl-unknown, .prio-none { background: var(--niyya-paper-2); }
.grid tr.total td, .grid tr.total th { background: var(--niyya-paper); }
.bar { background: var(--niyya-paper-3); }
.chip { background: var(--niyya-green-soft); color: var(--niyya-green-ink); }
.vendor-tabs a.is-active small { color: var(--niyya-on-dark); }
.tab.is-active { box-shadow: 0 1px 3px rgba(11, 11, 11, .1); }
.btn-export:hover { border-color: var(--niyya-pink); background: var(--niyya-pink-soft); }