/* ============================================================
   SEMIFREDDO — WOOCOMMERCE STYLES
   Spójne z style.css: --black / --gold / --serif / --sans
   ============================================================ */

/* ── OGÓLNE / KONTENER ── */
.woocommerce-page,
.single-product {
  background: var(--black);
  color: var(--text);
}

/* Odstęp na fixed navbar (motyw nie ma #content w markupie, więc
   odstęp idzie na body — dzięki temu breadcrumb, komunikaty
   WooCommerce ("dodano do koszyka" itp.) i sam produkt dostają
   tę samą, spójną przestrzeń pod fixed navbarem zamiast na siebie
   nachodzić). Navbar ma ok. 91px wysokości na desktopie. */
body.single-product {
  padding-top: 9.5rem;
}

.woocommerce {
  width: 100%;
  padding: 0 4rem 6rem;
}

/* Reset domyślnego niebieskiego koloru linków przeglądarki —
   wszystko w obrębie .woocommerce dziedziczy paletę marki,
   chyba że jest jawnie nadpisane (np. na złoto). */
.woocommerce a,
.woocommerce a:visited {
  color: inherit;
}
.woocommerce a:hover {
  color: var(--gold);
}

.woocommerce-breadcrumb {
  font-size: 0.72rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--text-muted);
  margin-bottom: 3rem;
  padding-top: 1rem;
}
.woocommerce-breadcrumb a {
  color: var(--text-muted);
  text-decoration: none;
  transition: color 0.2s;
}
.woocommerce-breadcrumb a:hover { color: var(--gold); }

.woocommerce h1.page-title,
.woocommerce-page h1.page-title {
  font-family: var(--serif);
  font-size: clamp(2.5rem, 4vw, 4rem);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: var(--text);
  margin-bottom: 3rem;
}

/* ── NOTICES / KOMUNIKATY ── */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error,
.woocommerce-noreviews,
p.no-comments {
  list-style: none;
  background: var(--black3);
  border: 1px solid var(--border);
  border-left: 3px solid var(--gold);
  color: var(--text);
  padding: 1.25rem 1.75rem;
  margin-bottom: 2.5rem;
  font-size: 0.85rem;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  flex-wrap: wrap;
}
.woocommerce-error { border-left-color: #C96A6A; }
.woocommerce-message .button,
.woocommerce-info .button {
  order: 2;
}

/* ── PASEK SORTOWANIA / WYNIKÓW ── */
.woocommerce-result-count,
.woocommerce-ordering {
  font-size: 0.78rem;
  color: var(--text-muted);
}
.woocommerce-ordering select {
  background: var(--black3);
  color: var(--text);
  border: 1px solid var(--border);
  padding: 0.6rem 1rem;
  border-radius: 4px;
  font-family: var(--sans);
  font-size: 0.78rem;
  letter-spacing: 0.05em;
  cursor: pointer;
}
.woocommerce > .woocommerce-notices-wrapper + p.woocommerce-result-count,
form.woocommerce-ordering {
  display: inline-block;
}
.woocommerce .woocommerce-result-count,
.woocommerce .woocommerce-ordering {
  margin-bottom: 3rem;
}
.woocommerce > p.woocommerce-result-count { float: none; }

/* ── SIATKA PRODUKTÓW (SKLEP) ── */
.woocommerce ul.products {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5px;
  list-style: none;
  margin: 0;
}

.woocommerce ul.products li.product {
  position: relative;
  background: var(--black3);
  border: 1px solid var(--border);
  overflow: hidden;
  transition: transform 0.3s, border-color 0.3s;
}
.woocommerce ul.products li.product:hover {
  transform: translateY(-6px);
  border-color: rgba(201,164,106,0.3);
}

.woocommerce ul.products li.product a {
  text-decoration: none;
  color: inherit;
  display: block;
}

.woocommerce ul.products li.product img {
  width: 100%;
  aspect-ratio: 4/5;
  object-fit: cover;
  display: block;
  transition: transform 0.6s ease;
}
.woocommerce ul.products li.product:hover img { transform: scale(1.05); }

.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-family: var(--serif);
  font-size: 1.25rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--text);
  padding: 1.5rem 1.5rem 0.5rem;
  line-height: 1.2;
}

.woocommerce ul.products li.product .price {
  font-family: var(--sans);
  font-size: 0.9rem;
  color: var(--gold);
  padding: 0 1.5rem 1.5rem;
  display: block;
  font-weight: 500;
}
.woocommerce ul.products li.product .price del {
  color: var(--text-muted);
  opacity: 0.6;
  margin-right: 0.5rem;
  font-weight: 300;
}
.woocommerce ul.products li.product .price ins {
  text-decoration: none;
  color: var(--gold);
}

.woocommerce span.onsale {
  position: absolute;
  top: 1rem; left: 1rem;
  z-index: 2;
  background: var(--gold);
  color: var(--black);
  font-size: 0.62rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  font-weight: 600;
  padding: 0.4rem 0.8rem;
  border-radius: 3px;
  min-width: 0;
  height: auto;
  line-height: 1;
}

.woocommerce ul.products li.product .button {
  margin: 0 1.5rem 1.5rem;
  width: calc(100% - 3rem);
  font-family: var(--sans);
  font-size: 0.72rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--black);
  background: var(--gold);
  border: 1px solid var(--gold);
  padding: 0.85rem 1.5rem;
  border-radius: 6px;
  font-weight: 500;
  transition: background 0.3s, transform 0.2s;
  text-align: center;
}
.woocommerce ul.products li.product .button:hover {
  background: var(--gold-light);
  transform: translateY(-1px);
}
.woocommerce ul.products li.product .added_to_cart {
  display: block;
  margin: 0 1.5rem 1.5rem;
  text-align: center;
  font-size: 0.72rem;
  color: var(--gold);
  text-decoration: underline;
}

