/* =========================================================================
   Librería Uno · Página del carrito (WooCommerce, carrito clásico)
   Cargar solo en el carrito desde functions.php (ver uno-carrito-hooks.php).
   Requiere los tokens de marca (tokens.css). Mobile first: lo base es celular.
   ========================================================================= */

/* ---------- 1. Variables (todo lo ajustable, en un solo lugar) ---------- */
:root{
  --uno-carrito-fondo:        var(--uno-papel, #F4EFE4);
  --uno-carrito-tarjeta:      var(--uno-blanco, #FFFFFF);
  --uno-carrito-filete:       var(--uno-filete, #E2DED5);
  --uno-carrito-filete-2:     #C7BBA1;            /* bordes de controles */
  --uno-carrito-texto:        var(--uno-negro, #111111);
  --uno-carrito-texto-2:      var(--uno-gris, #5C554A);
  --uno-carrito-verde:        var(--uno-verde, #123C2E);
  --uno-carrito-verde-medio:  var(--uno-verde-medio, #2C5A46);
  --uno-carrito-verde-10:     var(--uno-verde-10, #EAF0EC);
  --uno-carrito-accion:       var(--uno-bordo, #8C2F39);
  --uno-carrito-ok:           var(--uno-ok, #2E7D4F);
  --uno-carrito-warn:         var(--uno-warn, #8A6820);
  --uno-carrito-warn-fondo:   #FBF4E4;
  --uno-carrito-error:        var(--uno-error, #B03024);
  --uno-carrito-error-fondo:  #FBECEA;
  --uno-carrito-destello:     #F3E6C6;            /* fondo breve al cambiar un total */
  --uno-carrito-foco:         var(--uno-mostaza, #C79A3E);

  --uno-carrito-radio:        16px;
  --uno-carrito-radio-chico:  10px;
  --uno-carrito-toque:        48px;               /* botones − y + (mín. 44) */
  --uno-carrito-cta-alto:     56px;
  --uno-carrito-col-resumen:  380px;
  --uno-carrito-gap:          18px;
  --uno-carrito-barra-alto:   76px;               /* barra fija en celular */
  --uno-carrito-duracion:     .45s;
}

/* ---------- 2. Contenedor y grilla ---------- */
.woocommerce-cart .woocommerce{
  display:grid; grid-template-columns:minmax(0,1fr); gap:var(--uno-carrito-gap);
  padding-bottom:calc(var(--uno-carrito-barra-alto) + 32px + env(safe-area-inset-bottom));
}
.woocommerce-cart .woocommerce-notices-wrapper{ grid-column:1 / -1; }
.uno-carrito-titulo{ display:flex; flex-wrap:wrap; align-items:baseline; gap:10px; margin:0 0 4px; }
.uno-carrito-titulo h1{ margin:0; font-size:clamp(26px, 4vw, 32px); font-weight:600; color:var(--uno-carrito-verde); }
.uno-carrito-cantidad{ font-size:15px; color:var(--uno-carrito-texto-2); }

/* ---------- 3. Barra de envío gratis (OPCIONAL) ---------- */
.uno-carrito-envio-gratis{
  display:flex; align-items:center; gap:14px; margin-bottom:16px; padding:14px 16px;
  background:var(--uno-carrito-tarjeta); border:1px solid var(--uno-carrito-filete); border-radius:14px;
}
.uno-carrito-envio-gratis p{ margin:0 0 8px; font-size:14px; font-weight:500; }
.uno-carrito-envio-gratis.is-alcanzado p{ color:var(--uno-carrito-ok); }
.uno-carrito-envio-gratis__pista{ height:8px; background:var(--uno-carrito-verde-10); border-radius:999px; overflow:hidden; }
.uno-carrito-envio-gratis__relleno{ height:100%; background:var(--uno-carrito-verde-medio); border-radius:999px; transition:width var(--uno-carrito-duracion) ease; }
.is-alcanzado .uno-carrito-envio-gratis__relleno{ background:var(--uno-carrito-ok); }
.uno-carrito-envio-gratis__uno{ flex:0 0 auto; width:58px; animation:uno-carrito-salto 1s ease-out 2; }
@keyframes uno-carrito-salto{ 0%,100%{transform:none} 35%{transform:translateY(-10px) rotate(-4deg)} 60%{transform:none} 75%{transform:translateY(-4px)} }

/* ---------- 4. Lista de productos ---------- */
.uno-carrito-lista{ list-style:none; margin:0; padding:4px 14px; background:var(--uno-carrito-tarjeta); border:1px solid var(--uno-carrito-filete); border-radius:var(--uno-carrito-radio); }
.uno-carrito-item{ display:flex; flex-wrap:wrap; gap:12px 14px; padding:16px 0; align-items:flex-start; }
.uno-carrito-item + .uno-carrito-item{ border-top:1px solid var(--uno-carrito-filete); }
.uno-carrito-item__img{ flex:0 0 76px; }
.uno-carrito-item__img img{ width:76px; height:76px; object-fit:cover; border-radius:var(--uno-carrito-radio-chico); background:var(--uno-fondo-suave, #F6F4F0); display:block; }
.uno-carrito-item__info{ flex:1 1 170px; min-width:0; display:flex; flex-direction:column; gap:2px; }
.uno-carrito-item__nombre{ font-size:15px; font-weight:500; color:var(--uno-carrito-texto); text-decoration:none; line-height:1.35; }
.uno-carrito-item__variante, .uno-carrito-item__unitario{ font-size:13px; color:var(--uno-carrito-texto-2); }
.uno-carrito-item__variante dl{ margin:0; display:flex; gap:4px; } .uno-carrito-item__variante dd, .uno-carrito-item__variante p{ margin:0; }
.uno-carrito-item__quitar{ align-self:flex-start; display:inline-flex; align-items:center; min-height:44px; margin-left:-8px; padding:0 8px; font-size:13px; color:var(--uno-carrito-accion); text-decoration:underline; text-underline-offset:3px; }
.uno-carrito-item__acciones{ flex:1 1 230px; display:flex; align-items:center; justify-content:space-between; gap:16px; }
.uno-carrito-item__subtotal{ text-align:right; display:flex; flex-direction:column; font-variant-numeric:tabular-nums; }
.uno-carrito-item__subtotal span{ font-size:12px; color:var(--uno-carrito-texto-2); }
.uno-carrito-item__subtotal strong{ font-size:16px; font-weight:600; }
.uno-carrito-aviso{ flex:1 1 100%; margin:0; font-size:13px; border-radius:8px; padding:8px 12px; }
.uno-carrito-aviso--pocas{ color:var(--uno-carrito-warn); background:var(--uno-carrito-warn-fondo); }
.uno-carrito-aviso--sin-stock{ color:var(--uno-carrito-error); background:var(--uno-carrito-error-fondo); }

/* Selector de cantidad (global/quantity-input.php) */
.uno-carrito-cantidad-control{ display:inline-flex; align-items:center; border:1px solid var(--uno-carrito-filete-2); border-radius:999px; background:var(--uno-carrito-tarjeta); }
.uno-carrito-cantidad-control button{ width:var(--uno-carrito-toque); height:var(--uno-carrito-toque); border:0; border-radius:999px; background:none; font-size:22px; line-height:1; color:var(--uno-carrito-verde); cursor:pointer; }
.uno-carrito-cantidad-control button:hover{ background:var(--uno-carrito-fondo); }
.uno-carrito-cantidad-control button:disabled{ color:var(--uno-carrito-filete-2); cursor:default; background:none; }
.uno-carrito-cantidad-control input.qty{ width:40px; min-height:44px; border:0; background:none; text-align:center; font-size:16px; font-weight:600; font-variant-numeric:tabular-nums; -moz-appearance:textfield; }
.uno-carrito-cantidad-control input::-webkit-outer-spin-button, .uno-carrito-cantidad-control input::-webkit-inner-spin-button{ -webkit-appearance:none; margin:0; }
/* El botón "Actualizar carrito" queda oculto: el JS lo dispara solo */
.woocommerce-cart-form button[name="update_cart"], .woocommerce-cart-form .coupon{ position:absolute !important; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); }

/* ---------- 5. Te puede servir (ventas cruzadas) ---------- */
.uno-carrito-sugeridos h2{ margin:16px 0 10px; font-size:15px; font-weight:600; color:var(--uno-carrito-texto-2); }
.uno-carrito-sugeridos ul.products{ display:grid !important; grid-template-columns:repeat(auto-fill, minmax(200px,1fr)); gap:10px; margin:0; }
.uno-carrito-sugeridos ul.products li.product{ width:auto !important; margin:0 !important; float:none !important; }

/* ---------- 6. Resumen (cart_totals) ---------- */
.cart-collaterals .cart_totals{
  width:100% !important; float:none !important; box-sizing:border-box; padding:18px;
  background:var(--uno-carrito-tarjeta); border:1px solid var(--uno-carrito-filete); border-radius:var(--uno-carrito-radio);
  min-height:420px;                       /* espacio reservado: no "salta" al actualizar */
}
.cart_totals h2{ margin:0 0 12px; font-size:18px; font-weight:600; color:var(--uno-carrito-verde); }
.cart_totals table.shop_table{ border:0; margin:0; font-size:15px; }
.cart_totals table th, .cart_totals table td{ border:0 !important; padding:6px 0 !important; background:none !important; font-variant-numeric:tabular-nums; }
.cart_totals table th{ font-weight:400; color:var(--uno-carrito-texto-2); }
.cart_totals .order-total th{ font-size:18px; font-weight:600; color:var(--uno-carrito-texto); }
.cart_totals .order-total td .amount{ font-size:30px; font-weight:700; color:var(--uno-carrito-verde); border-radius:8px; padding:0 6px; transition:background var(--uno-carrito-duracion) ease; }
.cart_totals .order-total th, .cart_totals .order-total td{ border-top:1px solid var(--uno-carrito-filete) !important; padding-top:14px !important; }
.uno-carrito-flash .amount{ background:var(--uno-carrito-destello); }
.cart_totals .cart-discount td, .cart_totals .cart-discount th{ color:var(--uno-carrito-ok); }

/* Métodos de envío como tarjetas (domicilio / retiro en el local) */
.cart_totals #shipping_method{ list-style:none; margin:0; padding:0; display:grid; gap:8px; }
.cart_totals #shipping_method li{ position:relative; }
.cart_totals #shipping_method input{ position:absolute; opacity:0; }
.cart_totals #shipping_method label{ display:flex; align-items:center; min-height:52px; padding:8px 12px; border:1px solid var(--uno-carrito-filete); border-radius:12px; cursor:pointer; font-size:14px; }
.cart_totals #shipping_method input:checked + label{ border:2px solid var(--uno-carrito-verde); background:var(--uno-carrito-verde-10); }
.cart_totals #shipping_method input:focus-visible + label{ outline:3px solid var(--uno-carrito-foco); outline-offset:2px; }
/* Resumen ordenado: importes a la derecha; el envío ocupa todo el ancho (título arriba, opciones abajo) */
.cart_totals table.shop_table{ width:100%; }
.cart_totals table td{ text-align:right; }
.cart_totals tr.woocommerce-shipping-totals, .cart_totals tr.woocommerce-shipping-totals th, .cart_totals tr.woocommerce-shipping-totals td{ display:block; width:100%; text-align:left; }
.cart_totals tr.woocommerce-shipping-totals th{ padding-bottom:2px !important; }
.cart_totals tr.woocommerce-shipping-totals td::before{ display:none !important; }
.cart_totals #shipping_method label{ gap:10px; line-height:1.3; }
.uno-envio-op{ display:flex; align-items:center; gap:10px; width:100%; }
.uno-envio-op__nombre{ flex:1; min-width:0; color:var(--uno-carrito-texto); }
.uno-envio-op__precio{ flex:none; font-weight:600; font-variant-numeric:tabular-nums; color:var(--uno-carrito-texto); }
.uno-envio-op__precio--gratis{ color:var(--uno-carrito-ok); }
.cart_totals .woocommerce-shipping-destination{ margin:10px 0 0; font-size:13px; color:var(--uno-carrito-texto-2); }
.cart_totals .shipping-calculator-button{ font-size:13px; }
.woocommerce-shipping-calculator input{ min-height:46px; border:1px solid var(--uno-carrito-filete-2); border-radius:var(--uno-carrito-radio-chico); padding:0 12px; font-size:15px; }
.woocommerce-shipping-calculator button{ min-height:46px; border-radius:var(--uno-carrito-radio-chico); }

/* Cupón desplegable */
.uno-carrito-cupon summary{ display:inline-flex; align-items:center; gap:6px; min-height:44px; font-size:14px; font-weight:500; color:var(--uno-carrito-verde); cursor:pointer; list-style:none; }
.uno-carrito-cupon summary::-webkit-details-marker{ display:none; }
.uno-carrito-cupon summary::after{ content:"▾"; font-size:12px; transition:transform .2s; }
.uno-carrito-cupon[open] summary::after{ transform:rotate(180deg); }
.uno-carrito-cupon__fila{ display:flex; gap:8px; }
.uno-carrito-cupon__fila input{ flex:1; min-width:0; min-height:46px; border:1px solid var(--uno-carrito-filete-2); border-radius:var(--uno-carrito-radio-chico); padding:0 12px; font-size:15px; text-transform:uppercase; }
.uno-carrito-boton-sec{ min-height:46px; padding:0 16px; border-radius:var(--uno-carrito-radio-chico); border:1px solid var(--uno-carrito-verde); background:var(--uno-carrito-tarjeta); color:var(--uno-carrito-verde); font-weight:600; cursor:pointer; }

/* Transferencia (OPCIONAL) */
.uno-carrito-transferencia td{ font-size:13px !important; color:var(--uno-carrito-verde-medio); background:var(--uno-carrito-verde-10) !important; border-radius:var(--uno-carrito-radio-chico); padding:10px 12px !important; }

/* Botón principal */
.wc-proceed-to-checkout{ padding:12px 0 0 !important; display:flex; flex-direction:column; gap:6px; }
.wc-proceed-to-checkout a.checkout-button{
  display:flex !important; align-items:center; justify-content:center; min-height:var(--uno-carrito-cta-alto); margin:0 !important;
  border-radius:999px; background:var(--uno-carrito-accion) !important; color:#fff !important; font-size:17px !important; font-weight:600; box-shadow:0 2px 0 #5E1E26;
}
.wc-proceed-to-checkout a.checkout-button:hover{ filter:brightness(1.08); }
.uno-carrito-seguir{ align-self:center; display:inline-flex; align-items:center; min-height:44px; font-size:14px; font-weight:500; color:var(--uno-carrito-verde); }
.uno-carrito-pagos{ border-top:1px solid var(--uno-carrito-filete); padding-top:14px; display:grid; gap:10px; }
.uno-carrito-pagos__logos{ display:grid; grid-template-columns:repeat(3,1fr); gap:6px; margin:0; padding:0; list-style:none; }
.uno-carrito-pagos__logos li{ height:40px; display:flex; align-items:center; justify-content:center; border:1px solid var(--uno-carrito-filete); border-radius:6px; padding:0 6px; text-align:center; font:600 11.5px/1.2 var(--uno-texto,inherit); color:var(--uno-verde); background:var(--uno-blanco,#fff); }
.uno-carrito-pagos__logos img{ max-width:80%; max-height:24px; }
.uno-carrito-sello{ display:flex; align-items:center; gap:8px; margin:0; font-size:12.5px; color:var(--uno-carrito-texto-2); }
.uno-carrito-sello strong{ color:var(--uno-carrito-ok); }

/* ---------- 7. Barra fija (celular y tablet) ---------- */
.uno-carrito-barra{
  position:fixed; left:0; right:0; bottom:0; z-index:90;
  display:flex; align-items:center; gap:14px; padding:10px 16px calc(10px + env(safe-area-inset-bottom));
  background:var(--uno-carrito-tarjeta); border-top:1px solid var(--uno-carrito-filete); box-shadow:0 -6px 18px rgba(17,17,17,.08);
}
.uno-carrito-barra__total{ display:flex; flex-direction:column; }
.uno-carrito-barra__total span{ font-size:12px; color:var(--uno-carrito-texto-2); }
.uno-carrito-barra__total strong{ font-size:20px; font-weight:700; color:var(--uno-carrito-verde); font-variant-numeric:tabular-nums; }
.uno-carrito-barra__cta{ flex:1; display:flex; align-items:center; justify-content:center; min-height:52px; border-radius:999px; background:var(--uno-carrito-accion); color:#fff; font-size:16px; font-weight:600; text-decoration:none; }
/* Botón flotante de WhatsApp: reemplazar el selector por el que use tu sitio */
.woocommerce-cart .uno-whatsapp{ bottom:calc(var(--uno-carrito-barra-alto) + 12px + env(safe-area-inset-bottom)) !important; }

/* ---------- 8. "Deshacer" de WooCommerce como aviso flotante ---------- */
.woocommerce-cart .woocommerce-message:has(.restore-item){
  --_c:#9FD3B5;
  position:fixed; left:12px; right:12px; bottom:calc(var(--uno-carrito-barra-alto) + 12px + env(safe-area-inset-bottom)); z-index:1200; max-width:460px; margin:0 auto;
  display:flex; flex-wrap:nowrap; align-items:center; gap:10px; padding:8px 8px 8px 46px;
  background:var(--uno-carrito-texto); color:#fff; border:0; border-radius:14px; box-shadow:0 10px 24px rgba(0,0,0,.25);
  font:500 14px/1.35 var(--uno-texto); animation:uno-carrito-aparece .25s ease-out;
}
.woocommerce-cart .woocommerce-message:has(.restore-item)::before{ left:14px; top:50%; width:22px; height:22px; transform:translateY(-50%); }
.woocommerce-cart .woocommerce-message:has(.restore-item) a:not(.button).restore-item{ flex:none; margin-left:auto; color:#fff; }
.uno-deshacer-cerrar{ flex:none; display:grid; place-items:center; width:36px; height:36px; border:0; border-radius:50%; background:rgba(255,255,255,.12); color:#fff; cursor:pointer; }
.uno-deshacer-cerrar:hover{ background:rgba(255,255,255,.22); }
.woocommerce-message .restore-item{ display:inline-flex; align-items:center; min-height:38px; padding:0 14px; border:1px solid currentColor; border-radius:999px; color:inherit; font-weight:600; white-space:nowrap; text-decoration:none; }
.woocommerce-message.is-oculto{ display:none !important; }
@keyframes uno-carrito-aparece{ from{opacity:0; transform:translateY(8px)} to{opacity:1; transform:none} }

/* ---------- 9. Carrito vacío ---------- */
.uno-carrito-vacio{ max-width:640px; margin:0 auto; padding:24px 18px; text-align:center; display:grid; justify-items:center; gap:14px; background:var(--uno-carrito-tarjeta); border:1px solid var(--uno-carrito-filete); border-radius:20px; }
.uno-carrito-vacio h2{ margin:0; font-size:22px; color:var(--uno-carrito-verde); }
.uno-carrito-vacio p{ margin:0; color:var(--uno-carrito-texto-2); max-width:420px; }
.uno-carrito-vacio__mundos{ width:100%; display:grid; grid-template-columns:repeat(auto-fit, minmax(130px,1fr)); gap:8px; list-style:none; margin:6px 0 0; padding:0; }
.uno-carrito-vacio__mundos a{ display:flex; align-items:center; justify-content:center; gap:8px; min-height:52px; border:1px solid var(--uno-carrito-filete); border-radius:12px; background:var(--uno-fondo-suave, #F6F4F0); color:var(--uno-carrito-texto); font-weight:500; text-decoration:none; }
.uno-carrito-vacio__ofertas{ display:flex; align-items:center; justify-content:center; gap:8px; width:100%; max-width:320px; min-height:52px; border-radius:999px; background:var(--uno-carrito-accion); color:#fff; font-weight:600; text-decoration:none; }

/* ---------- 10. Foco visible y estado "actualizando" ---------- */
.woocommerce-cart :focus-visible{ outline:3px solid var(--uno-carrito-foco); outline-offset:2px; }
.woocommerce-cart .blockUI.blockOverlay{ background:var(--uno-carrito-fondo) !important; opacity:.35 !important; }

/* ---------- 11. Tablet (≥ 768 px) ---------- */
@media (min-width:768px){
  .uno-carrito-lista{ padding:4px 22px; }
  .cart-collaterals .cart_totals{ padding:24px; }
  .uno-carrito-vacio{ padding:40px; }
}

/* ---------- 12. Escritorio (≥ 1024 px): 2 columnas, resumen pegajoso ---------- */
@media (min-width:1024px){
  .woocommerce-cart .woocommerce{ grid-template-columns:minmax(0,1fr) var(--uno-carrito-col-resumen); column-gap:32px; align-items:start; padding-bottom:48px; }
  .woocommerce-cart .woocommerce-cart-form{ grid-column:1; }
  .woocommerce-cart .cart-collaterals{ grid-column:2; grid-row:2 / span 3; position:sticky; top:24px; }
  .uno-carrito-barra{ display:none; }
  .woocommerce-cart .uno-whatsapp{ bottom:20px !important; }
  .woocommerce-cart .woocommerce-message:has(.restore-item){ left:24px; right:auto; bottom:24px; margin:0; width:min(460px, calc(100vw - 48px)); }
}

/* ---------- 13. Sin animaciones si la persona lo pidió ---------- */
@media (prefers-reduced-motion: reduce){
  .woocommerce-cart *, .woocommerce-cart *::before, .woocommerce-cart *::after{ animation:none !important; transition:none !important; }
}

/* Kadence agrega un «Cart Summary» propio: no va con el diseño */
.woocommerce-cart .cart-summary{display:none}
.woocommerce-cart .kadence-woo-cart-form-wrap{display:contents}

/* Carrito vacío · versión 2: ocupa todo el ancho y en escritorio va en dos columnas */
.woocommerce-cart .woocommerce:has(.uno-carrito-vacio){ display:block; }
.uno-carrito-vacio__texto{ display:grid; justify-items:center; gap:14px; width:100%; }
.uno-carrito-vacio__acciones{ display:flex; flex-wrap:wrap; justify-content:center; gap:10px; width:100%; }
.uno-carrito-vacio__acciones a{ flex:1 1 200px; max-width:320px; }
.uno-carrito-vacio__sec{ display:flex; align-items:center; justify-content:center; min-height:52px; border-radius:999px; border:1.5px solid var(--uno-carrito-verde); color:var(--uno-carrito-verde); font-weight:600; text-decoration:none; }
.uno-carrito-vacio__sec:hover{ background:var(--uno-verde-10, #EAF0EC); }
@media (min-width:900px){
  .uno-carrito-vacio{ max-width:980px; margin:24px auto 56px; grid-template-columns:260px minmax(0,1fr); align-items:center; justify-items:start; text-align:left; gap:16px 48px; padding:48px 56px; }
  .uno-carrito-vacio__uno{ width:240px; height:auto; }
  .uno-carrito-vacio__texto{ justify-items:start; }
  .uno-carrito-vacio h2{ font-size:30px; }
  .uno-carrito-vacio p{ font-size:16px; }
  .uno-carrito-vacio__mundos{ grid-template-columns:repeat(4, minmax(0,1fr)); }
  .uno-carrito-vacio__acciones{ justify-content:flex-start; }
}