/* ==========================================================
   TIPOGRAFÍA GLOBAL - POPPINS
   Equivalente a AngarTheme original
   Poppins 400 / 600
   ========================================================== */

@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;600&display=swap');

html,
body {
    font-family: "Poppins", Arial, Helvetica, sans-serif;
}

/* ==========================================================
   ARTEALBALADEJO - PERSONALIZACIONES HUMMINGBIRD
   ========================================================== */


/* ==========================================================
   CABECERA
   ========================================================== */

.header-bottom{
    background:#ffffff !important;
    padding:5px 0 !important;
    border-bottom:0 !important;
}

/* contenedor alineado con slider */

.header-bottom__container{
    max-width:1280px !important;
    margin-left:auto !important;
    margin-right:auto !important;
}

/* logo */

.header-bottom .navbar-brand .logo{
    max-width:360px !important;
    max-height:none !important;
    width:auto !important;
}

.header-bottom__logo{
    min-width:360px !important;
}

/* lupa buscador magenta */

.ps-searchbar__magnifier{
    color:#e6007e !important;
}
/* ==========================================================
   MENU CORPORATIVO
   ========================================================== */

/* barra verde completa */

.header-nav-full-width{
    background:#88b400 !important;
}

/* ancho completo */

.header-nav-full-width .container-md{
    max-width:100% !important;
}

/* centrar menú */

.header-nav-full-width .ps-mainmenu{
    display:flex;
    justify-content:center;
}

.header-nav-full-width .ps-mainmenu__tree{
    justify-content:center !important;
    gap:0 !important;
}

/* enlaces */

.ps-mainmenu__tree-link{
    color:#ffffff !important;
    font-weight:600;
    text-transform:uppercase;
    padding:10px 18px !important;
    min-height:auto !important;
}

/* hover */

.ps-mainmenu__tree-link:hover{
    background:#e6007e !important;
    color:#ffffff !important;
}

/* activo */

.ps-mainmenu__tree-item.current .ps-mainmenu__tree-link{
    background:#e6007e !important;
    color:#ffffff !important;
    box-shadow:none !important;
}

/* quitar marco azul */

.ps-mainmenu__tree-link:focus,
.ps-mainmenu__tree-link:active,
.ps-mainmenu__tree-dropdown-toggle:focus,
.ps-mainmenu__tree-dropdown-toggle:active,
.ps-mainmenu a:focus,
.ps-mainmenu button:focus{
    outline:none !important;
    box-shadow:none !important;
}

/* compactar menú */

.ps-mainmenu__tree{
    gap:0 !important;
}


/* ==========================================================
   SUBMENÚS TIPO ANGAR
   ========================================================== */

/* Contenedor del desplegable */

.js-sub-menu.submenu{
    min-width:280px !important;
    width:auto !important;
    max-width:none !important;
    background:#ffffff !important;
    border:1px solid #e6e6e6;
    box-shadow:0 4px 12px rgba(0,0,0,.10);
}

/* Bootstrap */

.submenu .container{
    width:auto !important;
    max-width:none !important;
    padding:0 !important;
}

.submenu__row{
    display:flex !important;
    margin:0 !important;
}

/* Eliminamos completamente la columna derecha */

.submenu__right{
    display:none !important;
}

/* La izquierda ocupa todo el ancho */

.submenu__left{
    flex:0 0 100% !important;
    max-width:100% !important;
    width:100% !important;
    border:none !important;
    background:#ffffff !important;
}

/* Enlaces */

.submenu__left a{
    display:block;
    padding:12px 18px;
    color:#333333 !important;
    white-space:nowrap;
    text-decoration:none;
}

/* Hover */

.submenu__left a:hover{
    background:#e6007e !important;
    color:#ffffff !important;
}

/* Activo */

.submenu__left .current a,
.submenu__left li.current a,
.submenu__left a[aria-current="page"]{
    background:#e6007e !important;
    color:#ffffff !important;
}

/* Posición */

.ps-mainmenu__tree-item{
    position:relative !important;
}

.ps-mainmenu__tree-item .js-sub-menu.submenu{
    left:50% !important;
    transform:translateX(-50%) !important;
    top:100% !important;
}
/* ==========================================================
   PRODUCTOS
   ========================================================== */

