/* Site-wide search overlay (public/search.js). Self-contained tokens so it
   works on every page, including the dashboard's inline-styled document. */

.srch-overlay {
  --s-bg: #f7f3ea;
  --s-card: #fdfbf6;
  --s-border: #d8cfba;
  --s-text: #211d14;
  --s-dim: #6e6553;
  --s-accent: #31597f;
  --s-accent2: #b04e1b;
  --s-mark: rgba(176, 78, 27, 0.18);
  --s-serif: "Iowan Old Style", "Palatino Linotype", Palatino, "Book Antiqua", Georgia, serif;
  --s-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;

  position: fixed;
  inset: 0;
  z-index: 100;
  display: none;
}

@media (prefers-color-scheme: dark) {
  .srch-overlay {
    --s-bg: #161410;
    --s-card: #1e1b15;
    --s-border: #383225;
    --s-text: #e9e3d3;
    --s-dim: #9c917c;
    --s-accent: #8fb8e0;
    --s-accent2: #dd9355;
    --s-mark: rgba(221, 147, 85, 0.25);
  }
}

.srch-overlay.show { display: block; }

.srch-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(20, 16, 8, 0.45);
}

.srch-panel {
  position: relative;
  margin: 11vh auto 0;
  width: min(640px, calc(100vw - 32px));
  background: var(--s-card);
  border: 1px solid var(--s-border);
  border-radius: 5px;
  box-shadow: 0 18px 60px rgba(15, 12, 5, 0.35);
  font-family: var(--s-serif);
  color: var(--s-text);
  display: flex;
  flex-direction: column;
  max-height: 72vh;
}

.srch-input {
  font-family: var(--s-serif);
  font-size: 18px;
  color: var(--s-text);
  background: transparent;
  border: none;
  border-bottom: 1px solid var(--s-border);
  padding: 16px 18px;
  outline: none;
  width: 100%;
}

.srch-input::placeholder { color: var(--s-dim); }

.srch-chips {
  display: flex;
  gap: 6px;
  padding: 10px 14px 4px;
}

.srch-chip {
  font-family: var(--s-serif);
  font-variant-caps: small-caps;
  letter-spacing: 0.05em;
  font-size: 13.5px;
  color: var(--s-dim);
  background: transparent;
  border: 1px solid var(--s-border);
  border-radius: 3px;
  padding: 3px 11px;
  cursor: pointer;
}

.srch-chip.active { color: var(--s-accent); border-color: var(--s-accent); }

.srch-results {
  overflow-y: auto;
  padding: 8px 8px 10px;
}

.srch-hit {
  display: block;
  padding: 9px 10px;
  border-radius: 4px;
  text-decoration: none;
  color: inherit;
}

.srch-hit:hover, .srch-hit.cursor { background: var(--s-bg); }

.srch-hit.planned { opacity: 0.6; }

.srch-crumb {
  display: block;
  font-variant-caps: small-caps;
  letter-spacing: 0.05em;
  font-size: 12.5px;
  color: var(--s-accent2);
}

.srch-title {
  display: block;
  font-size: 16.5px;
  font-weight: 600;
}

.srch-snip {
  display: block;
  font-size: 13.5px;
  color: var(--s-dim);
  line-height: 1.5;
}

.srch-snip mark, .srch-title mark {
  background: var(--s-mark);
  color: inherit;
  border-radius: 2px;
  padding: 0 1px;
}

.srch-empty {
  padding: 22px 16px 26px;
  font-size: 14.5px;
  color: var(--s-dim);
}

.srch-foot {
  border-top: 1px solid var(--s-border);
  padding: 7px 14px;
  font-family: var(--s-mono);
  font-size: 10.5px;
  color: var(--s-dim);
}

/* Trigger injected into the sitenav */
.nav-search {
  cursor: pointer;
  color: var(--text-dim, var(--dim, #6e6553));
  text-decoration: none;
}

.nav-search:hover { color: var(--accent, #31597f); }

.nav-search .srch-kbd {
  font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  font-size: 0.78em;
  border: 1px solid currentColor;
  border-radius: 3px;
  padding: 0 4px;
  opacity: 0.7;
}
