/* ============================================================================
   Global ⌘K search palette — companion to global-search.js.
   Reuses portal.css custom properties (--link, --rule, etc.) and the existing
   .schema-badge / .method-badge classes for operation badges. All colors are
   on-system tokens; the few hex literals are var() fallbacks only.
============================================================================ */

/* top-right trigger, present on every page */
.gs-trigger {
  position: fixed;
  top: 14px;
  right: 18px;
  z-index: 900;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 7px 12px;
  background: var(--color-bg-surface, #fff);
  border: 1px solid var(--rule, #d9d9e3);
  border-radius: var(--radius-8, 8px);
  box-shadow: var(--shadow-1, 0 0 4px 0 rgba(0,0,0,0.12));
  font: inherit;
  font-size: 13px;
  color: var(--content-muted, #52527d);
  cursor: pointer;
}
.gs-trigger:hover { border-color: var(--link, #b93900); color: var(--content-fg, #222238); }
.gs-trigger .gs-mag { font-size: 15px; }
.gs-kbd, .gs-foot kbd, .gs-esc {
  font-family: var(--font-mono, "Roboto Mono", "SF Mono", Menlo, monospace);
  font-size: 11px;
  background: var(--color-neutral-100, #f0f0f4);
  border: 1px solid var(--color-neutral-300, #d9d9e3);
  border-radius: var(--radius-4, 4px);
  padding: 1px 5px;
  color: var(--content-muted, #52527d);
}
@media (max-width: 720px) {
  .gs-trigger-txt { display: none; }
}

/* overlay */
.gs-overlay { position: fixed; inset: 0; z-index: 1000; }
.gs-overlay[hidden] { display: none; }
.gs-backdrop {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, 0.3);
  backdrop-filter: blur(1.5px);
}
.gs-panel {
  position: relative;
  max-width: 620px;
  margin: 9vh auto 0 auto;
  background: var(--color-bg-surface, #fff);
  border-radius: var(--radius-16, 16px);
  box-shadow: var(--shadow-4, 0 0 20px 0 rgba(0,0,0,0.25));
  overflow: hidden;
  display: flex;
  flex-direction: column;
  max-height: 72vh;
}
.gs-input-wrap {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 16px;
  border-bottom: 1px solid var(--rule, #d9d9e3);
}
.gs-input-wrap .gs-mag { font-size: 18px; color: var(--content-muted, #52527d); }
.gs-input {
  flex: 1;
  border: none;
  outline: none;
  font-size: 16px;
  font-family: inherit;
  background: transparent;
  color: var(--content-fg, #222238);
  min-width: 0;
}
.gs-results { overflow-y: auto; padding: 6px 0; }
.gs-group {
  font-size: 10.5px;
  text-transform: uppercase;
  letter-spacing: 0.7px;
  font-weight: 700;
  color: var(--content-muted, #52527d);
  padding: 8px 16px 4px 16px;
}
.gs-row {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 16px;
  text-decoration: none;
  color: var(--content-fg, #222238);
  cursor: pointer;
}
.gs-row.active { background: var(--color-brand-orange-bg, #fbe1df); }
.gs-title {
  font-family: var(--font-mono, "Roboto Mono", "SF Mono", Menlo, monospace);
  font-size: 13.5px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  flex-shrink: 0;
  max-width: 46%;
}
.gs-sub {
  font-size: 12px;
  color: var(--content-muted, #52527d);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  margin-left: auto;
}
.gs-tag {
  font-size: 10.5px;
  font-weight: 700;
  border-radius: var(--radius-4, 4px);
  padding: 2px 7px;
  text-transform: uppercase;
  letter-spacing: 0.4px;
}
.gs-tag-guide {
  background: var(--color-util-purple-bg, #ebe4f6);
  color: var(--color-ink-700, #222238);
  border: 1px solid var(--color-brand-purple, #9747ff);
}
.gs-hint, .gs-empty {
  padding: 22px 18px;
  font-size: 13px;
  color: var(--content-muted, #52527d);
  text-align: center;
}
.gs-foot {
  display: flex;
  gap: 6px;
  align-items: center;
  padding: 9px 16px;
  border-top: 1px solid var(--rule, #d9d9e3);
  font-size: 11.5px;
  color: var(--content-muted, #52527d);
}
body.gs-open { overflow: hidden; }
