/* ------------ CART ------------ */
/* Grid only when the cart form is present: an empty cart renders just the
   notice + "return to shop" link as direct children of .woocommerce, and
   Woo's own clearfix (content:"" on ::before/::after) would otherwise become
   2 more grid items, scattering that plain content across the two tracks. */
body.toros-tienda.woocommerce-cart .woocommerce {
  display: block;
}
body.toros-tienda.woocommerce-cart .woocommerce:has(> form.woocommerce-cart-form) {
  display: grid;
  grid-template-columns: minmax(0, 1.4fr) minmax(280px, 1fr);
  gap: 32px;
  align-items: start;
}
body.toros-tienda.woocommerce-cart .woocommerce::before,
body.toros-tienda.woocommerce-cart .woocommerce::after {
  display: none;
}
@media (max-width: 900px) {
  body.toros-tienda.woocommerce-cart .woocommerce:has(> form.woocommerce-cart-form) {
    grid-template-columns: 1fr;
  }
}
body.toros-tienda.woocommerce-cart .woocommerce > form.woocommerce-cart-form {
  grid-column: 1;
}
body.toros-tienda.woocommerce-cart .cart-collaterals {
  grid-column: 2;
  width: 100% !important;
  float: none !important;
  position: sticky;
  top: 24px;
}
/* Placed after the unconditional rule above (same specificity, source order
   decides): grid-column:2 + position:sticky would otherwise still win at
   <= 900px, growing an implicit 2nd column on the 1-column grid and
   squeezing both tracks (table + totals) into it. */
@media (max-width: 900px) {
  body.toros-tienda.woocommerce-cart .cart-collaterals {
    grid-column: 1;
    position: static;
  }
}
body.toros-tienda.woocommerce-cart .cart-collaterals .cart_totals {
  width: 100% !important;
  float: none !important;
}

body.toros-tienda.woocommerce-cart table.cart,
body.toros-tienda.woocommerce-checkout table.shop_table {
  border-collapse: collapse;
  background: var(--tt-surface);
  border: 1px solid var(--tt-border-soft);
  border-radius: 6px;
  overflow: hidden;
  width: 100%;
}
body.toros-tienda.woocommerce-cart table.cart th,
body.toros-tienda.woocommerce-checkout table.shop_table th {
  background: var(--tt-bg-2);
  color: var(--tt-text-dim);
  font-family: var(--tt-mono); font-variant-numeric: tabular-nums;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-weight: 500;
  padding: 14px 16px;
  border-bottom: 1px solid var(--tt-border);
  text-align: left;
}
body.toros-tienda.woocommerce-cart table.cart td,
body.toros-tienda.woocommerce-checkout table.shop_table td {
  background: var(--tt-surface);
  color: var(--tt-text);
  padding: 16px;
  border-bottom: 1px solid var(--tt-border-soft);
  vertical-align: middle;
}
body.toros-tienda.woocommerce-cart table.cart td.product-thumbnail img {
  width: 64px;
  height: 64px;
  object-fit: cover;
  border-radius: 4px;
  border: 1px solid var(--tt-border-soft);
}
body.toros-tienda.woocommerce-cart table.cart .product-name a {
  font-family: var(--tt-display); font-weight: 400;
  text-transform: uppercase;
  font-size: 18px;
  letter-spacing: 0.02em;
  color: var(--tt-text);
}
body.toros-tienda.woocommerce-cart table.cart .product-remove a {
  color: var(--tt-text-muted);
  font-size: 18px;
  width: 24px;
  height: 24px;
  background: transparent;
  border: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
}
body.toros-tienda.woocommerce-cart table.cart .product-remove a:hover {
  color: var(--tt-primary);
  background: rgba(200,16,46,0.12);
}
body.toros-tienda.woocommerce-cart .actions .coupon {
  display: flex;
  gap: 8px;
  margin-bottom: 12px;
}
body.toros-tienda.woocommerce-cart .actions .coupon input.input-text {
  flex: 1;
  font-family: var(--tt-mono); font-variant-numeric: tabular-nums;
  text-transform: uppercase;
  letter-spacing: 0.08em;
}

body.toros-tienda .cart_totals h2,
body.toros-tienda.woocommerce-cart .cart_totals h2 {
  font-family: var(--tt-display);
  font-size: 28px;
  text-transform: uppercase;
  font-weight: 400;
  color: var(--tt-text);
  letter-spacing: 0.02em;
  margin-bottom: 12px;
}
body.toros-tienda .cart_totals table.shop_table_responsive,
body.toros-tienda .cart_totals table {
  width: 100%;
  border: 1px solid var(--tt-border-soft);
  background: var(--tt-surface);
  border-radius: 6px;
  overflow: hidden;
}
body.toros-tienda .cart_totals .order-total .amount {
  font-family: var(--tt-display); font-weight: 400;
  font-size: 25px;
  color: var(--tt-primary);
}
body.toros-tienda .wc-proceed-to-checkout {
  margin-top: 16px;
  padding: 0;
}
body.toros-tienda .wc-proceed-to-checkout .checkout-button {
  display: flex !important;
  width: 100%;
  min-height: 56px;
  font-size: 15px !important;
  letter-spacing: 0.1em !important;
}