.woocommerce ul.products li.product .star-rating {
  margin: 0.5rem 1.5rem 0;
  color: var(--gold);
  font-size: 0.8rem;
}

/* ── KAFELKI KATEGORII (jeśli strona sklepu pokazuje kategorie) ── */
.woocommerce ul.products li.product-category {
  background: var(--black3);
  border: 1px solid var(--border);
  text-align: left;
  padding: 0;
}
.woocommerce ul.products li.product-category a {
  display: block;
  color: inherit;
  text-decoration: none;
}
.woocommerce ul.products li.product-category img {
  width: 100%;
  aspect-ratio: 4/5;
  object-fit: cover;
  display: block;
}
.woocommerce ul.products li.product-category .woocommerce-loop-category__title {
  font-family: var(--serif);
  font-size: 1.25rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.03em;
  color: var(--text);
  padding: 1.5rem;
  line-height: 1.2;
}
.woocommerce ul.products li.product-category .woocommerce-loop-category__title .count {
  display: inline-block;
  margin-top: 0.5rem;
  font-family: var(--sans);
  font-size: 0.68rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--gold);
  background: none;
  padding: 0;
}

/* ── PEWNOŚĆ WYŚWIETLANIA PRZYCISKU "DODAJ DO KOSZYKA" ── */
.woocommerce ul.products li.product {
  display: flex;
  flex-direction: column;
}
.woocommerce ul.products li.product > a:first-child {
  display: flex;
  flex-direction: column;
  flex: 1;
}
.woocommerce ul.products li.product a.button,
.woocommerce ul.products li.product a.add_to_cart_button {
  display: block !important;
  visibility: visible !important;
  opacity: 1 !important;
  position: relative;
  z-index: 2;
}

/* ── PAGINACJA ── */
.woocommerce nav.woocommerce-pagination {
  margin-top: 4rem;
  text-align: center;
}
.woocommerce nav.woocommerce-pagination ul {
  display: inline-flex;
  gap: 0.5rem;
  border: none;
}
.woocommerce nav.woocommerce-pagination ul li {
  border: none;
}
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 42px;
  height: 42px;
  border: 1px solid var(--border);
  border-radius: 50%;
  color: var(--text-muted);
  font-size: 0.8rem;
  transition: border-color 0.3s, color 0.3s;
}
.woocommerce nav.woocommerce-pagination ul li a:hover,
.woocommerce nav.woocommerce-pagination ul li span.current {
  border-color: var(--gold);
  color: var(--gold);
}

/* ============================================================
   POJEDYNCZY PRODUKT
   ============================================================ */

.woocommerce div.product {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4rem;
  align-items: start;
  padding-top: 1rem;
}

.woocommerce div.product .woocommerce-product-gallery {
  position: relative;
}
.woocommerce div.product .woocommerce-product-gallery img {
  width: 100%;
  border-radius: 4px;
  object-fit: cover;
  display: block;
}
.woocommerce div.product .flex-control-thumbs {
  display: flex;
  gap: 0.75rem;
  margin-top: 1rem;
  list-style: none;
}
.woocommerce div.product .flex-control-thumbs li img {
  width: 80px;
  height: 80px;
  object-fit: cover;
  border-radius: 4px;
  border: 1px solid var(--border);
  cursor: pointer;
  opacity: 0.6;
  transition: opacity 0.3s, border-color 0.3s;
}
.woocommerce div.product .flex-control-thumbs li img.flex-active,
.woocommerce div.product .flex-control-thumbs li img:hover {
  opacity: 1;
  border-color: var(--gold);
}

.woocommerce div.product .summary {
  padding-top: 0.5rem;
}

.woocommerce div.product .product_title {
  font-family: var(--serif);
  font-size: clamp(2.2rem, 3.5vw, 3.2rem);
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: var(--text);
  line-height: 1.05;
  margin-bottom: 1.5rem;
}

.woocommerce div.product p.price,
.woocommerce div.product span.price {
  font-family: var(--sans);
  font-size: 1.6rem;
  color: var(--gold);
  font-weight: 500;
  margin-bottom: 2rem;
  display: block;
}
.woocommerce div.product p.price del {
  color: var(--text-muted);
  opacity: 0.6;
  font-size: 1.1rem;
  margin-right: 0.75rem;
}
.woocommerce div.product p.price ins { text-decoration: none; }

.woocommerce div.product .woocommerce-product-details__short-description {
  font-size: 0.92rem;
  line-height: 1.9;
  color: var(--text-muted);
  margin-bottom: 2.5rem;
  max-width: 460px;
}

.woocommerce div.product .star-rating {
  color: var(--gold);
  margin-bottom: 1.5rem;
}

.woocommerce div.product form.cart {
  display: flex;
  align-items: center;
  gap: 1rem;
  flex-wrap: wrap;
  margin-bottom: 2.5rem;
  padding-top: 1.5rem;
  border-top: 1px solid var(--border);
}

.woocommerce div.product form.cart .quantity {
  display: inline-block;
}
.woocommerce div.product form.cart .quantity input.qty,
.woocommerce input.qty {
  width: 90px;
  height: 54px;
  background: var(--black3);
  border: 1px solid var(--border);
  color: var(--text);
  font-family: var(--sans);
  font-size: 0.95rem;
  text-align: center;
  border-radius: 6px;
}
.woocommerce div.product form.cart .quantity input.qty:focus {
  outline: none;
  border-color: var(--gold);
}

