/*
 Theme Name:    Electro Child
 Theme URI:     https://themeforest.net/item/electro-electronics-store-woocommerce-theme/15720624
 Description:   This is the child theme of Electro
 Author:        MadrasThemes
 Author URI:    https://madrasthemes.com/
 Template:      electro
 Version:       3.3.9
 License:       GNU General Public License v2 or later
 License URI:   http://www.gnu.org/licenses/gpl-2.0.html
 Tags:          light, dark, two-columns, right-sidebar, responsive-layout
 Text Domain:   electro-child
*/

/* ============================================================
   TSP – Fix Presupuesto en MOBILE (vista de tarjetas)
   Pegar en: Apariencia → Personalizar → CSS adicional
   Solo afecta pantallas <= 575.98px. Desktop queda intacto.
   Verificado en vivo en test.turbysport.com.ar con varios productos.

   Resuelve juntos:
   - BUG-M0: la imagen del producto no se mostraba en mobile.
   - BUG-M1: la fila Total mostraba ":" en vez de "Total:".
   - BUG-M2: nombres y precios se cortaban contra el borde derecho.
   ============================================================ */

@media (max-width: 575.98px) {

  /* La tabla del presupuesto, contenida al viewport */
  #yith-ywrq-table-list.shop_table_responsive {
    width: 100%;
    box-sizing: border-box;
    border: 0;
  }

  /* Cada producto = tarjeta */
  #yith-ywrq-table-list.shop_table_responsive tbody tr.cart_item {
    display: block;
    position: relative;
    border: 1px solid #e6e6e6;
    border-radius: 10px;
    margin: 0 12px 14px;
    padding: 12px 14px;
    background: #fff;
  }

  /* Celdas apiladas, alineadas a la izquierda y sin recorte */
  #yith-ywrq-table-list.shop_table_responsive tbody tr.cart_item td {
    display: block;
    width: auto !important;
    float: none !important;
    text-align: left !important;
    padding: 3px 0 !important;
    border: 0 !important;
  }

  /* Etiquetas (Producto:, Cantidad:, Total:) en negrita, inline */
  #yith-ywrq-table-list.shop_table_responsive tbody tr.cart_item td::before {
    float: none !important;
    display: inline !important;
    font-weight: 700;
    margin-right: 4px;
  }

  /* Imagen del producto (BUG-M0): visible y centrada */
  #yith-ywrq-table-list.shop_table_responsive tbody tr.cart_item td.product-thumbnail {
    display: block !important;
    text-align: center;
    padding: 0 0 8px !important;
  }
  #yith-ywrq-table-list.shop_table_responsive tbody tr.cart_item td.product-thumbnail::before {
    display: none !important;
    content: "" !important;
  }
  #yith-ywrq-table-list.shop_table_responsive tbody tr.cart_item td.product-thumbnail a {
    display: inline-block;
  }
  #yith-ywrq-table-list.shop_table_responsive tbody tr.cart_item td.product-thumbnail img {
    max-width: 110px;
    height: auto;
    margin: 0 auto;
  }

  /* Total (BUG-M1): etiqueta correcta y destacado */
  #yith-ywrq-table-list.shop_table_responsive tbody tr.cart_item td.product-subtotal::before {
    content: "Total: " !important;
  }
  #yith-ywrq-table-list.shop_table_responsive tbody tr.cart_item td.product-subtotal {
    font-weight: 600;
  }

  /* "×" eliminar: arriba a la derecha de la tarjeta, sin ":" sobrante */
  #yith-ywrq-table-list.shop_table_responsive tbody tr.cart_item td.product-remove {
    position: absolute;
    top: 8px;
    right: 10px;
    padding: 0 !important;
    width: auto !important;
  }
  #yith-ywrq-table-list.shop_table_responsive tbody tr.cart_item td.product-remove::before {
    display: none !important;
    content: "" !important;
  }
  #yith-ywrq-table-list.shop_table_responsive tbody tr.cart_item td.product-remove a {
    font-size: 18px;
    color: #999;
  }

  /* Fila "Actualizar lista" (sin clase cart_item): centrada y sin etiqueta */
  #yith-ywrq-table-list.shop_table_responsive tbody tr:not(.cart_item) td {
    text-align: center !important;
  }
  #yith-ywrq-table-list.shop_table_responsive tbody tr:not(.cart_item) td::before {
    display: none !important;
    content: "" !important;
  }
}


