/*
 * ============================================================
   PASARELA VETBOX: Carrito + Checkout WooCommerce
   Basado en style-mochilas-.premium.css (MP Custom, Z-SEO)
   adaptado al look & feel de Vetbox.

   Convención:
   - Misma estructura de @layer que MP (mantenimiento/convergencia).
   - Paleta y tipografía mediante variables del theme (style.css):
     --primary-color, --primary-dark, --primary-light, --secondary-color,
     --gradient-primary, --text-main, --text-muted, --border-color,
     --bg-body, --bg-white, --error, --success, --radius-md.
   - Botones principales con gradiente primario Vetbox.
   - Tipografía de títulos/CTAs: "Play" (heading del theme).

   Este archivo es autocontenido: puede reemplazar a
   style-mochilas-.premium.css (eliminar ese archivo al validar).
   ============================================================
 */

/* ============================================
   CARRITO: Estilos del carrito WooCommerce
   Basado en mochilas-premium, adaptado a Vetbox
   ============================================ */
@layer carrito {
  /* ----------------------------------------------------------
   CONTENEDOR GENERAL
   ---------------------------------------------------------- */
  .carrito-container {
    padding: 2rem 0 4rem 0;
  }

  /* Breadcrumb del carrito (autocontenido, reusa clases del theme) */
  .vetbox-breadcrumb.vetbox-breadcrumb--cart {
    margin: 0 0 1.5rem;
  }

  .vetbox-breadcrumb__item[aria-current="page"] {
    font-weight: 700;
    color: var(--text-main);
  }

  /* Layout: Dos columnas */
  .woocommerce-cart .woocommerce {
    display: flex;
    gap: 2rem;
    align-items: flex-start;
    min-width: 0;
  }

  .woocommerce-cart .woocommerce-cart-form {
    flex: 1 0 65%;
    margin: 0;
    min-width: 0;
  }

  .woocommerce-cart .cart-collaterals {
    flex: 1 0 30%;
    position: sticky;
    top: 120px;
    min-width: 0;
  }

  /* ----------------------------------------------------------
   TABLA GENERAL DEL CARRITO
   ---------------------------------------------------------- */
  .woocommerce-cart table.shop_table {
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    overflow: hidden;
    background: var(--bg-white);
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.04);
    border-collapse: separate;
    border-spacing: 0;
    width: 100%;
    min-width: 0;
    margin-bottom: 2rem;
  }

  .woocommerce-cart table.shop_table th {
    background: var(--bg-body);
    color: var(--text-main);
    font-weight: 700;
    font-size: 0.95rem;
    padding: 14px 16px;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    border-bottom: 1px solid var(--border-color);
  }

  .woocommerce-cart table.shop_table td {
    padding: 16px;
    vertical-align: middle;
    border-bottom: 1px solid var(--bg-body);
  }

  /* Miniatura del producto en Desktop */
  .woocommerce-cart table.shop_table td.product-thumbnail img {
    width: 80px;
    height: 80px;
    object-fit: contain;
    border-radius: var(--radius-md);
    background: var(--bg-body);
    border: 1px solid var(--border-color);
    padding: 4px;
    display: block;
    margin: 0 auto;
  }

  .woocommerce-cart table.shop_table td.product-name a {
    color: var(--text-main);
    font-weight: 600;
    text-decoration: none;
    font-size: 1rem;
    transition: color 0.2s ease;
  }

  .woocommerce-cart table.shop_table td.product-name a:hover {
    color: var(--primary-color);
  }

  .woocommerce-cart table.shop_table td.product-price,
  .woocommerce-cart table.shop_table td.product-subtotal {
    font-weight: 700;
    color: var(--text-main);
    font-size: 1.05rem;
  }

  /* Botón de eliminar (cruz roja) */
  .woocommerce table.cart .product-remove a.remove {
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    width: 28px !important;
    height: 28px !important;
    border-radius: 50% !important;
    color: var(--error) !important;
    background: rgba(214, 48, 49, 0.08) !important;
    font-size: 1.2rem !important;
    font-weight: 700 !important;
    text-decoration: none !important;
    line-height: 1 !important;
    transition: all 0.2s ease !important;
  }

  .woocommerce table.cart .product-remove a.remove:hover {
    background: var(--error) !important;
    color: var(--bg-white) !important;
    transform: scale(1.1);
  }

  /* Input de cantidad */
  .woocommerce-cart table.shop_table td.product-quantity .quantity input.qty {
    width: 60px;
    height: 40px;
    text-align: center;
    border: 1.5px solid var(--border-color);
    border-radius: 6px;
    font-weight: 600;
    font-size: 1rem;
    background: var(--bg-white);
  }

  /* ----------------------------------------------------------
   FILA DE ACCIONES, CUPÓN Y ACTUALIZAR CARRITO
   ---------------------------------------------------------- */
  .woocommerce-cart table.shop_table td.actions {
    padding: 1.5rem;
    background: var(--bg-body);
  }

  .woocommerce-cart table.shop_table td.actions .coupon {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    align-items: center;
    float: left;
  }

  .woocommerce-cart table.shop_table td.actions .coupon input#coupon_code {
    height: 46px;
    min-width: 200px;
    padding: 0 16px;
    border: 1.5px solid var(--border-color);
    border-radius: var(--radius-md);
    font-size: 0.95rem;
    color: var(--text-main);
    background: var(--bg-white);
    outline: none;
    transition: all 0.2s ease;
    box-sizing: border-box;
  }

  .woocommerce-cart
    table.shop_table
    td.actions
    .coupon
    input#coupon_code:focus {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(0, 78, 138, 0.12);
  }

  .woocommerce-cart
    table.shop_table
    td.actions
    .coupon
    input#coupon_code::placeholder {
    color: var(--text-light);
  }

  /* Botón Aplicar Cupón */
  .woocommerce-cart table.shop_table td.actions .coupon button.button,
  .woocommerce-cart table.shop_table td.actions .coupon input[type="submit"] {
    height: 46px;
    padding: 0 22px;
    background: var(--primary-color) !important;
    color: var(--text-white) !important;
    font-weight: 700;
    font-size: 0.95rem;
    border: none !important;
    border-radius: var(--radius-md) !important;
    cursor: pointer;
    transition: all 0.2s ease;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
  }

  .woocommerce-cart table.shop_table td.actions .coupon button.button:hover,
  .woocommerce-cart
    table.shop_table
    td.actions
    .coupon
    input[type="submit"]:hover {
    background: var(--primary-dark) !important;
    transform: translateY(-1px);
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.15);
  }

  /* Botón Actualizar Carrito */
  .woocommerce-cart table.shop_table td.actions > button.button,
  .woocommerce-cart table.shop_table td.actions > input[type="submit"] {
    height: 46px;
    padding: 0 24px;
    background: var(--bg-body) !important;
    color: var(--text-muted) !important;
    font-weight: 600;
    font-size: 0.95rem;
    border: 1px solid var(--border-color) !important;
    border-radius: var(--radius-md) !important;
    cursor: pointer;
    transition: all 0.2s ease;
    float: right;
  }

  .woocommerce-cart
    table.shop_table
    td.actions
    > button.button:hover:not(:disabled) {
    background: var(--border-color) !important;
    color: var(--text-main) !important;
    border-color: var(--text-light) !important;
  }

  .woocommerce-cart table.shop_table td.actions > button.button:disabled {
    opacity: 0.5;
    cursor: not-allowed;
  }

  /* ----------------------------------------------------------
   TOTALES DEL CARRITO (CART TOTALS)
   ---------------------------------------------------------- */
  .cart-collaterals .cart_totals,
  .cart_totals,
  .woocommerce-cart .cart-collaterals .cart_totals {
    background: var(--bg-white);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    padding: 2rem;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.04);
  }

  .cart_totals h2,
  .woocommerce-cart .cart_totals h2 {
    font-family: "Play", sans-serif;
    font-size: 1.3rem;
    font-weight: 700;
    color: var(--text-main);
    margin-bottom: 1.2rem;
    padding-bottom: 0.8rem;
    border-bottom: 2px solid var(--bg-body);
  }

  .woocommerce-cart .cart_totals table.shop_table {
    border: none;
    box-shadow: none;
    margin-bottom: 1.5rem;
  }

  .woocommerce-cart .cart_totals table.shop_table th {
    background: transparent;
    padding: 12px 0;
    color: var(--text-muted);
    font-weight: 600;
  }

  .woocommerce-cart .cart_totals table.shop_table td {
    padding: 12px 0;
    text-align: right;
    font-weight: 700;
    color: var(--text-main);
  }

  /* Botón Finalizar Compra en Totales */
  .woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    width: 100% !important;
    text-align: center !important;
    background: var(--gradient-primary) !important;
    color: var(--text-white) !important;
    font-family: "Play", sans-serif !important;
    font-weight: 700 !important;
    font-size: 1.1rem !important;
    letter-spacing: 0.5px !important;
    text-transform: uppercase !important;
    padding: 16px 24px !important;
    border-radius: var(--radius-md) !important;
    border: none !important;
    text-decoration: none !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 4px 16px rgba(0, 78, 138, 0.3) !important;
    box-sizing: border-box !important;
    cursor: pointer !important;
    line-height: 1 !important;
  }

  .woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover {
    background: var(--primary-dark) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 24px rgba(0, 78, 138, 0.45) !important;
    color: var(--text-white) !important;
  }

  /* Botón volver a tienda */
  .woocommerce-cart .return-to-shop .button {
    display: inline-flex;
    align-items: center;
    height: 46px;
    padding: 0 2rem;
    background: var(--primary-color);
    color: var(--text-white);
    border: none;
    border-radius: var(--radius-md);
    font-size: 0.95rem;
    font-weight: 600;
    text-decoration: none;
    cursor: pointer;
    transition: all 0.25s ease;
  }

  .woocommerce-cart .return-to-shop .button:hover {
    background: var(--primary-light);
    color: var(--primary-color);
  }

  /* Envío */
  .shipping-calculator-button {
    color: var(--primary-color);
    text-decoration: underline;
    font-size: 0.85rem;
  }

  /* Carrito vacío */
  .wc-empty-cart-message {
    text-align: center;
    padding: 4rem 2rem;
  }

  .wc-empty-cart-message .cart-empty {
    font-size: 1.25rem;
    color: var(--text-muted);
    margin-bottom: 1.5rem;
  }

  /* Checkout sticky desktop */
  .wc-proceed-to-checkout {
    margin-top: 1.25rem;
  }

  /* ----------------------------------------------------------
   VISTA MÓVIL (PANTALLAS <= 768px)
   ---------------------------------------------------------- */
  @media (max-width: 768px) {
    /* Anular layout flex de dos columnas en móvil */
    .woocommerce-cart .woocommerce,
    .woocommerce-cart .woocommerce-cart-form,
    .woocommerce-cart .cart-collaterals {
      display: block !important;
      width: 100% !important;
      max-width: 100% !important;
      min-width: 0 !important;
      flex: none !important;
      box-sizing: border-box !important;
    }

    /* El contenedor del shortcode debe ser ancho completo */
    .woocommerce-cart .woocommerce > div,
    .woocommerce-cart .woocommerce-cart-form,
    .woocommerce-cart .cart-collaterals,
    .woocommerce-cart .woocommerce .cart_totals,
    .woocommerce-cart .woocommerce .cart-collaterals {
      width: 100% !important;
      max-width: 100% !important;
      box-sizing: border-box !important;
    }

    /* Tabla: ancho completo sin overflow hidden */
    .woocommerce-cart table.shop_table_responsive,
    .woocommerce-cart table.shop_table {
      width: 100% !important;
      max-width: 100% !important;
      border: 1px solid var(--border-color) !important;
      border-radius: var(--radius-md) !important;
      display: block !important;
      box-sizing: border-box !important;
    }

    .woocommerce-cart table.shop_table_responsive thead,
    .woocommerce-cart table.shop_table thead {
      display: none !important;
    }

    .woocommerce-cart table.shop_table_responsive tbody,
    .woocommerce-cart table.shop_table tbody,
    .woocommerce-cart table.shop_table_responsive tfoot,
    .woocommerce-cart table.shop_table tfoot {
      display: block !important;
      width: 100% !important;
      box-sizing: border-box !important;
    }

    .woocommerce-cart
      table.shop_table_responsive
      tr.woocommerce-cart-form__cart-item,
    .woocommerce-cart table.shop_table tr.woocommerce-cart-form__cart-item {
      display: block !important;
      width: 100% !important;
      padding: 1rem !important;
      border-bottom: 8px solid var(--bg-body) !important;
      position: relative !important;
      background: var(--bg-white) !important;
      box-sizing: border-box !important;
    }

    .woocommerce-cart table.shop_table_responsive tr,
    .woocommerce-cart table.shop_table tr {
      width: 100% !important;
      box-sizing: border-box !important;
    }

    /* Botón cerrar en la esquina superior */
    .woocommerce-cart table.shop_table tr td.product-remove {
      display: block !important;
      text-align: left !important;
      padding: 0 0 10px 0 !important;
      border: none !important;
    }

    /* MOSTRAR IMAGEN DEL PRODUCTO EN MÓVILES */
    .woocommerce-cart table.shop_table_responsive tr td.product-thumbnail,
    .woocommerce-cart table.shop_table tr td.product-thumbnail,
    .woocommerce table.cart .product-thumbnail,
    .woocommerce-cart-form table.shop_table_responsive tr td.product-thumbnail,
    table.shop_table_responsive tbody tr td.product-thumbnail {
      display: flex !important;
      align-items: center !important;
      justify-content: center !important;
      padding: 12px 0 16px 0 !important;
      border-bottom: 1px dashed var(--border-color) !important;
      margin-bottom: 12px !important;
      visibility: visible !important;
      opacity: 1 !important;
      height: auto !important;
      width: 100% !important;
      box-sizing: border-box !important;
    }

    .woocommerce-cart
      table.shop_table_responsive
      tr
      td.product-thumbnail::before,
    .woocommerce-cart table.shop_table tr td.product-thumbnail::before,
    .woocommerce table.cart .product-thumbnail::before {
      display: none !important;
      content: "" !important;
    }

    .woocommerce-cart table.shop_table_responsive tr td.product-thumbnail img,
    .woocommerce-cart table.shop_table tr td.product-thumbnail img,
    .woocommerce table.cart td.product-thumbnail img,
    .woocommerce-cart table.shop_table td.product-thumbnail a img {
      display: block !important;
      width: 100% !important;
      max-width: 120px !important;
      height: auto !important;
      max-height: 120px !important;
      object-fit: contain !important;
      border-radius: 10px !important;
      background: var(--bg-body) !important;
      border: 1px solid var(--border-color) !important;
      padding: 6px !important;
      margin: 0 auto !important;
      visibility: visible !important;
      box-sizing: border-box !important;
    }

    /* Filas de detalles con etiqueta a la izquierda y valor a la derecha */
    .woocommerce-cart
      table.shop_table_responsive
      tr
      td:not(.product-thumbnail):not(.product-remove):not(.actions),
    .woocommerce-cart
      table.shop_table
      tr
      td:not(.product-thumbnail):not(.product-remove):not(.actions) {
      display: flex !important;
      justify-content: space-between !important;
      align-items: center !important;
      gap: 1rem !important;
      padding: 10px 0 !important;
      border-bottom: 1px solid var(--bg-body) !important;
      text-align: right !important;
      width: 100% !important;
      box-sizing: border-box !important;
      min-width: 0 !important;
    }

    .woocommerce-cart table.shop_table_responsive tr td::before,
    .woocommerce-cart table.shop_table tr td::before {
      font-weight: 700 !important;
      color: var(--text-main) !important;
      font-size: 0.95rem !important;
      text-align: left !important;
      flex: 0 0 auto !important;
      min-width: 0 !important;
      max-width: 50% !important;
      overflow: visible !important;
      white-space: normal !important;
      word-wrap: break-word !important;
    }

    .woocommerce-cart table.shop_table_responsive tr td > *,
    .woocommerce-cart table.shop_table tr td > * {
      min-width: 0 !important;
    }

    /* Nombre de producto: permitir ajuste de línea */
    .woocommerce-cart table.shop_table_responsive tr td.product-name a,
    .woocommerce-cart table.shop_table tr td.product-name a {
      word-wrap: break-word !important;
      overflow-wrap: break-word !important;
      white-space: normal !important;
      max-width: 100% !important;
    }

    /* Sección de cupón y actualización en móviles */
    .woocommerce-cart table.shop_table td.actions {
      display: block !important;
      width: 100% !important;
      padding: 1rem !important;
      box-sizing: border-box !important;
    }

    .woocommerce-cart table.shop_table td.actions .coupon {
      display: flex !important;
      flex-direction: row !important;
      gap: 8px !important;
      width: 100% !important;
      float: none !important;
      margin-bottom: 12px !important;
      box-sizing: border-box !important;
    }

    .woocommerce-cart table.shop_table td.actions .coupon input#coupon_code {
      flex: 1 1 55% !important;
      min-width: 0 !important;
      height: 44px !important;
      font-size: 0.9rem !important;
      padding: 0 12px !important;
      box-sizing: border-box !important;
    }

    .woocommerce-cart table.shop_table td.actions .coupon button.button,
    .woocommerce-cart table.shop_table td.actions .coupon input[type="submit"] {
      flex: 1 1 45% !important;
      min-width: 0 !important;
      height: 44px !important;
      font-size: 0.88rem !important;
      padding: 0 12px !important;
      white-space: nowrap !important;
      box-sizing: border-box !important;
    }

    .woocommerce-cart table.shop_table td.actions > button.button,
    .woocommerce-cart table.shop_table td.actions > input[type="submit"] {
      width: 100% !important;
      height: 44px !important;
      float: none !important;
      display: block !important;
      box-sizing: border-box !important;
    }

    /* Botón Finalizar Compra fijo abajo en mobile */
    .wc-proceed-to-checkout {
      position: fixed !important;
      bottom: 0 !important;
      left: 0 !important;
      right: 0 !important;
      width: 100% !important;
      z-index: 999 !important;
      background: var(--bg-white) !important;
      padding: 0.75rem 1rem !important;
      box-shadow: 0 -4px 20px rgba(0, 0, 0, 0.1) !important;
      margin: 0 !important;
      box-sizing: border-box !important;
    }

    .wc-proceed-to-checkout a {
      height: 48px !important;
      box-sizing: border-box !important;
    }

    /* Ajustar carrito vacío y mensajes */
    .woocommerce-cart .woocommerce-info,
    .woocommerce-cart .woocommerce-message,
    .woocommerce-cart .woocommerce-error,
    .wc-empty-cart-message,
    .return-to-shop {
      width: 100% !important;
      max-width: 100% !important;
      box-sizing: border-box !important;
    }
  }

  /* ----------------------------------------------------------
   MEJORAS VISUALES CARRITO Y CHECKOUT
   ---------------------------------------------------------- */

  /* 1. Animaciones de entrada en cascada */
  @keyframes slideUpFade {
    0% {
      opacity: 0;
      transform: translateY(20px);
    }
    100% {
      opacity: 1;
      transform: translateY(0);
    }
  }

  .woocommerce-cart-form__cart-item,
  tr.cart_item {
    animation: slideUpFade 0.5s ease-out forwards;
    opacity: 0;
  }

  /* Stagger animation para los primeros items */
  tr.cart_item:nth-child(1) {
    animation-delay: 0.1s;
  }
  tr.cart_item:nth-child(2) {
    animation-delay: 0.2s;
  }
  tr.cart_item:nth-child(3) {
    animation-delay: 0.3s;
  }
  tr.cart_item:nth-child(4) {
    animation-delay: 0.4s;
  }

  /* 2. Imagen de producto */
  .woocommerce table.shop_table .product-thumbnail img {
    border-radius: var(--radius-md);
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.05);
    transition:
      transform 0.3s ease,
      box-shadow 0.3s ease;
    border: 1px solid var(--border-color);
    width: 80px !important;
    height: auto !important;
    object-fit: cover;
  }

  .woocommerce table.shop_table .product-thumbnail img:hover {
    transform: scale(1.05);
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.1);
  }

  /* 3. Input de Cupón y Botón */
  .woocommerce .coupon {
    display: flex !important;
    gap: 10px;
    align-items: center;
    background: var(--bg-body);
    padding: 15px;
    border-radius: var(--radius-md);
    border: 1px solid var(--border-color);
  }

  .woocommerce .coupon input.input-text {
    border: 1px solid var(--border-color) !important;
    border-radius: var(--radius-md) !important;
    padding: 12px 15px !important;
    font-size: 15px !important;
    background-color: var(--bg-white) !important;
    transition:
      border-color 0.3s,
      box-shadow 0.3s;
    outline: none !important;
    height: 48px !important;
    flex: 1;
    min-width: 200px;
  }

  .woocommerce .coupon input.input-text:focus {
    border-color: var(--primary-color) !important;
    box-shadow: 0 0 0 3px rgba(0, 78, 138, 0.15) !important;
  }

  .woocommerce .coupon button.button {
    background: var(--primary-color) !important;
    color: var(--text-white) !important;
    border: none !important;
    border-radius: var(--radius-md) !important;
    padding: 0 24px !important;
    font-weight: 600 !important;
    letter-spacing: 0.5px;
    transition: all 0.3s ease !important;
    height: 48px !important;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  .woocommerce .coupon button.button:hover {
    background: var(--primary-dark) !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 10px rgba(0, 78, 138, 0.3) !important;
  }

  /* 4. Alertas de WooCommerce */
  .woocommerce-error,
  .woocommerce-info,
  .woocommerce-message {
    border-radius: var(--radius-md) !important;
    padding: 15px 25px 15px 55px !important;
    margin: 0 0 2em !important;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.05) !important;
    font-weight: 500 !important;
    animation: slideUpFade 0.4s ease-out forwards;
    background-color: var(--bg-white) !important;
    border: none !important;
    border-left: 5px solid var(--text-main) !important;
    position: relative;
    backdrop-filter: blur(10px);
  }

  .woocommerce-error::before,
  .woocommerce-info::before,
  .woocommerce-message::before {
    top: 50% !important;
    transform: translateY(-50%) !important;
    left: 20px !important;
    font-size: 1.2em !important;
  }

  /* Error */
  .woocommerce-error {
    border-left-color: var(--error) !important;
    background: linear-gradient(
      90deg,
      rgba(214, 48, 49, 0.06) 0%,
      rgba(255, 255, 255, 1) 100%
    ) !important;
    color: var(--error) !important;
  }

  .woocommerce-error::before {
    color: var(--error) !important;
  }

  /* Success (Message) */
  .woocommerce-message {
    border-left-color: var(--success) !important;
    background: linear-gradient(
      90deg,
      rgba(39, 174, 96, 0.06) 0%,
      rgba(255, 255, 255, 1) 100%
    ) !important;
    color: var(--success) !important;
  }

  .woocommerce-message::before {
    color: var(--success) !important;
  }

  /* Botón "Ver carrito" dentro del mensaje de éxito */
  .woocommerce-message .button.wc-forward,
  .woocommerce-message a.button.wc-forward {
    background-color: var(--primary-color) !important;
    color: var(--text-white) !important;
    padding: 8px 16px !important;
    border-radius: 6px !important;
    text-decoration: none !important;
    font-weight: 600 !important;
    font-size: 0.9rem !important;
    margin-left: 10px !important;
    display: inline-block !important;
    transition: all 0.2s ease !important;
    border: none !important;
    box-shadow: 0 2px 8px rgba(0, 78, 138, 0.25) !important;
  }

  .woocommerce-message .button.wc-forward:hover,
  .woocommerce-message a.button.wc-forward:hover {
    background-color: var(--primary-dark) !important;
    color: var(--text-white) !important;
    transform: translateY(-1px) !important;
    box-shadow: 0 4px 12px rgba(0, 78, 138, 0.35) !important;
  }

  /* Info */
  .woocommerce-info {
    border-left-color: var(--secondary-color) !important;
    background: linear-gradient(
      90deg,
      rgba(0, 166, 166, 0.06) 0%,
      rgba(255, 255, 255, 1) 100%
    ) !important;
    color: var(--text-main) !important;
  }

  .woocommerce-info::before {
    color: var(--secondary-color) !important;
  }

  /* Fix delete button spacing in cart */
  .woocommerce table.shop_table a.remove {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    width: 28px !important;
    height: 28px !important;
    border-radius: 50% !important;
    background: rgba(214, 48, 49, 0.06) !important;
    color: var(--error) !important;
    border: 1px solid rgba(214, 48, 49, 0.25) !important;
    font-size: 16px !important;
    font-weight: bold !important;
    transition: all 0.2s ease !important;
    text-decoration: none !important;
    line-height: 1 !important;
  }

  .woocommerce table.shop_table a.remove:hover {
    background: var(--error) !important;
    color: #fff !important;
    border-color: var(--error) !important;
    transform: scale(1.1);
  }

  /* ----------------------------------------------------------
   RESET FINAL: prevenir desbordamiento horizontal en móvil
   ---------------------------------------------------------- */
  @media (max-width: 768px) {
    /* Forzar que todo el stack del carrito sea block y 100% */
    .woocommerce-cart .woocommerce,
    .woocommerce-cart .woocommerce > div,
    .woocommerce-cart .woocommerce-cart-form,
    .woocommerce-cart .cart-collaterals,
    .woocommerce-cart .cart-collaterals .cart_totals,
    .woocommerce-cart .woocommerce .cart_totals,
    .woocommerce-cart-form,
    .woocommerce-cart-form__contents,
    .woocommerce-cart table.shop_table,
    .woocommerce-cart table.shop_table_responsive,
    .woocommerce-cart table.shop_table.cart,
    .woocommerce-cart table.shop_table.woocommerce-cart-form__contents,
    .woocommerce-cart table.shop_table_responsive.cart,
    .woocommerce-cart
      table.shop_table_responsive.woocommerce-cart-form__contents,
    .woocommerce-cart-form table.shop_table,
    .woocommerce-cart-form table.shop_table_responsive,
    .woocommerce-cart-form table.shop_table.cart,
    .woocommerce-cart-form table.shop_table.woocommerce-cart-form__contents,
    .woocommerce-cart-form table.shop_table_responsive.cart,
    .woocommerce-cart-form
      table.shop_table_responsive.woocommerce-cart-form__contents {
      display: block !important;
      width: 100% !important;
      max-width: 100% !important;
      min-width: 0 !important;
      float: none !important;
      box-sizing: border-box !important;
    }

    .woocommerce-cart table.shop_table thead,
    .woocommerce-cart table.shop_table tbody,
    .woocommerce-cart table.shop_table tfoot,
    .woocommerce-cart table.shop_table tr,
    .woocommerce-cart table.shop_table th,
    .woocommerce-cart table.shop_table td,
    .woocommerce-cart table.shop_table_responsive thead,
    .woocommerce-cart table.shop_table_responsive tbody,
    .woocommerce-cart table.shop_table_responsive tfoot,
    .woocommerce-cart table.shop_table_responsive tr,
    .woocommerce-cart table.shop_table_responsive th,
    .woocommerce-cart table.shop_table_responsive td,
    .woocommerce-cart-form table.shop_table thead,
    .woocommerce-cart-form table.shop_table tbody,
    .woocommerce-cart-form table.shop_table tfoot,
    .woocommerce-cart-form table.shop_table tr,
    .woocommerce-cart-form table.shop_table th,
    .woocommerce-cart-form table.shop_table td,
    .woocommerce-cart-form table.shop_table_responsive thead,
    .woocommerce-cart-form table.shop_table_responsive tbody,
    .woocommerce-cart-form table.shop_table_responsive tfoot,
    .woocommerce-cart-form table.shop_table_responsive tr,
    .woocommerce-cart-form table.shop_table_responsive th,
    .woocommerce-cart-form table.shop_table_responsive td {
      display: block !important;
      width: 100% !important;
      max-width: 100% !important;
      min-width: 0 !important;
      box-sizing: border-box !important;
    }

    .woocommerce-cart table.shop_table thead,
    .woocommerce-cart table.shop_table_responsive thead,
    .woocommerce-cart-form table.shop_table thead,
    .woocommerce-cart-form table.shop_table_responsive thead,
    .woocommerce-cart table.shop_table tbody th,
    .woocommerce-cart table.shop_table_responsive tbody th,
    .woocommerce-cart-form table.shop_table tbody th,
    .woocommerce-cart-form table.shop_table_responsive tbody th,
    .woocommerce-cart table.shop_table td.actions::before,
    .woocommerce-cart table.shop_table_responsive td.actions::before,
    .woocommerce-cart-form table.shop_table td.actions::before,
    .woocommerce-cart-form table.shop_table_responsive td.actions::before,
    .woocommerce-cart table.shop_table td.product-remove::before,
    .woocommerce-cart table.shop_table_responsive td.product-remove::before,
    .woocommerce-cart-form table.shop_table td.product-remove::before,
    .woocommerce-cart-form
      table.shop_table_responsive
      td.product-remove::before {
      display: none !important;
    }

    .woocommerce-cart table.shop_table td::before,
    .woocommerce-cart table.shop_table_responsive td::before,
    .woocommerce-cart-form table.shop_table td::before,
    .woocommerce-cart-form table.shop_table_responsive td::before {
      display: block !important;
      width: 100% !important;
      max-width: 100% !important;
      float: none !important;
      text-align: left !important;
      margin-bottom: 0.25rem !important;
      box-sizing: border-box !important;
    }

    .woocommerce-cart table.shop_table td > *,
    .woocommerce-cart table.shop_table_responsive td > *,
    .woocommerce-cart-form table.shop_table td > *,
    .woocommerce-cart-form table.shop_table_responsive td > *,
    .woocommerce-cart table.shop_table td a,
    .woocommerce-cart table.shop_table_responsive td a,
    .woocommerce-cart-form table.shop_table td a,
    .woocommerce-cart-form table.shop_table_responsive td a,
    .woocommerce-cart table.shop_table td .quantity,
    .woocommerce-cart table.shop_table_responsive td .quantity,
    .woocommerce-cart-form table.shop_table td .quantity,
    .woocommerce-cart-form table.shop_table_responsive td .quantity,
    .woocommerce-cart table.shop_table td .amount,
    .woocommerce-cart table.shop_table_responsive td .amount,
    .woocommerce-cart-form table.shop_table td .amount,
    .woocommerce-cart-form table.shop_table_responsive td .amount {
      max-width: 100% !important;
      box-sizing: border-box !important;
    }

    .woocommerce-cart table.shop_table td img,
    .woocommerce-cart table.shop_table_responsive td img,
    .woocommerce-cart-form table.shop_table td img,
    .woocommerce-cart-form table.shop_table_responsive td img,
    .woocommerce-cart table.shop_table .product-thumbnail img,
    .woocommerce-cart table.shop_table_responsive .product-thumbnail img,
    .woocommerce-cart-form table.shop_table .product-thumbnail img,
    .woocommerce-cart-form table.shop_table_responsive .product-thumbnail img {
      width: 100% !important;
      max-width: 120px !important;
      height: auto !important;
      margin-left: auto !important;
      margin-right: auto !important;
    }

    .woocommerce-cart table.shop_table td input.qty,
    .woocommerce-cart table.shop_table_responsive td input.qty,
    .woocommerce-cart-form table.shop_table td input.qty,
    .woocommerce-cart-form table.shop_table_responsive td input.qty {
      width: 80px !important;
      max-width: 100% !important;
    }
  }

  /* ----------------------------------------------------------
   OVERRIDE CSS DE PLUGIN (WooCommerce general/layout):
   WooCommerce carga table.shop_table / .form-row fuera de
   @layer (border-radius:5px, bordes, padding, etc.). Al ser
   reglas de capa con !important las vencemos y aseguramos el
   look & feel Vetbox (misma lógica que el bloque de botones
   fuera de @layer que usa mochilas-premium).
   ---------------------------------------------------------- */
  .woocommerce-cart table.shop_table {
    border: 1px solid var(--border-color) !important;
    border-radius: var(--radius-md) !important;
    overflow: hidden !important;
    background: var(--bg-white) !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.04) !important;
  }

  .woocommerce-cart table.shop_table th {
    background: var(--bg-body) !important;
    color: var(--text-main) !important;
    font-weight: 700 !important;
    padding: 14px 16px !important;
    border-bottom: 1px solid var(--border-color) !important;
  }

  .woocommerce-cart table.shop_table td {
    padding: 16px !important;
    vertical-align: middle !important;
    border-bottom: 1px solid var(--bg-body) !important;
  }

  .woocommerce-cart table.shop_table td.product-thumbnail img {
    border-radius: var(--radius-md) !important;
    background: var(--bg-body) !important;
    border: 1px solid var(--border-color) !important;
    padding: 4px !important;
  }

  .woocommerce-cart
    table.shop_table
    td.product-quantity
    .quantity
    input.qty {
    border: 1.5px solid var(--border-color) !important;
    border-radius: 6px !important;
    background: var(--bg-white) !important;
  }

  .woocommerce-cart table.shop_table td.actions .coupon input#coupon_code {
    border: 1.5px solid var(--border-color) !important;
    border-radius: var(--radius-md) !important;
    background: var(--bg-white) !important;
  }

  .woocommerce .cart-collaterals .cart_totals,
  .woocommerce-page .cart-collaterals .cart_totals,
  .cart-collaterals .cart_totals,
  .cart_totals,
  .woocommerce-cart .cart-collaterals .cart_totals {
    float: right;
    width: 100% !important;
    background: var(--bg-white) !important;
    border: 1px solid var(--border-color) !important;
    border-radius: var(--radius-md) !important;
    padding: 2rem !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.04) !important;
  }

  .woocommerce-cart .cart_totals table.shop_table {
    border: none !important;
    box-shadow: none !important;
    margin-bottom: 1.5rem !important;
  }

  .woocommerce-cart .cart_totals table.shop_table th {
    background: transparent !important;
    padding: 12px 0 !important;
    border-bottom: none !important;
  }

  .woocommerce-cart .cart_totals table.shop_table td {
    padding: 12px 0 !important;
    border-bottom: none !important;
  }
}