.woocommerce div.product form.cart button.single_add_to_cart_button,
.woocommerce #respond input#submit,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #coupon_code + button,
.woocommerce button[name="apply_coupon"],
.woocommerce button[name="update_cart"],
.woocommerce input[name="apply_coupon"],
.woocommerce a.checkout-button,
.woocommerce .wc-proceed-to-checkout a {
  font-family: var(--sans) !important;
  font-size: 0.75rem !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
  color: var(--black) !important;
  background: var(--gold) !important;
  border: 1px solid var(--gold) !important;
  padding: 1rem 2.5rem !important;
  border-radius: 6px !important;
  font-weight: 500 !important;
  cursor: pointer;
  transition: background 0.3s, transform 0.2s;
  height: auto !important;
}
.woocommerce div.product form.cart button.single_add_to_cart_button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce button[name="apply_coupon"]:hover,
.woocommerce button[name="update_cart"]:hover,
.woocommerce input[name="apply_coupon"]:hover,
.woocommerce a.checkout-button:hover,
.woocommerce .wc-proceed-to-checkout a:hover {
  background: var(--gold-light) !important;
  border-color: var(--gold-light) !important;
  transform: translateY(-1px);
}
.woocommerce div.product form.cart button.single_add_to_cart_button {
  height: 54px !important;
}
.woocommerce table.cart td.actions .coupon {
  display: flex;
  gap: 0.75rem;
  align-items: center;
  flex-wrap: wrap;
}

.woocommerce div.product .product_meta {
  font-size: 0.78rem;
  color: var(--text-muted);
  padding-top: 1.5rem;
  border-top: 1px solid var(--border);
}
.woocommerce div.product .product_meta a {
  color: var(--gold);
  text-decoration: none;
}

/* ── ZAKŁADKI (opis / opinie) ── */
.woocommerce div.product .woocommerce-tabs {
  grid-column: 1 / -1;
  margin-top: 5rem;
  border-top: 1px solid var(--border);
  padding-top: 3rem;
}
.woocommerce div.product .woocommerce-tabs ul.tabs {
  list-style: none;
  display: flex;
  gap: 2.5rem;
  margin-bottom: 2.5rem;
  border: none;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li {
  padding: 0;
  margin: 0;
  border: none;
  background: none;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li a {
  font-size: 0.72rem;
  letter-spacing: 0.2em;
  text-transform: uppercase;
  color: var(--text-muted);
  text-decoration: none;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid transparent;
  transition: color 0.3s, border-color 0.3s;
}
.woocommerce div.product .woocommerce-tabs ul.tabs li.active a,
.woocommerce div.product .woocommerce-tabs ul.tabs li a:hover {
  color: var(--gold);
  border-bottom-color: var(--gold);
}
.woocommerce div.product .woocommerce-tabs .panel {
  font-size: 0.88rem;
  line-height: 1.9;
  color: var(--text-muted);
  max-width: 700px;
}
.woocommerce div.product .woocommerce-tabs .panel h2 {
  font-family: var(--serif);
  font-size: 1.6rem;
  color: var(--text);
  margin-bottom: 1rem;
  text-transform: uppercase;
}

/* ── OPINIE ── */
#reviews .commentlist { list-style: none; }
#reviews .comment {
  border-bottom: 1px solid var(--border);
  padding: 1.5rem 0;
}
#reviews .comment-text { color: var(--text-muted); }
#reviews .comment_container img {
  border-radius: 50%;
}
#review_form input:not([type="checkbox"]):not([type="radio"]),
#review_form textarea {
  background: var(--black3);
  border: 1px solid var(--border);
  color: var(--text);
  border-radius: 4px;
  padding: 0.75rem 1rem;
  font-family: var(--sans);
  width: 100%;
  margin-bottom: 1rem;
}
#review_form label { font-size: 0.78rem; color: var(--text-muted); }

/* Checkbox zgody na zapamiętanie danych — "#review_form input" wyżej
   rozciągał go do width:100% (był myślany tylko pod pola tekstowe). */
#review_form .comment-form-cookies-consent {
  display: flex;
  align-items: flex-start;
  gap: 0.6rem;
  margin-bottom: 1.5rem;
}
#review_form .comment-form-cookies-consent input[type="checkbox"] {
  width: 16px;
  height: 16px;
  flex-shrink: 0;
  margin: 0.15rem 0 0;
  accent-color: var(--gold);
}
#review_form .comment-form-cookies-consent label {
  margin: 0;
}

/* Gwiazdki oceny w formularzu opinii — WooCommerce renderuje je jako
   linki z samym tekstem ("1 z 5 gwiazdek"); wizualnie zamieniamy na
   ikony gwiazdek (tekst zostaje dla czytników ekranu), wypełniające
   się przy najechaniu/wyborze — patrz main.js. */
#review_form p.stars a {
  display: inline-block;
  width: 1.6em;
  height: 1.6em;
  position: relative;
  text-indent: -9999px;
  text-decoration: none;
  overflow: hidden;
}
#review_form p.stars a::before {
  content: "☆";
  position: absolute;
  inset: 0;
  text-indent: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.4rem;
  line-height: 1;
  color: var(--text-muted);
  transition: color 0.15s ease, transform 0.15s ease;
}
#review_form p.stars a.is-filled::before,
#review_form p.stars a.selected::before {
  content: "★";
  color: var(--gold);
}
#review_form p.stars a:hover::before { transform: scale(1.15); }

/* ── PRODUKTY POWIĄZANE ── */
.woocommerce div.product .related.products {
  grid-column: 1 / -1;
  margin-top: 5rem;
  border-top: 1px solid var(--border);
  padding-top: 3rem;
}
.woocommerce div.product .related.products > h2 {
  font-family: var(--serif);
  font-size: clamp(1.8rem, 3vw, 2.5rem);
  text-transform: uppercase;
  color: var(--text);
  margin-bottom: 2.5rem;
}
.woocommerce div.product .related.products ul.products {
  grid-template-columns: repeat(4, 1fr);
}

