/* The header search box and its suggestion dropdown (np-search-suggest.js).
   Depends only on the theme's :root tokens (tokens.css). Loaded by the
   theme's layout at its stable name /parts/assets/np-search-suggest.css. */
.np-search-host { position: relative; width: 100%; }
.np-search { display: flex; align-items: stretch; width: 100%; background: #fff; border: 1px solid var(--np-border, #E2E2E2); border-radius: 6px; overflow: hidden; }
.np-search:focus-within { border-color: var(--np-navy, #14387F); box-shadow: 0 0 0 2px rgba(20, 56, 127, .15); }
.np-search-input { flex: 1 1 auto; min-width: 0; border: 0; padding: 10px 12px; font: 15px/1.3 var(--font-body-family, sans-serif); color: var(--np-ink, #222); background: transparent; outline: none; -webkit-appearance: none; appearance: none; }
.np-search-input::-webkit-search-cancel-button { display: none; }
.np-search-clear { border: 0; background: transparent; color: var(--np-ink-soft, #555); font: 22px/1 var(--font-body-family, sans-serif); padding: 0 8px; cursor: pointer; }
.np-search-clear:hover { color: var(--np-red, #C8102E); }
.np-search-submit { border: 0; background: var(--np-navy, #14387F); color: #fff; padding: 0 14px; cursor: pointer; display: flex; align-items: center; }
.np-search-submit:hover { background: var(--np-navy-dark, #0F2A5F); }

.np-suggest-anchor { position: relative; }
.np-suggest { position: absolute; top: calc(100% + 6px); left: 0; right: 0; z-index: 60; background: #fff; border: 1px solid var(--np-border, #E2E2E2); border-radius: 8px; box-shadow: 0 12px 32px rgba(0, 0, 0, .16); max-height: min(70vh, 640px); overflow-y: auto; text-align: left; font-family: var(--font-body-family, sans-serif); color: var(--np-ink, #222); }
.np-suggest-section + .np-suggest-section { border-top: 1px solid var(--np-border, #E2E2E2); }
.np-suggest-title { margin: 0; padding: 10px 14px 4px; font: 600 12px/1.4 var(--font-heading-family, sans-serif); color: var(--np-ink-soft, #555); }
.np-suggest-item { display: flex; align-items: center; gap: 10px; padding: 8px 14px; text-decoration: none; color: inherit; font-size: 14px; line-height: 1.35; cursor: pointer; }
.np-suggest-item.is-active, .np-suggest-item:hover { background: var(--np-field, #EEF1F5); }
.np-suggest-item b { font-weight: 700; color: var(--np-navy, #14387F); }
.np-suggest-glyph { flex: 0 0 auto; color: var(--np-ink-soft, #555); }
.np-suggest-text { display: flex; flex-direction: column; min-width: 0; flex: 1 1 auto; }
.np-suggest-text > span:first-child { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.np-suggest-note { font-size: 12px; color: var(--np-ink-soft, #555); }
.np-suggest-term .np-suggest-note, .np-suggest-search .np-suggest-note { margin-left: auto; }
.np-suggest-count { margin-left: auto; font-size: 12px; color: var(--np-ink-soft, #555); }
.np-suggest-thumb { flex: 0 0 auto; width: 44px; height: 44px; object-fit: contain; border-radius: 4px; background: #fff; border: 1px solid var(--np-border, #E2E2E2); }
.np-suggest-thumb--blank { display: block; background: var(--np-surface, #F5F5F5); }
.np-suggest-price { margin-left: auto; font-weight: 700; white-space: nowrap; }
.np-suggest-fit { font-size: 12px; color: var(--np-stock-green, #1F7A3D); font-weight: 600; }
.np-suggest-all { justify-content: center; border-top: 1px solid var(--np-border, #E2E2E2); font-weight: 600; color: var(--np-navy, #14387F); padding: 12px 14px; }
.np-suggest-empty { padding: 14px; font-size: 14px; color: var(--np-ink-soft, #555); }
