

html,body{
margin:0 !important;
padding:0 !important;
height:100%;
width:100%;
}

#mufu-pos-wrapper{
position:fixed;
top:0;
left:0;
width:100vw;
height:100vh;
background:#f4f4f4;
z-index:2147483646;
}

#mufu-pos{
display:grid;
grid-template-columns:70px 1fr 1fr;
height:100%;
width:100%;
font-family:Roboto,Helvetica,Arial,sans-serif;
}

.sidebar{
background:#2f2f2f;
color:white;
display:flex;
flex-direction:column;
align-items:center;
padding-top:20px;
}

.sidebar .menu{
margin:16px 0;
font-size:20px;
}

.products-area{
display:flex;
flex-direction:column;
}

.search-bar{
display:flex;
gap:10px;
padding:12px;
background:white;
}

.search-bar input{
flex:1;
padding:12px;
}

.calc{
background:#3f5554;
color:white;
border:none;
width:50px;
font-size:18px;
}

.filters{
display:flex;
gap:10px;
padding:12px;
}

.filters button{
background:#2f7e79;
border:none;
color:white;
padding:10px 16px;
font-size:14px;
}

.product-grid{
display:grid;
grid-template-columns:repeat(3,1fr);
gap:20px;
padding:20px;
}

.product-card{
background:white;
border-radius:6px;
overflow:hidden;
position:relative;
cursor:pointer;
}

.product-card img{
width:100%;
height:180px;
object-fit:cover;
}

.overlay{
position:absolute;
bottom:0;
left:0;
right:0;
background:rgba(0,0,0,.6);
color:white;
padding:10px;
font-size:14px;
}

.add-product{
display:flex;
align-items:center;
justify-content:center;
background:#dcdcdc;
}

.plus{
font-size:42px;
}

.add-product{
  background:#17a2a0; /* mismo color de botones */
}

.add-product .plus{
  color:#fff;
}

.cart{
background:#ffffff;
border-left:1px solid #e5e5e5;
box-shadow:-3px 0 8px rgba(0,0,0,0.05);
padding:24px;
display:flex;
flex-direction:column;
}

.cart-row{
display:grid;
grid-template-columns:45px 1fr 140px 110px 110px; align-items:center;
gap:10px;
padding:10px 0;
border-bottom:1px solid #ddd;
}

.total{
font-size:24px;
color:#17a2a0;
margin-top:12px;
}

.pos-actions{
display:grid;
grid-template-columns:repeat(4,1fr);
gap:14px;
margin-top:auto;
}

.pos-actions button{
padding:18px;
border:none;
color:white;
cursor:pointer;
font-size:15px;
font-weight:600;
border-radius:4px;
}

.apartar{background:#17a2a0;}
.nota{background:#555;}
.recargo{background:#17a2a0;}
.cupon{background:#17a2a0;}
.envio{background:#17a2a0;}
.suspender{background:#e3a008;}
.vaciar{background:#c94f34;}
.pagar{
background:#a8b820;
font-size:18px;
padding:22px;
}



.cart-row button.remove{
background:none;
border:none;
font-size:18px;
cursor:pointer;
}

.product-info{
display:flex;
flex-direction:column;
font-size:14px;
}

.variation{
font-size:12px;
color:#777;
}

.qty{
display:flex;
gap:6px;
align-items:center;
}

.qty button{
width:28px;
height:28px;
}

.unit{
text-align:right;
color:#777;
}

.price{
text-align:right;
font-weight:600;
}


.cart-row{
align-items:center;
}

.cart-row button.remove{
display:flex;
align-items:center;
justify-content:center;
width:36px;
height:36px;
font-size:20px;
opacity:.7;
}

.cart-row:hover button.remove{
opacity:1;
}

.qty{
display:flex;
align-items:center;
gap:8px;
}

.qty button{
width:36px;
height:36px;
border-radius:6px;
font-size:18px;
font-weight:bold;
cursor:pointer;
}

.qty span{
min-width:28px;
text-align:center;
font-size:16px;
font-weight:600;
}

.cart-row{
padding:12px 8px;
border-bottom:1px solid #eee;
}


/* --- YITH style quantity buttons --- */
.qty{
display:flex !important;
align-items:center !important;
justify-content:center !important;
gap:6px !important;
}

.qty button{
width:32px !important;
height:32px !important;
min-width:32px !important;
padding:0 !important;
display:flex !important;
align-items:center !important;
justify-content:center !important;
border-radius:6px !important;
font-size:16px !important;
font-weight:600 !important;
line-height:1 !important;
cursor:pointer !important;
}

.qty span{
width:28px !important;
text-align:center !important;
font-size:15px !important;
font-weight:600 !important;
}



/* ===== Carrito estilo YITH ===== */

.cart-row{
font-size:16px;
}

.product-name{
font-size:16px;
font-weight:600;
color:#222;
}

.variation{
font-size:13px;
color:#666;
}

.unit{
font-size:15px;
color:#666;
}

.price{
font-size:16px;
font-weight:600;
color:#000;
}

/* Subtotal negro */
.totals div{
color:#000;
font-size:15px;
}

/* Total más visible */
.total{
font-size:20px;
font-weight:700;
color:#1fa7a1;
}

/* --- ajustes solicitados --- */

/* precio en cards blanco */
.product-card .price,
.producto .price{
color:#ffffff !important;
}

/* titulo carrito pequeño negro */
.cart-title,
.carrito-title,
h2.cart-title{
font-size:18px !important;
color:#000 !important;
font-weight:600;
}

/* total grande verde */
.total,
.cart-total{
font-size:26px !important;
font-weight:700;
color:#1fa7a1 !important;
}

/* FORZAR SUBTOTAL EN NEGRITA */
.cart .subtotal,
.cart .subtotal span,
.cart div:has(> span:contains("SUBTOTAL")),
.cart strong{
font-weight:700 !important;
color:#000 !important;
}

/* alternativa más directa */
.cart div{
font-weight:700;
}

/* SUBTOTAL y TOTAL alineados como YITH */
.totals div,
.cart-total,
.subtotal{
    display:flex !important;
    justify-content:space-between !important;
    align-items:center;
    width:100%;
}

/* mover signo ₡ junto al monto y alinearlo a la derecha */
.subtotal span,
.cart-total span,
.totals span{
    margin-left:auto !important;
    text-align:right !important;
    display:inline-flex;
    justify-content:flex-end;
    gap:2px;
}

/* FIX definitivo: símbolo ₡ junto al monto a la derecha */
.subtotal,
.cart-total,
.totals div{
    display:flex !important;
    justify-content:space-between !important;
    align-items:center;
}

/* empujar moneda y monto a la derecha */
.subtotal span:first-of-type,
.cart-total span:first-of-type,
.totals span:first-of-type{
    margin-left:auto !important;
}

/* mantener símbolo y número juntos */
.subtotal span,
.cart-total span,
.totals span{
    display:inline-flex;
    align-items:center;
    gap:2px;
}


/* FIX definitivo símbolo colones con monto a la derecha */
.subtotal .woocommerce-Price-amount,
.total .woocommerce-Price-amount{
    margin-left:auto !important;
    text-align:right !important;
    display:inline-block !important;
}

.woocommerce-Price-amount bdi{
    white-space:nowrap;
}

.woocommerce-Price-currencySymbol{
    margin-right:3px !important;
}



/* FIX REAL: el ₡ está en la etiqueta SUBTOTAL, no en el precio */
.subtotal .woocommerce-Price-currencySymbol,
.total .woocommerce-Price-currencySymbol{
    display:none !important;
}

/* agregar símbolo antes del monto a la derecha */
.subtotal .woocommerce-Price-amount::before,
.total .woocommerce-Price-amount::before{
    content:"₡";
    margin-right:3px;
}

.subtotal .woocommerce-Price-amount,
.total .woocommerce-Price-amount{
    margin-left:auto !important;
    text-align:right !important;
}



/* === MUFU POS FIX: carrito con scroll correcto === */

/* contenedor carrito ocupa toda la altura */
.cart{
display:flex;
flex-direction:column;
height:100%;
}

/* SOLO la lista de productos scrollea */
#cart-items{
flex:1 1 auto;
overflow-y:auto;
min-height:0;
padding-right:6px;
}

/* subtotal y total fijos */
.totals{
flex-shrink:0;
border-top:1px solid #e5e5e5;
padding:10px 0;
background:#ffffff;
}

/* botones POS fijos abajo */
.pos-actions{
flex-shrink:0;
border-top:1px solid #e5e5e5;
padding-top:10px;
background:#ffffff;
}

/* scrollbar limpio */
#cart-items::-webkit-scrollbar{
width:6px;
}
#cart-items::-webkit-scrollbar-thumb{
background:#c5c5c5;
border-radius:6px;
}



/* === FIX REAL SCROLL CARRITO: productos scrollean, footer fijo === */
.cart{
    display:grid !important;
    grid-template-rows:auto minmax(0,1fr) auto auto !important;
    height:100% !important;
    min-height:0 !important;
    overflow:hidden !important;
}

#cart-items{
    min-height:0 !important;
    overflow-y:scroll !important;
    overflow-x:hidden !important;
    padding-right:6px !important;
}

.totals{
    flex-shrink:0 !important;
    position:relative !important;
    z-index:2;
    background:#ffffff !important;
}

.pos-actions{
    margin-top:0 !important;
    flex-shrink:0 !important;
    position:relative !important;
    z-index:2;
    background:#ffffff !important;
}

/* scrollbar visible */
#cart-items::-webkit-scrollbar{
    width:8px !important;
}
#cart-items::-webkit-scrollbar-thumb{
    background:#bfbfbf !important;
    border-radius:8px;
}
#cart-items::-webkit-scrollbar-track{
    background:#efefef !important;
}