/* ============================================================
   KOSZYK
   ============================================================ */

.woocommerce-cart .woocommerce {
  display: grid;
  grid-template-columns: 1fr 380px;
  gap: 3rem;
  align-items: start;
}

table.shop_table {
  width: 100%;
  border-collapse: collapse;
  background: var(--black3);
  border: 1px solid var(--border);
  border-radius: 6px;
  overflow: hidden;
}
table.shop_table thead th {
  font-size: 0.68rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--gold);
  text-align: left;
  padding: 1.25rem 1.5rem;
  border-bottom: 1px solid var(--border);
}
table.shop_table tbody td {
  padding: 1.5rem;
  border-bottom: 1px solid var(--border);
  color: var(--text);
  font-size: 0.85rem;
  vertical-align: middle;
}
table.shop_table tbody tr:last-child td { border-bottom: none; }

table.shop_table td.product-thumbnail img {
  width: 72px;
  height: 72px;
  object-fit: cover;
  border-radius: 4px;
}
table.shop_table td.product-name a,
table.shop_table td.product-name a:visited {
  color: var(--text);
  text-decoration: none;
  font-family: var(--serif);
  font-size: 1.05rem;
  text-transform: uppercase;
}
table.shop_table td.product-name a:hover {
  color: var(--gold);
}
table.shop_table .product-price,
table.shop_table .product-subtotal {
  color: var(--gold);
  font-weight: 500;
}

.woocommerce td.actions .coupon {
  display: flex;
  gap: 0.75rem;
  align-items: center;
}
.woocommerce td.actions .coupon input#coupon_code {
  background: var(--black2);
  border: 1px solid var(--border);
  color: var(--text);
  padding: 0.8rem 1.2rem;
  border-radius: 6px;
  font-family: var(--sans);
  font-size: 0.8rem;
}

a.remove {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  color: var(--text-muted) !important;
  background: transparent !important;
  border: 1px solid var(--border);
  border-radius: 50%;
  text-decoration: none;
  transition: color 0.2s, border-color 0.2s;
}
a.remove:hover {
  color: #C96A6A !important;
  border-color: #C96A6A;
}

.cart-collaterals .cart_totals {
  background: var(--black3);
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 2rem;
}
.cart_totals h2 {
  font-family: var(--serif);
  font-size: 1.6rem;
  text-transform: uppercase;
  color: var(--text);
  margin-bottom: 1.5rem;
}
.cart_totals table {
  width: 100%;
}
.cart_totals table th,
.cart_totals table td {
  padding: 1rem 0;
  border-bottom: 1px solid var(--border);
  font-size: 0.85rem;
  color: var(--text-muted);
}
.cart_totals table .order-total th,
.cart_totals table .order-total td {
  color: var(--text);
  font-size: 1.1rem;
  border-bottom: none;
}
.cart_totals table .order-total .woocommerce-Price-amount {
  color: var(--gold);
  font-weight: 600;
}
.wc-proceed-to-checkout a.checkout-button {
  display: block;
  width: 100%;
  text-align: center;
  margin-top: 1.5rem;
}

/* ============================================================
   CHECKOUT
   ============================================================ */

.woocommerce-checkout .woocommerce {
  display: grid;
  grid-template-columns: 1fr 420px;
  gap: 3rem;
  align-items: start;
}

.woocommerce-billing-fields h3,
#order_review_heading {
  font-family: var(--serif);
  font-size: 1.5rem;
  text-transform: uppercase;
  color: var(--text);
  margin-bottom: 1.5rem;
}

.woocommerce form .form-row label {
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-muted);
  margin-bottom: 0.4rem;
  display: block;
}
.woocommerce form .form-row .required {
  color: var(--gold);
  text-decoration: none;
}

.woocommerce form .input-text,
.woocommerce form select,
.woocommerce-additional-fields textarea {
  width: 100%;
  background: var(--black3);
  border: 1px solid var(--border);
  color: var(--text);
  padding: 0.85rem 1.1rem;
  border-radius: 6px;
  font-family: var(--sans);
  font-size: 0.85rem;
  transition: border-color 0.2s;
}
.woocommerce form .input-text:focus,
.woocommerce form select:focus,
.woocommerce-additional-fields textarea:focus {
  outline: none;
  border-color: var(--gold);
}

.woocommerce-checkout #payment {
  background: var(--black3);
  border: 1px solid var(--border);
  border-radius: 6px;
  padding: 1.5rem;
  margin-top: 1.5rem;
}
.woocommerce-checkout #payment ul.payment_methods {
  list-style: none;
  border-bottom: 1px solid var(--border);
  padding-bottom: 1rem;
  margin-bottom: 1rem;
}
.woocommerce-checkout #payment ul.payment_methods li {
  padding: 0.75rem 0;
  color: var(--text);
  font-size: 0.85rem;
}
.woocommerce-checkout #payment div.payment_box {
  background: var(--black2);
  color: var(--text-muted);
  font-size: 0.8rem;
  padding: 1rem;
  border-radius: 4px;
  margin-top: 0.5rem;
}
.woocommerce-checkout #payment div.payment_box::before {
  border-bottom-color: var(--black2) !important;
}

#order_review table.shop_table {
  margin-bottom: 1.5rem;
}

.woocommerce-checkout #place_order {
  width: 100%;
  height: auto;
  padding: 1.1rem 2rem;
  font-size: 0.8rem;
  margin-top: 1rem;
}

/* Walidacja */
.woocommerce form .woocommerce-invalid input.input-text {
  border-color: #C96A6A;
}
.woocommerce-error li {
  list-style: none;
  color: #E89B9B;
  font-size: 0.85rem;
}