/* ==========================================================
   CHECKOUT: Estilos del checkout WooCommerce
   Basado en mochilas-premium (a su vez porta-seguro-custom),
   adaptado a Vetbox
   ========================================================== */
@layer checkout {
  /* ----------------------------------------------------------
   CHECKOUT: Estilos del checkout WooCommerce
   ---------------------------------------------------------- */
  .checkout-custom {
    padding: 2rem 0 4rem 0;
  }

  /* Layout principal en grid 2 columnas para Desktop */
  .checkout.woocommerce-checkout {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2rem;
  }

  .col2-set {
    float: none;
    width: 100%;
    margin: 0;
    padding: 0;
    display: grid;
    grid-template-columns: 1fr;
  }

  .col2-set .col-1 {
    width: 100% !important;
  }

  .col2-set .col-2 {
    width: 100% !important;
  }

  @media (max-width: 991px) {
    .checkout.woocommerce-checkout {
      grid-template-columns: 1fr;
      gap: 1.5rem;
    }
  }

  /* Formulario en grid 7/5 para desktop */
  @media (min-width: 992px) {
    .woocommerce-checkout form.checkout {
      display: grid;
      grid-template-columns: 7fr 5fr;
      gap: 2.5rem;
      align-items: start;
    }
  }

  /* Títulos del checkout */
  .woocommerce-checkout h3 {
    font-family: "Play", sans-serif;
    font-size: 1.25rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    margin-bottom: 1.25rem;
    border-bottom: 2px solid var(--border-color);
    padding-bottom: 0.5rem;
    color: var(--text-main);
  }

  /* Campos del formulario */
  .woocommerce-checkout .form-row input.input-text,
  .woocommerce-checkout .form-row select,
  .woocommerce-checkout .form-row textarea {
    width: 100%;
    padding: 0.75rem 0.9rem;
    border: 1.5px solid var(--border-color);
    border-radius: var(--radius-md);
    background-color: var(--bg-white);
    font-size: 0.92rem;
    color: var(--text-main);
    transition:
      border-color 0.2s,
      box-shadow 0.2s;
  }

  .woocommerce-checkout .form-row input.input-text:focus,
  .woocommerce-checkout .form-row select:focus,
  .woocommerce-checkout .form-row textarea:focus {
    border-color: var(--primary-color);
    box-shadow: 0 0 0 3px rgba(0, 78, 138, 0.15);
    outline: none;
  }

  .woocommerce-checkout .form-row {
    margin-bottom: 1.15rem !important;
  }

  .woocommerce-checkout .form-row label {
    font-weight: 600;
    font-size: 0.88rem;
    color: var(--text-muted);
    margin-bottom: 0.3rem;
    display: block;
  }

  /* Resumen del pedido */
  #order_review_heading {
    display: none;
  }

  #order_review {
    background: var(--bg-white);
    border: 1px solid var(--border-color);
    border-radius: var(--radius-md);
    padding: 1.75rem 1.5rem;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04);
  }

  /* Tabla de resumen */
  .shop_table.woocommerce-checkout-review-order-table {
    width: 100%;
    border-collapse: collapse;
    margin-bottom: 1.25rem;
    table-layout: auto;
  }

  .shop_table.woocommerce-checkout-review-order-table thead th {
    font-family: "Play", sans-serif;
    font-size: 0.95rem;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: var(--text-main);
    font-weight: 700;
    border-bottom: 2px solid var(--border-color);
    padding: 0.75rem 0.5rem 0.75rem 0;
    text-align: left;
  }

  .shop_table.woocommerce-checkout-review-order-table thead th.product-total {
    text-align: right;
    padding-right: 0.5rem;
  }

  .shop_table.woocommerce-checkout-review-order-table tbody td {
    padding: 0.85rem 0;
    border-bottom: 1px solid var(--bg-body);
    vertical-align: middle;
  }

  .shop_table.woocommerce-checkout-review-order-table tbody td.product-total {
    text-align: right;
    font-family: "Play", sans-serif;
    font-weight: 700;
    font-size: 0.9rem;
    color: var(--text-main);
    white-space: nowrap;
    padding-left: 0.75rem;
    padding-right: 0.5rem;
    width: 1%;
  }

  /* Miniatura y detalle del producto */
  .checkout-product-item {
    display: flex;
    align-items: center;
    gap: 12px;
    text-align: left;
  }

  .checkout-product-thumb {
    width: 52px;
    height: 52px;
    min-width: 52px;
    flex-shrink: 0;
    border-radius: var(--radius-md);
    overflow: hidden;
    background: var(--bg-body);
    border: 1px solid var(--border-color);
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.04);
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .checkout-product-thumb img,
  .checkout-product-thumb .checkout-item-thumb-img,
  .checkout-product-img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    border-radius: 7px;
  }

  .checkout-product-details {
    display: flex;
    flex-direction: column;
    gap: 3px;
    flex: 1;
    min-width: 0;
  }

  .checkout-product-name,
  .checkout-product-name a {
    font-family: "Play", sans-serif;
    font-size: 0.82rem;
    font-weight: 700;
    color: var(--text-main);
    line-height: 1.25;
    text-decoration: none;
    transition: color 0.2s;
    display: -webkit-box;
    line-clamp: 2;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }

  .checkout-product-name a:hover {
    color: var(--primary-color);
  }

  .checkout-product-meta-row {
    display: flex;
    align-items: center;
    gap: 6px;
    font-size: 0.78rem;
    color: var(--text-muted);
  }

  .checkout-product-qty-badge {
    background: var(--bg-body);
    color: var(--text-main);
    font-weight: 700;
    font-size: 0.72rem;
    padding: 1px 7px;
    border-radius: 9999px;
    border: 1px solid var(--border-color);
    display: inline-flex;
    align-items: center;
    white-space: nowrap;
  }

  .checkout-product-unit-price {
    font-weight: 600;
    color: var(--text-muted);
    font-size: 0.78rem;
    white-space: nowrap;
  }

  /* Filas de totales, envío y cupón */
  .shop_table.woocommerce-checkout-review-order-table tfoot th,
  .shop_table.woocommerce-checkout-review-order-table tfoot td {
    padding: 0.75rem 0.5rem 0.75rem 0;
    border-bottom: 1px solid var(--border-color);
    font-size: 0.9rem;
  }

  .shop_table.woocommerce-checkout-review-order-table tfoot th {
    color: var(--text-muted);
    font-weight: 600;
    text-align: left;
  }

  .shop_table.woocommerce-checkout-review-order-table tfoot td {
    text-align: right;
    font-weight: 700;
    color: var(--text-main);
    padding-right: 0.5rem;
  }

  .shop_table.woocommerce-checkout-review-order-table tfoot tr.order-total th,
  .shop_table.woocommerce-checkout-review-order-table tfoot tr.order-total td {
    font-family: "Play", sans-serif;
    font-size: 1.15rem;
    font-weight: 800;
    color: var(--text-main);
    border-top: 2px solid var(--text-main);
    border-bottom: none;
    padding-top: 1rem;
  }

  .shop_table.woocommerce-checkout-review-order-table
    tfoot
    tr.order-total
    td
    strong,
  .shop_table.woocommerce-checkout-review-order-table
    tfoot
    tr.order-total
    td
    .amount {
    font-size: 1.15rem !important;
    color: var(--primary-color);
  }

  /* Envío / métodos */
  .woocommerce-shipping-totals ul#shipping_method {
    list-style: none;
    padding: 0;
    margin: 0;
  }

  .woocommerce-shipping-totals ul#shipping_method li {
    margin-bottom: 0.5rem;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 0.5rem;
  }

  /* Pasarelas de pago */
  #payment {
    background: transparent !important;
    border: none !important;
    padding: 0 !important;
  }

  #payment ul.payment_methods {
    list-style: none;
    padding: 0;
    margin: 0 0 1.25rem 0;
    border-bottom: 1px solid var(--border-color);
    padding-bottom: 1rem;
  }

  #payment ul.payment_methods li {
    margin-bottom: 0.6rem;
  }

  #payment div.payment_box {
    background: var(--bg-body) !important;
    border: 1px solid var(--border-color) !important;
    border-radius: var(--radius-md) !important;
    padding: 0.85rem 1rem !important;
    margin: 0.5rem 0 !important;
    font-size: 0.88rem !important;
    color: var(--text-muted) !important;
  }

  #payment div.payment_box::before {
    display: none !important;
  }

  /* Botón Realizar Pedido */
  .woocommerce-checkout #place_order {
    width: 100% !important;
    background: var(--gradient-primary) !important;
    color: var(--text-white) !important;
    padding: 1.1rem 1.5rem !important;
    font-family: "Play", sans-serif !important;
    font-size: 1.2rem !important;
    font-weight: 700 !important;
    letter-spacing: 0.75px !important;
    text-transform: uppercase !important;
    border: none !important;
    border-radius: var(--radius-md) !important;
    cursor: pointer !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 10px !important;
    box-shadow: 0 4px 16px rgba(0, 78, 138, 0.3) !important;
    transition: all 0.3s ease !important;
  }

  .woocommerce-checkout #place_order:hover {
    background: var(--primary-dark) !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 24px rgba(0, 78, 138, 0.45) !important;
    color: var(--text-white) !important;
  }

  .woocommerce-checkout #place_order:active {
    transform: translateY(0) !important;
  }

  /* Responsive checkout */
  @media (max-width: 768px) {
    #order_review {
      padding: 1.15rem 1rem;
    }

    .checkout-product-thumb {
      width: 46px;
      height: 46px;
      min-width: 46px;
    }

    .checkout-product-name {
      font-size: 0.78rem;
    }

    .woocommerce-checkout #place_order {
      font-size: 1.05rem !important;
      padding: 0.95rem !important;
    }
  }

  /* Checkbox Boleta/Factura y campos condicionales */
  #billing_tipo_documento_field {
    margin: 1.5rem 0 1.25rem !important;
    padding: 1.1rem 1.25rem;
    background: linear-gradient(
      90deg,
      rgba(0, 78, 138, 0.06) 0%,
      rgba(255, 255, 255, 1) 100%
    );
    border: 1.5px solid rgba(0, 78, 138, 0.2);
    border-radius: 10px;
    position: relative;
  }

  #billing_tipo_documento_field::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    width: 4px;
    background: var(--primary-color);
    border-radius: 10px 0 0 10px;
  }

  #billing_tipo_documento_field label {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--text-main);
    cursor: pointer;
    margin-bottom: 0;
    position: relative;
    z-index: 1;
  }

  #billing_tipo_documento_field input[type="checkbox"].input-checkbox {
    width: 22px;
    height: 22px;
    min-width: 22px;
    border: 2px solid var(--border-color);
    border-radius: 5px;
    background: var(--bg-white);
    cursor: pointer;
    accent-color: var(--primary-color);
    margin: 0;
    flex-shrink: 0;
  }

  #billing_tipo_documento_field input[type="checkbox"].input-checkbox:checked {
    border-color: var(--primary-color);
    background-color: rgba(0, 78, 138, 0.1);
  }

  #billing_tipo_documento_field label .required {
    color: var(--error);
    margin-left: 0.25rem;
  }

  /* Campos de factura con transición suave */
  #billing_rut_empresa_field,
  #billing_razon_social_field,
  #billing_giro_comercial_field {
    transition:
      opacity 0.3s ease,
      transform 0.3s ease,
      max-height 0.3s ease;
    max-height: 200px;
    opacity: 1;
    transform: translateY(0);
  }

  #billing_rut_empresa_field[style*="none"],
  #billing_razon_social_field[style*="none"],
  #billing_giro_comercial_field[style*="none"] {
    max-height: 0;
    opacity: 0;
    transform: translateY(-10px);
    margin: 0 !important;
    padding: 0 !important;
    overflow: hidden;
  }

  /* ----------------------------------------------------------
   OVERRIDE CSS DE PLUGIN (WooCommerce general/layout):
   Misma lógica que en el carrito: forzamos inputs, resumen y
   tabla de revisión con !important dentro de la capa para
   vencer a los estilos de WooCommerce cargados fuera de
   @layer y mantener el look & feel Vetbox.
   ---------------------------------------------------------- */
  .woocommerce-checkout .form-row input.input-text,
  .woocommerce-checkout .form-row select,
  .woocommerce-checkout .form-row textarea {
    border: 1.5px solid var(--border-color) !important;
    border-radius: var(--radius-md) !important;
    background-color: var(--bg-white) !important;
    padding: 0.75rem 0.9rem !important;
    font-size: 0.92rem !important;
    color: var(--text-main) !important;
  }

  .woocommerce-checkout .form-row label {
    font-weight: 600 !important;
    font-size: 0.88rem !important;
    color: var(--text-muted) !important;
  }

  #order_review {
    background: var(--bg-white) !important;
    border: 1px solid var(--border-color) !important;
    border-radius: var(--radius-md) !important;
    padding: 1.75rem 1.5rem !important;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.04) !important;
  }

  .shop_table.woocommerce-checkout-review-order-table thead th {
    border-bottom: 2px solid var(--border-color) !important;
    padding: 0.75rem 0.5rem 0.75rem 0 !important;
  }

  .shop_table.woocommerce-checkout-review-order-table tbody td {
    padding: 0.85rem 0 !important;
    border-bottom: 1px solid var(--bg-body) !important;
  }

  .shop_table.woocommerce-checkout-review-order-table tfoot th,
  .shop_table.woocommerce-checkout-review-order-table tfoot td {
    padding: 0.75rem 0.5rem 0.75rem 0 !important;
    border-bottom: 1px solid var(--border-color) !important;
  }
}