/* ------------ CHECKOUT ------------ */
body.toros-tienda.woocommerce-checkout .woocommerce {
  display: block;
}
body.toros-tienda.woocommerce-checkout .woocommerce::before,
body.toros-tienda.woocommerce-checkout .woocommerce::after {
  display: none;
}
body.toros-tienda.woocommerce-checkout form.checkout {
  display: grid;
  grid-template-columns: minmax(0, 1.3fr) minmax(320px, 1fr);
  grid-template-rows: auto 1fr;
  gap: 32px;
  align-items: start;
}
body.toros-tienda.woocommerce-checkout form.checkout::before,
body.toros-tienda.woocommerce-checkout form.checkout::after {
  display: none;
}
/* WC's checkout.js injects a validation-error notice group as the first child
   of form.checkout: on the 2-column layout it needs its own row above both
   columns, or auto-placement pushes it below the whole grid (every explicit
   row is already full). The grid-column reset is unconditional (needed at
   every width); the :has() row logic only applies to the 2-column layout
   (min-width: 901px) below, so it can never outrank the <= 900px single
   -column reset that sets grid-row: auto on these same elements (was:
   1,4,2 vs 1,2,1 specificity, the :has() rules always won and overlapped
   the notice/heading/summary on top of the billing form on phones). */
body.toros-tienda.woocommerce-checkout form.checkout > .woocommerce-NoticeGroup,
body.toros-tienda.woocommerce-checkout form.checkout > .woocommerce-notices-wrapper {
  grid-column: 1 / -1;
}
/* #customer_details spans the heading + summary rows so column 2 starts flush
   with column 1 instead of trailing below it (was: heading in row 1 next to
   #customer_details, #order_review auto-placed into row 2, far down the page). */
body.toros-tienda.woocommerce-checkout #customer_details {
  grid-column: 1;
  grid-row: 1 / 3;
}
body.toros-tienda.woocommerce-checkout #order_review_heading {
  grid-column: 2;
  grid-row: 1;
}
body.toros-tienda.woocommerce-checkout #order_review {
  grid-column: 2;
  grid-row: 2;
  align-self: start;
  position: sticky;
  top: 24px;
  background: var(--tt-surface);
  border: 1px solid var(--tt-border-soft);
  border-radius: 6px;
  padding: 20px;
}
@media (min-width: 901px) {
  body.toros-tienda.woocommerce-checkout form.checkout:has(> .woocommerce-NoticeGroup),
  body.toros-tienda.woocommerce-checkout form.checkout:has(> .woocommerce-notices-wrapper) {
    grid-template-rows: auto auto 1fr;
  }
  body.toros-tienda.woocommerce-checkout form.checkout:has(> .woocommerce-NoticeGroup) > .woocommerce-NoticeGroup,
  body.toros-tienda.woocommerce-checkout form.checkout:has(> .woocommerce-notices-wrapper) > .woocommerce-notices-wrapper {
    grid-row: 1;
  }
  body.toros-tienda.woocommerce-checkout form.checkout:has(> .woocommerce-NoticeGroup) #customer_details,
  body.toros-tienda.woocommerce-checkout form.checkout:has(> .woocommerce-notices-wrapper) #customer_details {
    grid-row: 2 / 4;
  }
  body.toros-tienda.woocommerce-checkout form.checkout:has(> .woocommerce-NoticeGroup) #order_review_heading,
  body.toros-tienda.woocommerce-checkout form.checkout:has(> .woocommerce-notices-wrapper) #order_review_heading {
    grid-row: 2;
  }
  body.toros-tienda.woocommerce-checkout form.checkout:has(> .woocommerce-NoticeGroup) #order_review,
  body.toros-tienda.woocommerce-checkout form.checkout:has(> .woocommerce-notices-wrapper) #order_review {
    grid-row: 3;
  }
}
@media (max-width: 900px) {
  body.toros-tienda.woocommerce-checkout form.checkout {
    grid-template-columns: 1fr;
  }
  body.toros-tienda.woocommerce-checkout #customer_details,
  body.toros-tienda.woocommerce-checkout #order_review_heading,
  body.toros-tienda.woocommerce-checkout #order_review {
    grid-column: 1;
    grid-row: auto;
    position: static;
  }
}
body.toros-tienda.woocommerce-checkout #order_review_heading {
  font-family: var(--tt-display);
  font-size: 25px;
  text-transform: uppercase;
  font-weight: 400;
  color: var(--tt-text);
  letter-spacing: 0.02em;
  margin: 0 0 12px;
}

