/* ============================================================
   VENUS CALZADO — Checkout Styles v2.0
   Layout de 2 columnas con estilos del Design System
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap');

:root {
  --venus-red: #E8001C;
  --venus-red-dark: #B50016;
  --venus-black: #111111;
  --venus-gray-900: #5A5A5A;
  --venus-gray-500: #777777;
  --venus-gray-300: #BBBBBB;
  --venus-gray-200: #DDDDDD;
  --venus-gray-100: #F0EDEA;
  --venus-cream: #F5F0E8;
  --venus-white: #FFFFFF;
  --venus-footer-bg: #1C1C1C;
  --venus-radius-sm: 4px;
  --venus-radius-md: 8px;
  --venus-radius-lg: 12px;
  --venus-radius-xl: 18px;
  --venus-shadow-card: 0 4px 16px rgba(0, 0, 0, 0.08);
  --venus-shadow-card-md: 0 8px 32px rgba(0, 0, 0, 0.12);
}

/* ── Body / Fondo global ── */
body.woocommerce-checkout,
body.page-template-default:has(.woocommerce-checkout) {
  background-color: var(--venus-cream) !important;
  font-family: 'Poppins', sans-serif !important;
  color: var(--venus-black) !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  padding-top: 0 !important;
  margin-top: 0 !important;
}

/* Quitar espacio de contenedores nativos de WordPress/Twenty Twenty-Five */
body.woocommerce-checkout .wc-block-store-notices,
body.woocommerce-checkout .wp-block-group.alignwide,
body.woocommerce-checkout main.wp-block-group,
body.woocommerce-checkout .wp-block-post-content {
  padding-top: 0 !important;
  margin-top: 0 !important;
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}

/* Overridear márgenes masivos del tema en contenedores padre */
body.woocommerce-checkout .entry-content.alignwide,
body.woocommerce-checkout .entry-content,
body.woocommerce-checkout .wp-block-post-content.is-layout-flow,
body.woocommerce-checkout .wp-block-post-content.is-layout-constrained,
body.woocommerce-checkout main .is-layout-constrained,
body.woocommerce-checkout .wp-block-group.is-layout-constrained {
  max-width: none !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
}

body.woocommerce-checkout .woocommerce {
  padding-top: 0 !important;
  margin-top: 0 !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Romper max-width del tema en .woocommerce (hijo de is-layout-constrained) */
body.woocommerce-checkout .is-layout-constrained > .woocommerce,
body.woocommerce-checkout .is-layout-flow > .woocommerce,
body.woocommerce-checkout .entry-content > .woocommerce,
body.woocommerce-checkout .wp-block-post-content > .woocommerce,
body.woocommerce-checkout main > .woocommerce {
  max-width: 1280px !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* Ocultar header/footer nativos del tema */
body.woocommerce-checkout .wp-block-group:is(.site-header, [class*="site-header"]),
body.woocommerce-checkout header.wp-block-template-part,
body.woocommerce-checkout .wp-block-group:is(.site-footer, [class*="site-footer"]),
body.woocommerce-checkout footer.wp-block-template-part {
  display: none !important;
}

/* ── Header VENUS v2 ── */
.venus-checkout-header {
  background: var(--venus-white);
  border-bottom: 1px solid var(--venus-gray-200);
  border-radius: var(--venus-radius-lg) var(--venus-radius-lg) 0 0;
  padding: 16px 30px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 1280px;
  margin: 0 auto;
}

.venus-checkout-header__logo img {
  max-width: 140px;
  width: 100%;
  height: auto;
  display: block;
}

.venus-checkout-header__back {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 8px 16px;
  border: 1px solid var(--venus-gray-200);
  border-radius: var(--venus-radius-lg);
  color: var(--venus-black);
  font-family: 'Poppins', sans-serif;
  font-size: 13px;
  font-weight: 500;
  text-decoration: none;
  transition: all 150ms ease;
}

.venus-checkout-header__back:hover {
  border-color: var(--venus-red);
  color: var(--venus-red);
}

.venus-checkout-header__back svg {
  transform: rotate(180deg);
}

/* ── Contenedor principal checkout ── */
.woocommerce-checkout .woocommerce {
  max-width: 1280px !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding: 32px 30px 60px;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* Layout de 2 columnas — Checkout Clásico */
.woocommerce-checkout form.checkout.woocommerce-checkout {
  display: flex;
  flex-direction: row;
  gap: 24px;
  align-items: flex-start;
}

/* Pedido primero en el flujo (column-reverse visual) */
.woocommerce-checkout form.checkout.woocommerce-checkout > .col2-set {
  flex: 1 1 60%;
  min-width: 0;
}

.woocommerce-checkout form.checkout.woocommerce-checkout > #order_review_heading {
  display: none !important;
}

.woocommerce-checkout form.checkout.woocommerce-checkout > #order_review {
  flex: 1 1 40%;
  min-width: 0;
}

/* Layout de 2 columnas — WooCommerce Blocks */
.wc-block-checkout {
  display: flex !important;
  flex-direction: row !important;
  gap: 24px !important;
  align-items: flex-start !important;
  max-width: 1280px !important;
  margin: 0 auto !important;
  padding: 24px 30px 60px !important;
}

.wc-block-checkout__main {
  flex: 1 1 60% !important;
  min-width: 0 !important;
}

.wc-block-checkout__sidebar {
  flex: 1 1 40% !important;
  min-width: 0 !important;
}

/* Columna izquierda: formulario */
.woocommerce-checkout .col2-set {
  width: 100% !important;
  float: none !important;
  display: flex;
  flex-direction: column;
  gap: 24px;
}

.woocommerce-checkout .col2-set .col-1,
.woocommerce-checkout .col2-set .col-2 {
  width: 100% !important;
  float: none !important;
}

/* Tarjetas blancas para cada sección */
.woocommerce-checkout .woocommerce-billing-fields,
.woocommerce-checkout .woocommerce-shipping-fields,
.woocommerce-checkout .woocommerce-additional-fields,
.woocommerce-checkout .woocommerce-account-fields,
.woocommerce-checkout #ship-to-different-address {
  background: var(--venus-white);
  border-radius: var(--venus-radius-xl);
  padding: 28px;
  box-shadow: var(--venus-shadow-card);
  margin-bottom: 16px;
}