.product-miniature__title,
.product-title{
    color:#222222 !important;
    font-weight:600;
}

.product-miniature__price,
.price{
    color:#e6007e !important;
    font-weight:700;
}


/* ==========================================================
   SLIDER HOME
   ========================================================== */

#index .swiper,
#index .carousel,
#index .banner,
#index .slider{
    max-width: 1170px !important;
    margin-left:auto;
    margin-right:auto;
}


/* ==========================================================
   SEPARACION MENU / CONTENIDO
   ========================================================== */

#wrapper{
    padding-top:10px;
}

/* =========================================
   TELEFONO + EMAIL CABECERA
   ========================================= */

.ps-contactinfo__phone{
    font-size:15px !important;
    font-weight:600 !important;
    color:#444 !important;
}



/* =========================================
   TELEFONO + EMAIL CABECERA
   ========================================= */

.ps-contactinfo{
    display:flex;
    align-items:center;
    gap:15px;
    flex-wrap:nowrap;
}

.ps-contactinfo__phone,
.ps-contactinfo__email{
    color:#333 !important;
    text-decoration:none !important;
    font-size:14px;
    font-weight:500;
    white-space:nowrap;
}

.ps-contactinfo__phone:hover,
.ps-contactinfo__email:hover{
    color:#e6007e !important;
}

/* barra separadora magenta */

.ps-contactinfo__email{
    border-left:2px solid #e6007e;
    padding-left:15px;
}

.header-top_left,
#_desktop_ps_contactinfo{
    width:auto !important;
}

/* icono email más parecido a la web original */

.ps-contactinfo__email i{
    font-size:18px !important;
    color:#e6007e !important;
    margin-right:5px;
    vertical-align:middle;
    position:relative;
    top:-1px;
}
/* icono teléfono */

.ps-contactinfo__phone i{
    font-size:14px !important;
    color:#e6007e !important;
    margin-right:5px;
    vertical-align:middle;
}

/* =========================================
   LOGIN ARTEALBALADEJO
   ========================================= */

/* icono usuario */

#_desktop_ps_customersignin .header-block__icon{
    color:#e6007e !important;
}

/* texto iniciar sesión */

#_desktop_ps_customersignin .header-block__title{
    color:#333333 !important;
    font-weight:600;
}

/* hover */

#_desktop_ps_customersignin a:hover .header-block__icon{
    color:#e6007e !important;
}

#_desktop_ps_customersignin a:hover .header-block__title{
    color:#333333 !important;
}
/* =========================================
   CARRITO ARTEALBALADEJO
   ========================================= */

/* icono carrito */

#_desktop_ps_shoppingcart i,
#_desktop_ps_shoppingcart .material-icons{
    color:#e6007e !important;
}

/* texto carrito */

#_desktop_ps_shoppingcart a,
#_desktop_ps_shoppingcart .header-block__title{
    color:#333333 !important;
    font-weight:600;
}

/* contador */

#_desktop_ps_shoppingcart .cart-products-count,
#_desktop_ps_shoppingcart .cart-count{
    color:#333333 !important;
    font-weight:700;
}

/* submenu normal */

.submenu__left a{
    color:#333333 !important;
}

/* elemento activo */

.submenu__left .current a,
.submenu__left li.current a,
.submenu__left a[aria-current="page"]{
    color:#ffffff !important;
}

/* =========================================
   ELIMINAR COLUMNA FANTASMA SUBMENU
   ========================================= */

.submenu__left{
    border-right:none !important;
}

.submenu__column{
    border-right:none !important;
}

.submenu__row{
    border-right:none !important;
}

.js-sub-menu.submenu{
    border-right:none !important;
}

/*=========================================
 ancho general similar a la web original 
=========================================*/

.container,
.container-md,
.container-lg,
.container-xl,
.container-xxl {
    max-width: 1170px !important;

}

/* Flechas del slider más cerca de los extremos */

#ps_imageslider .carousel-control-prev {
    left: 5px !important;
}

#ps_imageslider .carousel-control-next {
    right: 5px !important;
}

#ps_imageslider .carousel-control-prev,
#ps_imageslider .carousel-control-next {
    width: 40px !important;
}

/* Botones slider */

