/* ==========================================================================
   TEMA GLOBAL ESTILO TIENDAS EFE  (azul marino) — electrodomésticos
   Sobrescribe la plantilla "xton" en TODO el sitio. Se carga al final.
   ========================================================================== */

:root{
    /* Color azul PRINCIPAL de la marca (Multipalmo) */
    --efe-navy:#0b2b50;
    --efe-navy-d:#07203c;   /* tono más oscuro (títulos/hover) */
    --efe-navy-2:#143f72;   /* tono más claro (degradados) */
    --efe-blue:#1d6fe0;     /* azul interactivo (enlaces/hover) */
    --efe-blue-soft:#eaf2ff;
    /* Color SECUNDARIO de la marca (anaranjado) — antes era amarillo */
    --efe-yellow:#ee7b05;
    --efe-orange:#ee7b05;
    --efe-red:#e30613;
    --efe-green:#25d366;
    --efe-ink:#1b2430;
    --efe-muted:#6b7787;
    --efe-line:#e6eaf0;
    --efe-bg:#f4f6fb;
}

body{
    font-family:'Segoe UI',Roboto,Arial,sans-serif !important;
    color:var(--efe-ink);
    background:#fff;
}
a{color:var(--efe-navy);}
a:hover{color:var(--efe-blue);}

/* ---------- Reemplazo global del celeste #00bfff por azul marino ---------- */
.default-btn{
    background-color:var(--efe-navy) !important;
    border-color:var(--efe-navy) !important;
    color:#fff !important;
    border-radius:8px !important;
    font-weight:700 !important;
    letter-spacing:.3px;
    box-shadow:0 6px 16px rgba(10,42,92,.18);
    transition:.25s !important;
}
.default-btn:hover{
    background-color:var(--efe-yellow) !important;
    border-color:var(--efe-yellow) !important;
    color:var(--efe-navy-d) !important;
    transform:translateY(-2px);
}
.optional-btn{
    border-radius:8px !important;
    border-color:var(--efe-navy) !important;
    color:var(--efe-navy) !important;
    font-weight:700 !important;
}
.optional-btn:hover{
    background-color:var(--efe-navy) !important;
    border-color:var(--efe-navy) !important;
    color:#fff !important;
}