/* ============================================================
   WOOCOMMERCE BLOCKS — KOSZYK I CHECKOUT (bloki Gutenberga)
   Ta sekcja dotyczy nowego systemu WooCommerce Blocks, który
   używa zupełnie innych klas (wc-block-*) niż klasyczne szablony
   stylowane wyżej w tym pliku.
   ============================================================ */

.wp-block-woocommerce-cart,
.wp-block-woocommerce-checkout {
  max-width: 1400px;
  margin: 0 auto;
  padding: 2rem 4rem 6rem;
  color: var(--text);
}

/* Reset koloru linków, w tym :visited (domyślny fiolet przeglądarki) */
.wp-block-woocommerce-cart a,
.wp-block-woocommerce-cart a:visited,
.wp-block-woocommerce-checkout a,
.wp-block-woocommerce-checkout a:visited {
  color: inherit;
}
.wp-block-woocommerce-cart a:hover,
.wp-block-woocommerce-checkout a:hover {
  color: var(--gold);
}

/* ── PRZYCISKI (wspólna klasa bazowa we wszystkich blokach) ── */
.wc-block-components-button,
.wc-block-cart__submit-button,
button.wc-block-components-totals-coupon__button,
.wc-block-components-checkout-place-order-button {
  font-family: var(--sans) !important;
  font-size: 0.75rem !important;
  letter-spacing: 0.15em !important;
  text-transform: uppercase !important;
  color: var(--black) !important;
  background: var(--gold) !important;
  border: 1px solid var(--gold) !important;
  border-radius: 6px !important;
  padding: 1rem 2rem !important;
  font-weight: 500 !important;
  box-shadow: none !important;
  transition: background 0.3s, transform 0.2s;
}
.wc-block-components-button:hover,
.wc-block-cart__submit-button:hover,
button.wc-block-components-totals-coupon__button:hover,
.wc-block-components-checkout-place-order-button:hover {
  background: var(--gold-light) !important;
  border-color: var(--gold-light) !important;
  transform: translateY(-1px);
}
/* Przycisk "outline" (np. drugorzędne akcje) */
.wc-block-components-button.is-style-outline {
  background: transparent !important;
  color: var(--text) !important;
}

/* ── LISTA PRODUKTÓW W KOSZYKU ── */
.wc-block-cart-items {
  border-top: 1px solid var(--border);
}
.wc-block-cart-items__header,
.wc-block-cart-item {
  border-bottom: 1px solid var(--border) !important;
}
.wc-block-cart-items__header th {
  font-size: 0.68rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--gold);
}
.wc-block-components-product-name {
  font-family: var(--serif) !important;
  font-size: 1.1rem !important;
  font-weight: 600 !important;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: var(--text) !important;
  text-decoration: none !important;
}
.wc-block-components-product-name:visited { color: var(--text) !important; }
.wc-block-components-product-name:hover { color: var(--gold) !important; }

.wc-block-components-product-price,
.wc-block-components-formatted-money-amount {
  color: var(--gold);
  font-weight: 500;
}
.wc-block-components-product-metadata,
.wc-block-cart-item__prices { color: var(--text-muted); }

.wc-block-components-quantity-selector {
  border: 1px solid var(--border) !important;
  background: var(--black3) !important;
  border-radius: 6px !important;
}
.wc-block-components-quantity-selector__input {
  background: transparent !important;
  color: var(--text) !important;
  font-family: var(--sans) !important;
}
.wc-block-components-quantity-selector__button {
  color: var(--text-muted) !important;
  background: transparent !important;
}
.wc-block-components-quantity-selector__button:hover {
  color: var(--gold) !important;
}