body.toros-tienda.woocommerce-checkout h3 {
  font-family: var(--tt-display);
  text-transform: uppercase;
  font-weight: 400;
  font-size: 23px;
  color: var(--tt-text);
  letter-spacing: 0.02em;
  margin: 0 0 16px;
  padding-bottom: 10px;
  border-bottom: 1px solid var(--tt-border-soft);
}
body.toros-tienda .woocommerce-billing-fields,
body.toros-tienda .woocommerce-additional-fields {
  background: var(--tt-surface);
  border: 1px solid var(--tt-border-soft);
  border-radius: 6px;
  padding: 20px;
  margin-bottom: 16px;
}
body.toros-tienda form .form-row {
  padding: 0;
  margin: 0 0 14px;
}
body.toros-tienda form .form-row-first,
body.toros-tienda form .form-row-last {
  width: 49%;
}
body.toros-tienda form .form-row .required {
  color: var(--tt-primary);
  text-decoration: none;
}

body.toros-tienda .woocommerce-checkout-review-order-table {
  width: 100%;
  font-size: 14px;
}
body.toros-tienda .woocommerce-checkout-review-order-table th,
body.toros-tienda .woocommerce-checkout-review-order-table td {
  padding: 10px 8px;
}
body.toros-tienda .woocommerce-checkout-review-order-table .order-total {
  font-family: var(--tt-display); font-weight: 400;
  font-size: 21px;
}
body.toros-tienda .woocommerce-checkout-review-order-table .order-total .amount {
  color: var(--tt-primary);
  font-size: 22px;
}

body.toros-tienda #payment {
  background: transparent;
  border-radius: 0;
}
body.toros-tienda #payment ul.payment_methods {
  background: var(--tt-bg-2);
  border: 1px solid var(--tt-border-soft);
  border-radius: 6px;
  padding: 12px;
  list-style: none;
  margin: 0 0 12px;
}
body.toros-tienda #payment ul.payment_methods li {
  padding: 10px 4px;
  border-bottom: 1px solid var(--tt-border-soft);
}
body.toros-tienda #payment ul.payment_methods li:last-child {
  border-bottom: 0;
}
body.toros-tienda #payment ul.payment_methods li label {
  display: inline-block;
  font-family: var(--tt-mono); font-variant-numeric: tabular-nums;
  font-size: 12px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--tt-text);
  margin-left: 4px;
  font-weight: 500;
}
body.toros-tienda #payment .payment_box {
  background: var(--tt-surface);
  color: var(--tt-text-dim);
  font-size: 13px;
  border-radius: 4px;
  padding: 12px;
  margin-top: 8px;
}
body.toros-tienda #payment .payment_box::before {
  border-color: transparent transparent var(--tt-surface) transparent;
}
body.toros-tienda #place_order {
  width: 100%;
  min-height: 56px;
  font-size: 15px !important;
  letter-spacing: 0.1em !important;
  margin-top: 12px;
}

/* ------------ MESSAGES ------------ */
body.toros-tienda .woocommerce-info,
body.toros-tienda .woocommerce-message,
body.toros-tienda .woocommerce-error,
body.toros-tienda .woocommerce-notice {
  background: var(--tt-surface);
  border: 0;
  border-left: 3px solid var(--tt-primary);
  color: var(--tt-text);
  border-radius: 0 4px 4px 0;
  font-size: 14px;
  padding: 14px 18px 14px 50px;
}
body.toros-tienda .woocommerce-info::before,
body.toros-tienda .woocommerce-message::before,
body.toros-tienda .woocommerce-error::before {
  color: var(--tt-primary);
  top: 50%;
  transform: translateY(-50%);
  left: 16px;
}
body.toros-tienda .woocommerce-message {
  border-left-color: var(--tt-success);
}
body.toros-tienda .woocommerce-message::before {
  color: var(--tt-success);
}
body.toros-tienda .woocommerce-error {
  border-left-color: var(--tt-warning);
}
body.toros-tienda .woocommerce-error::before {
  color: var(--tt-warning);
}
body.toros-tienda .woocommerce-notices-wrapper {
  margin-bottom: 16px;
}

/* ------------ ACCOUNT ------------ */
/* Grid only when the nav sidebar exists (logged in): logged out, .woocommerce's
   direct children are just the "Acceder" heading and the login form, and the
   260px track squeezed the heading into a narrow column with a large empty
   gap beside it. Woo's clearfix (::before/::after) is also suppressed for the
   same reason as cart/checkout above. */
