/* ============================================================
   CRL PARTS · CARRITO · v2 REFACTORIZADO
   ------------------------------------------------------------
   Reemplaza por completo la version anterior.
   Cada selector aparece UNA sola vez.
   ------------------------------------------------------------
   ESTRUCTURA
   Container            .crl-cart
     Column 2/3         .crl-cart-main
       Woo Notices
       Woo Cart Table   .crl-cart-table
       Title            .crl-cart-title
       Woo Cart Coupons .crl-cart-coupon
       Title            .crl-cart-title
       Woo Cart Shipping .crl-cart-shipping
     Column 1/3         .crl-cart-summary
       Title            .crl-cart-title
       Woo Cart Totals  .crl-cart-totals
       Boton            .crl-btn-checkout
       Boton            .crl-btn-update
   ------------------------------------------------------------
   INDICE
   1. Contenedor y columnas
   2. Titulos
   3. Tabla de productos
   4. Cantidad y eliminar
   5. Cupon
   6. Informacion de envio
   7. Resumen de totales
   8. Botones
   9. Responsive
   ============================================================ */


/* ============================================================
   1. CONTENEDOR Y COLUMNAS
   ============================================================ */

html body .crl-cart .fusion-row {
  max-width: 1280px !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
  padding-left: 40px !important;
  padding-right: 40px !important;
  box-sizing: border-box !important;
}

html body .crl-cart-main {
  background: #FFFFFF !important;
  border: 1px solid #E5E7EB !important;
  border-radius: 12px !important;
  padding: 28px !important;
  box-sizing: border-box !important;
  min-width: 0 !important;
}

html body .crl-cart-summary {
  background: #FFFFFF !important;
  border: 1px solid #E5E7EB !important;
  border-radius: 12px !important;
  padding: 24px !important;
  box-sizing: border-box !important;
  min-width: 0 !important;
  align-self: flex-start !important;
}


/* ============================================================
   2. TITULOS
   ------------------------------------------------------------
   Misma clase, dos estilos segun la columna donde vive.
   ============================================================ */

/* Titulo del resumen · grande con separador */
html body .crl-cart-summary .crl-cart-title,
html body .crl-cart-summary .crl-cart-title h1,
html body .crl-cart-summary .crl-cart-title h2,
html body .crl-cart-summary .crl-cart-title h3,
html body .crl-cart-summary .crl-cart-title .fusion-title-heading {
  font-family: 'Roboto', sans-serif !important;
  font-size: 16px !important;
  font-weight: 900 !important;
  color: #05080D !important;
  letter-spacing: -0.3px !important;
  line-height: 1.3 !important;
  text-transform: none !important;
  margin: 0 0 18px 0 !important;
  padding: 0 0 14px 0 !important;
  border-bottom: 1px solid #E5E7EB !important;
}

/* Titulos de seccion · pequenos en mayusculas, sin separador */
html body .crl-cart-main .crl-cart-title {
  margin: 26px 0 12px 0 !important;
  padding: 0 !important;
  border: none !important;
}

html body .crl-cart-main .crl-cart-title h1,
html body .crl-cart-main .crl-cart-title h2,
html body .crl-cart-main .crl-cart-title h3,
html body .crl-cart-main .crl-cart-title .fusion-title-heading {
  font-family: 'Roboto', sans-serif !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  color: #05080D !important;
  letter-spacing: 1px !important;
  line-height: 1.3 !important;
  text-transform: uppercase !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
}

html body .crl-cart-main .crl-cart-title .fusion-sep-none,
html body .crl-cart-main .crl-cart-title .title-sep-container,
html body .crl-cart-summary .crl-cart-title .title-sep-container {
  display: none !important;
}


/* ============================================================
   3. TABLA DE PRODUCTOS
   ============================================================ */