/* variation modal */
.mufu-var-backdrop{
position:fixed;
inset:0;
background:rgba(0,0,0,.55);
display:flex;
align-items:center;
justify-content:center;
z-index:2147483647;
}
.mufu-var-box{
background:#fff;
width:340px;
max-width:92vw;
border-radius:8px;
padding:16px;
box-shadow:0 10px 30px rgba(0,0,0,.2);
}


/* === FIX REAL MODAL PRODUCTO === */

.mufu-var-box,
.mufu-var-box *{
  color:#000 !important;
}

.mufu-var-header{
display:flex;
align-items:center;
justify-content:space-between;
margin-bottom:12px;
}
#mufu-var-close{
background:none;
border:none;
font-size:22px;
cursor:pointer;
}
.mufu-var-list{
display:flex;
flex-direction:column;
gap:8px;
}
.mufu-var-option{
display:flex;
justify-content:space-between;
align-items:center;
width:100%;
text-align:left;
padding:12px;
border:1px solid #ddd;
background:#fff;
cursor:pointer;
}
.mufu-var-option:hover{
background:#f7f7f7;
}

/* MUFU search dropdown */
.search-bar{position:relative;}
.mufu-dropdown{
position:absolute;
top:52px;
left:12px;
right:62px;
background:#fff;
border:1px solid #ddd;
box-shadow:0 2px 6px rgba(0,0,0,0.15);
z-index:9999;
max-height:300px;
overflow-y:auto;
}
.mufu-item{
display:flex;
justify-content:space-between;
padding:10px 12px;
cursor:pointer;
font-size:14px;
}
.mufu-item:hover{background:#f5f5f5;}
.mufu-item .price{font-weight:700;}


/* MUFU dropdown visual fixes */
.mufu-item{
display:flex;
justify-content:space-between;
padding:10px 12px;
cursor:pointer;
font-size:14px;
color:#000;
border-bottom:1px solid #eee;
}

.mufu-item .price{
font-weight:700;
color:#000;
}

.mufu-dropdown{
border-radius:6px;
}

/* SKU visible in dropdown */
.mufu-item .sku{
color:#777;
font-size:12px;
margin-left:6px;
}
#mufu-discount-modal select,
#mufu-discount-modal input{
width:100%;
margin-bottom:10px;
padding:10px;
border:1px solid #ddd;
border-radius:4px;
font-size:14px;
box-sizing:border-box;
}

/* ===== MUFU DISCOUNT MODAL ===== */

#mufu-discount-modal{
position:fixed;
inset:0;
background:rgba(0,0,0,.55);
display:flex;
align-items:center;
justify-content:center;
z-index:2147483647;
}

.mufu-modal-box{
background:#fff;
width:340px;
max-width:92vw;
border-radius:8px;
padding:16px;
box-shadow:0 10px 30px rgba(0,0,0,.2);
display:flex;
flex-direction:column;
gap:10px;
}

.mufu-modal-box h3{
margin:0 0 10px 0;
font-size:18px;
}

/* === FIX REAL FORZADO MODAL === */

.mufu-modal-box,
.mufu-modal-box *{
  color:#000 !important;
}

.mufu-modal-box button{
padding:10px;
border:none;
cursor:pointer;
border-radius:4px;
}

#mufu-apply-discount{
background:#17a2a0;
color:white;
}

#mufu-close-discount{
background:#ddd;
}

.product-card.mufu-out {
    opacity: 0.4;
    pointer-events: none;
    position: relative;
}

.product-card.mufu-out::after {
    content: "AGOTADO";
    position: absolute;
    top: 10px;
    left: 10px;
    background: #e74c3c;
    color: white;
    font-size: 11px;
    padding: 4px 6px;
    border-radius: 4px;
    font-weight: bold;
}


/* =========================================
   🔥 SCROLL IZQUIERDA (PRODUCTOS) PRO
========================================= */

/* contenedor izquierdo completo */
.products-area{
    height:100%;
    display:grid !important;
    grid-template-rows:auto auto minmax(0,1fr) !important;
    min-height:0;
}

/* grid ahora scrollea */
.product-grid{
    overflow-y:auto !important;
    min-height:0;
}

/* scrollbar limpio */
.product-grid::-webkit-scrollbar{
    width:8px;
}
.product-grid::-webkit-scrollbar-thumb{
    background:#bfbfbf;
    border-radius:8px;
}
.product-grid::-webkit-scrollbar-track{
    background:#efefef;
}


/* =========================================
   🔥 FIX TAMAÑO PRODUCTOS + SCROLL PRO
========================================= */

/* mantener tamaño visual original */
.product-grid{
    overflow-y:auto !important;
    min-height:0;
    align-content:start !important; /* 🔥 clave */
}

