/**
 * HSE Cmd+K / command-palette DNA
 * Source: ui/hse/assets/hse.css (.finder*) + ui/hse/assets/search.js
 * Canonical notes: Design.MD § HSE Cmd+K search DNA
 *
 * Shell chrome overlay — NOT ERP paint-body olive.
 * Tokens fall back to OS :root (--ink / --voltr neon) when present.
 */
:root {
  --cmdk-cream: #F4F4F2;
  --cmdk-ink: var(--ink, #0C0C0C);
  --cmdk-muted: #707070;
  --cmdk-line: rgba(12, 12, 12, 0.12);
  --cmdk-voltr: var(--voltr, #E6FD10);
  --cmdk-olive: #5a6400;
  --cmdk-width: min(1180px, calc(100% - 40px));
  --cmdk-input-size: 72px;
  --cmdk-title-size: 32px;
  --cmdk-row-min: 92px;
  --cmdk-z: 60;
}

/* Trigger chip (apps bar / nav) */
.cmdk-open,
.search-open {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  background: transparent;
  border: 0;
  color: var(--cmdk-ink);
  font: 600 13px/16px var(--font-body, Inter), sans-serif;
  cursor: pointer;
  padding: 0;
}
.cmdk-open kbd,
.search-open kbd {
  font: 700 10px/14px var(--font-display, "Space Grotesk"), sans-serif;
  letter-spacing: 0.06em;
  border: 1px solid var(--cmdk-ink);
  border-radius: 999px;
  padding: 2px 7px;
}

/* Full-screen overlay */
.cmdk,
.finder {
  position: fixed;
  inset: 0;
  z-index: var(--cmdk-z);
  background: var(--cmdk-cream);
  overflow: auto;
}
.cmdk[hidden],
.finder[hidden] {
  display: none !important;
}
body.cmdk-open-active {
  overflow: hidden;
}

.cmdk-screen,
.finder-screen {
  width: var(--cmdk-width);
  min-height: calc(100vh - 64px);
  margin: 32px auto 48px;
}

.cmdk-kicker,
.finder-screen > .kicker {
  margin: 0 0 12px;
  font: 700 11px/14px var(--font-display, "Space Grotesk"), sans-serif;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--cmdk-olive);
}

/* Bold large input — the hero of Ctrl+K */
.cmdk-input,
.finder-screen input,
#cmdk-q {
  width: 100%;
  border: 0;
  border-bottom: 2px solid var(--cmdk-ink);
  background: transparent;
  border-radius: 0;
  padding: 18px 0 22px;
  font: 700 var(--cmdk-input-size)/0.9 var(--font-display, "Space Grotesk"), sans-serif;
  letter-spacing: -0.045em;
  color: var(--cmdk-ink);
  caret-color: var(--cmdk-ink);
}
.cmdk-input::placeholder,
.finder-screen input::placeholder,
#cmdk-q::placeholder {
  color: rgba(12, 12, 12, 0.28);
  font-weight: 700;
}
.cmdk-input:focus,
.finder-screen input:focus,
#cmdk-q:focus {
  outline: none;
}

/* Instant results list */
.cmdk-list,
.finder-list {
  list-style: none;
  margin: 8px 0 0;
  padding: 0;
}
.cmdk-list a,
.cmdk-list button,
.finder-list a,
.finder-list button {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 16px;
  align-items: center;
  width: 100%;
  min-height: var(--cmdk-row-min);
  padding: 18px 16px;
  text-decoration: none;
  text-align: start;
  border: 0;
  border-bottom: 1px solid var(--cmdk-line);
  background: transparent;
  color: var(--cmdk-ink);
  cursor: pointer;
  font: inherit;
}
.cmdk-list a.on,
.cmdk-list a:hover,
.cmdk-list button.on,
.cmdk-list button:hover,
.finder-list a.on,
.finder-list a:hover,
.finder-list button.on,
.finder-list button:hover {
  background: var(--cmdk-voltr);
}
.cmdk-list b,
.finder-list b {
  display: block;
  font: 700 var(--cmdk-title-size)/36px var(--font-display, "Space Grotesk"), sans-serif;
  letter-spacing: -0.03em;
}
.cmdk-list small,
.finder-list small {
  display: block;
  color: var(--cmdk-muted);
  font-size: 15px;
  line-height: 1.35;
  margin-top: 4px;
}
.cmdk-list a.on small,
.cmdk-list a:hover small,
.cmdk-list button.on small,
.cmdk-list button:hover small,
.finder-list a.on small,
.finder-list a:hover small,
.finder-list button.on small,
.finder-list button:hover small {
  color: var(--cmdk-ink);
}

.cmdk-pill,
.code-pill {
  font: 700 13px/16px var(--font-display, "Space Grotesk"), sans-serif;
  letter-spacing: 0.06em;
  border: 1px solid var(--cmdk-ink);
  border-radius: 999px;
  padding: 6px 12px;
  max-width: 160px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.cmdk-note,
.finder-note {
  margin: 16px 0 0;
  color: var(--cmdk-muted);
  font-size: 15px;
}

.cmdk-group {
  margin: 20px 0 0;
  font: 700 11px/14px var(--font-display, "Space Grotesk"), sans-serif;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--cmdk-muted);
}

/* Shell homeSearch — inherit Cmd+K input scale when visible */
#homeSearch:not([hidden]).cmdk-input,
#homeSearch.home-search.cmdk-aligned:not([hidden]) {
  font: 700 clamp(44px, 7vw, 72px)/0.9 var(--font-display, "Space Grotesk"), sans-serif;
  letter-spacing: -0.045em;
  border-bottom: 2px solid var(--cmdk-ink);
  padding: 12px 0 18px;
}

@media (max-width: 800px) {
  :root {
    --cmdk-width: min(100% - 32px, 1180px);
    --cmdk-input-size: 44px;
    --cmdk-title-size: 22px;
    --cmdk-row-min: 72px;
  }
  .cmdk-list b,
  .finder-list b {
    line-height: 26px;
  }
}