html body .crl-cart-table table,
html body .crl-cart-table table.shop_table {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  border-collapse: collapse !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body .crl-cart-table table thead tr {
  background: transparent !important;
  border: none !important;
  border-bottom: 1px solid #E5E7EB !important;
}

html body .crl-cart-table table th {
  font-family: 'Roboto', sans-serif !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  color: #6B7280 !important;
  letter-spacing: 0.6px !important;
  text-transform: uppercase !important;
  text-align: left !important;
  padding: 0 12px 14px 12px !important;
  border: none !important;
  background: transparent !important;
}

html body .crl-cart-table table tbody tr {
  background: transparent !important;
  border: none !important;
  border-bottom: 1px solid #E5E7EB !important;
}

html body .crl-cart-table table tbody tr:last-child {
  border-bottom: none !important;
}

html body .crl-cart-table table td {
  padding: 18px 12px !important;
  border: none !important;
  background: transparent !important;
  vertical-align: middle !important;
  font-family: 'Roboto', sans-serif !important;
  font-size: 14px !important;
  color: #4B5563 !important;
}

html body .crl-cart-table td.product-thumbnail {
  width: 86px !important;
  padding-left: 0 !important;
}

html body .crl-cart-table td.product-thumbnail img {
  width: 70px !important;
  height: 70px !important;
  object-fit: contain !important;
  padding: 6px !important;
  box-sizing: border-box !important;
  background: #F5F7FA !important;
  border: 1px solid #E5E7EB !important;
  border-radius: 8px !important;
  display: block !important;
}

html body .crl-cart-table td.product-name,
html body .crl-cart-table td.product-name a {
  font-family: 'Roboto', sans-serif !important;
  font-size: 14px !important;
  font-weight: 600 !important;
  color: #05080D !important;
  line-height: 1.4 !important;
  text-decoration: none !important;
  transition: color 0.2s ease !important;
}

html body .crl-cart-table td.product-name a:hover {
  color: #075DA7 !important;
}

html body .crl-cart-table td.product-price,
html body .crl-cart-table td.product-price .amount {
  font-size: 14px !important;
  font-weight: 400 !important;
  color: #4B5563 !important;
}

html body .crl-cart-table td.product-subtotal,
html body .crl-cart-table td.product-subtotal .amount,
html body .crl-cart-table td.product-subtotal bdi {
  font-size: 15px !important;
  font-weight: 800 !important;
  color: #05080D !important;
}


/* ============================================================
   4. CANTIDAD Y ELIMINAR
   ============================================================ */

html body .crl-cart-table .quantity,
html body .crl-cart-table .quantity.buttons_added {
  display: inline-flex !important;
  align-items: center !important;
  background: #FFFFFF !important;
  border: 1px solid #E5E7EB !important;
  border-radius: 6px !important;
  overflow: hidden !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
}

html body .crl-cart-table .quantity input.qty {
  width: 46px !important;
  height: 34px !important;
  text-align: center !important;
  font-family: 'Roboto', sans-serif !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #05080D !important;
  background: #FFFFFF !important;
  border: none !important;
  border-left: 1px solid #E5E7EB !important;
  border-right: 1px solid #E5E7EB !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
  -moz-appearance: textfield !important;
}

html body .crl-cart-table .quantity input.qty::-webkit-outer-spin-button,
html body .crl-cart-table .quantity input.qty::-webkit-inner-spin-button {
  -webkit-appearance: none !important;
  margin: 0 !important;
}

html body .crl-cart-table .quantity input.minus,
html body .crl-cart-table .quantity input.plus,
html body .crl-cart-table .quantity .minus,
html body .crl-cart-table .quantity .plus {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 34px !important;
  height: 34px !important;
  background: #FFFFFF !important;
  background-color: #FFFFFF !important;
  color: #05080D !important;
  font-family: 'Roboto', sans-serif !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  border: none !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  margin: 0 !important;
  cursor: pointer !important;
  transition: background 0.2s ease !important;
}

html body .crl-cart-table .quantity input.minus:hover,
html body .crl-cart-table .quantity input.plus:hover,
html body .crl-cart-table .quantity .minus:hover,
html body .crl-cart-table .quantity .plus:hover {
  background: #F5F7FA !important;
  background-color: #F5F7FA !important;
  color: #075DA7 !important;
}

html body .crl-cart-table a.remove {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 28px !important;
  height: 28px !important;
  background: transparent !important;
  border-radius: 50% !important;
  color: #94A3B8 !important;
  font-size: 18px !important;
  font-weight: 400 !important;
  line-height: 1 !important;
  text-decoration: none !important;
  transition: background 0.2s ease, color 0.2s ease !important;
}

html body .crl-cart-table a.remove:hover {
  background: #FEE2E2 !important;
  color: #B91C1C !important;
}

/* Boton nativo de actualizar dentro de la tabla */
html body .crl-cart-table button[name="update_cart"],
html body .crl-cart-table input[name="update_cart"] {
  display: none !important;
}


/* ============================================================
   5. CUPON
   ============================================================ */

html body .crl-cart-coupon,
html body .crl-cart-coupon.coupon {
  display: flex !important;
  align-items: center !important;
  flex-wrap: nowrap !important;
  gap: 8px !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  background: transparent !important;
}

html body .crl-cart-coupon input[type="text"],
html body .crl-cart-coupon input#coupon_code {
  flex: 1 1 auto !important;
  width: auto !important;
  min-width: 0 !important;
  height: 44px !important;
  padding: 0 14px !important;
  font-family: 'Roboto', sans-serif !important;
  font-size: 13px !important;
  color: #05080D !important;
  background: #FFFFFF !important;
  border: 1px solid #E5E7EB !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
  transition: border-color 0.2s ease !important;
}