#ps_imageslider .carousel-control-prev,
#ps_imageslider .carousel-control-next{
    width:40px !important;
    height:40px !important;
    top:50% !important;
    transform:translateY(-50%) !important;
    opacity:1 !important;
}

/* eliminamos el icono original */
#ps_imageslider .carousel-control-prev-icon,
#ps_imageslider .carousel-control-next-icon{
    background-image:none !important;
    width:40px !important;
    height:40px !important;
    background:rgba(0,0,0,.45) !important;
    border-radius:4px !important;
    position:relative !important;
}

/* flecha izquierda */
#ps_imageslider .carousel-control-prev-icon::after{
    content:"�";
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    color:#fff;
    font-size:18px;
    font-weight:bold;
}

/* flecha derecha */
#ps_imageslider .carousel-control-next-icon::after{
    content:"�";
    position:absolute;
    top:50%;
    left:50%;
    transform:translate(-50%,-50%);
    color:#fff;
    font-size:18px;
    font-weight:bold;
}

/* Indicadores slider */

.carousel-indicators [data-bs-target]{
    background-color:#bdbdbd !important;
    opacity:1 !important;
}

.carousel-indicators .active{
    background-color:#666666 !important;
}


/* Botón productos destacados */

.btn-outline-primary{
    color:#e6007e !important;
    border-color:#e6007e !important;
}

.btn-outline-primary:hover{
    background:#e6007e !important;
    border-color:#e6007e !important;
    color:#fff !important;
}

/* =========================================
   TARJETAS DE PRODUCTO
   ========================================= */

article.product-miniature{
    background:#ffffff;
    border:1px solid #e6e6e6;
    border-radius:.5rem;
    overflow:hidden;
    box-shadow:0 2px 6px rgba(0,0,0,.08);
    transition:box-shadow .25s ease, transform .25s ease;
}

article.product-miniature:hover{
    box-shadow:0 10px 24px rgba(0,0,0,.16);
    transform:translateY(-2px);
}

/* =====================================================
   FOOTER HUMMINGBIRD - VERSIÓN FINAL
   ===================================================== */

/* ---------- Títulos ---------- */

.footer-block__title{
    position:relative;
    margin:0 0 18px 0 !important;
    padding:0 0 12px 0;
    font-size:1.15rem;
    font-weight:700;
    color:#ffffff;
}

.footer-block__title::after{
    content:"";
    position:absolute;
    left:0;
    bottom:0;
    width:110px;
    height:2px;
    background:#e6007e;
}

/* ==========================================================
   FOOTER - LISTAS DEFINITIVAS
   ========================================================== */

footer .footer-block__list{
    margin:0 !important;
    padding:0 !important;
}

footer .footer-block__list li{
    margin:0 !important;
    padding:0 !important;
    list-style:none;
}

footer .footer-block__list li + li{
    margin-top:8px !important;
}

footer .footer-block__list a{
    display:inline-block !important;
    padding:0 !important;
    margin:0 !important;
    line-height:1.2 !important;
}

footer .footer-block__list a:hover{
    color:#e6007e !important;
}

/* ---------- Columnas ---------- */

.footer-block{
    margin-bottom:20px;
}

/* ---------- Contacto ---------- */

.ps-contactinfo{
    margin-top:-12px;
    line-height:1.35;
}

.ps-contactinfo p{
    margin:0 0 6px 0;
}

/* ---------- Copyright ---------- */

.copyright{
    margin-top:30px;
    padding-top:18px;
    border-top:1px solid rgba(255,255,255,.08);
}

.copyright,
.copyright a{
    color:#ffffff;
    font-size:.95rem;
}

.copyright a{
    font-weight:600;
    transition:color .25s ease;
}

.copyright a:hover{
    color:#88b400;
}


footer .footer-block__list li + li{
    margin-top:4px;
}


/* ==========================================================
CHECKPOINT 02 - TARJETAS PRODUCTO
========================================================== */

/* ocultar quick view */

.quickview,
.product-miniature__quickview,
.js-quick-view{
    display:none !important;
}

/* ocultar selector de cantidad */

.product-miniature .input-group,
.bootstrap-touchspin,
.qty,
.quantity{
    display:none !important;
}

/* ocultar variaciones */

.product-variants,
.variant-links,
.color-list,
.product-colors{
    display:none !important;
}