.woocommerce-checkout #ship-to-different-address {
  padding: 20px 28px;
  margin-bottom: 16px;
}

/* Columna derecha: resumen + pago */
.woocommerce-checkout #order_review {
  width: 100% !important;
  float: none !important;
}

.woocommerce-checkout .woocommerce-checkout-payment {
  background: var(--venus-white);
  border-radius: var(--venus-radius-xl);
  padding: 28px;
  box-shadow: var(--venus-shadow-card);
  margin-bottom: 16px;
}

/* Tabla de orden: tarjeta blanca como en referencia */
.woocommerce-checkout .woocommerce-checkout-review-order-table {
  background: #ffffff !important;
  border-radius: 15px !important;
  padding: 20px !important;
  box-shadow: var(--venus-shadow-card) !important;
  margin-bottom: 15px !important;
}

/* Contenedor del resumen: sin padding, sin shadow */
.woocommerce-checkout #order_review {
  background: transparent !important;
  border-radius: 0 !important;
  padding: 0 !important;
  box-shadow: none !important;
}

/* Heading dentro del resumen */
.woocommerce-checkout #order_review::before {
  content: "Tu pedido";
  display: block;
  font-family: 'Poppins', sans-serif;
  font-weight: 700;
  color: var(--venus-black);
  font-size: 18px;
  margin-bottom: 20px;
}

/* ── Títulos de sección ── */
.woocommerce-checkout .woocommerce-billing-fields h3,
.woocommerce-checkout .woocommerce-shipping-fields h3,
.woocommerce-checkout #order_review_heading,
.woocommerce-checkout .woocommerce-checkout-review-order-table th,
.woocommerce-checkout #ship-to-different-address {
  font-family: 'Poppins', sans-serif !important;
  font-weight: 700 !important;
  color: var(--venus-black) !important;
  font-size: 18px !important;
  margin-bottom: 20px !important;
  padding: 0 !important;
  text-transform: none !important;
}

.woocommerce-checkout #ship-to-different-address {
  font-size: 14px !important;
  font-weight: 600 !important;
}

/* ── Formularios / Inputs ── */
.woocommerce-checkout input[type="text"],
.woocommerce-checkout input[type="email"],
.woocommerce-checkout input[type="tel"],
.woocommerce-checkout input[type="password"],
.woocommerce-checkout textarea,
.woocommerce-checkout select,
.woocommerce-checkout .input-text {
  font-family: 'Poppins', sans-serif !important;
  border: 1px solid var(--venus-gray-200) !important;
  border-radius: var(--venus-radius-lg) !important;
  padding: 12px 16px !important;
  font-size: 14px !important;
  background: var(--venus-white) !important;
  color: var(--venus-black) !important;
  transition: border-color 150ms ease, box-shadow 150ms ease !important;
  outline: none !important;
  height: auto !important;
  line-height: 1.5 !important;
}

