/* ==========================================================================
   Peptropolis — WooCommerce reskin
   Overrides WooCommerce's default markup to match the brand system,
   without overriding the cart/checkout templates themselves (so plugin
   updates don't silently break the storefront).
   ========================================================================== */

.woocommerce-page main,
.woocommerce main {
  padding-top: 7rem;
}

/* Generic WC pages (cart, checkout, my account) get a simple content wrap */
.woocommerce-cart main .wrap,
.woocommerce-checkout main .wrap,
.woocommerce-account main .wrap {
  max-width: var(--container);
  margin: 0 auto;
  padding: 3rem var(--gutter) 6rem;
}

.woocommerce ul.products { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.5rem; list-style: none; margin: 0; padding: 0; }
@media (max-width: 900px) { .woocommerce ul.products { grid-template-columns: 1fr; } }

/* Buttons */
.woocommerce a.button, .woocommerce button.button, .woocommerce input.button,
.woocommerce #respond input#submit {
  display: inline-flex; align-items: center; gap: 0.6rem;
  padding: 0.95rem 1.7rem;
  font-family: var(--font-mono); font-size: 0.82rem; letter-spacing: 0.04em; text-transform: uppercase;
  background: var(--navy); color: var(--white);
  border: 1px solid transparent; border-radius: var(--radius);
  transition: transform 0.35s var(--ease-out), background 0.3s, color 0.3s;
}
.woocommerce a.button:hover, .woocommerce button.button:hover, .woocommerce input.button:hover {
  background: var(--lime); color: var(--navy);
}
.woocommerce a.added_to_cart { font-family: var(--font-mono); font-size: 0.78rem; color: var(--ink-dim); margin-left: 0.75rem; }

/* Forms (cart qty, checkout fields, my account) */
.woocommerce table.shop_table { border: 1px solid var(--hairline); border-collapse: collapse; width: 100%; }
.woocommerce table.shop_table th, .woocommerce table.shop_table td { border-bottom: 1px solid var(--hairline); padding: 1rem; font-size: 0.92rem; }
.woocommerce table.shop_table th { font-family: var(--font-mono); font-size: 0.7rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink-dim); text-align: left; }

.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce table.shop_table td.product-quantity input.qty {
  border: 1px solid var(--hairline); background: var(--paper); padding: 0.8rem 1rem; font-size: 0.95rem; color: var(--navy); width: 100%;
}
.woocommerce form .form-row label { font-family: var(--font-mono); font-size: 0.72rem; letter-spacing: 0.06em; text-transform: uppercase; color: var(--ink-dim); }

.woocommerce-checkout #payment { background: var(--white); border: 1px solid var(--hairline); padding: 1.5rem; }
.woocommerce-checkout #payment ul.payment_methods { border-bottom: 1px solid var(--hairline); }

/* Terms checkbox at checkout — this is the legally meaningful RUO agreement */
.woocommerce-terms-and-conditions-wrapper {
  border: 1px solid var(--lime); background: rgba(200,243,29,0.08); padding: 1rem; margin: 1.5rem 0;
}
.woocommerce-form__label-for-checkbox { font-size: 0.88rem; color: var(--navy); }

/* Price / totals */
.woocommerce .amount, .woocommerce-Price-amount { font-family: var(--font-mono); font-weight: 600; color: var(--navy); }

/* Notices */
.woocommerce-message, .woocommerce-info, .woocommerce-error {
  border-top-color: var(--navy) !important;
  font-family: var(--font-sans);
}
.woocommerce-message::before, .woocommerce-info::before { color: var(--navy) !important; }
.woocommerce-error { border-top-color: var(--amber) !important; }
.woocommerce-error::before { color: var(--amber) !important; }

/* Single product page */
.single-product .product .price { font-family: var(--font-mono); font-size: 1.6rem; color: var(--navy); }
.single-product .product .summary { max-width: 46ch; }
.single-product div.product form.cart { margin-top: 1.5rem; display: flex; gap: 0.75rem; align-items: center; }
.single-product div.product form.cart .quantity input { width: 70px; border: 1px solid var(--hairline); padding: 0.8rem; font-family: var(--font-mono); }