html body .crl-cart-coupon input[type="text"]:focus {
  border-color: #075DA7 !important;
  outline: none !important;
}

html body .crl-cart-coupon button,
html body .crl-cart-coupon button.button {
  flex: 0 0 auto !important;
  height: 44px !important;
  padding: 0 22px !important;
  background: #05080D !important;
  background-color: #05080D !important;
  background-image: none !important;
  border: none !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  color: #FFFFFF !important;
  font-family: 'Roboto', sans-serif !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  text-transform: none !important;
  white-space: nowrap !important;
  cursor: pointer !important;
  transition: background 0.25s ease !important;
}

html body .crl-cart-coupon button:hover {
  background: #075DA7 !important;
  background-color: #075DA7 !important;
}


/* ============================================================
   6. INFORMACION DE ENVIO
   ------------------------------------------------------------
   Avada usa .avada-shipping-calculator-form como flex.
   Se reordena a rejilla de 2 columnas.
   ============================================================ */

html body .crl-cart-shipping {
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
}

html body .crl-cart-shipping .avada-shipping-calculator-form,
html body .crl-cart-shipping .shipping-calculator-form {
  display: flex !important;
  flex-wrap: wrap !important;
  align-items: flex-start !important;
  gap: 14px !important;
  margin: 0 !important;
  padding: 0 !important;
}

html body .crl-cart-shipping p.form-row {
  flex: 1 1 calc(50% - 7px) !important;
  width: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  float: none !important;
}

html body .crl-cart-shipping p#shipping_country_field {
  flex: 1 1 100% !important;
}

html body .crl-cart-shipping input[type="text"],
html body .crl-cart-shipping input[type="tel"],
html body .crl-cart-shipping select {
  width: 100% !important;
  height: 44px !important;
  padding: 0 14px !important;
  font-family: 'Roboto', sans-serif !important;
  font-size: 14px !important;
  color: #05080D !important;
  background: #FFFFFF !important;
  border: 1px solid #E5E7EB !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
  transition: border-color 0.2s ease !important;
}

html body .crl-cart-shipping input[type="text"]:focus,
html body .crl-cart-shipping select:focus {
  border-color: #075DA7 !important;
  outline: none !important;
}

/* Select2 alineado con los inputs */
html body .crl-cart-shipping .select2-container {
  width: 100% !important;
}

html body .crl-cart-shipping .select2-container .select2-selection--single {
  height: 44px !important;
  background: #FFFFFF !important;
  border: 1px solid #E5E7EB !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  box-sizing: border-box !important;
}

html body .crl-cart-shipping .select2-container .select2-selection__rendered {
  height: 42px !important;
  line-height: 42px !important;
  padding: 0 30px 0 14px !important;
  font-family: 'Roboto', sans-serif !important;
  font-size: 14px !important;
  color: #05080D !important;
}

html body .crl-cart-shipping .select2-container .select2-selection__arrow {
  height: 42px !important;
  right: 8px !important;
}

/* Boton actualizar totales */
html body .crl-cart-shipping p.form-row button,
html body .crl-cart-shipping button,
html body .crl-cart-shipping button.button,
html body .crl-cart-shipping input[type="submit"] {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  height: 44px !important;
  padding: 0 24px !important;
  background: #05080D !important;
  background-color: #05080D !important;
  background-image: none !important;
  border: none !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  color: #FFFFFF !important;
  font-family: 'Roboto', sans-serif !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  text-transform: none !important;
  white-space: nowrap !important;
  cursor: pointer !important;
  transition: background 0.25s ease !important;
}

html body .crl-cart-shipping button:hover,
html body .crl-cart-shipping button.button:hover {
  background: #075DA7 !important;
  background-color: #075DA7 !important;
}


/* ============================================================
   7. RESUMEN DE TOTALES
   ============================================================ */