/* === TSP – Presupuesto DESKTOP (estilo moderno) === */
@media (min-width: 576px) {
  #yith-ywrq-table-list.shop_table {
    border: 1px solid #ececec;
    border-radius: 12px;
    border-collapse: separate;
    border-spacing: 0;
    overflow: hidden;
    box-shadow: 0 6px 22px rgba(0,0,0,.06);
    width: 100%;
  }
  #yith-ywrq-table-list.shop_table thead th {
    background: #f7f8fa;
    text-transform: uppercase;
    font-size: 12px;
    letter-spacing: .06em;
    color: #6b7280;
    padding: 14px 16px;
    border: 0;
    text-align: left;
    font-weight: 700;
  }
  #yith-ywrq-table-list.shop_table tbody td {
    padding: 14px 16px;
    border: 0;
    border-top: 1px solid #f0f0f0;
    vertical-align: middle;
    background: #fff;
  }
  #yith-ywrq-table-list.shop_table tbody tr.cart_item:hover td {
    background: #fafbfc;
  }
  #yith-ywrq-table-list.shop_table td.product-thumbnail img {
    width: 64px;
    height: 64px;
    object-fit: contain;
    border: 1px solid #eee;
    border-radius: 8px;
    background: #fff;
    padding: 4px;
  }
  #yith-ywrq-table-list.shop_table td.product-name a {
    font-weight: 600;
    color: #1f2937;
    text-decoration: none;
  }
  #yith-ywrq-table-list.shop_table td.product-name a:hover {
    color: #e23b2e;
  }
  #yith-ywrq-table-list.shop_table td.product-subtotal {
    font-weight: 700;
    color: #111;
    font-size: 15px;
    white-space: nowrap;
  }
  #yith-ywrq-table-list.shop_table td.product-quantity input {
    border: 1px solid #d8dbe0;
    border-radius: 8px;
    padding: 6px 8px;
    width: 70px;
  }
  #yith-ywrq-table-list.shop_table td.product-remove a {
    color: #c4c4c4;
    font-size: 18px;
    text-decoration: none;
    font-weight: 700;
  }
  #yith-ywrq-table-list.shop_table td.product-remove a:hover {
    color: #e23b2e;
  }
  #yith-ywrq-table-list.shop_table tr:last-child td {
    padding-top: 16px;
  }
  #yith-ywrq-table-list.shop_table button[name="update_raq"],
  #yith-ywrq-table-list.shop_table .button {
    border-radius: 8px;
    padding: 10px 18px;
  }
}

/* === Botón "Añadir al presupuesto" en el listado (igual al carrito) === */

/* CLAVE anti-duplicado: Electro renderiza DOS .add-to-cart-wrap por producto en carruseles.
   Ocultamos el duplicado (footer-direct) y mostramos el botón SOLO en el de .price-add-to-cart. */
.product .product-loop-footer > .add-to-cart-wrap{ display:none !important; }
.product .add-request-quote-button{ display:none !important; }
.product .price-add-to-cart .add-to-cart-wrap .add-request-quote-button{ display:inline-flex !important; }
.eael-product-wrap ul.icons-wrap li.add-to-cart div.add-to-cart-wrap a.add-request-quote-button{ display:none !important; }

@media (min-width:1200px){
  .product .price-add-to-cart{ margin-right:-10px; }
  .product .price-add-to-cart .price{ font-size:18px; }
  .product .price-add-to-cart .add-to-cart-wrap{
    display:inline-flex !important; align-items:center; justify-content:flex-end; gap:6px; width:auto !important;
  }
  .product .price-add-to-cart .add-to-cart-wrap > a.button{ float:none !important; margin:0 !important; }
}

/* el botón de presupuesto: círculo 34px igual al del carrito */
.product .price-add-to-cart .add-to-cart-wrap .add-request-quote-button{
  order:-1;
  align-items:center !important; justify-content:center !important;
  width:34px !important; height:34px !important; min-width:0 !important;
  padding:0 !important; margin:0 !important; border:0 !important; box-shadow:none !important; background:transparent !important;
  font-size:0 !important; line-height:0 !important;
}
.product .price-add-to-cart .add-to-cart-wrap .add-request-quote-button::before{
  content:"\f15c";
  font-family:"Font Awesome 5 Free"; font-weight:900;
  display:flex; align-items:center; justify-content:center;
  flex:0 0 34px;
  width:34px; height:34px; box-sizing:border-box;
  border-radius:50%; background:#eaeaea; color:#fff; font-size:16px;
}
.product:hover .price-add-to-cart .add-to-cart-wrap .add-request-quote-button::before{
  background:#333E48; color:#fff;
}

