/* ============================================================
   ENGINEERED PREPAREDNESS — site-wide search
   Header trigger button + the search overlay. Pairs with
   shared/search.js and the static /search-index.json.
   ============================================================ */

/* ---- header icon buttons (live in .navactions so they survive the mobile collapse) ---- */
.navsearch, .navasst {
  display: flex; align-items: center; justify-content: center;
  width: 38px; height: 38px; flex: none;
  background: none; border: 0; padding: 0; cursor: pointer;
  color: rgba(255,255,255,.72); text-decoration: none;
  -webkit-appearance: none; appearance: none;
}
.navsearch:hover, .navasst:hover { color: #fff; }
.navsearch svg { width: 21px; height: 21px; display: block; }
.navasst svg { width: 22px; height: 22px; display: block; }

/* ---- overlay ---- */
html.pws-lock { overflow: hidden; }
.pws-overlay {
  position: fixed; inset: 0; z-index: 2000;
  display: none; justify-content: center; align-items: flex-start;
  padding: 10vh 18px 24px;
  background: rgba(15,34,54,.55); -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px);
}
.pws-overlay.on { display: flex; }

.pws-panel {
  width: 100%; max-width: 620px; max-height: 76vh;
  display: flex; flex-direction: column; overflow: hidden;
  background: #fff; border: 1px solid var(--line, #D9D3C6); border-radius: 14px;
  box-shadow: 0 24px 60px rgba(15,34,54,.32);
}

.pws-bar { display: flex; align-items: center; gap: 10px; padding: 12px 14px; border-bottom: 1px solid var(--line, #D9D3C6); }
.pws-bar .pws-ico { width: 20px; height: 20px; flex: none; color: var(--ink-faint, #797A71); }
.pws-input {
  flex: 1; min-width: 0; border: 0; outline: 0; background: none;
  font: inherit; font-size: 17px; color: var(--navy-900, #0F2236);
}
.pws-input::placeholder { color: var(--ink-faint, #9a9a88); }
.pws-close {
  flex: none; cursor: pointer; border: 1px solid var(--line, #D9D3C6); background: #F5F1E8;
  color: var(--ink-faint, #797A71); border-radius: 7px; padding: 4px 9px;
  font-family: var(--mono, ui-monospace, Menlo, monospace); font-size: 11px; letter-spacing: .04em;
}
.pws-close:hover { border-color: #b9b2a2; color: var(--navy-900, #0F2236); }

.pws-hint { padding: 14px 16px; color: var(--ink-faint, #797A71); font-size: 13.5px; }
.pws-empty { padding: 20px 16px; color: var(--ink-faint, #797A71); font-size: 14px; }

.pws-list { overflow-y: auto; }
.pws-row {
  display: flex; align-items: flex-start; gap: 11px;
  padding: 11px 15px; border-bottom: 1px solid #F0ECE3; text-decoration: none;
}
.pws-row:last-child { border-bottom: 0; }
.pws-row.on { background: #F6F2E9; }
.pws-kind {
  flex: none; margin-top: 1px; min-width: 62px;
  font-family: var(--mono, ui-monospace, Menlo, monospace); font-size: 9.5px; font-weight: 700;
  letter-spacing: .09em; text-transform: uppercase; color: var(--ink-faint, #797A71);
  padding: 3px 7px; border-radius: 999px; background: #ECE7DC; text-align: center;
}
.pws-k-tool { background: #FBF1D4; color: #8a6d12; }
.pws-k-threat { background: #F6E2DE; color: #B23A2A; }
.pws-k-topic { background: #E6EEF6; color: #1C4E8A; }
.pws-k-article { background: #E9F3EC; color: #1F6B43; }
.pws-k-resource { background: #EDE7F3; color: #5B3F86; }
.pws-k-page { background: #ECE7DC; color: #6b6c63; }
.pws-main { min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.pws-t { font-weight: 700; font-size: 15px; color: var(--navy-900, #0F2236); line-height: 1.25; }
.pws-d {
  font-size: 12.5px; color: var(--ink-faint, #797A71); line-height: 1.35;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
}

@media (max-width: 560px) {
  .pws-overlay { padding: 7vh 12px 16px; }
  .pws-panel { max-height: 84vh; }
  .pws-kind { min-width: 54px; }
}