html body .crl-cart-totals table,
html body .crl-cart-totals table.shop_table {
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  border: none !important;
  border-collapse: collapse !important;
  background: transparent !important;
  box-shadow: none !important;
}

html body .crl-cart-totals table tr {
  background: transparent !important;
  border: none !important;
}

html body .crl-cart-totals table th {
  width: 45% !important;
  padding: 10px 0 !important;
  font-family: 'Roboto', sans-serif !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  color: #4B5563 !important;
  text-align: left !important;
  text-transform: none !important;
  border: none !important;
  background: transparent !important;
  vertical-align: top !important;
}

html body .crl-cart-totals table td {
  padding: 10px 0 !important;
  font-family: 'Roboto', sans-serif !important;
  font-size: 13px !important;
  color: #4B5563 !important;
  text-align: right !important;
  border: none !important;
  background: transparent !important;
  vertical-align: top !important;
}

html body .crl-cart-totals tr.cart-subtotal td .amount {
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #05080D !important;
}

html body .crl-cart-totals ul#shipping_method {
  text-align: left !important;
}

html body .crl-cart-totals ul#shipping_method li {
  display: block !important;
  position: relative !important;
  margin: 0 0 10px 0 !important;
  padding: 0 !important;
  list-style: none !important;
  text-align: left !important;
}

html body .crl-cart-totals ul#shipping_method li:last-child {
  margin-bottom: 0 !important;
}

html body .crl-cart-totals ul#shipping_method li input[type="radio"] {
  position: absolute !important;
  opacity: 0 !important;
  width: 0 !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  pointer-events: none !important;
}

html body .crl-cart-totals ul#shipping_method li label {
  display: block !important;
  position: relative !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 0 0 26px !important;
  font-family: 'Roboto', sans-serif !important;
  font-size: 13px !important;
  color: #4B5563 !important;
  line-height: 1.5 !important;
  text-align: left !important;
  cursor: pointer !important;
}

html body .crl-cart-totals ul#shipping_method li label::before {
  content: '' !important;
  display: block !important;
  position: absolute !important;
  left: 0 !important;
  top: 3px !important;
  width: 16px !important;
  height: 16px !important;
  background: #FFFFFF !important;
  border: 1.5px solid #94A3B8 !important;
  border-radius: 50% !important;
  box-sizing: border-box !important;
  transition: border-color 0.2s ease !important;
}

html body .crl-cart-totals ul#shipping_method li label::after {
  content: '' !important;
  display: none !important;
  position: absolute !important;
  left: 4px !important;
  top: 7px !important;
  width: 8px !important;
  height: 8px !important;
  background: #075DA7 !important;
  border: none !important;
  border-radius: 50% !important;
  box-sizing: border-box !important;
}

html body .crl-cart-totals ul#shipping_method li input[type="radio"]:checked + label::before {
  border-color: #075DA7 !important;
}

html body .crl-cart-totals ul#shipping_method li input[type="radio"]:checked + label::after {
  display: block !important;
}

html body .crl-cart-totals ul#shipping_method li label:hover::before {
  border-color: #075DA7 !important;
}

html body .crl-cart-totals ul#shipping_method li label .amount,
html body .crl-cart-totals ul#shipping_method li label bdi {
  font-weight: 700 !important;
  color: #05080D !important;
}

html body .crl-aviso-recogida {
  display: block !important;
  margin: 10px 0 0 0 !important;
  padding: 10px 12px !important;
  background: #F0F6FC !important;
  border-left: 3px solid #075DA7 !important;
  border-radius: 4px !important;
  font-family: 'Roboto', sans-serif !important;
  font-size: 12px !important;
  font-weight: 500 !important;
  color: #075DA7 !important;
  line-height: 1.4 !important;
  text-align: left !important;
}

html body .crl-cart-totals .woocommerce-shipping-destination {
  font-size: 12px !important;
  color: #6B7280 !important;
  margin: 6px 0 0 0 !important;
  line-height: 1.4 !important;
}

html body .crl-cart-totals tr.order-total {
  border-top: 2px solid #05080D !important;
}

html body .crl-cart-totals tr.order-total th {
  padding: 16px 0 6px 0 !important;
  font-size: 14px !important;
  font-weight: 700 !important;
  color: #05080D !important;
  vertical-align: middle !important;
}

