/* =====================================================================
   EVO — product list pages (Gallery, SearchResults, BrandPage, Favorites,
   Top, Top5) + shared quick view partial (_EvoQuickView.cshtml).
   Mobile-first. Depends on evo-core.css. Prefixes: .evo-plist__ / .evo-qv__
   Page variants via root class: .evo-plist--gallery / --search / --brand /
   --favorites / --top / --top5.
   Product packshots are always full colour (no grayscale filter).
   ===================================================================== */

/* ---------- page root + variants ---------- */
.evo-plist { display: block; width: 100%; }
.evo-plist--gallery, .evo-plist--search, .evo-plist--brand, .evo-plist--favorites, .evo-plist--top, .evo-plist--top5 { min-height: 50vh; }
.evo-plist__main { min-width: 0; }

/* ---------- page head / toolbar ---------- */
.evo-plist__head { margin-bottom: var(--s-6); }
.evo-plist__head .evo-eyebrow { margin-bottom: var(--s-2); }
.evo-plist__head .evo-h1, .evo-plist__head .evo-h2 { display: flex; align-items: center; gap: var(--s-3); flex-wrap: wrap; }
.evo-plist__term { font-style: italic; }
.evo-plist__top5desc { margin-top: var(--s-4); }

.evo-plist__toolbar {
    display: flex; align-items: center; justify-content: space-between; gap: var(--s-3);
    padding: var(--s-3) 0; margin-bottom: var(--s-5);
    border-top: 1px solid var(--c-line); border-bottom: 1px solid var(--c-line);
}
.evo-plist__toolbar .evo-small { letter-spacing: var(--ls-cap); text-transform: uppercase; font-size: var(--fs-xs); }

/* ---------- product grid & cards ---------- */
.evo-plist__grid { grid-template-columns: repeat(2, 1fr); gap: var(--s-3); }
@media (min-width: 700px) { .evo-plist__grid { grid-template-columns: repeat(3, 1fr); gap: var(--s-4); } }
@media (min-width: 1000px) { .evo-plist__grid { grid-template-columns: repeat(4, 1fr); gap: var(--s-5); } }

.evo-plist .evo-product { min-height: 0; }
.evo-plist .evo-product__media { flex-basis: 150px; height: 150px; padding: var(--s-4); }
.evo-plist .evo-product__media img { max-width: 70%; max-height: 120px; filter: none; opacity: 1; }
.evo-plist .evo-product:hover .evo-product__media img { filter: none; }
.evo-plist .evo-product__body { padding: var(--s-3) var(--s-3) var(--s-4); }
.evo-plist .evo-product__name { min-height: 0; font-size: var(--fs-sm); }
.evo-plist__cardlink { display: flex; flex-direction: column; gap: var(--s-1); }
.evo-plist__badges { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; max-width: 70%; }
.evo-plist__badges:empty { display: none; }
.evo-plist__sale { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2); }
.evo-plist__save { height: 18px; padding: 0 7px; font-size: 8px; }
.evo-plist .evo-product__footer { flex-wrap: wrap; }
.evo-plist .evo-product__price { min-width: 0; }
.evo-plist .evo-product--promo { border-color: var(--c-ink); }
.evo-plist .evo-product--out .evo-product__footer { opacity: .7; }

/* add / quick-view control: icon button on desktop, link on mobile.
   (.evo-only-* from core lose to .evo-iconbtn/.evo-btn display, so re-assert here) */
.evo-plist__add.evo-only-desktop { display: none; }
.evo-plist__add.evo-only-mobile { display: inline-flex; }
@media (min-width: 900px) {
    .evo-plist .evo-product__media { flex-basis: 210px; height: 210px; padding: var(--s-5); }
    .evo-plist .evo-product__media img { max-width: 60%; max-height: 150px; }
    .evo-plist .evo-product__body { padding: var(--s-4) var(--s-4) var(--s-5); }
    .evo-plist .evo-product__name { font-size: var(--fs-md); }
    .evo-plist__add.evo-only-desktop { display: inline-flex; }
}

/* favorites / top5 richer cards */
.evo-plist__fav .evo-product__body { gap: var(--s-1); }
.evo-plist__status { font-size: 9px; }
.evo-plist__promo { align-self: flex-start; }
.evo-plist__desc { color: var(--c-mute); line-height: 1.5; }
.evo-plist__ship { display: flex; align-items: center; gap: 6px; color: var(--c-mute); margin-top: var(--s-1); }
.evo-plist__favfoot { gap: var(--s-2); align-items: center; }
.evo-plist__favfoot .evo-plist__add { flex: 1 1 auto; min-width: 0; height: auto; min-height: 34px; padding: 6px var(--s-3); white-space: normal; text-align: center; line-height: 1.3; }
/* richer favorites / top5 cards need the full width on narrow phones */
@media (max-width: 479px) {
    .evo-plist--favorites .evo-plist__grid, .evo-plist--top5 .evo-plist__grid { grid-template-columns: 1fr; }
}
.evo-plist__remove { color: var(--c-mute); }
.evo-plist__remove:hover { color: var(--c-danger); background: var(--c-off); }
.evo-plist__rank {
    display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 50%;
    background: var(--c-black); color: var(--c-white); font-family: var(--f-display); font-size: 18px; line-height: 1;
}

