/* Koszyk. Stylujemy natywny markup Woo — jego struktura odpowiada projektowi,
   więc override szablonu byłby kosztem bez zysku. */

.woocommerce-cart .ff-main,
.woocommerce-checkout .ff-main,
.woocommerce-account .ff-main { padding-block: var(--space-7) var(--section-y); }

.woocommerce-cart .ff-main > .woocommerce,
.woocommerce-checkout .ff-main > .woocommerce,
.woocommerce-account .ff-main > .woocommerce {
  width: 100%;
  max-width: var(--container);
  margin-inline: auto;
  padding-inline: var(--gutter);
}

@media (max-width: 767px) {
  .woocommerce-cart .ff-main > .woocommerce,
  .woocommerce-checkout .ff-main > .woocommerce,
  .woocommerce-account .ff-main > .woocommerce { padding-inline: var(--gutter-mobile); }
}

/* Układ dwukolumnowy: lista pozycji i podsumowanie. */
.woocommerce-cart .woocommerce {
  display: grid;
  grid-template-columns: 1fr;
  gap: var(--space-8);
}
.woocommerce-cart-form { min-width: 0; }

.shop_table {
  width: 100%;
  border-collapse: collapse;
  border: var(--border-w) solid var(--line);
  border-radius: var(--radius-4);
  overflow: hidden;
}
.shop_table th {
  text-align: left;
  padding: var(--space-4);
  background: var(--surface-1);
  border-bottom: var(--border-w) solid var(--line);
  font-family: var(--font-condensed);
  font-size: var(--label-size);
  font-weight: var(--label-weight);
  letter-spacing: var(--label-ls);
  text-transform: uppercase;
  color: var(--ink-600);
}
.shop_table td {
  padding: var(--space-4);
  border-bottom: var(--border-w) solid var(--line-soft);
  vertical-align: middle;
}
.shop_table .product-thumbnail { width: 96px; }
.shop_table .product-thumbnail img {
  width: 80px;
  height: 80px;
  object-fit: contain;
  mix-blend-mode: multiply;
  border: var(--border-w) solid var(--line);
  border-radius: var(--radius-2);
}
.shop_table .product-name a { font-weight: 600; }
.shop_table .product-name a:hover { color: var(--red-500); }
.shop_table .product-price,
.shop_table .product-subtotal { white-space: nowrap; font-family: var(--font-display); font-weight: 600; }

.shop_table .product-remove a {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  border-radius: var(--radius-2);
  color: var(--ink-400);
  font-size: 20px;
  line-height: 1;
}
.shop_table .product-remove a:hover { color: var(--red-500); background: var(--red-50); }

.quantity { display: inline-flex; align-items: center; }
.quantity input[type="number"] {
  width: 72px;
  height: var(--control-h);
  text-align: center;
  border: var(--border-w) solid var(--line-strong);
  border-radius: var(--radius-2);
  font-family: var(--font-mono);
  font-size: var(--mono-size);
}

.actions {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  padding: var(--space-4);
  flex-wrap: wrap;
}
.actions .coupon { display: flex; gap: var(--space-2); flex: 1 1 auto; }
.actions .coupon input {
  height: var(--control-h);
  border: var(--border-w) solid var(--line-strong);
  border-radius: var(--radius-2);
  padding-inline: var(--space-3);
  max-width: 220px;
}

/* Przyciski Woo wyglądają jak nasz przycisk — jeden wzorzec na cały sklep. */
.woocommerce .button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce a.button,
.woocommerce #respond input#submit {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: var(--space-2);
  height: var(--control-h);
  padding-inline: var(--control-pad-x);
  border: var(--border-w) solid var(--line-strong);
  border-radius: var(--radius-2);
  background: transparent;
  color: var(--ink-900);
  font-family: var(--font-condensed);
  font-size: var(--btn-label-size);
  font-weight: var(--btn-label-weight);
  letter-spacing: var(--btn-label-ls);
  text-transform: uppercase;
  cursor: pointer;
  transition: background-color var(--dur-1) var(--ease-standard), border-color var(--dur-1) var(--ease-standard), color var(--dur-1) var(--ease-standard);
}
.woocommerce .button:hover,
.woocommerce button.button:hover,
.woocommerce a.button:hover { border-color: var(--red-500); color: var(--red-500); }

