.ssts-panel{
    position:absolute; top:calc(100% + 10px); left:0; right:0; z-index:120;
    background:#fff; border:1px solid #dce8ec; border-radius:20px;
    box-shadow:0 26px 66px rgba(42,15,26,.20);
    overflow:hidden auto; max-height:72vh; display:none; text-align:left;
}
.ssts-panel.is-open{ display:block; animation:sstsDrop .2s cubic-bezier(.22,1,.36,1); }
@keyframes sstsDrop{ from{opacity:0;transform:translateY(-8px)} to{opacity:1;transform:none} }
.ssts-panel::before{ content:""; display:block; height:3px;
    background:linear-gradient(90deg,#bdebf2,#087f8c,#236f86); }

.ssts-grp{ padding:10px 18px 4px; font-size:10px; font-weight:900; letter-spacing:.1em;
    text-transform:uppercase; color:#236f86; display:flex; align-items:center; gap:7px; }
.ssts-grp.ssts-gc{ color:#006c67; }
.ssts-count{ color:#b7a6ae; font-weight:700; letter-spacing:0; }


.ssts-chiprow{
    display:flex; gap:7px; padding:10px 18px 4px; overflow-x:auto;
    scrollbar-width:none; -ms-overflow-style:none;
}
.ssts-chiprow::-webkit-scrollbar{ display:none; }
.ssts-chip{
    display:inline-flex; align-items:center; gap:6px; flex:none;
    font:inherit; font-size:12px; font-weight:700; line-height:1;
    padding:8px 14px; border-radius:999px; white-space:nowrap;
    border:1.5px solid #dce8ec; background:#f7fafb; color:#153d4a;
    cursor:pointer; text-decoration:none; transition:.16s;
}
.ssts-chip:hover,.ssts-chip:focus-visible{
    border-color:#087f8c; color:#006c67; background:#fff; transform:translateY(-1px);
}
@media (prefers-reduced-motion: reduce){ .ssts-chip:hover,.ssts-chip:focus-visible{ transform:none; } }
.ssts-chip i{ font-size:10px; color:#236f86; }
.ssts-chipn{ font-size:10px; font-weight:900; color:#b7a6ae; }


.ssts-grp-rel{ color:#236f86; border-top:1px solid #F1EFEA; margin-top:6px; padding-top:12px; }
.ssts-chip-rel{ background:#FFFCF4; border-color:#F0E4C8; font-weight:600; }
.ssts-chip-rel:hover,.ssts-chip-rel:focus-visible{ border-color:#236f86; color:#8A6608; background:#fff; }
.ssts-chip-rel i{ color:#236f86; }


.ssts-sug{ display:flex; width:100%; align-items:center; gap:12px; padding:8px 18px;
    background:none; border:0; border-left:3px solid transparent; cursor:pointer;
    font:inherit; font-size:13.5px; font-weight:700; color:#153d4a; text-align:left; }
.ssts-sug:hover{ background:#edf6f8; border-left-color:#bdebf2; }
.ssts-sug i{ color:#b9a8b0; font-size:12px; }
.ssts-sug b{ font-weight:900; }

.ssts-rw{ display:flex; align-items:center; }
.ssts-row{ flex:1; min-width:0; display:flex; align-items:center; gap:13px; padding:9px 18px;
    text-decoration:none; color:inherit; border-left:3px solid transparent; transition:.13s; }
.ssts-row:hover{ background:#edf6f8; border-left-color:#087f8c; }
.ssts-thumb{ width:46px; height:46px; border-radius:11px; object-fit:cover; background:#dce8ec; flex:none; }
.ssts-ico{ width:46px; height:46px; border-radius:11px; display:grid; place-items:center; flex:none;
    background:rgba(250,204,21,.18); color:#236f86; font-size:15px; }
.ssts-meta{ flex:1; min-width:0; }
.ssts-nm,.ssts-sb{ display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.ssts-nm{ font-size:13.5px; font-weight:800; color:#153d4a; }
.ssts-nm mark{ background:rgba(250,204,21,.45); color:inherit; padding:0 1px; border-radius:2px; }
.ssts-sb{ font-size:11.5px; color:#7d6b74; margin-top:2px; }
.ssts-price{ font-size:13px; font-weight:900; color:#006c67; white-space:nowrap; flex:none; }
.ssts-badge{ font-size:9px; font-weight:900; text-transform:uppercase; letter-spacing:.07em;
    padding:3px 8px; border-radius:999px; background:#f7fafb; color:#8a7680; flex:none; }
.ssts-need{ font-size:10px; font-weight:900; padding:3px 9px; border-radius:999px;
    background:rgba(22,163,74,.12); color:#006c67; white-space:nowrap; flex:none; margin-right:10px; }
.ssts-add{ width:34px; height:34px; margin-right:14px; border-radius:999px; border:1.5px solid #dce8ec;
    background:#fff; color:#006c67; font-size:12px; cursor:pointer; flex:none; transition:.16s; }
.ssts-add:hover{ background:#087f8c; border-color:#087f8c; color:#fff; transform:scale(1.1); }
.ssts-add.is-done{ background:#087f8c; border-color:#087f8c; color:#fff; }

.ssts-foot{ display:block; padding:12px 18px; background:#f7fafb; border-top:1px solid #dce8ec;
    font-size:12px; font-weight:800; color:#153d4a; text-decoration:none; }
.ssts-foot:hover{ background:#F4F0EC; }

.ssts-pad{ padding:14px 18px; }
.ssts-pills{ display:flex; flex-wrap:wrap; gap:7px; margin-top:9px; }
.ssts-pill{ font:inherit; font-size:12px; font-weight:700; padding:7px 14px; border-radius:999px;
    border:1.5px solid #dce8ec; background:#f7fafb; color:#153d4a; cursor:pointer; transition:.16s; }
.ssts-pill:hover{ border-color:#087f8c; color:#006c67; background:#fff; }

.ssts-zero{ text-align:center; padding:26px 18px; }
.ssts-zero > i{ font-size:25px; color:#dce8ec; margin-bottom:9px; display:block; }
.ssts-zero b{ display:block; font-size:14px; color:#153d4a; margin-bottom:4px; }
.ssts-zero p{ font-size:12.5px; color:#7d6b74; }
.ssts-fix{ color:#006c67; font-weight:900; cursor:pointer; text-decoration:underline; }
.ssts-wa{ display:inline-flex; align-items:center; gap:9px; margin-top:15px; background:#25D366;
    color:#fff; text-decoration:none; font-weight:800; font-size:13.5px; padding:11px 22px;
    border-radius:999px; box-shadow:0 6px 18px rgba(37,211,102,.32); transition:.18s; }
.ssts-wa:hover{ transform:translateY(-2px); box-shadow:0 10px 24px rgba(37,211,102,.42); }


#sst-search-overlay{
    position:fixed; inset:0; z-index:200; background:#fff;
    transform:translateY(100%); transition:transform .3s cubic-bezier(.22,1,.36,1);
    display:flex; flex-direction:column; visibility:hidden;
}
#sst-search-overlay.is-open{ transform:none; visibility:visible; }
.ssts-ov-head{ padding:11px 12px; display:flex; align-items:center; gap:9px;
    border-bottom:1px solid #dce8ec; background:#edf6f8; flex:none; }
.ssts-ov-back{ border:0; background:none; font-size:17px; color:#153d4a; cursor:pointer; padding:6px 8px; }
.ssts-ov-field{ flex:1; display:flex; align-items:center; gap:8px; background:#fff;
    border:2px solid #087f8c; border-radius:999px; padding:8px 15px; position:relative; }
.ssts-ov-field input{ border:0; outline:0; font:inherit; font-size:14px; font-weight:600;
    flex:1; min-width:0; background:transparent; color:#1B1B1B; }
.ssts-ov-body{ flex:1; overflow-y:auto; position:relative; }

#sst-search-overlay .ssts-panel{
    position:static; max-height:none; border:0; border-radius:0; box-shadow:none; display:block;
}
#sst-search-overlay .ssts-panel::before{ display:none; }

@media (prefers-reduced-motion: reduce){
    .ssts-panel.is-open{ animation:none; }
    #sst-search-overlay{ transition:none; }
    .ssts-add:hover,.ssts-wa:hover{ transform:none; }
}


.sst-nav-search,.sst-mobile-drawer-search-form,[data-sst-search]{position:relative}.ssts-panel{border-radius:12px;box-shadow:0 18px 44px rgba(17,58,72,.18)}.ssts-panel::before{background:#087f8c}.ssts-wa{background:#006c67;color:#fff;box-shadow:none}.ssts-add{width:44px;height:44px}.ssts-row:focus-visible,.ssts-chip:focus-visible,.ssts-add:focus-visible,.ssts-foot:focus-visible{outline:3px solid #087f8c;outline-offset:-3px}.ssts-ov-back{min-width:44px;min-height:44px}.ssts-ov-field button{border:0;background:#006c67;color:#fff;padding:8px 12px;border-radius:8px}#sst-search-overlay{height:100dvh;z-index:1500}.ssts-ov-head{padding-top:max(12px,env(safe-area-inset-top))}.ssts-ov-body{padding-bottom:env(safe-area-inset-bottom)}@media(max-width:600px){.ssts-panel{max-width:calc(100vw - 24px)}.ssts-row{gap:9px;padding:10px 12px}.ssts-price{font-size:11px;max-width:100px;white-space:normal}.ssts-nm{font-size:13px}.ssts-ov-field{padding:7px 9px}.ssts-ov-field input{font-size:16px}#sst-search-overlay .ssts-panel{max-width:none}.ssts-grp,.ssts-chiprow{padding-inline:12px}}
.sst-search-filters{display:flex;align-items:end;flex-wrap:wrap;gap:12px;margin:20px 0;padding:18px;border:1px solid #dce8ec;border-radius:12px;background:#f7fafb}.sst-search-filters label{display:grid;gap:5px;flex:1 1 150px;color:#153d4a;font-weight:600;font-size:13px}.sst-search-filters input,.sst-search-filters select{min-width:0;width:100%;min-height:44px;border:1px solid #b6cbd3;padding:9px 11px;border-radius:8px;background:#fff;color:#153d4a}.sst-search-filters button,.sst-search-filters>a{min-height:44px;display:inline-flex;align-items:center;justify-content:center;padding:10px 16px;background:#006c67;color:#fff;border:0;border-radius:8px;text-decoration:none;font-weight:600}.sst-search-pagination{display:flex;justify-content:center;flex-wrap:wrap;gap:8px;margin:30px 0}.sst-search-pagination a,.sst-search-pagination span{min-height:44px;min-width:44px;display:inline-flex;align-items:center;justify-content:center;padding:8px 14px;border:1px solid #b6cbd3;border-radius:8px;color:#153d4a;text-decoration:none}.sst-search-pagination [aria-current=page]{background:#006c67;color:#fff;border-color:#006c67}@media(max-width:480px){.sst-search-filters{padding:14px}.sst-search-filters label:first-child{flex-basis:100%}}

.sst-search-result{display:flex;flex-direction:column;min-width:0}.sst-search-result .sst-sr-card{flex:1}.sst-search-add{min-height:44px;margin-top:8px;padding:10px 16px;border:1px solid #006c67;border-radius:8px;background:#006c67;color:#fff;font-weight:700;cursor:pointer}.sst-search-add:focus-visible{outline:3px solid #f4bd2b;outline-offset:3px}

/* Desktop suggestions use a viewport-bounded panel, independently of input width. */
.ssts-panel-floating { position: fixed; right: auto; z-index: 1300; overscroll-behavior: contain; }
.ssts-panel-floating .ssts-nm { white-space: normal; line-height: 1.4; }
.ssts-panel-floating .ssts-sb { white-space: normal; }
.ssts-panel-floating .ssts-row { min-height: 72px; }
@media (min-width: 992px) {
    .ssts-panel-floating .ssts-rw { padding-right: 8px; }
    .ssts-panel-floating .ssts-nm { font-size: 15px; }
    .ssts-panel-floating .ssts-sb { font-size: 13px; }
    .ssts-panel-floating .ssts-thumb { width: 54px; height: 54px; }
}
@media (max-width: 991.98px) { .ssts-panel-floating { display: none !important; } }
