/* ===== Pretty Shop Archive ===== */
.shop-hero{background:linear-gradient(135deg, rgba(24,181,196,.10), #fff); border-bottom:1px solid var(--color-border)}
.shop-hero__inner{display:grid; grid-template-columns:1.2fr .8fr; gap:24px; align-items:center; padding:18px 0}
.shop-title{margin:.2em 0 .2em; font-weight:900; letter-spacing:.2px}
.shop-hero__meta{display:grid; grid-template-columns:auto 1fr; gap:16px; align-items:center}
.shop-hero__thumb img{border-radius:12px; background:#fff; border:1px solid var(--color-border); padding:6px}
.shop-hero__desc{color:var(--color-text-muted)}
.shop-usp{display:grid; grid-template-columns:1fr; gap:8px}
.shop-usp .usp{display:flex; align-items:center; gap:8px; background:#fff; border:1px solid var(--color-border); border-radius:10px; padding:8px 10px}
.shop-usp .usp span{display:inline-flex; width:18px; height:18px; border-radius:50%; background:var(--color-primary); color:#fff; align-items:center; justify-content:center; font-size:12px; font-weight:800}

.shop-toolbar{position:sticky; top:0; z-index:40; background:#fff; border-bottom:1px solid var(--color-border)}
.shop-toolbar__inner{display:flex; align-items:center; gap:16px; padding:10px 0}
.shop-filters__toggle{display:inline-flex; align-items:center; gap:8px; padding:8px 12px; border:1px solid var(--color-border); border-radius:10px; background:#fff}
.shop-toolbar__filters{display:flex; gap:8px; flex-wrap:wrap}
.shop-toolbar__controls{margin-left:auto; display:flex; align-items:center; gap:12px}
.widget_layered_nav_filters ul{display:flex; gap:8px; flex-wrap:wrap; margin:0; padding:0; list-style:none}
.widget_layered_nav_filters li{display:inline-flex; align-items:center; gap:6px; border:1px solid var(--color-border); background:#fff; padding:6px 8px; border-radius:999px}
.widget_layered_nav_filters a{color:var(--color-text); text-decoration:none}
.widget_layered_nav_filters .chosen a{opacity:.85}

.shop-layout{display:grid; grid-template-columns:300px 1fr; gap:24px; padding:18px 0}
.shop-layout--rev{grid-template-columns:300px 1fr}
.shop-sidebar{position:sticky; top:74px; align-self:start; border:1px solid var(--color-border); border-radius:12px; background:#fff; padding:10px}
.shop-sidebar__close{display:none}

.filter-acc{border:1px solid var(--color-border); border-radius:10px; background:#fff; margin:8px 0; overflow:hidden}
.filter-acc > summary{cursor:pointer; padding:10px 12px; font-weight:700; background:#f8fafc; outline:none}
.filter-acc[open] > summary{border-bottom:1px solid var(--color-border)}

.empty-state{padding:18px; text-align:center}

@media (max-width: 1024px){
  .shop-hero__inner{grid-template-columns:1fr}
  .shop-layout{grid-template-columns:1fr}
  .shop-sidebar{position:fixed; inset:0 0 0 auto; width:min(90vw, 400px); max-width:100%; transform:translateX(100%); transition:transform .25s ease; z-index:60; border-radius:0; box-shadow:-12px 0 24px rgba(0,0,0,.12)}
  .shop-sidebar.is-open{transform:none}
  .shop-sidebar__close{display:inline-flex; margin-bottom:8px; border:1px solid var(--color-border); background:#fff; border-radius:8px; padding:6px 10px}
  .shop-toolbar{top:0}
}

/* Cards polish using default Woo markup */
ul.products{--gap:12px; display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:var(--gap)}
@media (max-width: 1200px){ ul.products{grid-template-columns:repeat(3, minmax(0,1fr));} }
@media (max-width: 800px){ ul.products{grid-template-columns:repeat(2, minmax(0,1fr));} }
ul.products li.product{background:#fff; border:1px solid var(--color-border); border-radius:12px; overflow:hidden; transition:box-shadow .15s ease, transform .15s ease}
ul.products li.product:hover{box-shadow:0 6px 20px rgba(2,6,23,.06); transform:translateY(-1px)}
ul.products li.product a.woocommerce-LoopProduct-link{padding:10px; display:block}
ul.products li.product .price{color:#0f172a; font-weight:800}
ul.products li.product .button{margin:10px; border-radius:10px; font-weight:800; background:var(--color-primary); color:#fff}
ul.products li.product .onsale{left:10px; right:auto; background:#8ebb43; border-radius:999px; padding:4px 8px; top:10px}


/* === Fixes: product grid & cards === */
.woocommerce ul.products, .woocommerce-page ul.products{
  display:grid !important;
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
  gap:16px; list-style:none; margin:0; padding:0;
}
.woocommerce ul.products li.product, .woocommerce-page ul.products li.product{
  float:none !important; width:auto !important; margin:0 !important;
  display:flex; flex-direction:column;
  background:#fff; border:1px solid var(--color-border); border-radius:12px; overflow:hidden;
  transition:box-shadow .15s ease, transform .15s ease;
}
.woocommerce ul.products li.product:hover{box-shadow:0 6px 20px rgba(2,6,23,.06); transform:translateY(-1px)}
.woocommerce ul.products li.product a.woocommerce-LoopProduct-link{display:flex; flex-direction:column; gap:10px; padding:10px}

/* квадратные превью */
.woocommerce ul.products li.product a img{
  display:block; width:100%; aspect-ratio:1/1; object-fit:contain;
  background:#fff; border:1px solid var(--color-border); border-radius:10px; padding:6px;
}

/* заголовок, цена, кнопка */
.woocommerce ul.products li.product .woocommerce-loop-product__title{
  font-weight:700; margin:.2em 0 0;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; min-height:6em;
  text-align: center;
}
.woocommerce ul.products li.product .price{font-weight:800; color:#0f172a; margin:0 10px 10px}
.woocommerce ul.products li.product .button{margin:0 10px 12px; border-radius:10px; font-weight:800; background:var(--color-primary); color:#fff}

/* бейдж распродажи */
.woocommerce ul.products li.product .onsale{left:10px; right:auto; top:10px; background:#8ebb43; border-radius:999px; padding:4px 8px}

.woocommerce ul.products::before {display: none;}

/* Робимо реальним флекс-контейнером саме .site-main усередині Woo-обгорток */
.shop-main > #primary.content-area > .site-main{
  display: flex;
  flex-direction: column;
}

/* Переносимо опис візуально в самий низ,
   по DOM він як і раніше йде відразу після H1 */
.shop-main    .term-desc{
  order: 999;
  margin-top: 24px;
  color: var(--color-text-muted);
  background: #fff;
  border: 1px solid var(--color-border);
  border-radius: 12px;
  padding: 16px;
}

/* (не обов’язково) зафіксуємо порядок інших блоків */
.shop-main > #primary.content-area > .site-main > .woocommerce-result-count,
.shop-main > #primary.content-area > .site-main > .woocommerce-ordering{ order: 10; }

.shop-main > #primary.content-area > .site-main > ul.products{ order: 20; }

.shop-main > #primary.content-area > .site-main > .woocommerce-pagination{ order: 30; }

.product-card__actions {
  display: flex;
  justify-content: center;
}

/* Тогглер */
.shop-filters__toggle{
  display:none; margin:10px 0 0 10px;
  padding:8px 12px; border:1px solid var(--color-border);
  border-radius:10px; background:#fff; font-weight:700;
}

/* Бекдроп */
.shop-overlay{
  position:fixed; inset:0;
  background:rgba(15,23,42,.45);
  backdrop-filter: blur(2px);
  opacity:0; pointer-events:none;
  transition:opacity .2s ease;
  z-index:80;
}
.shop-overlay.is-open{ opacity:1; pointer-events:auto; }

/* Мобільний офф-канвас */
@media (max-width:1024px){
    .shop-filters__toggle{
    position: static !important;
    top: auto !important;
    left: auto !important;
    z-index: auto !important;
    display: inline-flex;        /* оставляем внешний вид */
    align-items: center;
    gap: 8px;
    margin: 10px 0 12px 10px;    /* можно подправить отступы под макет */
    background: #fff;
  }
  .shop-layout{ grid-template-columns:1fr; }

  .shop-sidebar{
    position:fixed; top:0; right:0; bottom:0; left:auto;
    height:100vh; height:100dvh;
    width:min(90vw, 420px); max-width:100%;
    transform:translateX(110%);
    transition:transform .28s cubic-bezier(.22,1,.36,1);
    z-index:90; background:#fff;
    box-shadow:-24px 0 48px rgba(2,6,23,.16);
    border-radius:12px 0 0 12px;
    display:flex; flex-direction:column; overflow:auto;
    padding-bottom: max(env(safe-area-inset-bottom, 0px), 8px);
  }
  .shop-sidebar.is-open{ transform:none; }

  /* Шапка всередині шухляди */
  .shop-sidebar .drawer-head{
    position:sticky; top:0; z-index:1;
    display:flex; align-items:center; justify-content:space-between;
    gap:12px; padding:12px 16px;
    background:#fff; border-bottom:1px solid var(--color-border);
  }
  .shop-sidebar .drawer-head strong{ font-size:18px; font-weight:800; }
  .shop-sidebar .drawer-close{
    display:inline-flex; align-items:center; justify-content:center;
    width:36px; height:36px; border:1px solid var(--color-border);
    background:#fff; border-radius:10px;
  }

  /* Внутрішні віджети */
  .shop-sidebar .widget{
    border:none; border-bottom:1px solid var(--color-border);
    border-radius:0; padding:16px;
  }
  .shop-sidebar .widget:last-child{ border-bottom:0; }
  .shop-sidebar .widgettitle{ margin:0 0 10px; font-size:16px; font-weight:800; }

  body.no-scroll{ overflow:hidden; }
}


/* Поставить описание категории под списком товаров */
.shop-main{
  display:flex;
  flex-direction:column;
}
.shop-main .products{ order: 1; }
.shop-main .term-desc{
  order: 2;
  margin-top: 16px;       /* чуть воздуха */
}


/* Cart+Checkout layout */
.checkout-shipping-top.card{
  border:1px solid var(--color-border,#e5e7eb);
  border-radius:12px;
  background:#fff;
  padding:14px;
  margin:18px 0;
}
.checkout-shipping-top__title{
  margin:0 0 8px;
  font-weight:800;
  font-size:18px;
}
.checkout-shipping-top .woocommerce-shipping-methods{
  list-style:none;
  margin:8px 0 0;
  padding:0;
}
.checkout-shipping-top .woocommerce-shipping-methods li{
  display:flex; align-items:center; gap:8px;
  padding:6px 0;
}
.checkout-shipping-top .shipping-package + .shipping-package{
  margin-top:10px; padding-top:10px; border-top:1px dashed var(--color-border,#e5e7eb);
}

.dm-hidden { display: none !important; }

#billing_country_field,
#shipping_country_field { display: none !important; }

/* Чуть подправим вид кастомных полей, если нужно */
.woocommerce-billing-fields__field-wrapper .form-row-wide { clear: both; }