/* ocultar bot�n azul */

.btn-primary{
    background:#e6007e !important;
    border-color:#e6007e !important;
}

.product-miniature .btn,
.product-miniature .btn-primary{
    display:none !important;
}

/* tarjetas */

article.product-miniature{
    border:1px solid #ececec !important;
    border-radius:8px !important;
    overflow:hidden;
    transition:.25s;
}

article.product-miniature:hover{
    box-shadow:0 8px 20px rgba(0,0,0,.12);
}

.product-miniature__title{
    min-height:42px;
    text-align:center;
}

.product-miniature__price{
    text-align:center;
    font-size:1.15rem;
    color:#e6007e !important;
}
/* ==========================================================
CHECKPOINT 03A
ENSANCHAR BUSCADOR
========================================================== */

.header-bottom .search-widget{
    width:430px !important;
    max-width:430px !important;
}

.header-bottom .search-widget form{
    width:100% !important;
}

.header-bottom .search-widget input[type="text"],
.header-bottom .search-widget input[type="search"]{
    width:100% !important;
}

/*==================================================
CHECKPOINT 04
MENU CORPORATIVO
==================================================*/

.header-nav-full-width{
    background:#88b400 !important;
}

.ps-mainmenu__desktop{
    min-height:48px !important;
}

.ps-mainmenu__tree{
    align-items:stretch !important;
}

.ps-mainmenu__tree-item{
    display:flex !important;
}

.ps-mainmenu__tree-link{
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;

    height:48px !important;
    padding:0 20px !important;

    font-size:14px !important;
    font-weight:600 !important;
    line-height:1 !important;

    color:#fff !important;
    text-transform:uppercase;
}

.ps-mainmenu__tree-dropdown-toggle{
    height:42px !important;
    color:#fff !important;
}

/* ==========================================================
   SUBMEN� Hummingbird
   ========================================================== */

.js-sub-menu.submenu{
    background:#95bf0d !important;
}

.js-sub-menu.submenu .container{
    background:#95bf0d !important;
}

.submenu__row{
    background:#95bf0d !important;
}

.submenu__left{
    background:#95bf0d !important;
}

.submenu__right{
    background:#95bf0d !important;
}

.submenu__left-item{
    color:#ffffff !important;
    background:#95bf0d !important;
}

.submenu__left-item:hover{
    background:#e6007e !important;
    color:#ffffff !important;
}

.submenu__left-item.active{
    background:#e6007e !important;
    color:#ffffff !important;
}
/* Texto blanco del submen� */

.js-sub-menu.submenu a.submenu__left-item,
.js-sub-menu.submenu a.submenu__left-item:link,
.js-sub-menu.submenu a.submenu__left-item:visited,
.js-sub-menu.submenu a.submenu__left-item:hover,
.js-sub-menu.submenu a.submenu__left-item:active{
    color:#ffffff !important;
}
/* ==========================================================
   ETIQUETAS PRODUCTO - ACABADO DEFINITIVO
   ========================================================== */

.product-flags .badge{
    border:none !important;
    outline:none !important;
    box-shadow:none !important;
}
/* ==========================================================
   BREADCRUMB + PAGINACIÓN
   ========================================================== */

/* Breadcrumb */
.breadcrumb .breadcrumb-link{
    color:#e6007e !important;
}

.breadcrumb .breadcrumb-link:hover{
    color:#88b400 !important;
}

.breadcrumb .breadcrumb-item:last-child{
    color:#333333 !important;
}

/* Paginación */
.pagination .page-link{
    color:#333333 !important;
}

.pagination .page-link:hover{
    color:#ffffff !important;
    background:#e6007e !important;
    border-color:#e6007e !important;
}

.pagination .page-item.active .page-link{
    color:#ffffff !important;
    background:#e6007e !important;
    border-color:#e6007e !important;
}
/* ==========================================================
   ARTEALBALADEJO - BOTONES DEL SUBMENÚ DE CATEGORÍAS
   ========================================================== */

.subcategory__link {
    background-color: #ec008c;
    border-color: #ec008c;
    color: #ffffff !important;
}

.subcategory__link .subcategory__name {
    color: #ffffff !important;
}

.subcategory__link:hover,
.subcategory__link:focus {
    background-color: #c90078;
    border-color: #c90078;
    color: #ffffff !important;
}