/* evitar que se encojan */
.product-card{
    min-height:220px; /* 🔥 ajusta según tu diseño original */
}

/* asegurar imágenes consistentes */
.product-card img{
    height:180px !important;
    object-fit:cover;
}

/* opcional: evitar compresión vertical */
.product-grid{
    grid-auto-rows: auto;
}

/* MUFU Apartados */
.buscar-apartado{
background:#4d5d5d;
}


/* ======================================================
MUFU POS THEME SHIELD v2
Evita que themes de WordPress rompan el POS
====================================================== */

#mufu-pos-wrapper,
#mufu-pos-wrapper *{
    font-family: Roboto, Helvetica, Arial, sans-serif !important;
}

/* ===== MODALES ===== */

#mufu-payment-modal,
#mufu-payment-modal *{
    color:#111 !important;
}

#mufu-payment-modal input,
#mufu-payment-modal select{
    background:#fff !important;
    color:#111 !important;
    border:1px solid #dcdcdc !important;
}

#mufu-payment-modal button{
    color:#111 !important;
}

/* ===== BOTÓN PAGAR ===== */

#mufu-payment-modal .pay{
    background:#dfe8b3 !important;
    color:#6b6b6b !important;
}

#mufu-payment-modal .pay[data-enabled="1"]{
    background:#b7db3a !important;
    color:#2f2f2f !important;
}

/* ===== TECLADO ===== */

#mufu-payment-modal .key,
#mufu-payment-modal .clear,
#mufu-payment-modal .back,
#mufu-payment-modal .volver{
    background:#fff !important;
    color:#111 !important;
    border:1px solid #e5e5e5 !important;
}

/* ===== RECIBO ===== */

#mufu-receipt-content,
#mufu-receipt-content *{
    color:#111 !important;
    font-family: Roboto, Helvetica, Arial, sans-serif !important;
}

/* EXCEPCIONES */
#print-receipt{
    background:#4d5d5d !important;
    color:#fff !important;
}

/* ===== INPUTS GLOBALES POS ===== */

#mufu-pos-wrapper input,
#mufu-pos-wrapper textarea,
#mufu-pos-wrapper select{
    color:#111 !important;
}

/* ===== FIX TEMAS OSCUROS ===== */

body.dark-mode #mufu-pos-wrapper,
body.dark-theme #mufu-pos-wrapper{
    background:#f4f4f4 !important;
}

/* ===== TEXTOS VISIBLES ===== */

#mufu-pos-wrapper label,
#mufu-pos-wrapper span,
#mufu-pos-wrapper div{
    text-shadow:none !important;
}

/* ===== FIX SELECT PAYMENT ===== */

#mufu-payment-method option{
    color:#111 !important;
    background:#fff !important;
}

/* ======================================================
MUFU FIX: X eliminar producto visible en carrito
====================================================== */

#mufu-pos-wrapper .cart-row button.remove,
#mufu-pos-wrapper .cart-row .remove{
    color:#111 !important;
    background:transparent !important;
    opacity:1 !important;
    font-size:18px !important;
    font-weight:700 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
}

#mufu-pos-wrapper .cart-row button.remove:hover,
#mufu-pos-wrapper .cart-row .remove:hover{
    color:#c94f34 !important;
}

/* ======================================================
MUFU PERFORMANCE v1 - Carga tipo YITH
====================================================== */

#mufu-product-grid{
    will-change: scroll-position;
}

#mufu-product-grid .product-card{
    contain: layout paint;
}

#mufu-product-grid .product-card:not(.mufu-visible):not(.add-product):not(.mufu-skeleton-card){
    opacity:0;
    transform:translateY(4px);
}

#mufu-product-grid .product-card.mufu-visible,
#mufu-product-grid .product-card.add-product{
    opacity:1;
    transform:translateY(0);
    transition:opacity .18s ease, transform .18s ease;
}

.mufu-product-img{
    width:100% !important;
    height:180px !important;
    object-fit:cover !important;
    display:block !important;
}

/* Skeleton cards */
.mufu-skeleton-card{
    background:#eeeeee !important;
    min-height:220px;
    pointer-events:none;
    position:relative;
    overflow:hidden;
}

.mufu-skeleton-img{
    height:180px;
    background:linear-gradient(90deg,#eeeeee 0%,#f7f7f7 45%,#eeeeee 90%);
    background-size:200% 100%;
    animation:mufuSkeletonShimmer 1.1s infinite linear;
}

.mufu-skeleton-overlay{
    position:absolute;
    bottom:0;
    left:0;
    right:0;
    padding:10px;
    background:rgba(0,0,0,.18);
}

.mufu-skeleton-line{
    height:12px;
    border-radius:10px;
    background:linear-gradient(90deg,#dddddd 0%,#f2f2f2 45%,#dddddd 90%);
    background-size:200% 100%;
    animation:mufuSkeletonShimmer 1.1s infinite linear;
    margin-bottom:7px;
}

.mufu-skeleton-line.short{
    width:55%;
}

@keyframes mufuSkeletonShimmer{
    0%{background-position:200% 0;}
    100%{background-position:-200% 0;}
}


/* ======================================================
MUFU MINOR FIXES v1
Sidebar clickeable + labels + colores protegidos
====================================================== */

#mufu-pos{
    grid-template-columns:86px 1fr 1fr !important;
}

.sidebar{
    width:86px !important;
    padding-top:14px !important;
    gap:4px !important;
}

.sidebar .menu,
.sidebar .mufu-side-btn{
    width:74px !important;
    min-height:58px !important;
    margin:4px 0 !important;
    padding:7px 4px !important;
    border-radius:8px !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    gap:3px !important;
    cursor:pointer !important;
    color:#fff !important;
    background:rgba(255,255,255,0.04) !important;
    box-sizing:border-box !important;
    user-select:none !important;
    text-decoration:none !important;
}

.sidebar .menu:hover,
.sidebar .mufu-side-btn:hover{
    background:rgba(255,255,255,0.12) !important;
}

.sidebar .mufu-side-icon{
    font-size:18px !important;
    line-height:1 !important;
    color:#fff !important;
}

.sidebar .mufu-side-label{
    font-size:9px !important;
    line-height:1.05 !important;
    color:#fff !important;
    text-align:center !important;
    font-weight:700 !important;
    letter-spacing:.4px !important;
    text-transform:uppercase !important;
}

/* Protección de colores en modal de pago */
#mufu-payment-modal .total-value{
    color:#111 !important;
    font-weight:700 !important;
}

#mufu-payment-modal .balance-value{
    color:#d54b3d !important;
    font-weight:700 !important;
}

#mufu-payment-modal .change-value{
    color:#2aa198 !important;
    font-weight:700 !important;
}


/* ======================================================
MUFU CART IMAGES v1
====================================================== */

.cart-row{
    display:grid !important;
    grid-template-columns:24px 54px minmax(0,1fr) auto auto auto !important;
    align-items:center !important;
    gap:10px !important;
}

.cart-thumb-wrap{
    width:46px !important;
    height:46px !important;
    border-radius:6px !important;
    overflow:hidden !important;
    background:#f4f4f4 !important;
    flex:0 0 46px !important;
}

