/* ==========================================================================
   ZADVEOKA SHOP — Archive Product Page
   ========================================================================== */

/* --- WooCommerce Default Overrides --- */
.woocommerce-ordering select.orderby {
  padding: 10px 36px 10px 16px; font-size: 13px; font-family: var(--z-font);
  font-weight: 500; border: 1.5px solid var(--z-border); border-radius: var(--z-radius-xs);
  background: var(--z-white); color: var(--z-text); cursor: pointer;
  appearance: none; -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 12px center;
}
.woocommerce-ordering select.orderby:focus { border-color: var(--z-primary); outline: none; }
/* Hide default WooCommerce result count if still present */
.woocommerce-result-count { display: none; }
/* Hide default Compare buttons on shop */
#zad-shop-page .woosc-btn,
#zad-shop-page .compare { display: none; }

/* --- Category Filter Pills --- */
.zad-category-pills {
  display: flex; flex-wrap: wrap; justify-content: center; gap: 10px;
  padding: 24px 0 0;
}
.zad-pill {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 10px 22px; font-size: 13px; font-weight: 600; font-family: var(--z-font);
  border: 1.5px solid var(--z-border); border-radius: 50px;
  color: var(--z-text-muted); background: var(--z-white);
  cursor: pointer; transition: var(--z-transition); white-space: nowrap;
}
.zad-pill:hover { border-color: var(--z-primary); color: var(--z-primary); }
.zad-pill.active {
  background: var(--z-primary); color: var(--z-white); border-color: var(--z-primary);
}
.zad-pill .count {
  font-size: 11px; font-weight: 700; background: rgba(0,0,0,.08); padding: 2px 8px;
  border-radius: 20px; min-width: 24px; text-align: center;
}
.zad-pill.active .count { background: rgba(255,255,255,.2); }

/* --- Shop Toolbar --- */
.zad-shop-toolbar {
  display: flex; justify-content: space-between; align-items: center;
  padding: 20px 0; margin-bottom: 8px;
}
.zad-shop-count {
  font-size: .9rem; color: var(--z-text-muted);
}
.zad-shop-count strong { color: var(--z-text); font-weight: 700; }
.zad-shop-controls { display: flex; align-items: center; gap: 12px; }
.zad-sort-select {
  padding: 10px 36px 10px 16px; font-size: 13px; font-family: var(--z-font);
  font-weight: 500; border: 1.5px solid var(--z-border); border-radius: var(--z-radius-xs);
  background: var(--z-white); color: var(--z-text); cursor: pointer;
  appearance: none; -webkit-appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%2364748b' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 12px center;
}
.zad-sort-select:focus { border-color: var(--z-primary); outline: none; }
.zad-grid-toggle {
  display: flex; border: 1.5px solid var(--z-border); border-radius: var(--z-radius-xs);
  overflow: hidden;
}
.zad-grid-toggle button {
  padding: 8px 12px; background: var(--z-white); border: none; cursor: pointer;
  color: var(--z-text-light); transition: var(--z-transition-fast);
  display: flex; align-items: center;
}
.zad-grid-toggle button.active { background: var(--z-primary); color: var(--z-white); }
.zad-grid-toggle button + button { border-left: 1.5px solid var(--z-border); }

/* --- Product Grid --- */
.zad-shop-grid {
  display: grid; grid-template-columns: repeat(4, 1fr); gap: 28px;
}
.zad-shop-grid.cols-3 { grid-template-columns: repeat(3, 1fr); }

/* --- Pagination --- */
.zad-pagination {
  display: flex; justify-content: center; align-items: center; gap: 6px;
  padding: 56px 0 0;
}
.zad-pagination a, .zad-pagination span {
  display: inline-flex; align-items: center; justify-content: center;
  width: 44px; height: 44px; font-size: 14px; font-weight: 600; font-family: var(--z-font);
  border-radius: var(--z-radius-xs); border: 1.5px solid var(--z-border);
  color: var(--z-text-muted); transition: var(--z-transition);
}
.zad-pagination a:hover { border-color: var(--z-primary); color: var(--z-primary); }
.zad-pagination .current {
  background: var(--z-primary); color: var(--z-white); border-color: var(--z-primary);
}
.zad-pagination .prev, .zad-pagination .next { width: auto; padding: 0 16px; font-size: 13px; letter-spacing: .5px; }

/* --- No Results --- */
.zad-no-products {
  grid-column: 1 / -1; text-align: center; padding: 80px 20px;
  color: var(--z-text-muted); font-size: 1.1rem;
}

/* --- Responsive --- */
@media (max-width: 1024px) {
  .zad-shop-grid { grid-template-columns: repeat(3, 1fr); }
  .zad-category-pills { overflow-x: auto; flex-wrap: nowrap; justify-content: flex-start; padding-bottom: 8px; -webkit-overflow-scrolling: touch; }
}
@media (max-width: 768px) {
  .zad-shop-grid { grid-template-columns: repeat(2, 1fr); gap: 16px; }
  .zad-shop-toolbar { flex-direction: column; gap: 12px; align-items: flex-start; }
  .zad-pagination a, .zad-pagination span { width: 38px; height: 38px; font-size: 13px; }
}
@media (max-width: 480px) {
  .zad-shop-grid { gap: 12px; }
}