/* ==========================================================
 OVERRIDE PASARELA: botones Finalizar Compra y Realizar Pedido
 WooCommerce carga .button.alt fuera de @layer, por lo que
 las reglas con !important dentro del layer no alcanzan a
 vencerlo en todos los casos. Este bloque queda fuera de todo
 @layer para asegurar la aplicación del look & feel Vetbox.
 (Misma convención que mochilas-premium)
 ========================================================== */
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button.button.alt,
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button {
  background: var(--gradient-primary) !important;
  background-color: var(--primary-color) !important;
  color: var(--text-white) !important;
}

.woocommerce-cart .wc-proceed-to-checkout a.checkout-button.button.alt:hover,
.woocommerce-cart .wc-proceed-to-checkout a.checkout-button:hover {
  background: var(--primary-dark) !important;
  background-color: var(--primary-dark) !important;
  color: var(--text-white) !important;
}

/* OVERRIDE CHECKOUT: botón Realizar Pedido (#place_order) */
body.woocommerce-checkout .woocommerce-checkout #place_order,
.woocommerce-checkout #place_order {
  background: var(--gradient-primary) !important;
  background-color: var(--primary-color) !important;
  color: var(--text-white) !important;
}

body.woocommerce-checkout .woocommerce-checkout #place_order:hover,
.woocommerce-checkout #place_order:hover {
  background: var(--primary-dark) !important;
  background-color: var(--primary-dark) !important;
  color: var(--text-white) !important;
}