/* v1.6.2-thin-resanim: base thin icon; results box animates softly when shown */
.mb-search { position: relative; display:inline-block; }
.mb-search__open { width:32px; height:32px; background:transparent; border:0; cursor:pointer; }

.mb-search__overlay { display:none; position:fixed; inset:0; z-index:9999; background:transparent; }
.mb-search__overlay.is-open { display:block; }

.mb-search__panel { position:fixed; left:0; right:0; top:0; width:100vw; background:#fff; }
.mb-search__bar { height:48px; display:flex; align-items:center; gap:10px; padding:0 min(20px,4vw); /* no bottom border */ }
.mb-search__icon { display:inline-flex; width:20px; height:20px; opacity:.85; }
.mb-search__close { margin-left:auto; background:none; border:0; width:32px; height:32px; display:inline-flex; align-items:center; justify-content:center; cursor:pointer; opacity:.85; }
.mb-search__inputwrap { flex:1; }
.mb-search__input { width:100%; border:0; outline:none; font-size:16px; padding:8px 0; color:#222; }
.mb-search__input::placeholder { color:#9aa0a6; }

.mb-search__meta { display:flex; align-items:center; gap:12px; padding:6px min(20px,4vw) 6px; color:#666; font-size:13px; }
.mb-search__meta[hidden] { display:none !important; }
.mb-search__meta .mb-search__count { font-weight:500; color:#333; }
.mb-search__viewall { margin-left:auto; color:#333; text-decoration:none; }
.mb-search__divider { border-top:1px solid #eaeaea; margin:0 min(20px,4vw) 6px; }
.mb-search__divider[hidden] { display:none !important; }

/* RESULTS anim container */
.mb-search__results { 
  padding: 6px min(20px,4vw) 18px; 
  display:grid; gap:18px; grid-template-columns: 1fr; 
  opacity:0; transform: translateY(6px);
  transition: opacity .22s ease, transform .22s ease;
}
.mb-search__results.is-shown { opacity:1; transform: translateY(0); }

.mb-card { display:grid; grid-template-columns: 76px 1fr; align-items:center; column-gap:14px; text-decoration:none; color:inherit; }
.mb-card__img { width:76px; height:76px; object-fit:cover; border-radius:8px; background:#f4f4f4; }
.mb-card__title { font-size:15px; color:#222; line-height:1.35; margin-bottom:6px; }
.mb-card__ratingrow { display:flex; align-items:center; gap:8px; margin-bottom:6px; }
.mb-stars { letter-spacing:2px; font-size:13px; }
.mb-score { font-size:13px; color:#111; }
.mb-card__price { font-size:14px; color:#444; }

.mb-skel { background:linear-gradient(90deg,#eee,#f7f7f7,#eee); background-size:200% 100%; animation:mbShine 1.4s linear infinite; border-radius:8px; }
@keyframes mbShine{0%{background-position:200% 0;}100%{background-position:-200% 0;}}