.wc-block-cart-item__remove-link {
  color: var(--text-muted) !important;
  font-size: 0.75rem !important;
  text-decoration: underline !important;
}
.wc-block-cart-item__remove-link:hover { color: #C96A6A !important; }

/* ── PODSUMOWANIE / KUPON / TOTALS (sidebar) ── */
.wc-block-cart__totals-title,
.wc-block-checkout__sidebar-title,
.wc-block-components-totals-wrapper > * {
  color: var(--text);
}
.wc-block-components-totals-item__label,
.wc-block-components-totals-item__description {
  color: var(--text-muted);
}
.wc-block-components-totals-item__value {
  color: var(--text);
  font-weight: 500;
}
.wc-block-components-totals-footer-item .wc-block-components-totals-item__value,
.wc-block-components-totals-footer-item .wc-block-formatted-money-amount {
  color: var(--gold) !important;
  font-family: var(--serif);
  font-size: 1.3rem;
  font-weight: 600;
}
.wc-block-components-totals-wrapper::before {
  border-top-color: var(--border) !important;
}

.wc-block-components-panel {
  border-color: var(--border) !important;
}
.wc-block-components-panel__button {
  color: var(--gold) !important;
  font-size: 0.78rem !important;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}
.wc-block-components-totals-coupon__input input,
.wc-block-components-text-input input,
.wc-block-components-text-input textarea,
.wc-block-components-combobox-control input {
  background: var(--black3) !important;
  border: 1px solid var(--border) !important;
  color: var(--text) !important;
  border-radius: 6px !important;
}
.wc-block-components-text-input label,
.wc-block-components-combobox-control label {
  color: var(--text-muted) !important;
  background: var(--black3) !important;
}
.wc-block-components-text-input input:focus,
.wc-block-components-totals-coupon__input input:focus {
  border-color: var(--gold) !important;
  box-shadow: none !important;
}

/* ── CHECKOUT: metody płatności / dostawy ── */
.wc-block-components-radio-control__option {
  border-color: var(--border) !important;
  background: var(--black3) !important;
}
.wc-block-components-radio-control__option.wc-block-components-radio-control__option-checked,
.wc-block-components-radio-control__input:checked {
  border-color: var(--gold) !important;
  accent-color: var(--gold);
}
.wc-block-components-radio-control__label,
.wc-block-components-payment-method-label {
  color: var(--text) !important;
}
.wc-block-components-radio-control__description,
.wc-block-components-payment-method-description {
  color: var(--text-muted) !important;
}
.wc-block-checkout__main,
.wc-block-checkout__sidebar {
  color: var(--text);
}
.wc-block-components-order-summary-item__description,
.wc-block-components-order-summary-item__quantity {
  color: var(--text-muted) !important;
}

/* ── UKŁAD STRONY (szerokość + karty premium) ──
   Wrapper .commerce-page-wrap zastępuje .legal-content (max-width:820px,
   pomyślany pod strony prawne) dla koszyka/checkoutu w page.php, żeby
   blok WooCommerce mógł wykorzystać swoje pełne 1400px zamiast być
   ściśnięty do wąskiej kolumny tekstu. ── */
.commerce-page-wrap {
  padding: 9rem 4rem 6rem;
  background: var(--black);
  min-height: 100vh;
}
.commerce-page-wrap h1.page-title {
  max-width: 1400px;
  margin-left: auto;
  margin-right: auto;
}

.wc-block-components-sidebar-layout {
  display: flex;
  align-items: flex-start;
  gap: 3rem;
}
.wc-block-components-main {
  flex: 1 1 auto;
  min-width: 0;
}
.wc-block-components-sidebar {
  flex: 0 0 380px;
  position: sticky;
  top: 7rem;
}

/* Karty — koszyk, każdy krok checkoutu, panel podsumowania.
   Uwaga: WooCommerce Blocks resetuje te elementy z !important
   (np. "table.wc-block-cart-items{background:none!important}",
   ".wc-block-components-form .wc-block-components-checkout-step
   {background:none;border:none}" — 2 klasy, wyższa specyficzność
   niż nasz pojedynczy selektor) — dlatego też !important + tag. */
table.wc-block-cart-items,
.wc-block-components-checkout-step,
.wc-block-components-sidebar > * {
  background: var(--black3) !important;
  border: 1px solid var(--border) !important;
  border-radius: 12px;
}
table.wc-block-cart-items {
  padding: 0.25rem 2rem;
}
.wc-block-components-checkout-step {
  padding: 2rem 2.25rem !important;
  margin-bottom: 1.5rem !important;
}
.wc-block-components-checkout-step:last-of-type { margin-bottom: 0 !important; }
.wc-block-components-sidebar > * + * { margin-top: 1.5rem; }

/* Numerowane kroki checkoutu — złota plakietka zamiast domyślnej,
   niestylowanej numeracji WooCommerce Blocks. */
.wc-block-checkout__form { counter-reset: semifreddo-step; }
.wc-block-components-checkout-step__heading-container {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-bottom: 1.5rem;
}
.wc-block-components-checkout-step__heading-container::before {
  counter-increment: semifreddo-step;
  content: counter(semifreddo-step);
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background: var(--gold);
  color: var(--black);
  font-family: var(--sans);
  font-size: 0.85rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}
.wc-block-components-checkout-step__title {
  font-family: var(--serif) !important;
  font-size: 1.4rem !important;
  font-weight: 600 !important;
  text-transform: uppercase;
  letter-spacing: 0.02em;
  color: var(--text) !important;
}
.wc-block-components-checkout-step__description {
  color: var(--text-muted);
  font-size: 0.85rem;
}

/* Pola formularza wewnątrz kart — nieco ciemniejsze niż tło karty,
   dla wyraźnego wgłębienia zamiast płaskiego zlania się z kartą. */
.wc-block-components-checkout-step .wc-block-components-text-input input,
.wc-block-components-checkout-step .wc-block-components-country-input,
.wc-block-components-checkout-step .wc-block-components-state-input,
.wc-block-components-checkout-step textarea {
  background: var(--black2) !important;
}

/* Podsumowanie zamówienia w sidebarze — odstępy wewnątrz karty */
.wc-block-components-checkout-order-summary__title,
.wc-block-cart__totals-title {
  padding: 1.75rem 2rem 0;
}
.wc-block-components-checkout-order-summary__content,
.wp-block-woocommerce-cart-order-summary-block {
  padding: 0 2rem 1.75rem;
}
.wc-block-cart__payment-options,
.wc-block-cart__submit {
  padding: 0 2rem 1.75rem;
}
.wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button {
  width: 100%;
}

/* ── RESPONSIVE ── */
@media (max-width: 1100px) {
  .wc-block-components-sidebar-layout { gap: 2rem; }
  .wc-block-components-sidebar { flex-basis: 320px; }
}
@media (max-width: 1024px) {
  .wc-block-components-sidebar-layout { flex-direction: column; }
  .wc-block-components-sidebar {
    position: static;
    width: 100%;
    flex-basis: auto;
  }
}
@media (max-width: 900px) {
  .wp-block-woocommerce-cart,
  .wp-block-woocommerce-checkout {
    padding: 1.5rem 1.5rem 4rem;
  }
  .commerce-page-wrap { padding: 7.5rem 1.5rem 4rem; }
  .wc-block-cart-items,
  .wc-block-components-checkout-step { padding: 1.5rem; }
  .wc-block-components-checkout-order-summary__title,
  .wc-block-cart__totals-title { padding: 1.5rem 1.5rem 0; }
  .wc-block-components-checkout-order-summary__content,
  .wp-block-woocommerce-cart-order-summary-block,
  .wc-block-cart__payment-options,
  .wc-block-cart__submit { padding: 0 1.5rem 1.5rem; }
}

/* ============================================================
   RESPONSIVE (SZABLONY KLASYCZNE)
   ============================================================ */
@media (max-width: 1100px) {
  .woocommerce ul.products { grid-template-columns: repeat(3, 1fr); }
  .woocommerce div.product .related.products ul.products { grid-template-columns: repeat(3, 1fr); }
}

@media (max-width: 900px) {
  .woocommerce { padding: 0 1.5rem 4rem; }
  body.single-product { padding-top: 8rem; }

  .woocommerce ul.products { grid-template-columns: repeat(2, 1fr); }
  .woocommerce div.product .related.products ul.products { grid-template-columns: repeat(2, 1fr); }

  .woocommerce div.product {
    grid-template-columns: 1fr;
    gap: 2rem;
  }

  .woocommerce-cart .woocommerce,
  .woocommerce-checkout .woocommerce {
    grid-template-columns: 1fr;
  }

  table.shop_table thead { display: none; }
  table.shop_table tbody td {
    display: flex;
    justify-content: space-between;
    align-items: center;
  }
}

@media (max-width: 520px) {
  .woocommerce ul.products { grid-template-columns: 1fr; }
  .woocommerce div.product .related.products ul.products { grid-template-columns: 1fr; }
  .woocommerce div.product form.cart { flex-direction: column; align-items: stretch; }
  .woocommerce div.product form.cart button.single_add_to_cart_button { width: 100%; }
}
/* ============================================================
   NIESTANDARDOWE ARCHIWUM PRODUKTÓW (strona Sklep, .product-card)
   Bazowe style .product-card / .product-card-img / .product-card-cat /
   .product-card-name / .product-card-desc są już w style.css
   (współdzielone z karuzelą na stronie głównej) — tu dopełniamy
   elementy specyficzne dla siatki sklepu: cenę, przycisk, filtry,
   pełną klikalność karty i responsywność.
   ============================================================ */

.shop-page-wrap {
  padding: 8rem 4rem 4rem;
  background: var(--black);
  min-height: 100vh;
}

.shop-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1.5rem;
}