body.toros-tienda.woocommerce-account .woocommerce {
  display: block;
}
body.toros-tienda.woocommerce-account .woocommerce:has(> .woocommerce-MyAccount-navigation) {
  display: grid;
  grid-template-columns: 260px minmax(0, 1fr);
  gap: 32px;
  align-items: start;
}
body.toros-tienda.woocommerce-account .woocommerce::before,
body.toros-tienda.woocommerce-account .woocommerce::after {
  display: none;
}
@media (max-width: 800px) {
  body.toros-tienda.woocommerce-account .woocommerce:has(> .woocommerce-MyAccount-navigation) {
    grid-template-columns: 1fr;
  }
}
body.toros-tienda.woocommerce-account .woocommerce-MyAccount-navigation {
  background: var(--tt-surface);
  border: 1px solid var(--tt-border-soft);
  border-radius: 6px;
  padding: 8px;
  width: 100% !important;
  float: none !important;
}
body.toros-tienda.woocommerce-account .woocommerce-MyAccount-navigation ul {
  list-style: none;
  margin: 0;
  padding: 0;
}
body.toros-tienda.woocommerce-account .woocommerce-MyAccount-navigation ul li {
  margin: 0;
  border-bottom: 1px solid var(--tt-border-soft);
}
body.toros-tienda.woocommerce-account .woocommerce-MyAccount-navigation ul li:last-child {
  border-bottom: 0;
}
body.toros-tienda.woocommerce-account .woocommerce-MyAccount-navigation ul li a {
  display: block;
  box-sizing: border-box;
  min-height: 44px;
  font-family: var(--tt-mono); font-variant-numeric: tabular-nums;
  font-size: 11px;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  color: var(--tt-text-dim);
  padding: 14px 16px;
  border-left: 2px solid transparent;
  text-decoration: none;
  transition: color .15s, border-color .15s, background .15s;
}
body.toros-tienda.woocommerce-account .woocommerce-MyAccount-navigation ul li a:hover {
  color: var(--tt-text);
  background: var(--tt-bg-2);
}
body.toros-tienda.woocommerce-account .woocommerce-MyAccount-navigation ul li.is-active a {
  color: var(--tt-text);
  border-left-color: var(--tt-primary);
  background: var(--tt-bg-2);
}
body.toros-tienda.woocommerce-account .woocommerce-MyAccount-content {
  width: 100% !important;
  float: none !important;
}

/* Login form */
body.toros-tienda.woocommerce-account .u-columns {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
}
@media (max-width: 700px) {
  body.toros-tienda.woocommerce-account .u-columns {
    grid-template-columns: 1fr;
  }
}
body.toros-tienda.woocommerce-account .u-column1,
body.toros-tienda.woocommerce-account .u-column2 {
  width: 100% !important;
  float: none !important;
  background: var(--tt-surface);
  border: 1px solid var(--tt-border-soft);
  border-radius: 6px;
  padding: 24px;
}

/* ------------ BREADCRUMB ------------ */
body.toros-tienda .woocommerce-breadcrumb {
  font-family: var(--tt-mono); font-variant-numeric: tabular-nums;
  font-size: 11px;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--tt-text-muted);
  margin-bottom: 24px;
  padding: 8px 0;
}
body.toros-tienda .woocommerce-breadcrumb a {
  color: var(--tt-text-dim);
  text-decoration: none;
}
body.toros-tienda .woocommerce-breadcrumb a:hover {
  color: var(--tt-primary);
}

/* ------------ CONFIRMACIÓN · pago Nequi + comprobante ------------ */
body.toros-tienda .tt-pago-cta {
  background: var(--tt-surface);
  border: 1px solid var(--tt-border);
  border-radius: 8px;
  padding: 22px 24px;
  margin: 0 0 28px;
}
body.toros-tienda .tt-pago-cta__head {
  font-family: var(--tt-display);
  font-size: 23px;
  font-weight: 400;
  letter-spacing: -0.01em;
  margin-bottom: 12px;
  color: var(--tt-text);
}
body.toros-tienda .tt-pago-cta__steps {
  margin: 0 0 18px;
  padding-left: 20px;
  color: var(--tt-text-dim);
  font-size: 14px;
  line-height: 1.6;
}
body.toros-tienda .tt-pago-cta__steps strong { color: var(--tt-text); }
body.toros-tienda .tt-pago-cta__btn {
  display: inline-block;
  background: var(--tt-primary);
  color: #fff;
  font-family: var(--tt-display);
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  text-decoration: none;
  padding: 13px 24px;
  border-radius: 6px;
  transition: background 0.15s ease;
}
body.toros-tienda .tt-pago-cta__btn:hover { background: var(--tt-primary-deep); }
body.toros-tienda .tt-pago-cta__note {
  margin: 14px 0 0;
  font-size: 12px;
  color: var(--tt-text-muted);
}