html body .crl-cart-totals tr.order-total td,
html body .crl-cart-totals tr.order-total td .amount,
html body .crl-cart-totals tr.order-total td bdi {
  padding: 16px 0 6px 0 !important;
  font-size: 26px !important;
  font-weight: 900 !important;
  color: #05080D !important;
  letter-spacing: -0.8px !important;
  line-height: 1 !important;
  vertical-align: middle !important;
}

html body .crl-cart-totals .wc-proceed-to-checkout {
  padding: 0 !important;
  margin: 0 !important;
}

html body .crl-cart-totals a.checkout-button {
  display: none !important;
}


/* ============================================================
   8. BOTONES FUSION DEL RESUMEN
   ============================================================ */

html body a.crl-btn-checkout,
html body a.crl-btn-checkout.fusion-button,
html body a.crl-btn-update,
html body a.crl-btn-update.fusion-button {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  width: 100% !important;
  box-sizing: border-box !important;
  border-radius: 6px !important;
  box-shadow: none !important;
  font-family: 'Roboto', sans-serif !important;
  font-weight: 700 !important;
  text-transform: none !important;
  text-decoration: none !important;
  line-height: 1.2 !important;
  min-height: 0 !important;
  cursor: pointer !important;
  transition: background 0.25s ease, color 0.25s ease !important;
}

html body a.crl-btn-checkout,
html body a.crl-btn-checkout.fusion-button {
  margin: 20px 0 10px 0 !important;
  padding: 15px 24px !important;
  background: #075DA7 !important;
  background-color: #075DA7 !important;
  background-image: none !important;
  border: none !important;
  color: #FFFFFF !important;
}

html body a.crl-btn-checkout .fusion-button-text {
  color: #FFFFFF !important;
  font-family: 'Roboto', sans-serif !important;
  font-size: 15px !important;
  font-weight: 700 !important;
  letter-spacing: 0.3px !important;
  padding: 0 !important;
  background: transparent !important;
}

html body a.crl-btn-checkout:hover,
html body a.crl-btn-checkout.fusion-button:hover {
  background: #05080D !important;
  background-color: #05080D !important;
}

html body a.crl-btn-update,
html body a.crl-btn-update.fusion-button {
  margin: 0 !important;
  padding: 13px 24px !important;
  background: transparent !important;
  background-color: transparent !important;
  background-image: none !important;
  border: 1.5px solid #05080D !important;
  color: #05080D !important;
}

html body a.crl-btn-update .fusion-button-text {
  color: #05080D !important;
  font-family: 'Roboto', sans-serif !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  padding: 0 !important;
  background: transparent !important;
  transition: color 0.25s ease !important;
}

html body a.crl-btn-update:hover,
html body a.crl-btn-update.fusion-button:hover {
  background: #05080D !important;
  background-color: #05080D !important;
}

html body a.crl-btn-update:hover .fusion-button-text {
  color: #FFFFFF !important;
}

html body a.crl-btn-checkout::before,
html body a.crl-btn-update::before,
html body a.crl-btn-checkout .fusion-button-icon-divider-left,
html body a.crl-btn-update .fusion-button-icon-divider-left {
  display: none !important;
}


/* ============================================================
   9. RESPONSIVE
   ============================================================ */

@media only screen and (max-width: 1024px) {
  html body .crl-cart .fusion-row {
    padding-left: 24px !important;
    padding-right: 24px !important;
  }

  html body .crl-cart-main {
    padding: 22px !important;
    margin-bottom: 20px !important;
  }
}

@media only screen and (max-width: 640px) {
  html body .crl-cart .fusion-row {
    padding-left: 16px !important;
    padding-right: 16px !important;
  }

  html body .crl-cart-main,
  html body .crl-cart-summary {
    padding: 16px !important;
  }

  html body .crl-cart-table table td {
    padding: 12px 6px !important;
  }

  html body .crl-cart-table td.product-thumbnail img {
    width: 54px !important;
    height: 54px !important;
  }

  html body .crl-cart-table td.product-name,
  html body .crl-cart-table td.product-name a {
    font-size: 13px !important;
  }

  html body .crl-cart-coupon,
  html body .crl-cart-coupon.coupon {
    flex-wrap: wrap !important;
  }

  html body .crl-cart-coupon input[type="text"],
  html body .crl-cart-coupon button {
    flex: 1 1 100% !important;
    width: 100% !important;
  }

  html body .crl-cart-shipping p.form-row {
    flex: 1 1 100% !important;
  }

  html body .crl-cart-totals tr.order-total td,
  html body .crl-cart-totals tr.order-total td .amount {
    font-size: 22px !important;
  }
}