/* ===================================================================
   Madame Ginger 5 — shop listing (shop.html)
   Shop page, product categories / tags / brands, product search.
   Grid + card: woocommerce.css + base.css (.prod).
   =================================================================== */

/* ---- page head ---- */
.shop-head .shop-logo{height:80px; width:auto;}
.shop-head :is(.term-description,.page-description){font-size:17px; line-height:1.6; opacity:.7; max-width:64ch; margin-top:12px;}
.shop-head :is(.term-description,.page-description) p + p{margin-top:.8em;}
.shop-head :is(.term-description,.page-description) a{text-decoration:underline; text-decoration-color:var(--gold); text-decoration-thickness:2px; text-underline-offset:3px;}

/* brand archive hero (v4 brand.php look) */
.brand-hero{display:grid; grid-template-columns:200px minmax(0,1fr); gap:36px; align-items:center; background:var(--paper); border:1.5px solid var(--ink); box-shadow:8px 8px 0 var(--mgshop); padding:28px;}
.brand-hero-logo{margin:0; aspect-ratio:1; display:flex; align-items:center; justify-content:center; background:var(--cream); overflow:hidden;}
.brand-hero-logo img{width:100%; height:100%; object-fit:contain;}
.brand-hero-body .eyebrow{display:block; margin-bottom:8px;}
.brand-hero-body h1{margin:0;}

/* ---- layout ---- */
.shop-layout{display:grid; grid-template-columns:270px minmax(0,1fr); gap:52px; align-items:start;}
.shop-main{min-width:0;}

/* ---- filters sidebar ---- */
.filters{position:sticky; top:104px; max-height:calc(100vh - 124px); overflow-y:auto; overscroll-behavior:contain; scrollbar-width:thin; padding-right:6px;}
.admin-bar .filters{top:136px; max-height:calc(100vh - 156px);}
.filters.is-loading{opacity:.6; pointer-events:none;}
.filters-head{display:flex; align-items:center; justify-content:space-between; margin-bottom:18px;}
.filters-head h2{font-family:var(--font-display); font-size:19px; font-weight:700; text-transform:uppercase; letter-spacing:.04em;}
.filters-head-actions{display:flex; align-items:center; gap:16px;}
.filters-reset{font-family:var(--font-mono); font-size:11px; font-weight:600; text-transform:uppercase; letter-spacing:.03em; color:var(--orange); border-bottom:1px solid transparent;}
.filters-reset:hover{border-bottom-color:var(--orange);}
.filters-close{display:none;}

.fgroup{border-top:1.5px solid var(--ink); padding:16px 0;}
.filters-form > .fgroup:first-of-type{border-top:2px solid var(--ink);}
.fgroup > summary{list-style:none; display:flex; align-items:center; justify-content:space-between; gap:10px; cursor:pointer; font-family:var(--font-mono); font-size:12.5px; font-weight:700; text-transform:uppercase; letter-spacing:.05em;}
.fgroup > summary::-webkit-details-marker{display:none;}
.fgroup .ficon{width:18px; height:18px; border:1.5px solid var(--ink); display:flex; align-items:center; justify-content:center; flex-shrink:0; font-size:13px; line-height:1;}
.fgroup[open] .ficon .plus{display:none;}
.fgroup:not([open]) .ficon .minus{display:none;}
.fgroup-body{padding-top:16px;}

.cat-list{display:flex; flex-direction:column; gap:3px;}
.cat-item{position:relative; display:flex; align-items:center; gap:10px; padding:8px 4px; cursor:pointer; transition:background .12s ease;}
.cat-item:hover{background:var(--cream);}
.cat-item input{position:absolute; opacity:0; width:1px; height:1px; pointer-events:none;}
.cat-item:focus-within{outline:2px solid var(--lavender-deep); outline-offset:-2px;}
.cat-dot{width:11px; height:11px; flex-shrink:0; border:1.5px solid var(--ink); background:var(--paper); transition:background .12s ease;}
.cat-item input:checked ~ .cat-dot{background:var(--dot,var(--mgshop));}
.cat-item input:checked ~ .cat-name{text-decoration:underline; text-decoration-color:var(--dot,var(--mgshop)); text-decoration-thickness:2px; text-underline-offset:4px;}
.cat-name{flex:1; min-width:0; font-size:14px; font-weight:600;}
.cat-num{font-family:var(--font-mono); font-size:11px; opacity:.45; font-weight:600;}
.cat-group{margin-bottom:2px;}
.cat-top > .cat-item .cat-name{font-weight:700;}
.cat-sub{padding-left:21px; border-left:1.5px solid var(--line-soft); margin-left:5px;}
.cat-sub .cat-item{padding:6px 4px;}
.cat-sub .cat-item .cat-dot{width:9px; height:9px;}
.cat-sub .cat-name{font-size:13px; font-weight:500;}
.cat-sub .cat-sub{padding-left:16px;}
.cat-sub .cat-sub .cat-name{font-size:12.5px; opacity:.85;}

