/* CSS ADICIONAL: se carga encima del diseño existente */
.mej-header-btn{border:0;background:transparent;color:inherit;font-size:18px;cursor:pointer;padding:8px 10px}
.mej-admin-link{font-size:.9em}
.mej-toast{position:fixed;right:24px;bottom:24px;z-index:10050;background:#111827;color:#fff;padding:14px 18px;border-radius:12px;display:flex;gap:10px;align-items:center;box-shadow:0 12px 30px #0003;transform:translateY(20px);opacity:0;pointer-events:none;transition:.25s}.mej-toast.mostrar{transform:translateY(0);opacity:1}.mej-toast.ok span{color:#34d399}.mej-toast.error span{color:#f87171}
.mej-fav{position:absolute;right:10px;top:10px;border:0;border-radius:50%;width:38px;height:38px;background:#fff;color:#64748b;font-size:24px;cursor:pointer;z-index:2;box-shadow:0 4px 12px #0002}.mej-fav.activo,.mej-fav-detalle{color:#e11d48}.mej-img{position:relative}.mej-badge{position:absolute;left:10px;top:10px;background:#111827;color:#fff;border-radius:20px;padding:5px 10px;font-size:11px;font-weight:700;z-index:2}.mej-precios{display:flex;gap:9px;align-items:center;margin:10px 0}.mej-precios del{color:#94a3b8;font-size:13px}.mej-precios strong{font-size:21px}.mej-fav-detalle{border:0;background:transparent;font-size:32px;cursor:pointer;float:right}
.mej-seccion{padding-top:42px;padding-bottom:20px}.mej-seccion-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:20px}.mej-seccion-head h2{margin:5px 0;font-size:28px}.mej-seccion-head a{font-weight:700}.mej-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}.mej-hero-rotativo{transition:opacity .35s}
.mej-filtros{display:grid;grid-template-columns:1.2fr 1.2fr 1fr 1fr;gap:12px;margin:15px 0 25px;padding:16px;border:1px solid #e2e8f0;border-radius:14px;background:#fff}.mej-filtros label{display:block;font-size:12px;font-weight:700;margin-bottom:6px}.mej-filtros select,.mej-filtros input{width:100%;box-sizing:border-box;padding:11px;border:1px solid #cbd5e1;border-radius:9px;background:#fff}.mej-check{display:flex!important;align-items:center;gap:8px;margin-top:23px!important}.mej-check input{width:auto!important}
.mej-mini-cart-btn{position:fixed;right:22px;bottom:85px;z-index:9000;border:0;border-radius:999px;padding:13px 17px;background:#111827;color:#fff;font-weight:800;box-shadow:0 10px 30px #0003;cursor:pointer}.mej-mini-cart-btn span{background:#fff;color:#111827;border-radius:50%;padding:2px 7px;margin-left:4px}.mej-drawer{position:fixed;right:0;top:0;width:380px;max-width:92vw;height:100vh;background:#fff;z-index:10000;box-shadow:-15px 0 45px #0003;transform:translateX(105%);transition:.3s;display:flex;flex-direction:column}.mej-drawer.abierto{transform:translateX(0)}.mej-drawer-head{padding:20px;border-bottom:1px solid #e2e8f0;display:flex;justify-content:space-between}.mej-drawer-head button{border:0;background:none;font-size:30px;cursor:pointer}.mej-drawer #mej-mini-items{padding:15px;overflow:auto;flex:1}.mej-mini-item{display:grid;grid-template-columns:55px 1fr auto;gap:10px;align-items:center;padding:12px 0;border-bottom:1px solid #eef2f7}.mej-mini-item img{width:55px;height:55px;object-fit:cover;border-radius:9px}.mej-mini-item span{display:block;color:#64748b;font-size:12px;margin-top:4px}.mej-drawer-foot{padding:18px;border-top:1px solid #e2e8f0;display:grid;gap:12px}.mej-drawer-foot strong{font-size:22px}.mej-empty{color:#64748b;text-align:center;padding:30px}
.mej-envio{margin:0 0 18px;padding:15px 18px;border-radius:12px;background:#f1f5f9}.mej-progress{height:7px;background:#cbd5e1;border-radius:99px;overflow:hidden;margin-top:10px}.mej-progress span{display:block;height:100%;background:#111827;border-radius:99px}
.mej-review-box{display:grid;grid-template-columns:1.4fr 1fr;gap:25px}.mej-review{padding:15px;border:1px solid #e2e8f0;border-radius:12px;margin-bottom:10px}.mej-review div{letter-spacing:2px}.mej-review p{margin-bottom:0;color:#475569}.mej-review-box form{display:grid;gap:10px}.mej-review-box input,.mej-review-box textarea,.mej-review-box select,.mej-track-form input{padding:12px;border:1px solid #cbd5e1;border-radius:9px;font:inherit}.mej-review-box textarea{min-height:100px}.mej-track-form{display:flex;gap:10px;max-width:650px}.mej-track-form input{flex:1}.mej-status{margin-top:15px;padding:18px;border:1px solid #dbeafe;border-radius:12px}.mej-steps{display:flex;gap:8px;flex-wrap:wrap;margin:15px 0}.mej-steps span{padding:8px 12px;border-radius:20px;background:#e2e8f0}.mej-steps .activo{background:#dcfce7;color:#166534}
.mej-dark{background:#0f172a;color:#e5e7eb}.mej-dark header,.mej-dark footer{background:#020617}.mej-dark .producto-card,.mej-dark .mej-filtros,.mej-dark .mej-drawer,.mej-dark .modal-pedido,.mej-dark .mej-review,.mej-dark .mej-envio{background:#111827;color:#e5e7eb;border-color:#334155}.mej-dark input,.mej-dark textarea,.mej-dark select{background:#0f172a;color:#e5e7eb;border-color:#475569}.mej-dark .mej-drawer-head,.mej-dark .mej-drawer-foot{border-color:#334155}.mej-dark .mej-filtros{border-color:#334155}.mej-dark .mej-seccion-head h2,.mej-dark h1,.mej-dark h2,.mej-dark h3{color:#f8fafc}.mej-dark .mej-progress{background:#334155}
@media(max-width:900px){.mej-grid{grid-template-columns:repeat(2,1fr)}.mej-filtros{grid-template-columns:1fr 1fr}.mej-review-box{grid-template-columns:1fr}}
@media(max-width:600px){.mej-grid{grid-template-columns:1fr}.mej-filtros{grid-template-columns:1fr}.mej-check{margin-top:0!important}.mej-seccion-head{align-items:start;flex-direction:column}.mej-mini-cart-btn{right:12px;bottom:72px}.mej-toast{right:12px;left:12px;bottom:15px}.mej-track-form{flex-direction:column}}
/* ==========================================================
   OFERTAS - STICKER PROMOCIONAL
   ========================================================== */

.mej-oferta-sticker {

    position: absolute;

    top: 12px;
    left: 12px;

    z-index: 5;

    width: 72px;
    height: 72px;

    display: flex;
    flex-direction: column;

    align-items: center;
    justify-content: center;

    text-align: center;

    border-radius: 50%;

    background:
        linear-gradient(
            135deg,
            #ff3b30,
            #ff6b00
        );

    color: white;

    font-weight: 900;

    box-shadow:
        0 5px 15px rgba(0,0,0,.30);

    transform: rotate(-8deg);

    border: 3px solid white;

}


/* Icono de fuego */

.mej-oferta-icono {

    font-size: 18px;

    line-height: 16px;

}


/* Texto OFERTA */

.mej-oferta-sticker strong {

    font-size: 13px;

    line-height: 15px;

    letter-spacing: .5px;

}


/* Porcentaje */

.mej-oferta-sticker small {

    font-size: 12px;

    font-weight: 900;

    background: rgba(255,255,255,.20);

    padding: 1px 5px;

    border-radius: 8px;

}


/* ==========================================================
   PRECIOS DE OFERTA
   ========================================================== */

.mej-precios {

    margin-top: 10px;

}


/* Precio anterior */

.precio-oferta-anterior {

    display: flex;

    align-items: center;

    gap: 6px;

    font-size: 12px;

    color: #777;

}


.precio-oferta-anterior del {

    font-size: 14px;

    font-weight: 600;

}


/* Precio actual */

.precio-oferta-actual {

    font-size: 25px;

    font-weight: 900;

    line-height: 1.1;

    margin-top: 2px;

}


/* Texto de ahorro */

.descuento-texto {
    display: inline-flex;
    align-items: center;
    max-width: 100%;
    box-sizing: border-box;
    margin-top: 5px;
    padding: 5px 8px;
    border-radius: 6px;
    font-size: 11px;
    font-weight: 800;
    line-height: 1.25;
    background: rgba(255, 80, 40, .12);

    white-space: normal;
    overflow-wrap: break-word;
    word-break: normal;
}


/* ==========================================================
   ANIMACIÓN SUAVE DEL STICKER
   ========================================================== */

.mej-oferta-sticker {

    animation:
        ofertaPulso 1.8s ease-in-out infinite;

}


@keyframes ofertaPulso {

    0%,
    100% {

        transform:
            rotate(-8deg)
            scale(1);

    }

    50% {

        transform:
            rotate(-8deg)
            scale(1.06);

    }

}


/* ==========================================================
   MEJORAR IMAGEN DEL PRODUCTO
   ========================================================== */

.mej-img {

    position: relative;

}


/* ==========================================================
   MODO OSCURO
   ========================================================== */

.mej-dark
.precio-oferta-anterior {

    color: #bbb;

}


.mej-dark
.descuento-texto {

    background:
        rgba(255,255,255,.10);

}

/* ===== CORRECCIÓN ETIQUETA "¡AHORRAS!" ===== */

.mej-card,
.mej-card .producto-card-info,
.mej-card .mej-precios {
    overflow: visible !important;
}

/* =====================================================
   MINI CARRITO: CERRADO POR DEFECTO
   ===================================================== */

#mej-mini-drawer {
    display: none !important;
    visibility: hidden !important;
    opacity: 0 !important;
}

#mej-mini-drawer.abierto {
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
    border-top-left-radius: 2.5%;
    border-bottom-left-radius: 2.5%;
}
/* ================================
   BOTÓN FLOTANTE DE WHATSAPP
   ================================ */

#mej-wa {
    position: fixed !important;
    right: 20px !important;
    bottom: 20px !important;

    width: 58px !important;
    height: 58px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    background: #25D366 !important;
    color: white !important;

    border-radius: 50% !important;

    font-size: 30px !important;
    text-decoration: none !important;

    box-shadow: 0 4px 15px rgba(0,0,0,.30) !important;

    z-index: 99999 !important;

    cursor: pointer !important;

    transition: transform .2s ease, box-shadow .2s ease;
}

#mej-wa:hover {
    transform: scale(1.10);
    box-shadow: 0 6px 20px rgba(0,0,0,.40);
}
/* ==========================================
   CORRECCIÓN BOTONES SOCIALES
   ========================================== */

#mej-sociales {
    position: fixed !important;
    right: 20px !important;
    bottom: 20px !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 10px !important;

    width: 55px !important;

    z-index: 999999 !important;
}