/* ---------- Encabezado superior ---------- */
.top-header{
    background:var(--efe-navy) !important;
    padding:9px 0 !important;
    border:0 !important;
}
.top-header *{color:#fff !important;}

.header-contact-info{display:flex;flex-wrap:wrap;align-items:center;margin:0;padding:0;list-style:none;}
.header-contact-info li{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;padding:0 14px;position:relative;line-height:1.4;}
.header-contact-info li:first-child{padding-left:0;}
.header-contact-info li:not(:last-child)::after{content:"";position:absolute;right:0;top:50%;transform:translateY(-50%);height:14px;width:1px;background:rgba(255,255,255,.22);}
.header-contact-info li i{color:var(--efe-yellow) !important;font-size:16px;}
.header-contact-info li a{color:#fff !important;display:inline-flex;align-items:center;gap:6px;}
.header-contact-info li a:hover{color:var(--efe-yellow) !important;}

.header-top-menu{display:flex;flex-wrap:wrap;align-items:center;justify-content:flex-end;gap:4px;margin:0;padding:0;list-style:none;}
.header-top-menu li{margin:0 !important;display:inline-flex;position:relative;}
.header-top-menu li::before{display:none !important;}
.header-top-menu li a{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;padding:6px 12px !important;border-radius:8px;transition:.2s;color:#fff !important;}
.header-top-menu li a i{position:static !important;left:auto !important;top:auto !important;color:var(--efe-yellow) !important;font-size:15px;}
.header-top-menu li a::before{display:none !important;}
.header-top-menu li a:hover{background:rgba(255,255,255,.14);color:#fff !important;}

@media (max-width:991px){
    /* En móvil ocultamos toda la barra superior azul; el acceso a sesión queda en el menú hamburguesa */
    .top-header{display:none !important;}
    .header-contact-info{justify-content:center;}
    .header-top-menu{justify-content:center;margin-top:6px;}
}

/* ---------- Navbar ---------- */
.navbar-area{
    background:#fff !important;
    box-shadow:0 4px 18px rgba(10,42,92,.07);
}
.navbar-area.is-sticky,.header-sticky.is-sticky{
    box-shadow:0 6px 22px rgba(10,42,92,.12) !important;
    background:#fff !important;
}
.xton-nav .navbar .navbar-nav .nav-item a{
    color:var(--efe-navy-d) !important;
    font-weight:700 !important;
    font-size:14px;
    letter-spacing:.4px;
}
.xton-nav .navbar .navbar-nav .nav-item a:hover,
.xton-nav .navbar .navbar-nav .nav-item a.active,
.xton-nav .navbar .navbar-nav .nav-item:hover a{
    color:var(--efe-blue) !important;
}
.xton-nav .navbar .navbar-nav .nav-item .dropdown-menu{
    border:0 !important;
    border-top:3px solid var(--efe-navy) !important;
    box-shadow:0 12px 30px rgba(10,42,92,.15) !important;
    border-radius:0 0 10px 10px !important;
}
.xton-nav .navbar .navbar-nav .nav-item .dropdown-menu li a{
    color:var(--efe-ink) !important;
    font-weight:600 !important;
    font-size:13.5px;
}
.xton-nav .navbar .navbar-nav .nav-item .dropdown-menu li a:hover{
    color:var(--efe-blue) !important;
    background:var(--efe-blue-soft);
    padding-left:20px;
}
.others-option .option-item .search-btn,
.others-option .option-item .cart-btn a,
.header-top-others-option .cart-btn a,
.header-top-others-option .search-btn{color:var(--efe-navy) !important;}
.cart-btn a span{
    background:var(--efe-red) !important;
    color:#fff !important;
    font-weight:700;
}
.burger-menu span{background:var(--efe-navy) !important;}

/* ---------- Menú hamburguesa (móvil): panel lateral izquierdo a pantalla completa ---------- */
@media (max-width:991px){
    /* meanmenu se inicializa en el nav normal y en el sticky -> oculta la barra/botón duplicado */
    .xton-responsive-nav .xton-responsive-menu.mean-container .mean-bar ~ .mean-bar{display:none !important;}

    /* Panel/drawer fijo a la izquierda, alto completo, oculto por defecto (fuera de pantalla) */
    .xton-responsive-nav .xton-responsive-menu.mean-container .mean-nav{
        position:fixed;
        top:0;
        left:0;
        bottom:0;
        width:86%;
        max-width:340px;
        height:100vh;
        margin:0 !important;
        background:#fff;
        box-shadow:0 0 45px rgba(0,0,0,.3);
        transform:translateX(-100%);
        transition:transform .35s ease;
        z-index:99999;
        overflow-y:auto;
        -webkit-overflow-scrolling:touch;
        padding-top:0;
    }
    /* Al abrir (la hamburguesa toma la clase .meanclose) el panel entra desde la izquierda */
    .xton-responsive-nav .xton-responsive-menu.mean-container a.meanmenu-reveal.meanclose ~ .mean-nav{
        transform:translateX(0);
    }
    /* La lista principal siempre visible dentro del panel; el drawer maneja abrir/cerrar */
    .xton-responsive-nav .xton-responsive-menu.mean-container .mean-nav > ul{
        display:block !important;
        height:auto !important;
        min-height:0 !important;
        overflow:visible !important;
        float:none;
        width:100%;
        margin:0;
    }
    /* Botón cerrar: la hamburguesa convertida en "X", fija arriba a la derecha DENTRO del panel.
       meanmenu posiciona el botón con un "left" inline, por eso forzamos con !important. */
    .xton-responsive-nav .xton-responsive-menu.mean-container a.meanmenu-reveal.meanclose{
        position:fixed !important;
        top:14px !important;
        left:calc(min(86vw, 340px) - 46px) !important;
        right:auto !important;
        z-index:100001;
        color:var(--efe-navy-d) !important;
    }
    /* Logo dentro del panel (inyectado por JS) */
    .mean-nav-logo{
        padding:14px 50px 14px 20px;
        border-bottom:1px solid #e9eef5;
        background:#fff;
    }
    .mean-nav-logo a{display:inline-block;line-height:0;}
    .mean-nav-logo img{max-height:38px;width:auto;}

    /* Header móvil pegado arriba: el logo y la hamburguesa no se pierden al hacer scroll */
    .xton-responsive-nav{
        position:sticky;
        top:0;
        z-index:1030;
        background:#fff;
        box-shadow:0 2px 12px rgba(10,42,92,.07);
    }
    /* Bloquea el scroll del fondo con el panel abierto (sin capa/overlay visible) */
    body.mean-nav-open{
        position:fixed;
        left:0;
        right:0;
        width:100%;
        overflow:hidden;
    }
    /* Con el panel abierto, oculta el logo del header (z-index:999) para que no se pinte
       sobre el panel. El logo del panel (.mean-nav-logo) no usa la clase .logo, así que no se ve afectado. */
    body.mean-nav-open .xton-responsive-nav .logo{
        display:none !important;
    }
}

/* ---------- Banner principal ---------- */
.main-banner{position:relative;}
.main-banner::before{
    content:"";position:absolute;inset:0;
    background:linear-gradient(90deg,rgba(6,32,63,.65),rgba(6,32,63,.15));
}
.main-banner .container{position:relative;z-index:2;}
.main-banner-content .sub-title{
    color:var(--efe-yellow) !important;
    font-weight:800;letter-spacing:1px;
}
.main-banner-content h1{font-weight:900 !important;text-shadow:0 4px 20px rgba(0,0,0,.3);}
.main-banner-content .btn-box .default-btn{background:var(--efe-yellow) !important;border-color:var(--efe-yellow) !important;color:var(--efe-navy-d) !important;}
.main-banner-content .btn-box .default-btn:hover{background:#fff !important;border-color:#fff !important;}
.main-banner-content .btn-box .optional-btn{color:#fff !important;border-color:#fff !important;}
.main-banner-content .btn-box .optional-btn:hover{background:#fff !important;color:var(--efe-navy-d) !important;}

/* ---------- Títulos de sección ---------- */
.section-title .sub-title{
    color:var(--efe-blue) !important;
    background:var(--efe-blue-soft);
    padding:5px 14px;border-radius:30px;
    font-weight:700 !important;display:inline-block;
}
.section-title h2{
    color:var(--efe-navy-d) !important;
    font-weight:900 !important;
    position:relative;
}
.section-title.text-start h2{padding-left:18px;}
.section-title.text-start h2::before{
    content:"";position:absolute;left:0;top:50%;transform:translateY(-50%);
    width:7px;height:30px;background:var(--efe-yellow);border-radius:4px;
}
.section-title .default-btn{position:absolute;right:0;top:0;}

/* ---------- Tarjetas de producto ---------- */
.single-products-box{
    background:#fff;
    border:1px solid var(--efe-line);
    border-radius:14px;
    overflow:hidden;
    transition:.28s;
}
.single-products-box:hover{
    box-shadow:0 16px 36px rgba(10,42,92,.14);
    transform:translateY(-5px);
    border-color:var(--efe-blue);
}
.single-products-box .products-image{background:#fff;}
.single-products-box .products-image img{padding:14px;object-fit:contain;height:240px;width:100%;}
.single-products-box .new-tag{
    background:var(--efe-navy) !important;
    color:#fff !important;
    border-radius:30px;font-weight:700;font-size:11px;
    padding:4px 12px;
}
.single-products-box .products-button ul li .wishlist-btn a,
.single-products-box .products-button ul li .quick-view-btn a{
    background:#fff !important;color:var(--efe-navy) !important;
    box-shadow:0 4px 12px rgba(10,42,92,.18);
}
.single-products-box .products-button ul li .wishlist-btn a:hover,
.single-products-box .products-button ul li .quick-view-btn a:hover{
    background:var(--efe-navy) !important;color:#fff !important;
}
.single-products-box .products-content{padding:6px 16px 20px;}
.single-products-box .products-content h3{font-size:15px;font-weight:700;}
.single-products-box .products-content h3 a{color:var(--efe-ink) !important;}
.single-products-box .products-content h3 a:hover{color:var(--efe-blue) !important;}
.products-content .price .new-price,.price .new-price{color:var(--efe-navy-d) !important;font-weight:900 !important;font-size:20px;}
.products-content .price .old-price,.price .old-price{color:var(--efe-muted) !important;text-decoration:line-through;}
.star-rating i,.rating i.bxs-star,.rating i.bx-star{color:var(--efe-yellow) !important;}

/* botón "agregar al carrito" inyectado en las tarjetas */
.efe-card-add{
    display:block;width:100%;border:0;cursor:pointer;
    background:var(--efe-navy);color:#fff;font-weight:800;font-size:13px;
    padding:11px;border-radius:9px;margin-top:10px;
    transition:.2s;letter-spacing:.3px;
}
.efe-card-add:hover{background:var(--efe-yellow);color:var(--efe-navy-d);}
.efe-card-add i{margin-right:6px;}

/* ---------- Cajas de categorías ---------- */
.single-categories-box{border-radius:14px;overflow:hidden;box-shadow:0 8px 24px rgba(10,42,92,.08);}
.single-categories-box::before{
    content:"";position:absolute;inset:0;
    background:linear-gradient(180deg,rgba(6,32,63,0) 30%,rgba(6,32,63,.85) 100%);
    z-index:1;
}
.single-categories-box .content{z-index:2;}
.single-categories-box .content span{color:var(--efe-yellow) !important;font-weight:700;}
.single-categories-box .content .default-btn{background:var(--efe-yellow) !important;border-color:var(--efe-yellow) !important;color:var(--efe-navy-d) !important;}

/* ---------- Marcas / facility: tira de logos en escala de grises (sin tarjeta) ---------- */
.facility-area .single-facility-box,.single-facility-box{
    background:transparent !important;
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
    padding:10px 12px !important;
    text-align:center;
    display:flex !important;
    align-items:center;
    justify-content:center;
    min-height:100px;
}
/* Anula el círculo gris de 150px que trae el template para el .icon */
.single-facility-box .icon{
    background:transparent !important;
    width:auto !important;
    height:auto !important;
    border-radius:0 !important;
    font-size:0 !important;
    line-height:0 !important;
}
.single-facility-box:hover .icon{
    background:transparent !important;
}
.single-facility-box .icon img{
    max-height:60px;
    width:auto;
    object-fit:contain;
    filter:grayscale(100%);
    opacity:.6;
    transition:filter .3s ease, opacity .3s ease;
}
.single-facility-box:hover .icon img{
    filter:grayscale(0);
    opacity:1;
}
/* En la tira solo van los logos: ocultamos el nombre de la marca */
.single-facility-box h3{display:none !important;}

/* ---------- Título de página / breadcrumb ---------- */
.page-title-area{
    background:linear-gradient(120deg,var(--efe-navy-d),var(--efe-navy-2)) !important;
    padding:55px 0 !important;
}
.page-title-content h2{color:#fff !important;font-weight:900 !important;}
.page-title-content ul li,.page-title-content ul li a{color:#cfe0ff !important;}
.page-title-content ul li a:hover{color:#fff !important;}

/* ---------- Detalle de producto (estructura existente) ---------- */
.products-details-desc h1{color:var(--efe-navy-d);font-weight:900;}
.products-details-desc .price .new-price{color:var(--efe-navy-d) !important;}
.products-color-switch span,.products-size-wrapper span,.products-info li span{color:var(--efe-navy-d);font-weight:700;}
.products-details-tab .tabs li a{color:var(--efe-navy-d);font-weight:700;}
.products-details-tab .tabs li.current a,.products-details-tab .tabs li a:hover{color:var(--efe-blue);}
.products-details-tab .tabs li .dot{border-color:var(--efe-navy) !important;}
.products-details-tab .tabs li.current a .dot::before{background:var(--efe-navy) !important;}

/* ---------- Paginación ---------- */
.pagination-area .page-numbers{color:var(--efe-navy);border-radius:8px;font-weight:700;}
.pagination-area .page-numbers.current,.pagination-area .page-numbers:hover{
    background:var(--efe-navy) !important;border-color:var(--efe-navy) !important;color:#fff !important;
}

/* ---------- Formularios ---------- */
.form-control:focus,input:focus,textarea:focus{
    border-color:var(--efe-blue) !important;
    box-shadow:0 0 0 3px var(--efe-blue-soft) !important;
}

/* ---------- Footer ---------- */
.footer-area{
    background:var(--efe-navy-d) !important;
    color:#c7d2e3;
}
.footer-area::before,.footer-area::after{display:none !important;}
.single-footer-widget h3{color:#fff !important;font-weight:800;position:relative;padding-bottom:10px;}
.single-footer-widget h3::after{content:"";position:absolute;left:0;bottom:0;width:42px;height:3px;background:var(--efe-yellow);border-radius:3px;}
.footer-area p,.footer-area li,.footer-area a,.about-the-store p{color:#aebbd0 !important;}
.footer-area a:hover,.quick-links li a:hover,.customer-support li a:hover,.footer-contact-info li a:hover{color:var(--efe-yellow) !important;}
.footer-contact-info li i{color:var(--efe-yellow) !important;}
.social-link li a{background:rgba(255,255,255,.08) !important;color:#fff !important;border-radius:8px;}
.social-link li a:hover{background:var(--efe-yellow) !important;color:var(--efe-navy-d) !important;}
.footer-newsletter-box .newsletter-form .input-newsletter{border-radius:8px 0 0 8px;}
.footer-newsletter-box .newsletter-form button{background:var(--efe-yellow) !important;color:var(--efe-navy-d) !important;border-radius:0 8px 8px 0;font-weight:800;}
.footer-bottom-area{border-top:1px solid rgba(255,255,255,.1) !important;}
.footer-bottom-area p,.footer-bottom-area a{color:#aebbd0 !important;}

/* ---------- Botón ir arriba ---------- */
.go-top{
    background:var(--efe-navy) !important;
    color:#fff !important;
    border-radius:10px !important;
    box-shadow:0 8px 20px rgba(10,42,92,.3);
}
.go-top:hover{background:var(--efe-yellow) !important;color:var(--efe-navy-d) !important;}

/* ---------- Mapa ---------- */
#map iframe{width:100% !important;display:block;filter:saturate(1.05);}

/* ---------- Barra de búsqueda ---------- */
.search-overlay .search-overlay-form form button{background:var(--efe-navy) !important;}

/* ---------- Scrollbar (vertical y horizontal): azul principal ---------- */
::-webkit-scrollbar{width:11px;height:11px;}
::-webkit-scrollbar-track{background:#eef1f6;}
::-webkit-scrollbar-thumb{background:var(--efe-navy);border-radius:8px;}
::-webkit-scrollbar-thumb:hover{background:var(--efe-navy-d);}
/* Firefox */
html{scrollbar-color:var(--efe-navy) #eef1f6;scrollbar-width:thin;}

/* ==========================================================================
   AUTENTICACIÓN DE CLIENTES (login / registro / mi cuenta)
   ========================================================================== */
.efe-auth-area{background:var(--efe-bg);padding:55px 0 75px;min-height:60vh;}
.efe-auth-card{
    max-width:520px;margin:0 auto;background:#fff;border:1px solid var(--efe-line);
    border-radius:16px;box-shadow:0 16px 48px rgba(10,42,92,.10);overflow:hidden;
}
.efe-auth-card.wide{max-width:760px;}
.efe-auth-head{background:linear-gradient(135deg,var(--efe-navy-d),var(--efe-navy-2));color:#fff;padding:28px 30px;text-align:center;}
.efe-auth-head i{font-size:42px;background:rgba(255,255,255,.12);width:74px;height:74px;border-radius:50%;display:inline-flex;align-items:center;justify-content:center;margin-bottom:10px;}
.efe-auth-head h2{margin:0;font-weight:900;font-size:24px;color:#fff;}
.efe-auth-head p{margin:6px 0 0;color:#cfe0ff;font-size:14px;}
.efe-auth-body{padding:30px 32px;}
.efe-auth-body .row-2{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
.efe-fg{margin-bottom:16px;}
.efe-fg label{display:block;font-size:13px;font-weight:700;color:var(--efe-navy-d);margin-bottom:6px;}
.efe-fg label .req{color:var(--efe-red);}
.efe-fg input[type=text],.efe-fg input[type=email],.efe-fg input[type=tel],.efe-fg input[type=password],.efe-fg select,.efe-fg textarea{
    width:100%;border:1.5px solid var(--efe-line);border-radius:10px;padding:12px 14px;font-size:15px;outline:none;transition:.2s;background:#fff;
}
.efe-fg input:focus,.efe-fg select:focus,.efe-fg textarea:focus{border-color:var(--efe-blue);box-shadow:0 0 0 3px var(--efe-blue-soft);}
.efe-fg .err{color:var(--efe-red);font-size:12.5px;margin-top:5px;display:block;font-weight:600;}
.efe-check{display:flex;align-items:flex-start;gap:9px;font-size:13.5px;color:var(--efe-muted);margin-bottom:18px;}
.efe-check input{margin-top:3px;width:16px;height:16px;accent-color:var(--efe-navy);}
.efe-auth-btn{
    width:100%;border:0;border-radius:10px;padding:14px;font-weight:800;font-size:16px;cursor:pointer;
    background:linear-gradient(135deg,var(--efe-navy),var(--efe-navy-2));color:#fff;transition:.2s;
    display:inline-flex;align-items:center;justify-content:center;gap:9px;
}
.efe-auth-btn:hover{filter:brightness(1.12);transform:translateY(-1px);color:#fff;}
.efe-auth-foot{text-align:center;margin-top:18px;font-size:14px;color:var(--efe-muted);}
.efe-auth-foot a{color:var(--efe-blue);font-weight:700;text-decoration:none;}
.efe-auth-foot a:hover{text-decoration:underline;}
.efe-alert{background:#e7f7ed;border:1px solid #b6e6c6;color:#138a36;padding:12px 16px;border-radius:10px;font-weight:600;font-size:14px;margin-bottom:18px;}
.efe-alert.err{background:#fdecec;border-color:#f6bcbc;color:#c0202b;}
.efe-account-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px;}
@media (max-width:575px){.efe-auth-body .row-2,.efe-account-grid{grid-template-columns:1fr;}}

/* ---------- Tamaño del logo en el header ---------- */
/* El logo no traía tope de tamaño y se mostraba a su resolución natural.
   Limita su ancho/alto y conserva la proporción. */
.navbar-area .navbar-brand .main-logo,
.navbar-area .navbar-brand .white-logo{
    max-width:170px;
    max-height:60px;
    width:auto;
    height:auto;
    object-fit:contain;
}
/* Logo del header móvil */
.xton-responsive-nav .logo .main-logo,
.xton-responsive-nav .logo .white-logo{
    max-width:150px;
    max-height:48px;
    width:auto;
    height:auto;
    object-fit:contain;
}

/* ==========================================================================
   Tarjeta de producto estilo limpio (.efe-pc) — usada en el home
   Etiqueta de categoría arriba, nombre en azul, precio grande + anterior tachado
   ========================================================================== */
.single-products-box.efe-pc{
    border:1px solid var(--efe-line);
    border-radius:12px;
    box-shadow:0 1px 3px rgba(10,42,92,.05);
    transition:.25s;
}
.single-products-box.efe-pc:hover{
    box-shadow:0 16px 34px rgba(10,42,92,.13);
    transform:translateY(-4px);
    border-color:var(--efe-line);
}
.single-products-box.efe-pc .products-image{
    background:#fff;
    border-bottom:1px solid var(--efe-line);
}
.single-products-box.efe-pc .products-image img{
    height:230px;
    width:100%;
    object-fit:contain;
    padding:20px;
}
.single-products-box.efe-pc .products-content{
    padding:14px 16px 18px;
    text-align:left;
}
/* Etiqueta de categoría (tipo de producto) */
.single-products-box.efe-pc .efe-pc-cat{
    display:block;
    font-size:12px;
    font-weight:600;
    color:var(--efe-muted);
    margin-bottom:5px;
    text-transform:capitalize;
    letter-spacing:.2px;
}
/* Nombre del producto: azul, hasta 2 líneas */
.single-products-box.efe-pc .products-content h3{
    font-size:15px;
    font-weight:700;
    line-height:1.35;
    margin:0 0 10px;
    min-height:40px;
    display:-webkit-box;
    -webkit-line-clamp:2;
    -webkit-box-orient:vertical;
    overflow:hidden;
}
.single-products-box.efe-pc .products-content h3 a{color:var(--efe-blue) !important;}
.single-products-box.efe-pc .products-content h3 a:hover{color:var(--efe-navy-d) !important;}
/* Precio: nuevo grande (oscuro) + anterior tachado al lado */
.single-products-box.efe-pc .price{
    display:flex;
    align-items:baseline;
    gap:8px;
    flex-wrap:wrap;
}
.single-products-box.efe-pc .price .new-price{
    font-size:22px !important;
    font-weight:800 !important;
    color:var(--efe-ink) !important;
}
.single-products-box.efe-pc .price .old-price{
    font-size:14px;
    font-weight:500;
    color:var(--efe-muted) !important;
    text-decoration:line-through;
}
/* --- Hover calmado: la imagen NO se mueve --- */
/* El template hacía scale(1.07) + swap a .hover-image (absolute, left:0) y ocultaba
   el precio esperando un .add-to-cart. Aquí dejamos la imagen estática, el precio
   siempre visible y quitamos los íconos flotantes que distraen. */
.single-products-box.efe-pc .products-image a .hover-image{
    display:none !important;
}
.single-products-box.efe-pc:hover .products-image a .main-image{
    opacity:1 !important;
    visibility:visible !important;
    transform:none !important;
}
.single-products-box.efe-pc:hover .products-content .price{
    opacity:1 !important;
    visibility:visible !important;
}
/* Botones flotantes (añadir al carrito / ver): sobre la imagen, arriba a la derecha,
   con algo de separación del borde superior. */
.single-products-box.efe-pc .products-image .products-button{
    top:24px;
    right:18px;
    z-index:3;
}
/* Cada ícono: círculo de fondo blanco con el ícono en azul de la marca */
.single-products-box.efe-pc .products-button ul li a{
    display:flex;
    align-items:center;
    justify-content:center;
    width:40px;
    height:40px;
    border-radius:50%;
    background:#fff !important;
    color:var(--efe-navy) !important;
    font-size:19px;
    box-shadow:0 4px 14px rgba(10,42,92,.20);
    transition:.2s;
}
.single-products-box.efe-pc .products-button ul li a:hover{
    background:var(--efe-navy) !important;
    color:#fff !important;
}
/* Tooltip (etiqueta emergente): mismo azul de la marca, no el celeste por defecto */
.single-products-box.efe-pc .products-button ul li a .tooltip-label{
    background-color:var(--efe-navy) !important;
    color:#fff !important;
}
.single-products-box.efe-pc .products-button ul li a .tooltip-label::before{
    color:var(--efe-navy) !important;
}

/* ==========================================================================
   TIENDA / PÁGINA DE PRODUCTOS con filtros asíncronos (sidebar)
   ========================================================================== */
.efe-shop{background:var(--efe-bg);padding-top:32px;}

/* Botón "Filtros" (solo móvil) */
.efe-filter-toggle{display:none;}

/* Panel de filtros */
.efe-filters{
    background:#fff;
    border:1px solid var(--efe-line);
    border-radius:14px;
    padding:4px 18px 16px;
    position:static;
    box-shadow:0 8px 30px rgba(10,42,92,.06);
}
.efe-filters-head{
    display:flex;align-items:center;justify-content:space-between;
    padding:14px 0 12px;border-bottom:1px solid var(--efe-line);
}
.efe-filters-head h3{
    margin:0;font-size:17px;font-weight:800;color:var(--efe-navy-d);
    display:flex;align-items:center;gap:8px;
}
.efe-head-right{display:flex;align-items:center;gap:14px;}
.efe-clear{background:none;border:0;color:var(--efe-blue);font-weight:700;font-size:13px;cursor:pointer;padding:0;}
.efe-clear:hover{text-decoration:underline;}
/* Botón cerrar (X) y pie con "Aplicar": solo visibles en el modal móvil */
.efe-filters-close{display:none;background:none;border:0;font-size:28px;line-height:1;color:var(--efe-navy-d);cursor:pointer;padding:0 2px;}
.efe-filters-foot{display:none;}
.efe-filters-overlay{display:none;}
.efe-apply-btn{width:100%;background:var(--efe-navy);color:#fff;border:0;border-radius:10px;padding:14px;font-weight:800;font-size:15px;cursor:pointer;transition:.2s;}
.efe-apply-btn:hover{background:var(--efe-navy-d);}
.efe-fblock{padding:16px 0;border-bottom:1px solid var(--efe-line);}
.efe-fblock:last-child{border-bottom:0;padding-bottom:6px;}
.efe-fblock h4{font-size:13px;font-weight:800;color:var(--efe-navy-d);margin:0 0 13px;text-transform:uppercase;letter-spacing:.4px;}

.efe-search{position:relative;}
.efe-search i{position:absolute;left:12px;top:50%;transform:translateY(-50%);color:var(--efe-muted);font-size:18px;}
.efe-search input{width:100%;border:1.5px solid var(--efe-line);border-radius:9px;padding:10px 12px 10px 38px;font-size:14px;outline:none;transition:.2s;}
.efe-search input:focus{border-color:var(--efe-blue);box-shadow:0 0 0 3px var(--efe-blue-soft);}

.efe-foptions{display:flex;flex-direction:column;gap:10px;}
.efe-foptions.efe-scroll{max-height:230px;overflow-y:auto;padding-right:6px;}
.efe-check{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--efe-ink);cursor:pointer;margin:0;}

/* --- Filtros: ver más / ver menos --- */
.efe-opt-extra{display:none;}
.efe-foptions.show-all .efe-opt-extra{display:flex;}
.efe-vermas{display:inline-block;margin-top:12px;padding:0;background:none;border:0;font-size:13.5px;font-weight:700;color:var(--efe-navy-d);cursor:pointer;border-bottom:1.5px solid var(--efe-navy-d);transition:.2s;}
.efe-vermas:hover{color:var(--efe-blue);border-color:var(--efe-blue);}

/* --- Bloque colapsable --- */
.efe-collapsible .efe-fhead{display:flex;align-items:center;justify-content:space-between;cursor:pointer;user-select:none;outline:none;}
.efe-collapsible .efe-fhead-arrow{font-size:20px;color:var(--efe-muted);transition:transform .25s;}
.efe-collapsible .efe-fcontent{overflow:hidden;}
.efe-collapsible.collapsed .efe-fhead{margin-bottom:0;}
.efe-collapsible.collapsed .efe-fhead-arrow{transform:rotate(180deg);}
.efe-collapsible.collapsed .efe-fcontent{display:none;}

.efe-check input{width:17px;height:17px;accent-color:var(--efe-navy);cursor:pointer;flex-shrink:0;}
.efe-check span{line-height:1.3;}
.efe-check:hover span{color:var(--efe-navy);}

.efe-price-inputs{display:flex;align-items:center;gap:8px;}
.efe-price-inputs input{width:100%;border:1.5px solid var(--efe-line);border-radius:9px;padding:9px 10px;font-size:14px;outline:none;transition:.2s;}
.efe-price-inputs input:focus{border-color:var(--efe-blue);box-shadow:0 0 0 3px var(--efe-blue-soft);}
.efe-price-inputs span{color:var(--efe-muted);}

/* Toolbar (conteo + orden) */
.efe-toolbar{
    display:flex;align-items:center;justify-content:space-between;
    background:#fff;border:1px solid var(--efe-line);border-radius:12px;
    padding:12px 18px;margin-bottom:22px;flex-wrap:wrap;gap:10px;
}
.efe-toolbar p{margin:0;color:var(--efe-muted);font-size:14px;}
.efe-toolbar p strong{color:var(--efe-navy-d);font-size:17px;}
.efe-sort{display:flex;align-items:center;gap:8px;}
.efe-sort label{font-size:13px;color:var(--efe-muted);font-weight:600;}
.efe-sort select{border:1.5px solid var(--efe-line);border-radius:8px;padding:8px 12px;font-size:14px;font-weight:600;color:var(--efe-navy-d);outline:none;cursor:pointer;background:#fff;}
.efe-sort select:focus{border-color:var(--efe-blue);}

/* Grilla (con estado de carga) */
.efe-grid{position:relative;min-height:220px;transition:opacity .2s;}
.efe-grid.efe-loading{opacity:.4;pointer-events:none;}
.efe-grid.efe-loading::after{
    content:"";position:absolute;top:60px;left:50%;width:42px;height:42px;margin-left:-21px;
    border:4px solid var(--efe-blue-soft);border-top-color:var(--efe-navy);border-radius:50%;
    animation:efeSpin .7s linear infinite;
}
@keyframes efeSpin{to{transform:rotate(360deg);}}

.efe-empty{text-align:center;padding:70px 20px;color:var(--efe-muted);}
.efe-empty i{font-size:64px;color:#cdd6e3;display:block;margin-bottom:14px;}
.efe-empty h4{color:var(--efe-navy-d);font-weight:800;margin:0 0 6px;}
.efe-empty p{margin:0;font-size:14px;}

/* --- Paginación --- */
.efe-pagination{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:6px;margin-top:26px;}
.efe-page{display:inline-flex;align-items:center;justify-content:center;min-width:40px;height:40px;padding:0 10px;border:1.5px solid var(--efe-line);border-radius:9px;background:#fff;color:var(--efe-navy-d);font-size:14px;font-weight:700;text-decoration:none;cursor:pointer;transition:.2s;}
.efe-page:hover{border-color:var(--efe-blue);color:var(--efe-blue);}
.efe-page.efe-page-active{background:var(--efe-navy);border-color:var(--efe-navy);color:#fff;cursor:default;}
.efe-page.efe-page-disabled{opacity:.45;pointer-events:none;}
.efe-page i{font-size:20px;}
.efe-page-dots{display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:40px;color:var(--efe-muted);font-weight:700;}

/* --- Marcas: slider continuo (marquee) + título de sección --- */
.efe-section-title{display:flex;align-items:center;gap:14px;margin:45px 0 22px;}
.efe-section-title h2{font-size:24px;font-weight:800;color:#07203c;margin:0;}
.efe-section-title:before{content:"";width:6px;height:28px;background:#ee7b05;border-radius:4px;}
.efe-marquee{overflow:hidden;width:100%;padding:6px 0 4px;-webkit-mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);mask-image:linear-gradient(90deg,transparent,#000 6%,#000 94%,transparent);}
.efe-marquee-track{display:flex;align-items:center;gap:64px;width:max-content;animation:efeMarcaScroll 38s linear infinite;}
.efe-marquee:hover .efe-marquee-track{animation-play-state:paused;}
.efe-marca{flex:0 0 auto;text-align:center;}
.efe-marca img{height:64px;max-width:160px;object-fit:contain;display:block;margin:0 auto;}
.efe-marca-name{font-size:13px;color:#6b7787;font-weight:600;margin-top:8px;}
@keyframes efeMarcaScroll{from{transform:translateX(0);}to{transform:translateX(-50%);}}

@media (max-width:991px){
    .efe-filter-toggle{
        display:inline-flex;align-items:center;gap:8px;
        background:var(--efe-navy);color:#fff;border:0;border-radius:10px;
        padding:11px 20px;font-weight:800;font-size:14px;cursor:pointer;margin-bottom:18px;
    }

    /* Filtros como modal/drawer lateral */
    .efe-filters{
        position:fixed;top:0;left:0;bottom:0;
        width:88%;max-width:360px;height:100%;
        z-index:10000;margin:0;padding:0;border:0;border-radius:0;
        display:flex;flex-direction:column;overflow:hidden;
        transform:translateX(-100%);transition:transform .3s ease;
        box-shadow:0 0 45px rgba(0,0,0,.3);
    }
    .efe-filters.open{transform:translateX(0);}

    .efe-filters-head{padding:16px 18px;flex-shrink:0;border-bottom:1px solid var(--efe-line);margin:0;}
    .efe-filters-close{display:inline-flex;}

    .efe-filters-body{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;padding:0 18px;}
    /* Dentro del modal las listas se expanden (el modal hace el scroll) */
    .efe-filters-body .efe-foptions.efe-scroll{max-height:none;}

    .efe-filters-foot{display:block;flex-shrink:0;padding:14px 16px;border-top:1px solid var(--efe-line);background:#fff;}

    /* Overlay oscuro detrás del modal */
    .efe-filters-overlay{
        display:block;position:fixed;inset:0;
        background:rgba(6,32,63,.5);
        opacity:0;visibility:hidden;transition:.3s;z-index:9999;
    }
    .efe-filters-overlay.open{opacity:1;visibility:visible;}
}