.subcategory__link:hover .subcategory__name,
.subcategory__link:focus .subcategory__name {
    color: #ffffff !important;
}

/* Color de los títulos de la descripción y detalles del producto */
.product__accordion .accordion-button,
.product__accordion .accordion-button:not(.collapsed) {
    color: #212529 !important;
}
/* =========================================================
   MENÚ MÓVIL - BASE LIMPIA
   ========================================================= */

@media (max-width: 991.98px) {

    /* PANEL */
    #mobileMenu {
        top: 122px !important;
        bottom: auto !important;
        left: 0 !important;
        right: 0 !important;

        width: 100% !important;
        height: auto !important;
        max-height: calc(100vh - 122px) !important;

        background: #88b400 !important;
        color: #fff !important;

        transform: translateY(-110%) !important;
        transition: transform .35s ease !important;

        overflow-y: auto !important;

        z-index: 1055 !important;
    }

    #mobileMenu.show {
        transform: translateY(0) !important;
    }


    /* CUERPO */
    #mobileMenu .offcanvas-body {
        padding: 0 !important;
        background: #88b400 !important;
    }


    /* LISTA */
    #mobileMenu ul,
    #mobileMenu ol {
        margin: 0 !important;
        padding: 0 !important;
    }


    /* ELEMENTOS DEL MENÚ */
    #mobileMenu li {
        margin: 0 !important;
        padding: 0 !important;

        background: #88b400 !important;

        border-bottom: 1px solid rgba(255,255,255,.75) !important;
    }


    /* TODOS LOS ENLACES DEL NIVEL PRINCIPAL */
    #mobileMenu li > a {
        display: flex !important;

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

        width: 100% !important;
        min-height: 44px !important;

        padding: 11px 15px !important;

        color: #ffffff !important;
        background: #88b400 !important;

        text-align: left !important;

        text-decoration: none !important;
    }


    /* TEXTO INTERIOR */
    #mobileMenu li > a * {
        color: #ffffff !important;
    }


    /* AL PULSAR / HOVER */
    #mobileMenu li > a:hover,
    #mobileMenu li > a:focus,
    #mobileMenu li > a:active {
        color: #ffffff !important;
        background: #e6007e !important;
    }


    #mobileMenu li > a:hover *,
    #mobileMenu li > a:focus *,
    #mobileMenu li > a:active * {
        color: #ffffff !important;
    }


    /* BOTÓN HAMBURGUESA */
    .ps-mainmenu__mobile-toggle .menu-toggle {
        color: #ffffff !important;
        background: transparent !important;
        border: 0 !important;
    }

    .ps-mainmenu__mobile-toggle .menu-toggle .material-icons {
        color: #ffffff !important;
    }


    /* SOMBRA */
    .offcanvas-backdrop {
        background: rgba(0,0,0,.45) !important;
    }
}
/* =====================================================
   X DE CIERRE
   MAGENTA + X BLANCA
   ===================================================== */

#mobileMenu .btn-close {
    position: relative !important;

    width: 44px !important;
    height: 44px !important;

    margin: 0 !important;
    padding: 0 !important;

    background: #e6007e !important;
    background-image: none !important;

    border: 0 !important;
    border-radius: 0 !important;

    opacity: 1 !important;

    filter: none !important;

    box-shadow: none !important;
}


/* Dibujamos nosotros la X */

#mobileMenu .btn-close::before,
#mobileMenu .btn-close::after {
    content: "" !important;

    position: absolute !important;

    top: 50% !important;
    left: 50% !important;

    width: 22px !important;
    height: 2px !important;

    background: #ffffff !important;

    transform-origin: center !important;
}


#mobileMenu .btn-close::before {
    transform: translate(-50%, -50%) rotate(45deg) !important;
}


#mobileMenu .btn-close::after {
    transform: translate(-50%, -50%) rotate(-45deg) !important;
}


/* Estado al pulsar */

#mobileMenu .btn-close:hover,
#mobileMenu .btn-close:focus,
#mobileMenu .btn-close:active {
    background: #e6007e !important;

    opacity: 1 !important;

    filter: none !important;

    box-shadow: none !important;

    outline: none !important;
}
/* =========================================================
   FLECHAS DEL MENÚ MÓVIL
   BOTÓN MAGENTA + FLECHA BLANCA
   ========================================================= */