.cart-thumb{
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    display:block !important;
}

.cart-thumb-empty{
    background:transparent !important;
}

.cart-row .product-info{
    min-width:0 !important;
}

.cart-row .product-name{
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:normal !important;
}


/* ======================================================
MUFU CART/RECEIPT IMAGE FIX FINAL
====================================================== */

.cart-row{
    display:grid !important;
    grid-template-columns:24px 54px minmax(0,1fr) auto auto auto !important;
    align-items:center !important;
    gap:10px !important;
}

.cart-thumb-wrap{
    width:46px !important;
    height:46px !important;
    border-radius:6px !important;
    overflow:hidden !important;
    background:#f4f4f4 !important;
    flex:0 0 46px !important;
}

.cart-thumb{
    width:100% !important;
    height:100% !important;
    object-fit:cover !important;
    display:block !important;
}

.cart-thumb-empty{
    background:transparent !important;
}

.mufu-receipt-line-item{
    display:flex !important;
    gap:10px !important;
    align-items:flex-start !important;
}

.mufu-receipt-thumb{
    width:52px !important;
    height:52px !important;
    object-fit:cover !important;
    border-radius:6px !important;
    flex:0 0 52px !important;
    background:#f4f4f4 !important;
}


/* MUFU v13.1 - Restaurar productos visibles + scroll izquierdo estable */
#mufu-pos{
  height:100vh !important;
  overflow:hidden !important;
}

.products-area{
  height:100vh !important;
  min-height:0 !important;
  overflow:hidden !important;
  display:grid !important;
  grid-template-rows:auto auto minmax(0,1fr) !important;
}

#mufu-product-grid,
.product-grid{
  min-height:0 !important;
  height:100% !important;
  max-height:100% !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  align-content:start !important;
  grid-auto-rows:auto !important;
}

#mufu-product-grid .product-card{
  min-height:220px !important;
  opacity:1;
}

#mufu-product-grid .product-card.mufu-skeleton-card{
  opacity:1 !important;
}


/* MUFU v13.2 - Scroll real de productos + layout estable
   FIX v1.0.6.47: no bloquear html/body globalmente.
   El overflow hidden solo aplica dentro de /mufu-pos/ con body.mufu-pos-fullscreen. */
body.mufu-pos-fullscreen{
  overflow:hidden !important;
}

#mufu-pos-wrapper{
  height:100vh !important;
  max-height:100vh !important;
  overflow:hidden !important;
}

#mufu-pos{
  height:100vh !important;
  max-height:100vh !important;
  min-height:0 !important;
  overflow:hidden !important;
}

.products-area{
  height:100vh !important;
  max-height:100vh !important;
  min-height:0 !important;
  overflow:hidden !important;
  display:grid !important;
  grid-template-rows:auto auto 1fr !important;
}

.search-bar,
.filters{
  flex-shrink:0 !important;
}

#mufu-product-grid,
.product-grid{
  height:auto !important;
  max-height:none !important;
  min-height:0 !important;
  overflow-y:scroll !important;
  overflow-x:hidden !important;
  align-content:start !important;
  grid-auto-rows:auto !important;
  padding-bottom:80px !important;
  -webkit-overflow-scrolling:touch !important;
}

#mufu-product-grid::-webkit-scrollbar,
.product-grid::-webkit-scrollbar{
  width:8px !important;
}

#mufu-product-grid::-webkit-scrollbar-thumb,
.product-grid::-webkit-scrollbar-thumb{
  background:#bfbfbf !important;
  border-radius:8px !important;
}

#mufu-product-grid::-webkit-scrollbar-track,
.product-grid::-webkit-scrollbar-track{
  background:#efefef !important;
}


/* MUFU POS v13.3 - Botón PAGAR con jerarquía tipo YITH */
.pos-actions{
  grid-template-columns: repeat(4, 1fr) 1.45fr !important;
  grid-auto-rows: minmax(58px, auto) !important;
  align-items: stretch !important;
}

.pos-actions .pagar{
  grid-column: 5 !important;
  grid-row: 1 / span 2 !important;
  min-height: 132px !important;
  height: 100% !important;
  background:#a8b820 !important;
  color:#fff !important;
  font-size:26px !important;
  font-weight:900 !important;
  letter-spacing:.08em !important;
  text-transform:uppercase !important;
  border-radius:4px !important;
  box-shadow:0 8px 18px rgba(0,0,0,.16) !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}

.pos-actions .pagar:hover{
  filter:brightness(1.04);
  transform:translateY(-1px);
}

.pos-actions .cerrar-caja{
  grid-column: 1 / span 2 !important;
}

@media(max-width:1200px){
  .pos-actions{
    grid-template-columns: repeat(4, 1fr) !important;
  }

  .pos-actions .pagar{
    grid-column: 1 / -1 !important;
    grid-row:auto !important;
    min-height:78px !important;
    font-size:22px !important;
  }

  .pos-actions .cerrar-caja{
    grid-column:auto !important;
  }
}


/* MUFU POS v13.4 - Fix seguro botón X sin romper layout del carrito */
#cart-items{
  overflow-x:hidden !important;
}

.cart-row{
  position:relative !important;
}

.cart-row button.remove,
.cart-row .remove{
  display:inline-flex !important;
  align-items:center !important;
  justify-content:center !important;
  width:26px !important;
  height:26px !important;
  min-width:26px !important;
  min-height:26px !important;
  padding:0 !important;
  margin:0 6px 0 0 !important;
  border:0 !important;
  background:transparent !important;
  color:#111 !important;
  font-size:16px !important;
  font-weight:800 !important;
  line-height:1 !important;
  opacity:1 !important;
  visibility:visible !important;
  cursor:pointer !important;
  flex:0 0 26px !important;
  z-index:10 !important;
  overflow:visible !important;
}

.cart-row button.remove:hover,
.cart-row .remove:hover{
  color:#c94f34 !important;
  background:rgba(201,79,52,.08) !important;
  border-radius:50% !important;
}

.cart-row .product-info{
  min-width:0 !important;
}

.cart-row .price,
.cart-row .unit{
  white-space:nowrap !important;
}

/* ======================================================
   MUFU POS v0.7.6 - FULLSCREEN UNIVERSAL APP MODE
   Objetivo: que /mufu-pos/ se vea igual en cualquier hosting, theme o constructor.
====================================================== */

html:has(body.mufu-pos-fullscreen),
body.mufu-pos-fullscreen{
  margin:0 !important;
  padding:0 !important;
  width:100% !important;
  height:100% !important;
  min-height:100% !important;
  overflow:hidden !important;
  background:#f4f4f4 !important;
  overscroll-behavior:none !important;
}

body.mufu-pos-fullscreen #wpadminbar,
body.mufu-pos-fullscreen header,
body.mufu-pos-fullscreen footer,
body.mufu-pos-fullscreen .site-header,
body.mufu-pos-fullscreen .site-footer,
body.mufu-pos-fullscreen .entry-header,
body.mufu-pos-fullscreen .entry-footer,
body.mufu-pos-fullscreen .page-header,
body.mufu-pos-fullscreen .elementor-location-header,
body.mufu-pos-fullscreen .elementor-location-footer,
body.mufu-pos-fullscreen .wp-site-blocks > header,
body.mufu-pos-fullscreen .wp-site-blocks > footer{
  display:none !important;
}

