/* ==========================================================
   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;
}

/* Fuera de stock y oferta */

.product-flag{
    background:#e6007e !important;
    color:#fff !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;
}
/* =========================================
   ETIQUETAS PRODUCTO
   ========================================= */

.product-flags .badge{
    border:none !important;
    color:#fff !important;
    font-weight:600 !important;
    padding:4px 8px;
    border-radius:4px;
}

.product-flags .badge.aa-out-stock{
    background:#333333 !important;
}

.product-flags .badge.aa-discount{
    background:#88b400 !important;
}

.product-flags .badge.new,
.product-flags .badge.product-flag-new{
    background:#e6007e !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;
}