/* ==========================================================================
   WooCommerce — restyled to the 2026 system.
   Targets Woo's own class names so no template overrides are needed yet.
   ========================================================================== */

/* --- buttons ----------------------------------------------------------- */
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
  background: var(--tc-teal-btn); color: #fff; border: 0; border-radius: var(--tc-r);
  font-family: var(--tc-font); font-weight: 700; font-size: .9375rem;
  padding: .8125rem 1.375rem; line-height: 1.2; transition: background-color .15s, color .15s;
}
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover { background: var(--tc-teal-btn-h); color: #fff; }

.woocommerce button.button.alt,
.woocommerce a.button.alt,
.woocommerce input.button.alt { background: var(--tc-navy-700); color: #fff; }
.woocommerce button.button.alt:hover,
.woocommerce a.button.alt:hover { background: var(--tc-navy-800); color: #fff; }

/* --- product grid ------------------------------------------------------ */
.woocommerce ul.products { display: grid; gap: var(--tc-5); margin: 0; padding: 0; list-style: none; }
.woocommerce ul.products.columns-3 { grid-template-columns: repeat(3, 1fr); }
.woocommerce ul.products.columns-4 { grid-template-columns: repeat(4, 1fr); }
@media (max-width: 900px) { .woocommerce ul.products.columns-3,
  .woocommerce ul.products.columns-4 { grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 560px) { .woocommerce ul.products { grid-template-columns: 1fr; } }

.woocommerce ul.products li.product { width: auto; margin: 0; float: none; text-align: left; }
.woocommerce ul.products li.product a img { border-radius: var(--tc-r-sm); margin-bottom: var(--tc-3); }
.woocommerce ul.products li.product .woocommerce-loop-product__title {
  font-size: var(--tc-fs-md); font-weight: 700; padding: 0; margin-bottom: var(--tc-2);
}
.woocommerce ul.products li.product .price {
  color: var(--tc-navy-700); font-weight: 800; font-size: var(--tc-fs-md);
}
.woocommerce ul.products li.product .price del { color: var(--tc-muted); font-weight: 600; }

/* --- single product ---------------------------------------------------- */
.woocommerce div.product .product_title { font-size: var(--tc-fs-2xl); }
.woocommerce div.product p.price,
.woocommerce div.product span.price {
  color: var(--tc-navy-700); font-weight: 800; font-size: var(--tc-fs-xl);
}
.woocommerce div.product form.cart { margin-top: var(--tc-5); }
.woocommerce div.product .quantity .qty {
  width: 5rem; border: 1.5px solid var(--tc-line); border-radius: var(--tc-r-sm); padding: .6875rem;
}

/* variation table: the old site set `display: inline-grid` on <tr>, which
   broke the table's own layout. Left as a normal table here. */
.woocommerce div.product form.cart .variations { border: 0; margin-bottom: var(--tc-4); }
.woocommerce div.product form.cart .variations th,
.woocommerce div.product form.cart .variations td { border: 0; padding: var(--tc-2) 0; }
.woocommerce div.product form.cart .variations label { font-weight: 700; }

/* --- notices ----------------------------------------------------------- */
.woocommerce-message,
.woocommerce-info,
.woocommerce-error {
  border-top: 0; border-radius: var(--tc-r); padding: var(--tc-4) var(--tc-5);
  font-size: .9375rem; background: var(--tc-navy-50); color: var(--tc-ink);
  border: 1px solid var(--tc-navy-line);
}
.woocommerce-message { background: var(--tc-teal-tint); border-color: var(--tc-teal-line); }
.woocommerce-error { background: var(--tc-error-tint); border-color: var(--tc-error-line); }
.woocommerce-message::before,
.woocommerce-info::before,
.woocommerce-error::before { display: none; }

/* --- cart & checkout --------------------------------------------------- */
.woocommerce table.shop_table {
  border: 1px solid var(--tc-line); border-radius: var(--tc-r-lg);
  border-collapse: separate; border-spacing: 0; overflow: hidden;
}
.woocommerce table.shop_table th {
  background: var(--tc-navy-50); font-size: .7188rem; text-transform: uppercase;
  letter-spacing: .06em; color: var(--tc-muted); font-weight: 800; padding: var(--tc-4) var(--tc-5);
}
.woocommerce table.shop_table td { padding: var(--tc-4) var(--tc-5); border-top: 1px solid var(--tc-line); }
.woocommerce .cart_totals h2,
.woocommerce-checkout h3 { font-size: var(--tc-fs-lg); }

.woocommerce form .form-row { padding: 0; margin-bottom: var(--tc-4); }
.woocommerce form .form-row label { font-weight: 700; font-size: .875rem; margin-bottom: var(--tc-2); display: block; }
.woocommerce form .form-row .required { color: var(--tc-error); text-decoration: none; }
.woocommerce-checkout #payment { background: var(--tc-navy-50); border-radius: var(--tc-r-lg); }
.woocommerce-checkout #payment ul.payment_methods { border-bottom: 1px solid var(--tc-line); }
.woocommerce-checkout #payment div.payment_box { background: var(--tc-white); border-radius: var(--tc-r-sm); }
.woocommerce-checkout #payment div.payment_box::before { display: none; }

/* --- my account -------------------------------------------------------- */
.woocommerce-account .woocommerce-MyAccount-navigation ul { list-style: none; margin: 0; padding: 0; }
.woocommerce-account .woocommerce-MyAccount-navigation li { border-bottom: 1px solid var(--tc-line); }
.woocommerce-account .woocommerce-MyAccount-navigation li a {
  display: block; padding: var(--tc-3) 0; font-weight: 600; color: var(--tc-navy-700); text-decoration: none;
}
.woocommerce-account .woocommerce-MyAccount-navigation li.is-active a { color: var(--tc-teal-dark); font-weight: 800; }
.woocommerce-account .woocommerce-MyAccount-content { padding-left: var(--tc-8); }
@media (max-width: 768px) { .woocommerce-account .woocommerce-MyAccount-content { padding-left: 0; } }

/* the loyalty card the barcode plugin renders on the dashboard */
.woocommerce-account .tc-loyalty { margin-bottom: var(--tc-6); }

/* --- cart: coupon and points discount ---------------------------------- */
/* The coupon input defaults to a stub barely wide enough for four characters;
   real codes overflow it. */
.woocommerce .coupon .input-text,
.woocommerce-cart .coupon #coupon_code {
  width: auto; min-width: 16rem; flex: 1 1 16rem;
  padding: 0.6rem 0.75rem; border: 1px solid var(--tc-line); border-radius: var(--tc-r-sm);
}
.woocommerce-cart .coupon { display: flex; gap: var(--tc-2); flex-wrap: wrap; align-items: center; }

@media (max-width: 560px) {
  .woocommerce .coupon .input-text,
  .woocommerce-cart .coupon #coupon_code { min-width: 0; width: 100%; flex: 1 1 100%; }
  /* Match "Обновяване на количката", which is already full width here. */
  .woocommerce-cart .coupon .button,
  .woocommerce-cart .actions .button,
  .woocommerce-cart button[name="apply_coupon"],
  .woocommerce-cart button[name="update_cart"] { width: 100%; display: block; }
}

/* The points-discount form sits inside a notice; give its button room. */
.wc_points_rewards_apply_discount { margin-left: var(--tc-2); }
.wc_points_redeem_earn_points { display: flex; gap: var(--tc-3); align-items: center; flex-wrap: wrap; }

/* --- collection slot on checkout --------------------------------------- */
.tc-checkout-slot {
  margin: var(--tc-6) 0; padding: var(--tc-5);
  border: 1px solid var(--tc-teal-line); border-radius: var(--tc-r); background: var(--tc-teal-tint);
}
.tc-checkout-slot h3 { margin: 0 0 var(--tc-1); font-size: var(--tc-fs-md); }
.tc-checkout-slot .tc-muted { margin-bottom: var(--tc-4); font-size: var(--tc-fs-sm); }
.tc-checkout-slot .form-row { padding: 0; margin-bottom: var(--tc-4); }
.tc-checkout-slot .form-row:last-child { margin-bottom: 0; }
.tc-checkout-slot label { display: block; font-weight: 700; margin-bottom: var(--tc-2); }
.tc-checkout-slot input[type="date"],
.tc-checkout-slot select {
  width: 100%; min-height: 46px; padding: 0.55rem 0.75rem;
  border: 1px solid var(--tc-line); border-radius: var(--tc-r-sm);
  font: inherit; background: var(--tc-white); color: var(--tc-ink);
}