/* Todos los botones dentro del grupo */
#mej-sociales a {
    position: relative !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;
    top: auto !important;

    flex-shrink: 0 !important;

    width: 55px !important;
    height: 55px !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    border-radius: 50% !important;
    box-sizing: border-box !important;

    text-decoration: none !important;
}

/* Facebook */
#mej-sociales #mej-facebook {
    background: #1877F2 !important;
}

/* Instagram */
#mej-sociales #mej-instagram {
    background: linear-gradient(
        135deg,
        #833AB4,
        #E1306C,
        #F77737
    ) !important;
}
/* ==========================================
   REDES SOCIALES - LADO IZQUIERDO
   ========================================== */

#mej-sociales {
    position: fixed !important;

    top: 50% !important;
    left: 15px !important;
    right: auto !important;
    bottom: auto !important;

    transform: translateY(-50%) !important;

    width: 50px !important;
    height: auto !important;

    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;

    gap: 10px !important;

    z-index: 999999 !important;
}

#mej-sociales a {
    position: relative !important;

    top: auto !important;
    right: auto !important;
    bottom: auto !important;
    left: auto !important;

    width: 50px !important;
    height: 50px !important;

    margin: 0 !important;

    display: flex !important;
    align-items: center !important;
    justify-content: center !important;

    flex-shrink: 0 !important;

    border-radius: 50% !important;
    box-sizing: border-box !important;

    text-decoration: none !important;

    box-shadow: 0 4px 12px rgba(0,0,0,.30);
}