body.mufu-pos-fullscreen .wp-site-blocks,
body.mufu-pos-fullscreen .site,
body.mufu-pos-fullscreen .site-content,
body.mufu-pos-fullscreen .content-area,
body.mufu-pos-fullscreen main,
body.mufu-pos-fullscreen article,
body.mufu-pos-fullscreen .entry-content{
  margin:0 !important;
  padding:0 !important;
  width:100% !important;
  max-width:none !important;
  height:100% !important;
  min-height:0 !important;
  overflow:hidden !important;
}

body.mufu-pos-fullscreen #mufu-pos-wrapper{
  position:fixed !important;
  inset:0 !important;
  top:0 !important;
  left:0 !important;
  right:0 !important;
  bottom:0 !important;
  width:100vw !important;
  height:100vh !important;
  height:100dvh !important;
  max-width:none !important;
  max-height:none !important;
  margin:0 !important;
  padding:0 !important;
  overflow:hidden !important;
  background:#f4f4f4 !important;
  z-index:2147483647 !important;
}

body.mufu-pos-fullscreen #mufu-pos{
  width:100% !important;
  height:100vh !important;
  height:100dvh !important;
  max-height:100dvh !important;
  min-height:0 !important;
  margin:0 !important;
  padding:0 !important;
  overflow:hidden !important;
  box-sizing:border-box !important;
}

body.mufu-pos-fullscreen #mufu-pos,
body.mufu-pos-fullscreen #mufu-pos *{
  box-sizing:border-box !important;
}

body.mufu-pos-fullscreen .products-area,
body.mufu-pos-fullscreen .cart{
  height:100dvh !important;
  max-height:100dvh !important;
  min-height:0 !important;
  overflow:hidden !important;
}

body.mufu-pos-fullscreen .product-grid,
body.mufu-pos-fullscreen #mufu-product-grid,
body.mufu-pos-fullscreen #cart-items{
  min-height:0 !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  -webkit-overflow-scrolling:touch !important;
}

body.mufu-pos-fullscreen .search-bar,
body.mufu-pos-fullscreen .filters,
body.mufu-pos-fullscreen .totals,
body.mufu-pos-fullscreen .pos-actions{
  flex-shrink:0 !important;
}


/* MUFU POS v0.7.8 - Correcciones rápidas de clic y modal de pago */
#mufu-payment-modal,
#mufu-payment-modal *{
  box-sizing:border-box !important;
}

.sidebar .mufu-side-btn,
.sidebar .mufu-side-btn *{
  pointer-events:auto !important;
}

#mufu-config-btn{
  position:relative !important;
  z-index:20 !important;
}

.pos-actions .pagar{
  position:relative !important;
  z-index:30 !important;
  pointer-events:auto !important;
  cursor:pointer !important;
}

.pos-actions .pagar *{
  pointer-events:none !important;
}


/* === MUFU POS v1.0.6.23 - Botonera estilo YITH + cupón discreto === */
.mufu-coupon-engine{
  margin:8px 0 8px !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
.mufu-coupon-engine label{
  display:block !important;
  margin:0 0 3px !important;
  font-size:10px !important;
  line-height:1 !important;
  font-weight:800 !important;
  text-transform:uppercase !important;
  color:#111827 !important;
  letter-spacing:.03em !important;
}
.mufu-coupon-engine .mufu-coupon-row{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) 76px !important;
  gap:6px !important;
  align-items:center !important;
}
.mufu-coupon-engine input,
#mufu-coupon-input{
  height:30px !important;
  min-height:30px !important;
  padding:5px 9px !important;
  font-size:12px !important;
  border:1px solid #d1d5db !important;
  border-radius:4px !important;
  background:#fff !important;
  box-shadow:none !important;
}
.mufu-coupon-engine .mufu-coupon-apply,
#mufu-coupon-apply{
  height:30px !important;
  min-height:30px !important;
  padding:0 10px !important;
  font-size:10px !important;
  font-weight:900 !important;
  border-radius:4px !important;
  background:#17a2a0 !important;
  color:#fff !important;
  border:0 !important;
  text-transform:uppercase !important;
  box-shadow:none !important;
}
.mufu-coupon-message,
.mufu-applied-codes-list{
  font-size:11px !important;
  margin-top:4px !important;
}

.pos-actions{
  display:grid !important;
  grid-template-columns:repeat(5, minmax(0,1fr)) 1.55fr !important;
  grid-template-rows:34px 72px !important;
  gap:8px !important;
  align-items:stretch !important;
  padding-top:8px !important;
  border-top:1px solid #e5e5e5 !important;
  background:#fff !important;
}
.pos-actions button,
.pos-actions .mufu-cambios-action{
  min-height:0 !important;
  height:72px !important;
  padding:8px 7px !important;
  border-radius:4px !important;
  font-size:12px !important;
  line-height:1.12 !important;
  font-weight:900 !important;
  text-align:center !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  box-shadow:none !important;
}
.pos-actions .apartar{grid-column:1 !important; grid-row:2 !important;}
.pos-actions .buscar-apartado{grid-column:2 !important; grid-row:2 !important;}
.pos-actions .recargo{grid-column:3 !important; grid-row:2 !important;}
.pos-actions .mufu-cambios-action{grid-column:4 !important; grid-row:2 !important;}
.pos-actions .cerrar-caja{
  grid-column:5 !important;
  grid-row:2 !important;
  height:72px !important;
  min-height:0 !important;
  font-size:12px !important;
  opacity:.55;
}
.pos-actions .vaciar{
  grid-column:6 !important;
  grid-row:1 !important;
  height:34px !important;
  min-height:0 !important;
  padding:4px 8px !important;
  font-size:11px !important;
  font-weight:900 !important;
  background:#c94f34 !important;
  color:#fff !important;
  border-radius:4px !important;
}
.pos-actions .pagar{
  grid-column:6 !important;
  grid-row:2 !important;
  height:72px !important;
  min-height:72px !important;
  padding:8px 10px !important;
  background:#a8b820 !important;
  color:#fff !important;
  font-size:23px !important;
  font-weight:900 !important;
  letter-spacing:.05em !important;
  text-transform:uppercase !important;
  border-radius:4px !important;
  box-shadow:0 8px 18px rgba(0,0,0,.14) !important;
}
@media(max-width:1200px){
  .pos-actions{
    grid-template-columns:repeat(3, minmax(0,1fr)) !important;
    grid-template-rows:auto !important;
  }
  .pos-actions .apartar,
  .pos-actions .buscar-apartado,
  .pos-actions .recargo,
  .pos-actions .mufu-cambios-action,
  .pos-actions .cerrar-caja,
  .pos-actions .vaciar,
  .pos-actions .pagar{
    grid-column:auto !important;
    grid-row:auto !important;
    height:58px !important;
    min-height:58px !important;
  }
  .pos-actions .pagar{
    grid-column:1 / -1 !important;
    font-size:22px !important;
  }
}