.woocommerce-checkout input:focus,
.woocommerce-checkout textarea:focus,
.woocommerce-checkout select:focus,
.woocommerce-checkout .input-text:focus {
  border-color: var(--venus-red) !important;
  box-shadow: 0 0 0 3px rgba(232, 0, 28, 0.10) !important;
}

/* Select arrow custom */
.woocommerce-checkout select {
  appearance: none;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%23777' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E") !important;
  background-repeat: no-repeat !important;
  background-position: right 14px center !important;
  padding-right: 40px !important;
}

/* ── Labels ── */
.woocommerce-checkout label,
.woocommerce-checkout .woocommerce-form__label {
  font-family: 'Poppins', sans-serif !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  color: var(--venus-gray-500) !important;
  text-transform: uppercase;
  letter-spacing: 0.04em;
  margin-bottom: 6px !important;
}

/* ── Tabla de orden (resumen) ── */
.woocommerce-checkout .woocommerce-checkout-review-order-table {
  border: none !important;
  margin: 0 !important;
}

.woocommerce-checkout .woocommerce-checkout-review-order-table th,
.woocommerce-checkout .woocommerce-checkout-review-order-table td {
  font-family: 'Poppins', sans-serif !important;
  font-size: 14px !important;
  padding: 10px 0 !important;
  border-bottom: 1px solid var(--venus-gray-100) !important;
  border-top: none !important;
}

.woocommerce-checkout .woocommerce-checkout-review-order-table thead th {
  font-weight: 700 !important;
  color: var(--venus-black) !important;
  text-transform: uppercase;
  font-size: 11px !important;
  letter-spacing: 0.06em;
  padding-top: 0 !important;
}

.woocommerce-checkout .woocommerce-checkout-review-order-table .cart-subtotal td,
.woocommerce-checkout .woocommerce-checkout-review-order-table .order-total td {
  font-weight: 700 !important;
}

.woocommerce-checkout .woocommerce-checkout-review-order-table .order-total .amount {
  color: var(--venus-red) !important;
  font-size: 20px !important;
  font-weight: 700 !important;
}

.woocommerce-checkout .woocommerce-checkout-review-order-table .product-name {
  font-weight: 600 !important;
}

.woocommerce-checkout .woocommerce-checkout-review-order-table .product-quantity {
  color: var(--venus-gray-500);
  font-weight: 400;
  font-size: 13px;
}

/* ── Sección de pago ── */
.woocommerce-checkout .woocommerce-checkout-payment {
  margin-top: 20px !important;
}