@media (max-width: 991.98px) {

    /* Cada elemento del menú es la referencia
       para colocar su propia flecha */
    #mobileMenu .menu__list > li {
        position: relative !important;
    }


    /* Botón de desplegable */
    #mobileMenu .menu__list > li > .menu__toggle-child {
        position: absolute !important;

        top: 50% !important;
        right: 0 !important;

        width: 44px !important;
        height: 44px !important;

        margin: 0 !important;
        padding: 0 !important;

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

        transform: translateY(-50%) !important;

        background: #e6007e !important;

        border: 0 !important;
        border-radius: 0 !important;

        color: #ffffff !important;
        opacity: 1 !important;

        box-shadow: none !important;
    }


    /* Flecha */
    #mobileMenu .menu__list > li > .menu__toggle-child .material-icons {
        color: #ffffff !important;

        font-size: 24px !important;
        line-height: 1 !important;

        margin: 0 !important;
        padding: 0 !important;

        opacity: 1 !important;
    }


    /* Estados */
    #mobileMenu .menu__list > li > .menu__toggle-child:hover,
    #mobileMenu .menu__list > li > .menu__toggle-child:focus,
    #mobileMenu .menu__list > li > .menu__toggle-child:active {
        background: #e6007e !important;
        color: #ffffff !important;
        opacity: 1 !important;
        box-shadow: none !important;
        outline: none !important;
    }

}
/* =========================================================
   SUBMENÚ MÓVIL - CABECERA
   TODAS / TÍTULO DE CATEGORÍA
   ========================================================= */

@media (max-width: 991.98px) {

    /* -----------------------------------------------------
       ENLACE "TODAS"
       ----------------------------------------------------- */

    #mobileMenu nav.menu--mobile.menu--child > a {
        color: #ffffff !important;
        background: #88b400 !important;

        text-align: left !important;

        font-size: 14px !important;
        font-weight: 600 !important;

        text-decoration: none !important;
    }

    #mobileMenu nav.menu--mobile.menu--child > a * {
        color: #ffffff !important;
    }


    /* -----------------------------------------------------
       QUITAR EL AZUL DE "TODAS" EN CUALQUIER ESTADO
       ----------------------------------------------------- */

    #mobileMenu nav.menu--mobile.menu--child > a:hover,
    #mobileMenu nav.menu--mobile.menu--child > a:focus,
    #mobileMenu nav.menu--mobile.menu--child > a:active,
    #mobileMenu nav.menu--mobile.menu--child > a:visited {
        color: #ffffff !important;
        background: #88b400 !important;
    }


    #mobileMenu nav.menu--mobile.menu--child > a:hover *,
    #mobileMenu nav.menu--mobile.menu--child > a:focus *,
    #mobileMenu nav.menu--mobile.menu--child > a:active *,
    #mobileMenu nav.menu--mobile.menu--child > a:visited * {
        color: #ffffff !important;
    }


    /* -----------------------------------------------------
       TÍTULO DEL SUBMENÚ
       BODAS / MADERA / REGALOS / ETC.
       ----------------------------------------------------- */

    #mobileMenu nav.menu--mobile.menu--child[data-parent-title] {
        background: #88b400 !important;
    }


    /*
       El título real se genera a partir de data-parent-title.
       Lo convertimos en una franja magenta.
    */

    #mobileMenu nav.menu--mobile.menu--child[data-parent-title]::before {
        content: attr(data-parent-title) !important;

        display: block !important;

        width: 100% !important;

        padding: 10px 15px !important;

        background: #e6007e !important;
        color: #ffffff !important;

        font-size: 16px !important;
        font-weight: 700 !important;

        text-align: left !important;

        box-sizing: border-box !important;
    }


    /* -----------------------------------------------------
       LISTA DEL SUBMENÚ
       ----------------------------------------------------- */

    #mobileMenu nav.menu--mobile.menu--child .menu__list {
        background: #88b400 !important;
    }


    /* -----------------------------------------------------
       ELEMENTOS DEL SUBMENÚ
       ----------------------------------------------------- */

    #mobileMenu nav.menu--mobile.menu--child .menu__list > li {
        background: #88b400 !important;
        color: #ffffff !important;

        border-bottom: 1px solid rgba(255,255,255,.75) !important;
    }


    #mobileMenu nav.menu--mobile.menu--child .menu__list > li > a {
        color: #ffffff !important;
        background: #88b400 !important;

        text-align: center !important;
    }


    #mobileMenu nav.menu--mobile.menu--child .menu__list > li > a * {
        color: #ffffff !important;
    }


    /* Hover / pulsación */

    #mobileMenu nav.menu--mobile.menu--child .menu__list > li > a:hover,
    #mobileMenu nav.menu--mobile.menu--child .menu__list > li > a:focus,
    #mobileMenu nav.menu--mobile.menu--child .menu__list > li > a:active {
        color: #ffffff !important;
        background: #e6007e !important;
    }


    #mobileMenu nav.menu--mobile.menu--child .menu__list > li > a:hover *,
    #mobileMenu nav.menu--mobile.menu--child .menu__list > li > a:focus *,
    #mobileMenu nav.menu--mobile.menu--child .menu__list > li > a:active * {
        color: #ffffff !important;
    }

