/* ==========================================================================
   search.css — search form, search drawer (predictive results) and the
   search results page. Guides / Search / SEO agent. Prefix: search-.
   ========================================================================== */

/* ---------- form (drawer + searchform.php) ---------- */
.search-form,.search-form--stack{display:grid;gap:var(--s-2);max-width:640px}
.search-form--stack{max-width:none}
.search-label{font:500 11px/1.3 var(--sans);letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.search-field{display:flex;gap:var(--s-2);min-width:0}
.search-field .input{flex:1;min-width:0}
.search-field .btn{flex:none;padding-inline:20px}
.search-hint{margin:0;font-size:13px;line-height:1.5;color:var(--muted)}
@media (hover:none){.search-hint{display:none}}

/* ---------- predictive results (drawer) ---------- */
.search-results{margin-top:var(--s-6);display:grid;gap:var(--s-6);transition:opacity .2s}
.search-results[hidden],.search-idle[hidden]{display:none}
.search-box[aria-busy="true"] .search-results{opacity:.55}
.search-idle{margin-top:var(--s-6);display:grid;gap:var(--s-3)}
.search-group{display:grid;gap:var(--s-3)}
.search-group__h{margin:0}
.search-chips{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:var(--s-2)}
.search-chips .chip{min-height:44px}
.search-list{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.search-item{border-bottom:1px solid var(--line)}
.search-item__link{display:grid;grid-template-columns:60px minmax(0,1fr);gap:var(--s-4);align-items:center;min-height:44px;padding-block:var(--s-3);color:inherit;text-decoration:none}
.search-item__link:hover .search-item__title,.search-item__link:focus-visible .search-item__title{text-decoration:underline;text-underline-offset:4px;text-decoration-thickness:1px}
.search-item__media{display:block;aspect-ratio:3/4;overflow:hidden;background:var(--soft)}
.search-item__media img{display:block;width:100%;height:100%;object-fit:cover}
.search-item__body{display:grid;gap:4px;min-width:0}
.search-item__title{font:400 19px/1.2 var(--serif);color:var(--ink)}
.search-item__price{font-size:13px;white-space:normal}
.search-item__price del{color:var(--muted)}
.search-item__price ins{text-decoration:none}
.search-item__stock{font:500 11px/1.3 var(--sans);letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.search-none{margin:0;font:300 24px/1.3 var(--serif);max-width:28ch}
.search-all__row{margin:0}
.search-all{display:inline-flex;align-items:flex-end;min-height:44px}

/* ---------- results page ---------- */
.search-page__head .search-form{margin-top:var(--s-3)}
.search-page__count{margin:0}
.search-section{margin-top:var(--s-8);display:grid;gap:var(--s-5);min-width:0}
.search-section--cols{margin-top:var(--s-6);gap:var(--s-3)}
.search-section__h{margin:0}
.search-grid{--cols:4}
@media (max-width:760px){.search-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:560px){.search-grid--posts{grid-template-columns:minmax(0,1fr)}}
.search-empty{margin-top:var(--s-6);display:grid;gap:var(--s-5);justify-items:start}
.search-empty__lead{margin:0;max-width:28ch;font:300 clamp(26px,3vw,34px)/1.2 var(--serif)}
.search-empty .muted{margin:0;max-width:56ch}
.search-empty .search-section{margin-top:0}

@media (prefers-reduced-motion:reduce){.search-results{transition:none}}