/* Kategoria i lista produktow */

.fr-shop__header{display:grid;grid-template-columns:1.5fr 1fr;gap:64px;
  align-items:end;padding-block:24px 40px}
.fr-shop__title{margin:0 0 14px;font-size:48px}
.fr-shop__lead{margin:0;font-size:19px;line-height:1.6;color:var(--muted);max-width:56ch}
.fr-shop__kwiz{border:1px solid var(--line);background:#fff;padding:24px 26px}
.fr-shop__kwiz p{margin:0 0 16px;font-size:16px;line-height:1.6;color:var(--muted)}
.fr-shop__kwiz strong{color:var(--ink)}

/* Osie wyboru */
.fr-osie{display:flex;flex-wrap:wrap;gap:40px;padding-block:22px;
  border-block:1px solid var(--line);margin-bottom:28px}
.fr-os__label{display:block;font-size:13px;font-weight:700;letter-spacing:.1em;
  text-transform:uppercase;color:var(--muted);margin-bottom:10px}
.fr-os__lista{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.fr-os__lista a{display:inline-flex;align-items:center;height:40px;padding-inline:16px;
  border:1px solid var(--line);background:var(--ivory);text-decoration:none;font-size:15px}
.fr-os__lista a:hover{border-color:var(--ink)}
.fr-os__lista .is-on a{background:var(--ink);color:var(--ivory);border-color:var(--ink)}

/* Pasek nad siatka: liczba produktow i sortowanie */
.woocommerce-result-count{margin:0;font-size:15px;color:var(--muted)}
.woocommerce-ordering{margin:0}
.woocommerce-ordering select{height:44px;padding-inline:12px;border:1px solid var(--line);
  background:var(--ivory);font-family:var(--f-body);font-size:15px}

/* Siatka */
ul.products{list-style:none;margin:0 0 40px;padding:0;display:grid;
  grid-template-columns:repeat(4,minmax(0,1fr));gap:34px 24px}
.fr-card{display:flex;flex-direction:column}
/* Odnosnik rosnie, zeby wszystko doklejone za nim (np. przycisk listy
   zyczen z wtyczki) siadalo przy dolnej krawedzi karty, a nie tuz pod
   tekstem. Bez tego kazda karta w rzedzie ma guzik na innej wysokosci. */
.fr-card > a{display:flex;flex-direction:column;flex:1 1 auto;text-decoration:none;color:inherit}
.fr-card__media img{display:block;width:100%;height:auto;background:var(--tint)}
.fr-card__body{padding-top:14px}
/* Dwie linie na stale. Nazwy sa rozne: „Farciuch «Szary»" miesci sie
   w jednej, „Fartuszek Comfort «Maly czarny»" lamie sie na dwie, i cena
   pod spodem przestawala stac w jednej linii z sasiadami. Zmierzone
   na Studio: rozjazd 24 px w cenach, do 29 px w guzikach. */
.fr-card__title{margin:0 0 6px;font-size:20px;line-height:1.2;min-height:2.4em}
.fr-card__meta{margin:0;font-size:15px;color:var(--muted)}
.fr-card__meta .amount{color:var(--ink);font-weight:700}
.fr-card__meta del{opacity:.6;margin-right:6px}
.fr-card__nadruk{margin:4px 0 0;font-size:14px;color:var(--muted)}
.fr-card__brak{margin:8px 0 0;font-size:14px;font-weight:700;color:var(--muted)}
.fr-card .star-rating{margin:8px 0 0;font-size:13px}

/* Ciemny pas przerywajacy siatke */
.fr-grid__pas{grid-column:1/-1;list-style:none}
.fr-pas{background:var(--ink);color:var(--ivory);padding:40px 44px}
.fr-pas__title{margin:0 0 18px;font-family:var(--f-display);font-size:32px;
  font-weight:500;line-height:1.14}
.fr-pas__tresc{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px 44px}
.fr-pas__tresc p{margin:0;font-size:17px;line-height:1.7}
.fr-pas__tresc strong{color:var(--accent-on-dark)}

/* Dlugi tekst dla Google, pod produktami */
.fr-shop__seo-inner{max-width:1120px}
.fr-shop__seo h2{margin:0 0 24px;font-size:34px}
.fr-shop__seo h3{margin:0 0 8px;font-size:20px}
.fr-shop__seo p{margin:0 0 18px;font-size:17px;line-height:1.7;color:var(--muted)}
.fr-shop__seo p:last-child{margin-bottom:0}

/* Paginacja */
.woocommerce-pagination ul{list-style:none;display:flex;gap:8px;margin:0 0 40px;padding:0}
.woocommerce-pagination a,.woocommerce-pagination span{display:inline-flex;align-items:center;
  justify-content:center;min-width:46px;height:46px;padding-inline:12px;
  border:1px solid var(--line);text-decoration:none;font-size:16px}
.woocommerce-pagination .current{background:var(--ink);color:var(--ivory);border-color:var(--ink)}

@media (max-width:1100px){
  ul.products{grid-template-columns:repeat(3,minmax(0,1fr))}
}
@media (max-width:900px){
  .fr-shop__header{grid-template-columns:1fr;gap:24px;align-items:start;padding-block:16px 26px}
  .fr-shop__title{font-size:32px}
  .fr-shop__lead{font-size:17px}
  .fr-osie{gap:22px;flex-direction:column}
  ul.products{grid-template-columns:repeat(2,minmax(0,1fr));gap:26px 16px}
  .fr-card__title{font-size:17px}
  .fr-pas{padding:26px 22px}
  .fr-pas__title{font-size:24px}
  .fr-pas__tresc{grid-template-columns:1fr;gap:14px}
  .fr-pas__tresc p{font-size:16px}
  .fr-shop__seo h2{font-size:26px}
}

/* Przycisk listy zyczen z wtyczki WPC Smart Wishlist. Wtyczka dokleja
   surowy <button> na koniec karty, wiec bez tego wyglada jak guzik
   z formularza z lat dziewiecdziesiatych i przykrywa sobą cene.
   Robimy z niego cichy odnosnik, przy dolnej krawedzi karty.
   Gdyby mial zniknac z list calkiem, robi to ustawienie wtyczki
   „Button position on archive: None", bez ruszania kodu. */
.fr-card .woosw-btn{align-self:flex-start;margin-top:12px;padding:0;border:0;background:none;
  font:inherit;font-size:14px;line-height:1.4;color:var(--muted);
  text-decoration:underline;text-underline-offset:3px;cursor:pointer}
.fr-card .woosw-btn:hover,
.fr-card .woosw-btn:focus-visible{color:var(--ink)}