.shop-grid .product-card {
  position: relative;
  display: flex;
  flex-direction: column;
}

/* Cała karta klikalna — poza przyciskiem koszyka (wyższy z-index) */
.product-card-stretched-link {
  position: absolute;
  inset: 0;
  z-index: 1;
}

/* ── SERCE / WISHLIST na karcie produktu ── */
.product-card-heart {
  position: absolute;
  top: 14px;
  right: 14px;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: rgba(10,8,6,0.55);
  border: 1px solid var(--border);
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  z-index: 2;
  padding: 0;
  transition: transform 0.2s ease, border-color 0.2s ease;
}
.product-card-heart:hover {
  transform: scale(1.08);
  border-color: var(--gold);
}
.product-card-heart svg {
  width: 17px;
  height: 17px;
  stroke: var(--text);
  transition: fill 0.2s ease, stroke 0.2s ease;
}
.product-card-heart.is-active svg {
  fill: var(--gold);
  stroke: var(--gold);
}

.shop-grid .product-card-body {
  position: relative;
  display: flex;
  flex-direction: column;
  flex: 1;
}

.product-card-price {
  color: var(--gold);
  font-family: var(--serif);
  font-size: 1.2rem;
  margin-top: 0.75rem;
}

.product-card-actions {
  position: relative;
  z-index: 2;
  margin-top: 1rem;
}
.product-card-actions .button,
.product-card-actions .add_to_cart_button {
  display: block;
  width: 100%;
  text-align: center;
  font-family: var(--sans);
  font-size: 0.72rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--black) !important;
  background: var(--gold);
  border: 1px solid var(--gold);
  padding: 0.85rem 1.5rem;
  border-radius: 6px;
  font-weight: 500;
  text-decoration: none !important;
  transition: background 0.3s, transform 0.2s;
}
.product-card-actions .button:hover,
.product-card-actions .add_to_cart_button:hover {
  background: var(--gold-light);
  border-color: var(--gold-light);
  transform: translateY(-1px);
}
.product-card-actions .added_to_cart {
  display: block;
  margin-top: 0.5rem;
  text-align: center;
  font-size: 0.7rem;
  color: var(--gold);
  text-decoration: underline;
}

/* ── FILTRY KATEGORII ── */
.shop-filters {
  display: flex;
  flex-wrap: wrap;
  gap: 0.75rem;
  margin-bottom: 3rem;
}
.shop-filter-btn {
  font-family: var(--sans);
  font-size: 0.72rem;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--text-muted);
  background: transparent;
  border: 1px solid var(--border);
  padding: 0.65rem 1.4rem;
  border-radius: 30px;
  cursor: pointer;
  transition: color 0.3s, border-color 0.3s, background 0.3s;
}
.shop-filter-btn:hover {
  color: var(--text);
  border-color: rgba(201,164,106,0.4);
}
.shop-filter-btn.is-active {
  color: var(--black);
  background: var(--gold);
  border-color: var(--gold);
}
.product-card.is-hidden { display: none; }

/* ── RESPONSYWNOŚĆ ── */
@media (max-width: 1100px) {
  .shop-grid { grid-template-columns: repeat(3, 1fr); }
}
@media (max-width: 900px) {
  .shop-page-wrap { padding: 6.5rem 1.5rem 3rem; }
  .shop-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width: 560px) {
  .shop-grid { grid-template-columns: 1fr; }
}
/* ============================================================
   POPRAWKI UKŁADU — POJEDYNCZY PRODUKT v3
   Kontener zwężony do 1440px, wyśrodkowany.

   WAŻNE: ten blok ZASTĘPUJE poprzedni blok "POPRAWKI UKŁADU —
   POJEDYNCZY PRODUKT v2". Usuń tamten z woocommerce.css i wklej
   w jego miejsce ten — nie trzymaj obu naraz.
   ============================================================ */

