/* Phase 7 presentation only. Shared tokens, cards, categories and shell stay authoritative. */
.shopyli-ui .sh-search-widget { min-inline-size: 0; position: relative; }
.shopyli-ui .sh-search-form { display: grid; gap: .5rem; min-inline-size: 0; }
.shopyli-ui .sh-search-input-row { display: flex; align-items: center; gap: .375rem; min-inline-size: 0; }
.shopyli-ui .sh-search-input-row > input { min-inline-size: 0; flex: 1; inline-size: 100%; }
.shopyli-ui .sh-search-input-row > input::-webkit-search-cancel-button { display: none; }
.shopyli-ui .sh-search-input-row > button { flex: none; min-inline-size: 44px; min-block-size: 44px; padding: 10px; }
.shopyli-ui .sh-search-input-row > button .sh-icon { inline-size: 24px; block-size: 24px; }
.shopyli-ui .sh-search-status { margin-block: .5rem 0; color: var(--sh-muted); font-size: .875rem; }
.shopyli-ui .sh-search-status:empty { display: none; }
.shopyli-ui .sh-search-suggestions { margin-block-start: .75rem; border-block-start: 1px solid var(--sh-line); padding-block-start: .75rem; }
.shopyli-ui .sh-search-suggestions nav { display: grid; gap: .625rem; }
.shopyli-ui .sh-search-group-title { font-weight: 700; font-size: .875rem; }
.shopyli-ui .sh-search-suggestions .sh-card-collection--list { gap: .375rem; }
.shopyli-ui .sh-search-suggestions .sh-product-type, .shopyli-ui .sh-search-suggestions .sh-card-options { display: none; }
.shopyli-ui .sh-search-suggestions .sh-product-card--list .sh-product-link { grid-template-columns: minmax(0,min(30%,6rem)) minmax(0,1fr); }
.shopyli-ui .sh-search-suggestions .sh-product-body { padding: .375rem .625rem; grid-template-rows: calc(2 * var(--sh-product-title-line)) minmax(1.5rem,auto); }
.shopyli-ui .sh-search-suggestions .sh-product-price { font-size: .9375rem; }
.shopyli-ui .sh-search-suggestions .sh-category-grid { grid-template-columns: 1fr; }
.shopyli-ui .sh-search-suggestions .sh-category-tile { min-block-size: 44px; }
/* Stable header/form; only feedback scrolls as suggestions change. */
.shopyli-ui #sh-shell-search { inline-size: min(100%,600px); max-inline-size: 100%; max-block-size: calc(100dvh - 10rem); overflow: hidden; padding: 0; }
.shopyli-ui #sh-shell-search .sh-dialog-inner { display: flex; flex-direction: column; gap: 16px; min-block-size: 0; max-block-size: inherit; padding: 20px 16px; }
.shopyli-ui #sh-shell-search .sh-dialog-header { align-items: center; gap: 12px; margin-block-end: 0; }
.shopyli-ui #sh-shell-search .sh-dialog-header h2 { min-inline-size: 0; padding-block-start: 0; overflow-wrap: anywhere; }
.shopyli-ui #sh-shell-search .sh-search-widget { display: flex; flex-direction: column; min-block-size: 0; flex-shrink: 1; }
.shopyli-ui #sh-shell-search .sh-search-form { flex: none; }
.shopyli-ui #sh-shell-search .sh-search-feedback { min-block-size: 0; overflow-y: auto; overscroll-behavior: contain; scrollbar-gutter: stable; padding-inline: 3px; margin-inline: -3px; }
.shopyli-ui #sh-shell-search .sh-search-status { margin-block-start: 10px; }
.shopyli-ui #sh-shell-search .sh-search-suggestions { margin-block-start: 10px; padding-block: 10px 3px; }
.shopyli-ui .sh-search-input-row > input:focus { border-color: var(--sh-brand); outline: 2px solid var(--sh-brand); outline-offset: 0; box-shadow: none; }
.shopyli-ui #sh-shell-search [data-sh-shell-close] { position: relative; isolation: isolate; flex: none; inline-size: 44px; block-size: 44px; padding: 10px; border: 0; border-radius: var(--sh-radius-full); background: transparent; color: var(--sh-brand-hover); }
.shopyli-ui #sh-shell-search [data-sh-shell-close]::before { content: ''; position: absolute; z-index: -1; inset: 4px; border-radius: inherit; pointer-events: none; }
.shopyli-ui #sh-shell-search [data-sh-shell-close]:is(:hover,:focus-visible,:active)::before { background: var(--sh-brand-soft); }
.shopyli-ui #sh-shell-search [data-sh-shell-close]:focus-visible { outline: none; }
.shopyli-ui #sh-shell-search [data-sh-shell-close]:focus-visible::before { outline: 2px solid var(--sh-brand); outline-offset: 2px; }
@media(max-width:959px) {
 .shopyli-ui #sh-shell-search { --sh-search-top-gap: calc(16px + env(safe-area-inset-top,0px) + var(--sh-shell-admin-offset,0px)); position: fixed; inset-block: calc(var(--sh-search-top-gap) + var(--sh-search-view-top,0px)) auto; margin-block: 0; margin-inline: auto; inline-size: calc(100% - 32px - env(safe-area-inset-left,0px) - env(safe-area-inset-right,0px)); border-radius: var(--sh-radius-xl); max-block-size: min(72dvh,calc(var(--sh-search-view-height,100dvh) - var(--sh-search-top-gap) - 16px - env(safe-area-inset-bottom,0px))); }
 .shopyli-ui #sh-shell-search .sh-dialog-inner { padding-block: 16px; }
}
.shopyli-ui.sh-search-page { display: grid; gap: 1rem; min-inline-size: 0; }
.sh-search-page :is(h1,h2,h3,p,span,a,label,summary) { overflow-wrap: anywhere; }
.sh-search-page h1 { font-size: clamp(1.65rem,5vw,2.3rem); }
.sh-search-page h2 { font-size: 1.125rem; margin-block-end: .5rem; }
.sh-search-page .sh-search-context, .shopyli-ui .sh-search-actions { display: flex; flex-wrap: wrap; gap: .5rem; }
.sh-search-page .sh-search-context { gap: 1.25rem; }
.sh-search-page .sh-search-context a { display: inline-flex; align-items: center; min-block-size: 44px; color: var(--sh-brand-hover); }
.sh-search-page .sh-search-filters { border: 1px solid var(--sh-line); border-radius: var(--sh-radius-md); background: var(--sh-surface); padding-inline: .75rem; }
.sh-search-page .sh-search-filters summary { cursor: pointer; min-block-size: 44px; padding-block: .625rem; font-weight: 600; }
.sh-search-page .sh-search-filter-fields { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,15rem),1fr)); gap: .75rem; padding-block-end: .75rem; }
.sh-search-page .sh-search-filter-fields > label { display: grid; gap: .375rem; min-inline-size: 0; }
.sh-search-page .sh-search-filter-fields select { inline-size: 100%; max-inline-size: 100%; min-inline-size: 0; }
.sh-search-page .sh-search-filter-fields .sh-search-stock { display: flex; align-items: center; gap: .5rem; min-block-size: 44px; }
.sh-search-page .sh-search-stock input { inline-size: 20px; block-size: 20px; accent-color: var(--sh-brand); }
.sh-search-page .sh-search-results-heading { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .5rem; }
.sh-search-page .sh-search-results-heading > p { color: var(--sh-muted); font-size: .875rem; }
.shopyli-ui .sh-search-state { display: grid; gap: .75rem; padding: 1rem; }
.sh-search-page .sh-search-pagination { display: flex; flex-wrap: wrap; gap: .5rem; margin-block-start: 1rem; }
.sh-search-page .sh-search-pagination .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-inline-size: 44px; min-block-size: 44px; padding: .4rem .75rem; border: 1px solid var(--sh-line); border-radius: var(--sh-radius-sm); color: var(--sh-ink); text-decoration: none; background: var(--sh-surface); }
.sh-search-page .sh-search-pagination .current { background: var(--sh-brand); color: var(--sh-on-color); border-color: var(--sh-brand); }
.sh-search-page:lang(ar), .sh-search-page:lang(ar) :is(input,select,button,a,label,h1,h2,h3,p,span,summary) { font-family: var(--sh-font-ar) !important; letter-spacing: 0; }


.sh-search-page .sh-category-grid { grid-template-columns: repeat(auto-fit,minmax(min(100%,16rem),1fr)); }