/* === MUFU POS v1.0.6.24 - Ajuste final botonera compacta + cupón bajo === */
body.mufu-pos-fullscreen .mufu-coupon-engine{
  margin:5px 0 6px !important;
  padding:0 !important;
  border:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
body.mufu-pos-fullscreen .mufu-coupon-engine label{
  margin:0 0 2px !important;
  font-size:9px !important;
  line-height:1 !important;
}
body.mufu-pos-fullscreen .mufu-coupon-engine .mufu-coupon-row{
  display:grid !important;
  grid-template-columns:minmax(0,1fr) 72px !important;
  gap:5px !important;
  align-items:center !important;
}
body.mufu-pos-fullscreen .mufu-coupon-engine input,
body.mufu-pos-fullscreen #mufu-coupon-input{
  height:24px !important;
  min-height:24px !important;
  padding:3px 8px !important;
  font-size:11px !important;
  line-height:24px !important;
  border-radius:3px !important;
}
body.mufu-pos-fullscreen .mufu-coupon-engine .mufu-coupon-apply,
body.mufu-pos-fullscreen #mufu-coupon-apply{
  height:24px !important;
  min-height:24px !important;
  padding:0 8px !important;
  font-size:9px !important;
  line-height:24px !important;
  border-radius:3px !important;
}
body.mufu-pos-fullscreen .mufu-coupon-message,
body.mufu-pos-fullscreen .mufu-applied-codes-list{
  font-size:10px !important;
  margin-top:3px !important;
}

body.mufu-pos-fullscreen .cart > .pos-actions{
  display:grid !important;
  grid-template-columns:repeat(5, minmax(0,1fr)) minmax(112px,1.55fr) !important;
  grid-template-rows:28px 62px !important;
  gap:6px !important;
  align-items:stretch !important;
  padding-top:6px !important;
  border-top:1px solid #e5e5e5 !important;
  background:#fff !important;
}
body.mufu-pos-fullscreen .cart > .pos-actions > button,
body.mufu-pos-fullscreen .cart > .pos-actions > .mufu-cambios-action{
  height:62px !important;
  min-height:62px !important;
  padding:6px 6px !important;
  font-size:11px !important;
  line-height:1.1 !important;
  border-radius:4px !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  text-align:center !important;
  box-shadow:none !important;
}
body.mufu-pos-fullscreen .cart > .pos-actions > .apartar{grid-column:1 !important; grid-row:2 !important;}
body.mufu-pos-fullscreen .cart > .pos-actions > .buscar-apartado{grid-column:2 !important; grid-row:2 !important;}
body.mufu-pos-fullscreen .cart > .pos-actions > .recargo{grid-column:3 !important; grid-row:2 !important;}
body.mufu-pos-fullscreen .cart > .pos-actions > .mufu-cambios-action{grid-column:4 !important; grid-row:2 !important;}
body.mufu-pos-fullscreen .cart > .pos-actions > .cerrar-caja{
  grid-column:5 !important;
  grid-row:2 !important;
  height:62px !important;
  min-height:62px !important;
  background:#4b5f5d !important;
  color:#fff !important;
  opacity:1 !important;
  border:0 !important;
}
body.mufu-pos-fullscreen .cart > .pos-actions > .vaciar{
  grid-column:6 !important;
  grid-row:1 !important;
  width:100% !important;
  height:28px !important;
  min-height:28px !important;
  padding:2px 8px !important;
  font-size:10px !important;
  line-height:1 !important;
  background:#c94f34 !important;
  color:#fff !important;
  border:0 !important;
  border-radius:4px !important;
  box-shadow:none !important;
}
body.mufu-pos-fullscreen .cart > .pos-actions > .pagar{
  grid-column:6 !important;
  grid-row:2 !important;
  width:100% !important;
  height:62px !important;
  min-height:62px !important;
  padding:6px 10px !important;
  font-size:21px !important;
  line-height:1.05 !important;
  border-radius:4px !important;
}