.woocommerce div.product {
  max-width: 1440px;
  margin: 0 auto;
  gap: 4rem;
  align-items: start;
}

.woocommerce div.product .woocommerce-product-gallery {
  aspect-ratio: 4 / 3;
  max-height: 560px;
  overflow: hidden;
  border-radius: 4px;
}

.woocommerce div.product .woocommerce-product-gallery img {
  width: 100%;
  height: 100%;
  aspect-ratio: 4 / 3;
  object-fit: cover;
  border-radius: 4px;
  display: block;
}

.woocommerce div.product .summary {
  padding-top: 0;
}

.woocommerce div.product .product_title {
  font-size: clamp(2rem, 3vw, 2.6rem);
  margin-bottom: 1rem;
}

.woocommerce div.product p.price,
.woocommerce div.product span.price {
  font-size: 1.3rem;
  margin-bottom: 1.5rem;
}

/* Krótki opis — między ceną a przyciskiem "Dodaj do koszyka"
   (to już domyślna kolejność WooCommerce, tu tylko dopracowany styl) */
.woocommerce div.product .woocommerce-product-details__short-description {
  font-size: 0.92rem;
  line-height: 1.9;
  color: var(--text-muted);
  margin-bottom: 2rem;
  max-width: 460px;
}

.woocommerce div.product form.cart {
  margin-bottom: 1.5rem;
  padding-top: 1.25rem;
}

.woocommerce div.product .product_meta {
  padding-top: 1.25rem;
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-muted);
}

.woocommerce div.product .woocommerce-tabs {
  margin-top: 4rem;
  padding-top: 2.5rem;
}

/* Breadcrumb — ta sama szerokość co treść produktu */
.woocommerce-breadcrumb {
  max-width: 1440px;
  margin-left: auto;
  margin-right: auto;
}

@media (max-width: 1500px) {
  .woocommerce div.product,
  .woocommerce-breadcrumb {
    max-width: 100%;
  }
}

@media (max-width: 900px) {
  .woocommerce div.product .woocommerce-product-gallery {
    aspect-ratio: 4 / 3;
    max-height: 420px;
  }
  .woocommerce div.product {
    gap: 2rem;
  }
}

/* ============================================================
   WARIANTY PRODUKTU — GRAMATURA JAKO SWATCHE (zamiast <select>)
   JS (main.js) zamienia <select> z table.variations na przyciski
   .weight-swatch z realną wagą jako etykietą (np. "1,5–1,6 kg").
   Oryginalny <select> zostaje w DOM (WooCommerce go potrzebuje do
   dopasowania wariantu/ceny) ale wizualnie ukryty.
   ============================================================ */

.woocommerce div.product table.variations {
  width: 100%;
  border: none;
  margin: 0 0 0.5rem;
}
.woocommerce div.product table.variations tbody,
.woocommerce div.product table.variations tr,
.woocommerce div.product table.variations th,
.woocommerce div.product table.variations td {
  display: block;
  border: none;
  padding: 0;
  background: none;
}
.woocommerce div.product table.variations th.label {
  font-family: var(--sans);
  font-size: 0.72rem;
  letter-spacing: 0.15em;
  text-transform: uppercase;
  color: var(--text-muted);
  margin-bottom: 1rem;
  font-weight: 400;
}
.woocommerce div.product table.variations th.label label { display: block; }

/* Natywny <select> zostaje funkcjonalny dla WooCommerce, ale niewidoczny —
   zamiennik wizualny to .weight-swatches wstawiane przez main.js. */
.woocommerce div.product table.variations select.weight-select-native {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

.weight-swatches {
  display: flex;
  flex-wrap: wrap;
  gap: 0.85rem;
}
.weight-swatch {
  font-family: var(--sans);
  font-size: 0.85rem;
  letter-spacing: 0.01em;
  color: var(--text);
  background: var(--black3);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 0.95rem 1.6rem;
  cursor: pointer;
  transition: border-color 0.25s ease, background 0.25s ease, color 0.25s ease, transform 0.15s ease;
}
.weight-swatch:hover {
  border-color: rgba(201, 164, 106, 0.5);
  transform: translateY(-1px);
}
.weight-swatch.is-active {
  background: var(--gold);
  border-color: var(--gold);
  color: var(--black);
  font-weight: 600;
}
.weight-swatch:focus-visible {
  outline: 2px solid var(--gold);
  outline-offset: 2px;
}

.woocommerce div.product a.reset_variations {
  display: inline-block;
  margin-top: 0.9rem;
  font-family: var(--sans);
  font-size: 0.7rem;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--text-muted);
  text-decoration: underline;
}
.woocommerce div.product a.reset_variations:hover { color: var(--gold); }

.woocommerce div.product .single_variation_wrap {
  margin-top: 1.75rem;
}
.woocommerce div.product .woocommerce-variation-price .price {
  margin-bottom: 0.5rem !important;
}
.woocommerce div.product .woocommerce-variation-description p {
  font-size: 0.85rem;
  line-height: 1.7;
  color: var(--text-muted);
  margin: 0 0 1rem;
  max-width: 460px;
}
.woocommerce div.product .woocommerce-variation-add-to-cart.variations_button {
  display: flex;
  align-items: center;
  gap: 1rem;
  flex-wrap: wrap;
}

/* Komunikaty WooCommerce ("dodano do koszyka" itp.) — renderowane jako
   rodzeństwo przed div.product, nie w jego wnętrzu, więc odstęp trzeba
   dać na sam wrapper, żeby nie stykał się z breadcrumbem/produktem. */
.woocommerce-notices-wrapper:not(:empty) {
  margin-bottom: 1.5rem;
}