/* Facebook */
#mej-sociales #mej-facebook {
    background: #1877F2 !important;
}

/* Instagram */
#mej-sociales #mej-instagram {
    background: linear-gradient(
        135deg,
        #833AB4,
        #E1306C,
        #F77737
    ) !important;
}

/* WhatsApp */
#mej-sociales #mej-wa {
    background: #25D366 !important;
}

/* Carrito permanece a la derecha */
#mej-mini-cart {
    position: fixed !important;
    right: 15px !important;
    left: auto !important;
    bottom: 20px !important;

    z-index: 1000000 !important;
}


/* CELULAR */
@media (max-width: 600px) {

    #mej-sociales {
        left: 8px !important;
        right: auto !important;
    }

    #mej-sociales a {
        width: 43px !important;
        height: 43px !important;
    }

    #mej-mini-cart {
        right: 10px !important;
        bottom: 12px !important;
    }
}
.campo-imagen-admin {
    grid-column: span 2;
}

.campo-imagen-admin label {
    display: block;
    font-weight: bold;
    margin-bottom: 8px;
}

.campo-imagen-admin input[type="file"] {
    width: 100%;
    padding: 10px;
    border: 1px solid #cbd5e1;
    border-radius: 9px;
    box-sizing: border-box;
    background: #f8fafc;
}