/* =========================================================
   SUBMENU MOVIL - TITULO DE CATEGORIA
   ========================================================= */

@media (max-width: 991.98px) {

    #mobileMenu nav.menu.menu--mobile.menu--current
    > ul.menu__list
    > li.menu__title {
        color: #ffffff !important;
        background-color: #e6007e !important;
        font-weight: 700 !important;
        text-align: left !important;
        padding: 10px 15px !important;
        margin: 0 !important;
        border: 0 !important;
    }

}
}
/* =========================================================
   SUBMENÚ MÓVIL - BOTÓN VOLVER
   ========================================================= */

@media (max-width: 991.98px) {

    /* Texto "Todas" -> "Volver" */
    #mobileMenu .js-menu-back-title {
        font-size: 0 !important;
        color: #ffffff !important;
        text-align: left !important;
    }

    #mobileMenu .js-menu-back-title::after {
        content: "Volver";
        font-size: 14px !important;
        color: #ffffff !important;
        font-weight: 600 !important;
        display: inline-block;
    }

    /* Botón completo de volver */
    #mobileMenu .ps-mainmenu__back-button {
        color: #ffffff !important;
        background: transparent !important;
        text-align: left !important;
    }

    #mobileMenu .ps-mainmenu__back-button .material-icons {
        color: #ffffff !important;
    }

}
/* =========================================================
   LOGO RESPONSIVE - CORRECCIÓN MÓVILES ESTRECHOS
   ========================================================= */

@media (max-width: 575.98px) {

    /* Contenedor del logo */
    .header-bottom__logo {
        width: calc(100vw - 24px) !important;
        max-width: calc(100vw - 24px) !important;
        min-width: 0 !important;
        flex: 0 1 auto !important;
    }

    /* H1 que contiene el logo */
    .header-bottom__logo .header-bottom__h1,
    .header-bottom__h1 {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    /* Enlace del logo */
    .header-bottom__logo .navbar-brand {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    /* Imagen */
    .header-bottom__logo .navbar-brand .logo {
        display: block !important;
        width: 100% !important;
        max-width: 100% !important;
        height: auto !important;
    }
}
/* =========================================================
   SLIDER RESPONSIVE - MÓVILES
   Mantiene la proporción original de las imágenes
   ========================================================= */

@media (max-width: 767.98px) {

    /* El contenedor debe adaptarse a la altura real de la imagen */
    .ps-imageslider__figure {
        height: auto !important;
    }

    /* La imagen conserva su proporción original */
    .ps-imageslider__figure img {
        width: 100% !important;
        height: auto !important;
        object-fit: contain !important;
        object-position: center center !important;
    }

}
/* =========================================================
   SLIDER - OCULTAR FLECHAS EN MÓVIL
   ========================================================= */

@media (max-width: 767.98px) {

    .ps-imageslider .carousel-control-prev,
    .ps-imageslider .carousel-control-next {
        display: none !important;
    }

}
/* =========================================================
   SLIDER - OCULTAR INDICADORES EN MÓVIL
   ========================================================= */

@media (max-width: 767.98px) {

    .ps-imageslider .carousel-indicators {
        display: none !important;
    }

}