@import url('https://fonts.googleapis.com/css2?family=Sora:wght@600;700&family=Inter:wght@400;500;600&display=swap');

.psg-search{
  --ink:#181818; --muted:#6b7280; --accent:#7A0C0C; --border:#e3e3e3; --btn:#14225C;
  position:relative; width:100%; max-width:560px;
  font-family:'Inter',-apple-system,BlinkMacSystemFont,sans-serif;
  box-sizing:border-box;
}
.psg-search *{ box-sizing:border-box; }

.psg-search-box{
  display:flex; align-items:center; border:1.5px solid var(--border);
  border-radius:10px; overflow:hidden; background:#fff; margin:0;
  transition:border-color .15s ease, box-shadow .15s ease;
}
.psg-search-box:focus-within{ border-color:var(--btn); box-shadow:0 0 0 3px rgba(20,34,92,.12); }
.psg-search-input{
  flex:1; min-width:0; padding:13px 14px !important; font-size:15px !important;
  font-family:'Inter',sans-serif; color:var(--ink);
  -webkit-appearance:none; appearance:none;
  border:none !important; border-radius:0 !important;
  box-shadow:none !important; outline:none !important;
  background:transparent !important; margin:0 !important; height:auto !important;
}
.psg-search-input::-webkit-search-cancel-button{ -webkit-appearance:none; display:none; }
.psg-search-clear{
  border:none !important; background:none !important; font-size:22px; color:var(--muted) !important;
  cursor:pointer; padding:0 10px !important; line-height:1; margin:0;
}
.psg-search-clear[hidden]{ display:none !important; }
.psg-search-btn{
  display:flex; align-items:center; justify-content:center;
  width:54px; height:54px; border:none !important; border-radius:0 !important;
  background:var(--btn) !important; cursor:pointer; flex-shrink:0; padding:0 !important; margin:0;
}
.psg-search-btn:hover{ background:#0e1844 !important; }
.psg-search-btn svg{ width:26px; height:26px; }

.psg-search-results{
  display:none;
  position:absolute; top:calc(100% + 8px); left:0; right:0;
  background:#fff; border:1px solid var(--border); border-radius:12px;
  box-shadow:0 12px 32px rgba(0,0,0,.12);
  max-height:70vh; overflow-y:auto;
  z-index:9999; padding:10px;
}
.psg-search-results.open{ display:block; }

.psg-search-status{ padding:16px; text-align:center; color:var(--muted); font-size:14px; }

.psg-search-item{
  display:flex; align-items:center; gap:14px;
  padding:10px; border-radius:8px; text-decoration:none !important; color:var(--ink) !important;
  transition:background .12s ease;
}
.psg-search-item:hover, .psg-search-item.is-active{ background:#f3f4f7; }
.psg-search-item img{
  width:52px; height:52px; object-fit:contain; border-radius:6px;
  background:#f4f4f6; flex-shrink:0;
}
.psg-search-item-info{ flex:1; min-width:0; }
.psg-search-item-name{
  font-size:14px; font-weight:600; margin:0 0 2px !important; line-height:1.35;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.psg-search-item-price{ font-size:13px; color:var(--accent); font-weight:700; margin:0 !important; }
.psg-search-item-price .was{ color:var(--muted); text-decoration:line-through; font-weight:500; margin-right:6px; }
.psg-search-item-stock{ font-size:12px; color:var(--muted); margin:2px 0 0 !important; }

.psg-search-viewall{
  display:block; text-align:center; padding:12px; margin-top:6px;
  font-family:'Sora',sans-serif; font-weight:700; font-size:13px;
  color:#fff !important; background:var(--accent); border-radius:8px; text-decoration:none !important;
}
.psg-search-viewall:hover{ background:#970F0F; }

.psg-search .screen-reader-text{
  position:absolute !important; width:1px; height:1px; overflow:hidden; clip:rect(1px,1px,1px,1px); white-space:nowrap;
}

@media (max-width:640px){
  .psg-search-input{ font-size:16px !important; } /* stops iPhone from zooming in */
  .psg-search-btn{ width:48px; height:48px; }
  .psg-search-results{ max-height:60vh; }
}