.imagen-preview-admin {
    width: 180px;
    height: 180px;
    margin-top: 12px;
    border: 2px dashed #cbd5e1;
    border-radius: 14px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    background: #f8fafc;
    color: #64748b;
}

.imagen-preview-admin span {
    font-size: 42px;
}

.imagen-preview-admin p {
    margin: 5px 0 0;
    font-size: 13px;
}

.imagen-preview-admin img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

#imagen-nombre-admin {
    display: block;
    margin-top: 7px;
    color: #64748b;
}

@media(max-width:700px) {
    .campo-imagen-admin {
        grid-column: auto;
    }

    .imagen-preview-admin {
        width: 150px;
        height: 150px;
    }
}
.icono-encargo-menu {
    width: 24px;
    height: 24px;
    object-fit: contain;
    vertical-align: middle;
    margin-right: 6px;
}
/* AJUSTE DE IMÁGENES DE PRODUCTOS */

.producto-imagen {
    height: auto !important;
    min-height: 180px;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #f3f4f6;
    overflow: hidden;
}

.producto-imagen img {
    width: 100%;
    height: auto !important;
    max-height: 360px;
    object-fit: contain !important;
    display: block;
}
/* ==========================================
   IMÁGENES DE DETALLE SIN RECORTE
========================================== */

.detalle-imagen {
    height: auto !important;
    min-height: 400px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.detalle-imagen img {
    width: 100%;
    height: auto !important;
    max-height: 650px;
    object-fit: contain !important;
    display: block;
}
/* Separación superior del detalle del producto */
.detalle-producto {
    margin-top: 40px;
}