/* v1.0.6.37 — Selector de variaciones con imagen propia */
.mufu-var-box-with-images{
  width:380px !important;
  max-width:94vw !important;
  border-radius:10px !important;
}
.mufu-var-box-with-images .mufu-var-list{
  gap:7px !important;
  max-height:70vh !important;
  overflow-y:auto !important;
}
.mufu-var-box-with-images .mufu-var-option{
  min-height:58px !important;
  padding:8px 10px !important;
  border:1px solid #e5e7eb !important;
  border-radius:0 !important;
  background:#fff !important;
  display:flex !important;
  align-items:center !important;
  justify-content:space-between !important;
  gap:10px !important;
}
.mufu-var-box-with-images .mufu-var-option:hover{
  background:#f8fafc !important;
  border-color:#cbd5e1 !important;
}
.mufu-var-box-with-images .mufu-var-left{
  display:flex !important;
  align-items:center !important;
  gap:10px !important;
  min-width:0 !important;
  flex:1 1 auto !important;
}
.mufu-var-box-with-images .mufu-var-thumb{
  width:42px !important;
  height:42px !important;
  flex:0 0 42px !important;
  border-radius:4px !important;
  overflow:hidden !important;
  background:#f3f4f6 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
}
.mufu-var-box-with-images .mufu-var-thumb img{
  width:100% !important;
  height:100% !important;
  object-fit:cover !important;
  display:block !important;
}
.mufu-var-box-with-images .mufu-var-main{
  display:flex !important;
  flex-direction:column !important;
  min-width:0 !important;
  line-height:1.2 !important;
}
.mufu-var-box-with-images .mufu-var-label{
  font-size:14px !important;
  font-weight:800 !important;
  color:#111827 !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}
.mufu-var-box-with-images .mufu-var-stock-badge{
  display:inline-block !important;
  width:max-content !important;
  margin-top:4px !important;
  padding:1px 5px !important;
  border-radius:2px !important;
  background:#a3b414 !important;
  color:#fff !important;
  font-size:9px !important;
  font-weight:900 !important;
  line-height:1.2 !important;
}
.mufu-var-box-with-images .mufu-var-stock-badge.is-out{
  background:#ef4444 !important;
}
.mufu-var-box-with-images .mufu-var-price{
  flex:0 0 auto !important;
  min-width:82px !important;
  text-align:right !important;
  font-size:14px !important;
  font-weight:950 !important;
  color:#111827 !important;
  white-space:nowrap !important;
}
.mufu-var-box-with-images .mufu-var-option.mufu-var-out{
  opacity:.45 !important;
  cursor:not-allowed !important;
}
.mufu-var-box-with-images .mufu-manual-var-option,
.mufu-var-box-with-images .mufu-manual-var-option:hover{
  opacity:1 !important;
  cursor:pointer !important;
}


/* ==============================
   MUFU NOTIFICACIONES - FASE 4.2.1
============================== */
.mufu-notifications-button{
    position:fixed;
    top:16px;
    right:18px;
    z-index:999999;
    width:54px;
    height:54px;
    border:1px solid rgba(226,232,240,.95);
    border-radius:18px;
    background:#ffffff;
    color:#0f172a;
    display:flex;
    align-items:center;
    justify-content:center;
    box-shadow:0 12px 32px rgba(15,23,42,.14);
    cursor:pointer;
    transition:transform .15s ease, box-shadow .15s ease;
}
.mufu-notifications-button:hover{
    transform:translateY(-1px);
    box-shadow:0 16px 38px rgba(15,23,42,.18);
}
.mufu-notifications-icon{
    font-size:24px;
    line-height:1;
}
.mufu-notifications-count{
    position:absolute;
    top:-7px;
    right:-7px;
    min-width:22px;
    height:22px;
    padding:0 6px;
    border-radius:999px;
    background:#ef4444;
    color:#fff;
    font-size:12px;
    font-weight:900;
    line-height:22px;
    text-align:center;
    border:2px solid #fff;
}
.mufu-notifications-button.mufu-has-notifications{
    border-color:#99f6e4;
}


/* ==============================
   MUFU PROMOCIONES EN POS - FASE 3
   Ajuste visual mínimo: anuncio compacto + tarjetas en promo.
============================== */
.mufu-pos-promo-banner{
  position:relative;
  display:flex;
  align-items:center;
  gap:12px;
  min-height:54px;
  margin:0 0 14px 0;
  padding:10px 46px 10px 12px;
  border:1px solid rgba(23,162,160,.38);
  border-radius:14px;
  background:linear-gradient(180deg,#ffffff 0%,#f8ffff 100%);
  box-shadow:0 8px 24px rgba(15,23,42,.06);
  color:#0f172a;
}
.mufu-pos-promo-banner.is-hidden{
  display:none !important;
}
.mufu-pos-promo-icon{
  width:38px;
  height:38px;
  min-width:38px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:14px;
  background:rgba(23,162,160,.12);
  font-size:20px;
}
.mufu-pos-promo-content{
  flex:1;
  min-width:0;
}
.mufu-pos-promo-slide{
  display:none;
}
.mufu-pos-promo-slide.active{
  display:block;
}
.mufu-pos-promo-eyebrow{
  font-size:12px;
  line-height:1.1;
  font-weight:900;
  color:#0f8f8b;
  margin-bottom:2px;
}
.mufu-pos-promo-name{
  font-size:14px;
  line-height:1.15;
  font-weight:900;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.mufu-pos-promo-meta{
  font-size:12px;
  line-height:1.2;
  color:#64748b;
  margin-top:3px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.mufu-pos-promo-details{
  color:#0f8f8b !important;
  font-size:12px;
  font-weight:900;
  text-decoration:none !important;
  white-space:nowrap;
  padding:8px 10px;
  border-radius:10px;
  background:rgba(23,162,160,.08);
}
.mufu-pos-promo-close{
  position:absolute;
  top:7px;
  right:9px;
  width:24px;
  height:24px;
  border:0;
  background:transparent;
  color:#64748b;
  font-size:24px;
  line-height:20px;
  cursor:pointer;
  padding:0;
}
.mufu-pos-promo-close:hover{
  color:#0f172a;
}

/* Tarjeta visual para productos con precio rebajado WooCommerce */
.product-card.mufu-product-on-sale{
  background:#ffffff;
  border-radius:7px;
  overflow:hidden;
  box-shadow:0 1px 4px rgba(15,23,42,.12);
}
.product-card.mufu-product-on-sale img{
  height:145px;
  object-fit:cover;
  display:block;
}
.product-card.mufu-product-on-sale .mufu-product-promo-badge{
  position:absolute;
  top:0;
  left:0;
  z-index:12;
  background:#f04444;
  color:#ffffff;
  font-size:11px;
  line-height:1;
  font-weight:950;
  padding:7px 10px;
  border-radius:6px 0 6px 0;
  box-shadow:0 6px 14px rgba(240,68,68,.22);
}
.product-card.mufu-product-on-sale .mufu-promo-card-info{
  position:relative;
  background:#ffffff;
  padding:10px 12px 11px;
  min-height:58px;
}
.product-card.mufu-product-on-sale .mufu-promo-card-info .name{
  color:#111827;
  font-size:14px;
  font-weight:900;
  margin-bottom:12px;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.product-card.mufu-product-on-sale .mufu-promo-prices{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
}
.product-card.mufu-product-on-sale .mufu-regular-price{
  color:#9ca3af;
  font-size:13px;
  font-weight:800;
  text-decoration:line-through;
  white-space:nowrap;
}
.product-card.mufu-product-on-sale .mufu-sale-price{
  color:#ef4444;
  font-size:15px;
  font-weight:950;
  white-space:nowrap;
}


/* ======================================================
   MUFU POS v1.0.6.109
   FIX visual promociones:
   - La tarjeta con promoción no empuja el grid hacia abajo.
   - El carrito conserva su layout normal aunque exista banner.
   - Las columnas del carrito no se sobreponen.
====================================================== */

/* Banner compacto: ocupa espacio propio y no se monta encima del carrito */
.cart .mufu-pos-promo-banner{
  flex:0 0 auto !important;
  width:100% !important;
  box-sizing:border-box !important;
  margin:0 0 16px 0 !important;
  max-height:74px !important;
  overflow:hidden !important;
}

.cart .mufu-pos-promo-banner.is-hidden{
  display:none !important;
}

.cart .cart-title{
  flex:0 0 auto !important;
  margin-top:0 !important;
  clear:both !important;
}

/* El listado del carrito queda debajo del banner, sin sobreposición */
#cart-items{
  position:relative !important;
  z-index:1 !important;
  min-height:0 !important;
  overflow-y:auto !important;
}

/* Layout estable de filas del carrito: remove + imagen + nombre + cantidad + unitario + total */
.cart-row{
  display:grid !important;
  grid-template-columns:28px 54px minmax(150px,1fr) auto minmax(72px,auto) minmax(82px,auto) !important;
  align-items:center !important;
  gap:10px !important;
  width:100% !important;
  box-sizing:border-box !important;
}

.cart-row .product-info{
  min-width:0 !important;
  overflow:hidden !important;
}

.cart-row .product-name{
  min-width:0 !important;
  max-width:100% !important;
  white-space:nowrap !important;
  overflow:hidden !important;
  text-overflow:ellipsis !important;
}

.cart-row .qty{
  min-width:92px !important;
  justify-self:end !important;
  white-space:nowrap !important;
}

.cart-row .unit,
.cart-row .price{
  min-width:0 !important;
  white-space:nowrap !important;
  justify-self:end !important;
}

/* Productos con promoción: misma altura y misma posición visual que una tarjeta normal */
#mufu-product-grid .product-card.mufu-product-on-sale{
  height:220px !important;
  min-height:220px !important;
  max-height:220px !important;
  align-self:start !important;
  transform:none !important;
  margin-top:0 !important;
  background:#ffffff !important;
  border-radius:7px !important;
  overflow:hidden !important;
  position:relative !important;
  box-sizing:border-box !important;
}

/* La imagen no altera el alto total de la tarjeta */
#mufu-product-grid .product-card.mufu-product-on-sale img,
#mufu-product-grid .product-card.mufu-product-on-sale .mufu-product-img{
  height:160px !important;
  max-height:160px !important;
  width:100% !important;
  object-fit:cover !important;
  display:block !important;
}

/* El badge va encima de la imagen y no ocupa espacio en el layout */
#mufu-product-grid .product-card.mufu-product-on-sale .mufu-product-promo-badge{
  position:absolute !important;
  top:0 !important;
  left:0 !important;
  z-index:20 !important;
  margin:0 !important;
}

/* El bloque de precio queda fijo abajo; no empuja la tarjeta ni el grid */
#mufu-product-grid .product-card.mufu-product-on-sale .mufu-promo-card-info{
  position:absolute !important;
  left:0 !important;
  right:0 !important;
  bottom:0 !important;
  height:60px !important;
  min-height:60px !important;
  padding:8px 12px 9px !important;
  box-sizing:border-box !important;
  background:#ffffff !important;
  z-index:10 !important;
}

