/* The public search drawer has no catalog-card or product-page sizing rules. */
body.shop-search-drawer-open { overflow: hidden; }
.shop-search-drawer {
  position: fixed;
  inset: var(--shop-search-viewport-top, 0px) auto auto 0;
  width: min(420px, 100vw);
  max-width: 100vw;
  height: var(--shop-search-viewport-height, 100dvh);
  max-height: var(--shop-search-viewport-height, 100dvh);
  margin: 0;
  padding: 12px 14px max(12px, env(safe-area-inset-bottom));
  border: 0;
  background: #faf8f5;
  color: #292733;
  box-shadow: 6px 0 28px #0002;
  overflow: hidden;
  box-sizing: border-box;
}
.shop-search-drawer[open] { display: flex; flex-direction: column; animation: shop-search-drawer-enter .18s ease-out; }
.shop-search-drawer::backdrop { background: #24212d66; }
.shop-search-drawer [hidden] { display: none !important; }
.shop-search-drawer-header { display: flex; justify-content: space-between; gap: 8px; align-items: flex-start; flex: 0 0 auto; }
.shop-search-drawer-header h2 { margin: 0; font-size: 20px; line-height: 1.25; }
.shop-search-drawer-header p { margin: 4px 0 0; color: #6c6570; font-size: 13px; }
.shop-search-drawer-close { flex: 0 0 44px; width: 44px; height: 44px; padding: 0; background: #fff; border: 1px solid #ded8e1; border-radius: 10px; color: #4c4b75; font-size: 26px; cursor: pointer; }
.shop-search-drawer-form { display: grid; gap: 6px; margin: 8px 0 0; flex: 0 0 auto; }
.shop-search-drawer-label { margin: 0; color: #6c6570; font-size: 13px; line-height: 1.35; }
.shop-search-drawer-field { position: relative; min-width: 0; }
.shop-search-drawer-field input { display: block; width: 100%; min-width: 0; height: 46px; margin: 0; padding: 10px 46px 10px 12px; border: 1px solid #bab4c4; border-radius: 10px; background: #fff; color: #292733; font: inherit; font-size: 16px; -webkit-appearance: none; appearance: none; }
.shop-search-drawer-field input::-webkit-search-cancel-button { display: none; }
.shop-search-drawer-field button { position: absolute; right: 1px; top: 1px; width: 44px; height: 44px; padding: 0; border: 0; border-radius: 9px; background: #fff; color: #4c4b75; font-size: 24px; cursor: pointer; }
.shop-search-drawer-submit { min-height: 44px; padding: 8px 12px; border: 1px solid #d5d0df; border-radius: 10px; background: #f0edf5; color: #4c4b75; font: inherit; cursor: pointer; }
.shop-search-drawer-status { flex: 1 1 0; min-width: 0; margin: 8px 0; color: #6c6570; font-size: 13px; overflow-wrap: anywhere; }
.shop-search-drawer-results { flex: 1 1 auto; min-height: 0; overflow-y: auto; overflow-x: hidden; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; }
.shop-search-drawer-group { margin: 0 0 12px; }
.shop-search-drawer-group h3 { position: sticky; top: 0; z-index: 1; padding: 8px 4px; margin: 0; background: #faf8f5; color: #66532e; font-size: 14px; line-height: 1.35; overflow-wrap: anywhere; border-bottom: 1px solid #e6dfd5; }
.shop-search-drawer-group ul { list-style: none; padding: 0; margin: 0; }
.shop-search-drawer-item { display: grid; gap: 3px; min-height: 44px; padding: 10px 4px; border-bottom: 1px solid #ece6df; color: #292733; text-decoration: none; overflow-wrap: anywhere; scroll-margin-top: 42px; }
.shop-search-drawer-item:hover { background: #f1eef5; }
.shop-search-drawer-name { font-size: 15px; line-height: 1.35; }
.shop-search-drawer-prices { display: flex; flex-wrap: wrap; gap: 2px 12px; color: #39782f; font-size: 13px; line-height: 1.4; }
.shop-search-drawer-prices span { max-width: 100%; }
.shop-search-drawer-retry { flex: 0 0 auto; min-height: 44px; padding: 8px 12px; border: 1px solid #c9c3d2; border-radius: 10px; background: #fff; color: #4c4b75; font: inherit; cursor: pointer; }
.shop-search-drawer :is(button, input, a):focus-visible { outline: 2px solid #5a547f; outline-offset: 2px; }
@keyframes shop-search-drawer-enter { from { transform: translateX(-100%); } to { transform: translateX(0); } }
@media (prefers-reduced-motion: reduce) { .shop-search-drawer[open] { animation: none; } }

/* Search refinements are scoped to the drawer and the existing filter panel. */
.shop-search-drawer-toolbar { display:flex; justify-content:space-between; align-items:center; gap:8px; margin:4px 0; flex:0 0 auto; }
.shop-search-drawer-toolbar .shop-search-drawer-status { margin:0; }
.shop-search-filter-toggle { flex:0 0 auto; min-height:44px; padding:8px 12px; background:#fff; border:1px solid #ddd6e1; border-radius:10px; color:#4c4b75; font:inherit; cursor:pointer; }
.shop-search-filter-toggle[aria-expanded="true"] { background:#f0edf5; }
.shop-search-filter-panel { flex:0 0 auto; display:grid; grid-template-columns:minmax(0, 1fr); gap:8px; padding:8px; margin-bottom:8px; border:1px solid #e0d9e6; border-radius:12px; background:#fff; max-height:min(270px, calc(var(--shop-search-viewport-height, 100dvh) * .45)); overflow-y:auto; overscroll-behavior:contain; }
.shop-search-filter-panel > label { display:grid; gap:4px; margin:0; color:#6c6570; font-size:13px; min-width:0; }
.shop-search-filter-panel select { width:100%; min-width:0; min-height:44px; height:44px; margin:0; padding:8px; border:1px solid #cfc7d8; border-radius:8px; color:#292733; background:#fff; font-size:16px; }
:is(.shop-filter-options, .shop-search-filter-panel) .shop-search-genders { grid-column:1 / -1; padding:0; margin:0; border:0; min-width:0; }
:is(.shop-filter-options, .shop-search-filter-panel) .shop-search-genders legend { margin-bottom:7px; color:#6c6570; font-size:13px; }
:is(.shop-filter-options, .shop-search-filter-panel) .shop-search-genders > div { display:flex; flex-wrap:wrap; gap:5px; }
:is(.shop-filter-options, .shop-search-filter-panel) .shop-search-genders label { position:relative; display:block; flex:1 1 auto; margin:0; }
:is(.shop-filter-options, .shop-search-filter-panel) .shop-search-genders input { position:absolute; opacity:0; width:100%; height:100%; margin:0; cursor:pointer; }
:is(.shop-filter-options, .shop-search-filter-panel) .shop-search-genders span { display:flex; align-items:center; justify-content:center; min-height:44px; padding:7px; border:1px solid #ddd6e1; border-radius:8px; color:#4c4b75; background:#fff; font-size:13px; }
:is(.shop-filter-options, .shop-search-filter-panel) .shop-search-genders input:checked + span { background:#565176; color:#fff; border-color:#565176; }
:is(.shop-filter-options, .shop-search-filter-panel) .shop-search-genders input:focus-visible + span { outline:2px solid #5a547f; outline-offset:2px; }
.shop-search-alternative { padding:6px 8px; margin:0 0 8px; flex:0 0 auto; color:#5a4760; background:#f0eaf2; border-radius:9px; font-size:13px; }
.shop-search-drawer-brand { font-size:12px; color:#66532e; }

/* Compact drawer controls; shared catalog filters keep their existing geometry. */
.shop-search-filter-panel .shop-search-genders legend { margin-bottom:4px; }
.shop-search-filter-panel .shop-search-genders span { padding:6px; }
@media (min-width:380px) {
  .shop-search-filter-panel { grid-template-columns:repeat(2, minmax(0, 1fr)); }
  /* Price sort labels need a full row so that their direction stays readable. */
  .shop-search-filter-panel:has(select[name="sort"] option[value*="_price_"]:checked) > label { grid-column:1 / -1; }
}