/* estado "AGREGADO": botón verde con check */
.product .price-add-to-cart .add-to-cart-wrap .add-request-quote-button.tsp-added::before{
  content:"\f00c" !important;
  background:#34a853 !important; color:#fff !important;
}
.tsp-tip-added .tooltip-inner{ background:#34a853 !important; }
.tsp-tip-added .tooltip-arrow::before{ border-top-color:#34a853 !important; border-bottom-color:#34a853 !important; }

/* Loader del carrito: spinner negro en vez de "Please wait..." */
@keyframes tsp-spin{ to{ transform:rotate(360deg); } }
.product .blockUI.blockMsg{ display:none !important; }
.product .blockUI.blockOverlay{ background:rgba(255,255,255,.65) !important; opacity:1 !important; cursor:wait; }
.product .blockUI.blockOverlay::after{
  content:""; position:absolute; top:50%; left:50%; width:36px; height:36px; margin:-18px 0 0 -18px;
  border:3px solid rgba(0,0,0,.15); border-top-color:#000 !important; border-radius:50%;
  animation:tsp-spin .7s linear infinite;
}
/* Mini popover de CANTIDAD (compacto, discreto): input chico + botón ✓, horizontal,
   sin label/título/flecha. Tamaño ~84x38px. */
.tsp-qty-popover{ z-index:100000 !important; /* por encima del overlay de la imagen del producto */
  width:auto !important; max-width:none !important; min-width:0 !important;
  border:1px solid #e3e3e3; border-radius:8px; box-shadow:0 4px 14px rgba(0,0,0,.12); }
.tsp-qty-popover .popover-header{ display:none !important; }
.tsp-qty-popover .popover-arrow{ display:none !important; }
.tsp-qty-popover .popover-body{ padding:4px !important; }
.tsp-qty-pop{ display:flex; align-items:center; gap:4px; }
.tsp-qty-pop .tsp-qty-input{ width:42px; height:28px; padding:2px 4px; border:1px solid #ddd; border-radius:6px;
  font-size:13px; text-align:center; box-sizing:border-box; -moz-appearance:textfield; }
.tsp-qty-pop .tsp-qty-add{ width:28px; height:28px; display:inline-flex; align-items:center; justify-content:center;
  background:#333E48; color:#fff; border:0; border-radius:6px; cursor:pointer; padding:0; font-size:0; }
.tsp-qty-pop .tsp-qty-add::before{ content:"\f00c"; /* check */ font-family:"Font Awesome 5 Free"; font-weight:900; font-size:12px; color:#fff; }
.tsp-qty-pop .tsp-qty-add:hover{ background:#34a853; }

/* === Botón "Añadir al presupuesto" en la FICHA de producto (igualado al de carrito) === */
form.cart .yith-ywraq-add-button .add-request-quote-button{
  background:#000 !important; color:#fff !important; border:0 !important; border-radius:25px !important;
  padding:14px 40px !important; font-size:14px !important; font-weight:700 !important; line-height:1.4 !important;
  display:inline-flex !important; align-items:center; justify-content:center; box-shadow:none !important;
}
form.cart .yith-ywraq-add-button .add-request-quote-button:hover{ background:#333E48 !important; }
form.cart .yith-ywraq-add-button .add-request-quote-button.tsp-added-detail,
form.cart .yith-ywraq-add-button .add-request-quote-button.tsp-added-detail:hover{
  background:#34a853 !important; border-color:#34a853 !important;
}

/* === Total general en la página de presupuesto (línea fina + monto grande) === */

/* --- DESKTOP --- */
#yith-ywrq-table-list tfoot .tsp-total-row td{ border-top:1px solid #ececec; padding:14px 16px; background:transparent; }
#yith-ywrq-table-list .tsp-total-label{ text-align:right; font-weight:600; font-size:13px; text-transform:uppercase; letter-spacing:1px; color:#9a9a9a; }
#yith-ywrq-table-list .tsp-total-value{ font-weight:800; font-size:22px; color:#333E48; white-space:nowrap; }
#yith-ywrq-table-list .tsp-total-iva{ font-size:13px; font-weight:600; color:#9a9a9a; }

/* --- MOBILE (≤575.98px) --- */
@media (max-width:575.98px){
  #yith-ywrq-table-list tfoot .tsp-total-row{ display:flex !important; justify-content:space-between !important; align-items:center !important; padding:14px 16px !important; border-top:1px solid #ececec !important; background:transparent !important; }
  #yith-ywrq-table-list .tsp-total-row td{ display:inline-block !important; width:auto !important; border:0 !important; padding:0 !important; text-align:left !important; }
  #yith-ywrq-table-list .tsp-total-row td::before{ content:none !important; display:none !important; }
  #yith-ywrq-table-list .tsp-total-row .tsp-total-label{ font-size:13px !important; }
  #yith-ywrq-table-list .tsp-total-row .tsp-total-value{ font-size:20px !important; }
  /* cada ítem dice "Subtotal:" en vez de "Total:" */
  #yith-ywrq-table-list.shop_table_responsive tbody tr.cart_item td.product-subtotal::before{ content:"Subtotal: " !important; }
}