#mufu-product-grid .product-card.mufu-product-on-sale .mufu-promo-card-info .name{
  margin:0 0 8px 0 !important;
  line-height:1.1 !important;
}

#mufu-product-grid .product-card.mufu-product-on-sale .mufu-promo-prices{
  height:20px !important;
  align-items:center !important;
}

#mufu-product-grid .product-card.mufu-product-on-sale .mufu-regular-price,
#mufu-product-grid .product-card.mufu-product-on-sale .mufu-sale-price{
  line-height:1 !important;
}


/* ======================================================
   MUFU POS v1.0.6.110
   FIX anuncio promociones:
   - Vuelve a mostrarse aunque antes se haya cerrado.
   - El banner ocupa su propia fila compacta.
   - No se sobrepone al carrito ni empuja los productos del grid.
   - El carrito conserva filas normales y el listado sigue scrolleando.
====================================================== */
body.mufu-pos-fullscreen .cart,
#mufu-pos-wrapper .cart{
  display:grid !important;
  grid-template-rows:auto auto minmax(0,1fr) auto auto auto !important;
  height:100% !important;
  min-height:0 !important;
  overflow:hidden !important;
  align-content:stretch !important;
}

body.mufu-pos-fullscreen .cart > .mufu-pos-promo-banner,
#mufu-pos-wrapper .cart > .mufu-pos-promo-banner{
  grid-row:auto !important;
  width:100% !important;
  min-height:50px !important;
  max-height:62px !important;
  margin:0 0 10px 0 !important;
  padding:8px 42px 8px 10px !important;
  box-sizing:border-box !important;
  overflow:hidden !important;
  align-self:start !important;
  z-index:3 !important;
}

body.mufu-pos-fullscreen .cart > .mufu-pos-promo-banner.is-hidden,
#mufu-pos-wrapper .cart > .mufu-pos-promo-banner.is-hidden{
  display:none !important;
}

body.mufu-pos-fullscreen .cart > .mufu-pos-promo-banner .mufu-pos-promo-icon,
#mufu-pos-wrapper .cart > .mufu-pos-promo-banner .mufu-pos-promo-icon{
  width:34px !important;
  height:34px !important;
  min-width:34px !important;
  border-radius:12px !important;
  font-size:18px !important;
}

body.mufu-pos-fullscreen .cart > .mufu-pos-promo-banner .mufu-pos-promo-eyebrow,
#mufu-pos-wrapper .cart > .mufu-pos-promo-banner .mufu-pos-promo-eyebrow{
  font-size:11px !important;
  margin-bottom:1px !important;
}

body.mufu-pos-fullscreen .cart > .mufu-pos-promo-banner .mufu-pos-promo-name,
#mufu-pos-wrapper .cart > .mufu-pos-promo-banner .mufu-pos-promo-name{
  font-size:13px !important;
  line-height:1.1 !important;
}

body.mufu-pos-fullscreen .cart > .mufu-pos-promo-banner .mufu-pos-promo-meta,
#mufu-pos-wrapper .cart > .mufu-pos-promo-banner .mufu-pos-promo-meta{
  font-size:11px !important;
  margin-top:2px !important;
}

body.mufu-pos-fullscreen .cart > .mufu-pos-promo-banner .mufu-pos-promo-details,
#mufu-pos-wrapper .cart > .mufu-pos-promo-banner .mufu-pos-promo-details{
  font-size:11px !important;
  padding:7px 9px !important;
}

body.mufu-pos-fullscreen .cart > .cart-title,
#mufu-pos-wrapper .cart > .cart-title{
  margin:0 0 8px 0 !important;
  align-self:start !important;
}

body.mufu-pos-fullscreen .cart > #cart-items,
#mufu-pos-wrapper .cart > #cart-items{
  min-height:0 !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  align-self:stretch !important;
}

body.mufu-pos-fullscreen #mufu-product-grid .product-card.mufu-product-on-sale,
#mufu-product-grid .product-card.mufu-product-on-sale{
  align-self:start !important;
  margin-top:0 !important;
}

/* Fila de carrito: evita que precios/cantidad se monten cuando hay banner arriba */
body.mufu-pos-fullscreen .cart-row,
#mufu-pos-wrapper .cart-row{
  grid-template-columns:28px 54px minmax(130px,1fr) minmax(92px,auto) minmax(76px,auto) minmax(86px,auto) !important;
  gap:10px !important;
  align-items:center !important;
}


/* ======================================================
   MUFU POS v1.0.6.121
   FIX layout carrito:
   - Subtotal/total permanecen en la zona inferior normal.
   - Con carrito vacío, los totales no suben hasta arriba.
   - Con productos, la lista ocupa el espacio disponible y scrollea.
   - No cambia lógica de venta/cobro.
====================================================== */
body.mufu-pos-fullscreen #mufu-pos-wrapper .cart,
body.mufu-pos-fullscreen .cart,
#mufu-pos-wrapper .cart{
  display:flex !important;
  flex-direction:column !important;
  height:100% !important;
  min-height:0 !important;
  overflow:hidden !important;
  box-sizing:border-box !important;
}

body.mufu-pos-fullscreen #mufu-pos-wrapper .cart > .mufu-pos-promo-banner,
body.mufu-pos-fullscreen .cart > .mufu-pos-promo-banner,
#mufu-pos-wrapper .cart > .mufu-pos-promo-banner,
body.mufu-pos-fullscreen #mufu-pos-wrapper .cart > .cart-title,
body.mufu-pos-fullscreen .cart > .cart-title,
#mufu-pos-wrapper .cart > .cart-title{
  flex:0 0 auto !important;
}

body.mufu-pos-fullscreen #mufu-pos-wrapper .cart > #cart-items,
body.mufu-pos-fullscreen .cart > #cart-items,
#mufu-pos-wrapper .cart > #cart-items{
  flex:1 1 auto !important;
  min-height:0 !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
}

body.mufu-pos-fullscreen #mufu-pos-wrapper .cart > .totals,
body.mufu-pos-fullscreen .cart > .totals,
#mufu-pos-wrapper .cart > .totals{
  flex:0 0 auto !important;
  margin-top:14px !important;
}

body.mufu-pos-fullscreen #mufu-pos-wrapper .cart > .pos-actions,
body.mufu-pos-fullscreen .cart > .pos-actions,
#mufu-pos-wrapper .cart > .pos-actions{
  flex:0 0 auto !important;
  margin-top:14px !important;
}


/* MUFU v1.0.6.122 - Filtro En descuento */
.mufu-no-sale-products{
    grid-column: 1 / -1;
    background: #fff;
    border: 1px solid #e5e7eb;
    border-radius: 12px;
    padding: 22px;
    color: #374151;
    font-weight: 700;
    text-align: center;
    box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04);
}