.theme-list{display:flex; flex-direction:column; gap:2px;}
.theme-list a{display:flex; align-items:center; justify-content:space-between; gap:8px; padding:8px 4px; font-size:13.5px; font-weight:600; border-bottom:1px solid var(--line-soft); transition:padding-left .12s ease, color .12s ease;}
.theme-list a:last-child{border-bottom:none;}
.theme-list a:hover,.theme-list a[aria-current]{padding-left:8px; color:var(--orange);}
.theme-list a::after{content:"→"; opacity:.4; font-size:12px;}

.price-values{display:flex; align-items:center; justify-content:space-between; font-family:var(--font-mono); font-weight:700; font-size:13px; margin-bottom:16px;}
.price-values span{border:1.5px solid var(--ink); padding:5px 9px;}
.price-slider{position:relative; height:34px;}
.price-slider .track{position:absolute; top:15px; left:0; right:0; height:3px; background:var(--line-soft);}
.price-slider .range-fill{position:absolute; top:15px; height:3px; background:var(--mgshop);}
.price-slider input[type=range]{position:absolute; top:0; left:0; width:100%; height:34px; margin:0; padding:0; border:0; min-height:0; background:none; -webkit-appearance:none; appearance:none; pointer-events:none; box-shadow:none;}
.price-slider input[type=range]:focus{outline:none; box-shadow:none;}
.price-slider input[type=range]::-webkit-slider-thumb{-webkit-appearance:none; pointer-events:auto; width:18px; height:18px; border-radius:50% !important; background:var(--ink); border:3px solid var(--paper); box-shadow:0 0 0 1.5px var(--ink); cursor:pointer;}
.price-slider input[type=range]::-moz-range-thumb{pointer-events:auto; width:18px; height:18px; border-radius:50% !important; background:var(--ink); border:3px solid var(--paper); box-shadow:0 0 0 1.5px var(--ink); cursor:pointer;}
.price-slider input[type=range]:focus-visible::-webkit-slider-thumb{box-shadow:0 0 0 1.5px var(--ink), 0 0 0 4px var(--lavender);}
.price-slider input[type=range]:focus-visible::-moz-range-thumb{box-shadow:0 0 0 1.5px var(--ink), 0 0 0 4px var(--lavender);}
.price-slider input[type=range]::-webkit-slider-runnable-track{background:transparent;}
.price-slider input[type=range]::-moz-range-track{background:transparent;}
.price-hint{font-size:11.5px; opacity:.5; margin-top:14px; line-height:1.5;}

.toggle-row{display:flex; align-items:center; justify-content:space-between; gap:12px; padding:6px 0;}
.toggle-label{font-size:14px; font-weight:600;}
.toggle-sub{display:block; font-size:11.5px; opacity:.5; font-weight:500; margin-top:2px;}
.switch{position:relative; width:42px; height:24px; flex-shrink:0; border:1.5px solid var(--ink); cursor:pointer; background:var(--paper);}
.switch input{position:absolute; inset:0; width:100%; height:100%; opacity:0; cursor:pointer; margin:0;}
.switch:focus-within{outline:2px solid var(--lavender-deep); outline-offset:2px;}
.switch .knob{position:absolute; top:2px; left:2px; width:16px; height:16px; background:var(--ink); transition:transform .18s ease, background .18s ease; pointer-events:none;}
.switch input:checked ~ .knob{transform:translateX(18px); background:var(--orange);}

/* ---- attribute filters (WooCommerce "Filter by Attribute" widget, shop-filters-attributes area) ---- */
/* Same look as .theme-list: arrow, no count, hover shifts right + turns orange. */
.fgroup-widget-item + .fgroup-widget-item{margin-top:16px;}
.fgroup-widget-item .woocommerce-widget-layered-nav-list{display:flex; flex-direction:column; gap:2px; list-style:none; margin:0; padding:0;}
.fgroup-widget-item .woocommerce-widget-layered-nav-list__item{padding:0;}
.fgroup-widget-item .woocommerce-widget-layered-nav-list__item a,
.fgroup-widget-item .woocommerce-widget-layered-nav-list__item > span{display:flex; align-items:center; justify-content:space-between; gap:8px; padding:8px 4px; font-size:13.5px; font-weight:600; border-bottom:1px solid var(--line-soft); transition:padding-left .12s ease, color .12s ease;}
.fgroup-widget-item .woocommerce-widget-layered-nav-list__item:last-child a,
.fgroup-widget-item .woocommerce-widget-layered-nav-list__item:last-child > span{border-bottom:none;}
.fgroup-widget-item .woocommerce-widget-layered-nav-list__item a:hover,
.fgroup-widget-item .woocommerce-widget-layered-nav-list__item--chosen a{padding-left:8px; color:var(--orange);}
.fgroup-widget-item .woocommerce-widget-layered-nav-list__item a::after,
.fgroup-widget-item .woocommerce-widget-layered-nav-list__item > span::after{content:"→"; opacity:.4; font-size:12px;}
.fgroup-widget-item .woocommerce-widget-layered-nav-list .count{display:none;}
.fgroup-widget-item select{width:100%; border:1.5px solid var(--ink); padding:8px 10px; font-family:var(--font-mono); font-size:13px; background:var(--paper); appearance:auto;}