.woocommerce .button.alt,
.woocommerce button.button.alt,
.woocommerce a.button.alt,
.woocommerce #respond input#submit,
.woocommerce .checkout-button {
  background: var(--red-500);
  border-color: var(--red-500);
  color: var(--surface-0);
}
.woocommerce .button.alt:hover,
.woocommerce button.button.alt:hover,
.woocommerce a.button.alt:hover,
.woocommerce .checkout-button:hover {
  background: var(--red-600);
  border-color: var(--red-600);
  color: var(--surface-0);
}
.woocommerce .button:active { transform: translateY(1px); }
.woocommerce .button:disabled,
.woocommerce .button.disabled {
  background: var(--surface-3);
  border-color: var(--surface-3);
  color: var(--ink-400);
  cursor: not-allowed;
}

/* Podsumowanie koszyka. */
.cart-collaterals { min-width: 0; }
.cart_totals {
  border: var(--border-w) solid var(--line);
  border-radius: var(--radius-4);
  padding: var(--card-pad-lg);
  background: var(--surface-1);
  position: sticky;
  top: calc(var(--header-h) + var(--space-4));
}
.cart_totals h2 { font-size: var(--h3-size); margin-bottom: var(--space-4); }
.cart_totals table { width: 100%; border-collapse: collapse; }
.cart_totals th,
.cart_totals td {
  padding: var(--space-3) 0;
  border-bottom: var(--border-w) solid var(--line);
  text-align: left;
}
.cart_totals th {
  font-family: var(--font-condensed);
  font-size: var(--label-size);
  letter-spacing: var(--label-ls);
  text-transform: uppercase;
  color: var(--ink-600);
}
.cart_totals td { text-align: right; }
.cart_totals .order-total td { font-family: var(--font-display); font-size: var(--h3-size); font-weight: 600; }
.cart_totals .wc-proceed-to-checkout { margin-top: var(--space-5); }
.cart_totals .checkout-button { width: 100%; height: var(--control-h-lg); }

@media (min-width: 1024px) {
  .woocommerce-cart .woocommerce {
    grid-template-columns: minmax(0, 2fr) minmax(320px, 1fr);
    align-items: start;
  }
}

.cart-empty,
.return-to-shop { text-align: center; }
.cart-empty { font-size: var(--h3-size); font-family: var(--font-display); text-transform: uppercase; margin-bottom: var(--space-5); }

/* Komunikaty Woo. */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
  display: flex;
  align-items: center;
  gap: var(--space-3);
  flex-wrap: wrap;
  padding: var(--space-4);
  margin-bottom: var(--space-5);
  border-radius: var(--radius-3);
  border-left: var(--border-w-accent) solid var(--red-500);
  background: var(--red-50);
  list-style: none;
}
/* Woo sadza swoją ikonę absolutnie (left: 1.5em) i robi jej miejsce paddingiem
   3.5em. Nasze komunikaty mają własny padding, więc ikona lądowała na pierwszym
   słowie — wpuszczamy ją w układ jako zwykły element flexa, a pusty ::after,
   który u Woo tylko czyści float, chowamy. */
.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before {
  position: static;
  flex: 0 0 auto;
  display: inline-block;
  line-height: 1;
}
.woocommerce-message::after,
.woocommerce-info::after,
.woocommerce-error::after { display: none; }

.woocommerce-message { border-left-color: var(--success-500); background: var(--success-50); }
.woocommerce-info { border-left-color: var(--warning-500); background: var(--warning-50); }
.woocommerce-message .button,
.woocommerce-info .button { margin-left: auto; }