/* top: category pills */
.evo-plist__cats { gap: var(--s-2); }

/* ---------- desktop sidebar filters ---------- */
.evo-plist__sidebar { align-self: start; }
@media (min-width: 1000px) {
    .evo-plist__sidebar { position: sticky; top: calc(var(--header-h) + var(--s-4)); max-height: calc(100vh - var(--header-h) - var(--s-6)); overflow-y: auto; padding-right: var(--s-2); }
}
.evo-plist__options { margin: 0; }
.evo-plist__options--scroll { max-height: 400px; overflow-y: auto; }
.evo-plist__options--genders { display: flex; flex-wrap: wrap; gap: var(--s-2) var(--s-5); padding-bottom: var(--s-3); border-bottom: 1px solid var(--c-line); }
.evo-plist__options--genders .evo-filter-option { gap: var(--s-2); }
.evo-plist .evo-accordion__head .evo-icon { flex: 0 0 auto; }
.evo-plist__reset { margin-top: var(--s-5); color: var(--c-mute); }
.evo-plist__reset:hover { color: var(--c-ink); opacity: 1; }

/* ---------- mobile filter & sort drawer ---------- */
.evo-plist__drawer-backdrop { position: fixed; inset: 0; z-index: 95; background: rgba(10,10,10,.55); animation: evo-fade var(--t-med); }
.evo-plist__drawer { width: min(420px, 92vw); }
.evo-plist__drawer-body { flex: 1 1 auto; overflow-y: auto; padding: var(--s-2) var(--s-5) var(--s-5); -webkit-overflow-scrolling: touch; }
.evo-plist__drawer .evo-accordion__body { padding-top: var(--s-2); }
.evo-plist__drawer .evo-filter-option { min-height: 40px; }
.evo-plist__sorting { padding-top: var(--s-5); }
.evo-plist__sorting .evo-row { gap: var(--s-2); }
.evo-plist .evo-btn--outline.is-active { background: var(--c-black); color: var(--c-white); }

/* ---------- pagination ---------- */
.evo-plist .evo-pagination { flex-wrap: wrap; }
.evo-plist .evo-pagination .evo-btn { gap: 4px; }

/* ---------- quotation popup ---------- */
.evo-plist__quote .evo-split { gap: var(--s-6); }
.evo-plist__qitem { align-items: flex-start; }
.evo-plist__qmedia { flex: 0 0 64px; width: 64px; height: 64px; display: flex; align-items: center; justify-content: center; padding: 6px; }
.evo-plist__qmedia img { max-height: 100%; object-fit: contain; }
.evo-plist__qctrl { display: flex; flex-direction: column; align-items: flex-end; gap: var(--s-2); flex: 0 0 auto; }
.evo-plist__qctrl .evo-stepper { height: 32px; }
.evo-plist__qctrl .evo-stepper__btn { width: 30px; }

/* ---------- brand page blocks ---------- */
.evo-plist__brandbody > * + * { margin-top: var(--s-7); }
.evo-plist__brandimg { width: 100%; }
.evo-plist__brandtext { margin-left: auto; margin-right: auto; }
.evo-plist__brandblock { display: grid; gap: var(--s-6); align-items: center; }
@media (min-width: 900px) {
    .evo-plist__brandbody > * + * { margin-top: var(--s-8); }
    .evo-plist__brandblock { grid-template-columns: 1.1fr .9fr; }
    .evo-plist__brandblock .evo-plist__brandtext { margin: 0; }
}

/* =====================================================================
   Quick view (.evo-qv) — modal on desktop, full-screen sheet on mobile
   ===================================================================== */
.evo-qv { max-width: 920px; }
@media (max-width: 699px) {
    .evo-qv { top: 0; left: 0; width: 100%; max-width: none; height: 100%; max-height: none; transform: none; border-radius: 0; animation: evo-slide-right var(--t-med); }
}
.evo-qv__body { padding: var(--s-4); }
@media (min-width: 700px) { .evo-qv__body { padding: var(--s-5) var(--s-6) var(--s-6); } }