.active-chips{display:flex; flex-wrap:wrap; gap:8px; margin-bottom:24px;}
.chip{display:inline-flex; align-items:center; gap:6px; border:1.5px solid var(--ink); padding:6px 10px 6px 12px; font-family:var(--font-mono); font-size:11px; font-weight:600; text-transform:uppercase; background:var(--cream); transition:background .12s ease, color .12s ease;}
.chip:hover{background:var(--ink); color:var(--cream);}

.filters-apply{margin-top:18px;}
.filters-form.is-auto .filters-apply{display:none;}

/* ---- toolbar ---- */
.shop-toolbar{display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:26px; padding-bottom:20px; border-bottom:2px solid var(--gold);}
.toolbar-left{display:flex; align-items:center; gap:14px; min-width:0;}
.result-count{margin:0; font-family:var(--font-mono); font-size:12.5px; font-weight:600; text-transform:uppercase; letter-spacing:.03em; color:rgba(27,23,18,.65);}
.result-count strong{color:var(--ink);}

.filter-trigger{display:none; align-items:center; gap:8px; border:1.5px solid var(--ink); background:var(--paper); padding:10px 16px; font-family:var(--font-mono); font-size:11.5px; font-weight:700; text-transform:uppercase; letter-spacing:.03em; cursor:pointer; position:relative;}
.filter-trigger svg{width:15px; height:15px;}
.filter-trigger .fbadge{background:var(--orange); color:#fff; font-size:10px; font-weight:700; min-width:16px; height:16px; padding:0 3px; display:none; align-items:center; justify-content:center;}
.filter-trigger .fbadge.show{display:inline-flex;}

.sort-select{position:relative; flex-shrink:0;}
.sort-select .woocommerce-ordering{margin:0;}
.sort-select select{width:auto; min-height:0; appearance:none; border:1.5px solid var(--ink); background:var(--paper); background-image:none; padding:10px 34px 10px 14px; font-family:var(--font-mono); font-size:11.5px; font-weight:600; text-transform:uppercase; letter-spacing:.03em; color:var(--ink); cursor:pointer;}
.sort-select::after{content:"▾"; position:absolute; right:12px; top:50%; transform:translateY(-50%); font-size:10px; color:var(--orange); pointer-events:none;}

.filters-backdrop{position:fixed; inset:0; background:rgba(27,23,18,.5); opacity:0; pointer-events:none; transition:opacity .25s ease; z-index:90;}
.filters-backdrop.open{opacity:1; pointer-events:auto;}

/* ---- grid / states ---- */
.shop-loop .prod-grid{grid-template-columns:repeat(3,minmax(0,1fr));}
.woocommerce-no-products-found.empty-state{grid-column:1/-1; display:block; text-align:center; padding:70px 20px; border:1.5px dashed var(--line); text-transform:none; letter-spacing:0; font-family:var(--font); font-size:15px; opacity:1;}
.woocommerce-no-products-found.empty-state p{font-size:15px; opacity:.6; margin-bottom:18px;}
.woocommerce-no-products-found .btn{align-self:center;}
.shop-loop .load-more{display:flex; justify-content:center; margin-top:40px;}

@media (max-width:1080px){
  .shop-layout{grid-template-columns:minmax(0,1fr); gap:0;}
  .shop-head .brand-hero{grid-template-columns:140px minmax(0,1fr); gap:24px;}

  .filter-trigger{display:inline-flex;}
  .filters-close{display:flex; align-items:center; justify-content:center; width:32px; height:32px; border:1.5px solid var(--ink); font-size:16px; cursor:pointer;}

  .filters,.admin-bar .filters{position:fixed; top:0; left:0; bottom:0; width:86%; max-width:360px; max-height:none; background:var(--paper); z-index:96; transform:translateX(-100%); visibility:hidden; transition:transform .3s ease, visibility 0s linear .3s; overflow-y:auto; padding:0 20px; box-shadow:10px 0 30px rgba(0,0,0,.18);}
  .filters.open{transform:translateX(0); visibility:visible; transition:transform .3s ease;}
  .filters-head{position:sticky; top:0; background:var(--paper); margin:0 -20px 18px; padding:20px 20px 16px; border-bottom:2px solid var(--gold); z-index:2;}
  .filters-form.is-auto .filters-apply,.filters-apply{display:block; position:sticky; bottom:0; margin:18px -20px 0; padding:14px 20px 20px; background:var(--paper); border-top:1.5px solid var(--line-soft); z-index:2;}
  body.mg-filters-open{overflow:hidden;}

  .shop-loop .prod-grid{grid-template-columns:repeat(2,minmax(0,1fr));}
}

@media (max-width:640px){
  .shop-head .shop-logo{height:52px;}
  .shop-head .brand-hero{grid-template-columns:minmax(0,1fr); padding:20px; box-shadow:6px 6px 0 var(--mgshop);}
  .shop-head .brand-hero-logo{max-width:160px;}
  .shop-toolbar{flex-wrap:wrap; gap:12px;}
  .filter-trigger{font-size:11px; padding:9px 13px;}
  .shop-loop .prod-grid{grid-template-columns:minmax(0,1fr); gap:24px;}
}