.woocommerce-checkout .wc_payment_methods {
  list-style: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

.woocommerce-checkout .wc_payment_methods .wc_payment_method {
  padding: 12px 0;
  border-bottom: 1px solid var(--venus-gray-100);
}

.woocommerce-checkout .wc_payment_methods .wc_payment_method:last-child {
  border-bottom: none;
}

.woocommerce-checkout .wc_payment_methods label {
  font-family: 'Poppins', sans-serif !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  color: var(--venus-black) !important;
  text-transform: none !important;
  letter-spacing: normal !important;
}

.woocommerce-checkout .payment_box {
  background: var(--venus-gray-100) !important;
  border-radius: var(--venus-radius-md) !important;
  padding: 16px !important;
  margin-top: 8px !important;
}

/* ── Botón de pago (CTA principal) ── */
.woocommerce-checkout #place_order,
.woocommerce-checkout .button.alt {
  font-family: 'Poppins', sans-serif !important;
  background: var(--venus-red) !important;
  color: var(--venus-white) !important;
  border: none !important;
  border-radius: var(--venus-radius-lg) !important;
  padding: 16px 28px !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em;
  cursor: pointer !important;
  transition: opacity 150ms ease, transform 150ms ease, box-shadow 150ms ease !important;
  text-transform: none !important;
  width: 100% !important;
  margin-top: 8px !important;
  box-shadow: 0 4px 12px rgba(232, 0, 28, 0.25) !important;
}

.woocommerce-checkout #place_order:hover,
.woocommerce-checkout .button.alt:hover {
  opacity: 0.9 !important;
  box-shadow: 0 6px 20px rgba(232, 0, 28, 0.35) !important;
}

.woocommerce-checkout #place_order:active,
.woocommerce-checkout .button.alt:active {
  transform: scale(0.98) !important;
}

/* Botón secundario (cupón) */
.woocommerce-checkout .button[name="apply_coupon"] {
  background: var(--venus-black) !important;
  color: var(--venus-white) !important;
  border-radius: var(--venus-radius-lg) !important;
  padding: 10px 20px !important;
  font-size: 13px !important;
  font-weight: 600 !important;
}

/* Logo Wompi */
.wc_payment_methods img[src*="wompi"],
.wc_payment_methods img[alt*="wompi"],
.wc_payment_method.payment_method_wompi img {
  display: inline !important;
  position: relative !important;
  margin: -2px 0 0 7px !important;
  padding: 0 !important;
  width: 159px !important;
  height: auto !important;
  max-height: 173px !important;
  object-fit: contain !important;
}

.wc_payment_method.payment_method_wompi,
.wc_payment_method.payment_method_wompi label {
  font-size: 16px !important;
}

/* ── Notices / Mensajes ── */
.woocommerce-checkout .woocommerce-notices-wrapper,
.woocommerce-checkout .woocommerce-error,
.woocommerce-checkout .woocommerce-info,
.woocommerce-checkout .woocommerce-message {
  font-family: 'Poppins', sans-serif !important;
  border-radius: var(--venus-radius-lg) !important;
  margin-bottom: 20px !important;
}

.woocommerce-checkout .woocommerce-error {
  background: #FFF0F1 !important;
  border-left: 3px solid var(--venus-red) !important;
  color: var(--venus-red) !important;
}

.woocommerce-checkout .woocommerce-info,
.woocommerce-checkout .woocommerce-message {
  background: #EAF5EE !important;
  border-left: 3px solid #2A7A4B !important;
  color: #2A7A4B !important;
}

/* ── Cupón ── */
.woocommerce-checkout .checkout_coupon {
  background: var(--venus-white) !important;
  border-radius: var(--venus-radius-xl) !important;
  padding: 24px !important;
  box-shadow: var(--venus-shadow-card) !important;
  margin-bottom: 24px !important;
  border: none !important;
}

.woocommerce-checkout .checkout_coupon p {
  font-family: 'Poppins', sans-serif !important;
  font-size: 14px !important;
}

/* ── Privacy policy / Términos ── */
.woocommerce-checkout .woocommerce-privacy-policy-text,
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper {
  font-family: 'Poppins', sans-serif !important;
  font-size: 12px !important;
  color: var(--venus-gray-500) !important;
  line-height: 1.6 !important;
}

.woocommerce-checkout .woocommerce-privacy-policy-text a,
.woocommerce-checkout .woocommerce-terms-and-conditions-wrapper a {
  color: var(--venus-red) !important;
  text-decoration: underline !important;
}

/* ── Footer VENUS — oculto en checkout v2 ── */
.venus-checkout-footer {
  display: none !important;
}

/* ── Responsive ── */
@media (max-width: 900px) {
  .woocommerce-checkout form.checkout.woocommerce-checkout {
    flex-direction: column !important;
    gap: 16px !important;
  }

  .woocommerce-checkout form.checkout.woocommerce-checkout > .col2-set,
  .woocommerce-checkout form.checkout.woocommerce-checkout > #order_review {
    flex: 1 1 100% !important;
    width: 100% !important;
  }

  .wc-block-checkout {
    flex-direction: column !important;
    gap: 16px !important;
    padding: 20px 16px 40px !important;
  }

  .wc-block-checkout__main,
  .wc-block-checkout__sidebar {
    flex: 1 1 100% !important;
    width: 100% !important;
  }

  .woocommerce-checkout .woocommerce {
    padding: 20px 16px 40px;
  }

  .woocommerce-checkout .woocommerce-billing-fields,
  .woocommerce-checkout .woocommerce-shipping-fields,
  .woocommerce-checkout .woocommerce-additional-fields,
  .woocommerce-checkout .woocommerce-checkout-review-order-table,
  .woocommerce-checkout .woocommerce-checkout-payment {
    padding: 20px;
  }

  .venus-checkout-header {
    padding: 12px 16px;
  }

  .venus-checkout-header__back span {
    display: none;
  }
}