/* top: image tile + info */
.evo-qv__top { display: grid; grid-template-columns: 1fr; gap: var(--s-4); margin-bottom: var(--s-5); }
@media (min-width: 700px) { .evo-qv__top { grid-template-columns: 220px 1fr; gap: var(--s-6); margin-bottom: var(--s-6); } }
.evo-qv__media { aspect-ratio: 1 / 1; max-height: 220px; display: flex; align-items: center; justify-content: center; padding: var(--s-5); }
.evo-qv__media img { max-height: 100%; max-width: 80%; width: auto; height: auto; object-fit: contain; mix-blend-mode: multiply; }
.evo-qv__info { display: flex; flex-direction: column; gap: var(--s-2); min-width: 0; }
.evo-qv__title { line-height: 1.2; }
.evo-qv__usage { color: var(--c-mute); }
.evo-qv__meta { display: flex; flex-wrap: wrap; align-items: center; gap: var(--s-2) var(--s-4); }
.evo-qv__rating { display: inline-flex; align-items: center; gap: 4px; font-size: var(--fs-sm); }
.evo-qv__prices { margin-top: var(--s-1); }
.evo-qv__pricerow { display: flex; flex-wrap: wrap; align-items: baseline; gap: var(--s-2) var(--s-3); padding: var(--s-1) 0; }
.evo-qv__pricerow .evo-price { font-size: var(--fs-h4); font-family: var(--f-display); }
.evo-qv__pricerow .evo-small { font-size: var(--fs-xs); letter-spacing: var(--ls-cap); text-transform: uppercase; }

/* stock rows */
.evo-qv__stocks { border-top: 1px solid var(--c-line); }
.evo-qv__rowhead { display: none; }
.evo-qv__row {
    display: grid; grid-template-columns: 1fr auto; grid-template-areas: "name name" "rating qty" "add add";
    gap: var(--s-2) var(--s-3); align-items: center; padding: var(--s-3) 0; border-bottom: 1px solid var(--c-line);
}
.evo-qv__col-name { grid-area: name; display: flex; align-items: center; gap: var(--s-2); min-width: 0; }
.evo-qv__col-rating { grid-area: rating; display: inline-flex; align-items: center; gap: 4px; font-size: var(--fs-sm); color: var(--c-ink-2); }
.evo-qv__col-qty { grid-area: qty; display: flex; justify-content: flex-end; }
.evo-qv__col-add { grid-area: add; display: flex; justify-content: flex-end; }
.evo-qv__col-add .evo-btn { width: 100%; }
.evo-qv__add { min-width: 0; }
.evo-qv__add.is-success { background: var(--c-ink); color: var(--c-white); }
.evo-qv__name { font-size: var(--fs-md); font-weight: 400; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.evo-qv__col-qty .evo-stepper { height: 34px; }
.evo-qv__col-qty .evo-stepper__btn { width: 32px; }
.evo-qv__col-qty .evo-stepper__input { width: 36px; }
.evo-qv__notify { gap: 4px; font-size: 8.5px; white-space: normal; text-align: left; }
@media (min-width: 700px) {
    .evo-qv__rowhead {
        display: grid; grid-template-columns: 1fr 72px 128px 150px; gap: var(--s-3); padding: var(--s-3) 0; border-bottom: 1px solid var(--c-line);
        font-size: var(--fs-xs); font-weight: 500; letter-spacing: var(--ls-cap); text-transform: uppercase; color: var(--c-mute);
    }
    .evo-qv__row { grid-template-columns: 1fr 72px 128px 150px; grid-template-areas: "name rating qty add"; gap: var(--s-3); }
    .evo-qv__col-add .evo-btn { width: auto; min-width: 100px; }
    .evo-qv__notify { white-space: nowrap; min-width: 0; padding: 0 var(--s-3); }
}

/* package branch */
.evo-qv__package { border-top: 1px solid var(--c-line); padding-top: var(--s-4); }
.evo-qv__pkgitem { position: relative; display: grid; grid-template-columns: 64px 1fr; gap: var(--s-3) var(--s-4); align-items: center; padding: var(--s-4) 0; border-top: 1px solid var(--c-line); }
.evo-qv__pkgmedia { width: 64px; height: 64px; display: flex; align-items: center; justify-content: center; padding: 6px; }
.evo-qv__pkgmedia img { max-height: 100%; object-fit: contain; mix-blend-mode: multiply; }
.evo-qv__pkginfo { min-width: 0; }
.evo-qv__pkgname { font-weight: 400; }
.evo-qv__pkgselect { grid-column: 1 / -1; position: relative; }
.evo-qv__pkgbtn { height: 40px; text-align: left; cursor: pointer; font-size: var(--fs-sm); }
.evo-qv__pkgpop { width: 100%; min-width: 0; max-height: 260px; overflow-y: auto; }
.evo-qv__choices .evo-list__item.is-selected { font-weight: 500; }
.evo-qv__choice--out { opacity: .65; }
.evo-qv__pkgfoot { margin-top: var(--s-5); }
@media (min-width: 700px) {
    .evo-qv__pkgitem { grid-template-columns: 64px 1fr 220px; }
    .evo-qv__pkgselect { grid-column: auto; }
}