body{font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;font-size: 14px;line-height: 1.42857143;color: #333;background-color: #fff;}
h2 {font: 2em Arial, Sans-Serif;margin: 0;padding: 0;}
p.noResultado {display: none;}
p.buscadorNoResultado {font-size: large;}
.df-card__pricing {display: none !important;}
.df-branding {display: none !important;}
.df-card__title {font-weight: 500;}
.df-classic .df-panel .df-panel__title:hover {color: white !important;}


@media (min-width: 1300px){
	.sin-columnas.Ofertas {width: 1400px !important;}
}

button.adyen-checkout__button.adyen-checkout__button--pay {
    background-color: #fb6a12 !important;
}

svg.adyen-checkout__card__cvc__hint.adyen-checkout__card__cvc__hint--back {
    margin-left: -13px !important;
}

/* INICIO PARA LAS PAGINAS DE OFERTAS */
ol.listaExplicacion {list-style: circle;}
ol.listaExplicacion > li {font-size: larger;}

@media screen and (max-width: 767px) {
    p.textoExplicacion{text-align: justify !IMPORTANT;font-size: 1.2em;line-height: 22px;margin-top: 5px;}
}

/* FIN PARA LAS PAGINAS DE OFERTAS */

.suscripciones {border: 0px !important;}

h1,h2,h3,h4 {font-family: 'Baloo Bhaina 2', cursive;}
p,span,a,label,b,form {font-family: 'Baloo Bhaina 2', cursive;}
button.btn.btn-link.btn-block.text-left.collapsed {font-family: 'Baloo Bhaina 2', cursive;}
button.btn.btn-link.btn-block.text-left {font-family: 'Baloo Bhaina 2', cursive;}
.card-body {font-family: 'Baloo Bhaina 2', cursive;}
h2.products-section-title.text-uppercase.home_secttion_title {font-family: 'Baloo Bhaina 2', cursive;}
.search-izq{font-family: 'Baloo Bhaina 2', cursive;}
.category_name{font-family: 'Baloo Bhaina 2', cursive;}
.breadscrumb{font-family: 'Baloo Bhaina 2', cursive;}
.carritoDesktop{font-family: 'Baloo Bhaina 2', cursive;}
.boton-guardar, .boton-guardar2{font-family: 'Baloo Bhaina 2', cursive;}
input.botonRealizarPedido.botonCarrito{font-family: 'Baloo Bhaina 2', cursive;}
div#pc-lineas-pedido{font-family: 'Baloo Bhaina 2', cursive;}
span.numeroGlobo.numeroGloboSeleccionado {font-family: auto;}
span.numeroGlobo {font-family: auto;}
a.cn_v3_dynamic_element_button{font-family: 'Baloo Bhaina 2', cursive;}
.subcategory-title {text-transform: capitalize;}

input.inputDeshabilitado.botonRealizarPedido.botonCarrito[disabled] {cursor: default;background-color: #e0e0e0;color: #a0a0a0;border: 1px solid #c0c0c0;opacity: 0.6;pointer-events: none;}


/* Contenedor de la imagen con tamaño fijo y centrado */
.image-contrainer {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 150px;
    height: 150px;
    margin: 0 auto; /* Centra el contenedor horizontalmente dentro de la columna */
    position: relative;
    overflow: hidden;
    transition: transform 0.3s ease, box-shadow 0.3s ease, border-radius 0.3s ease; /* Añade la transición del border-radius */
    border-radius: 0; /* Inicialmente cuadrado */
}

.image-contrainer img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* Mantener proporciones de la imagen */
    transition: border-radius 0.3s ease; /* Suaviza la transición del borde */
}

/* Efecto de la capa oscura y animación */
.overlay {
    position: absolute;
    top: 100%; /* Inicia fuera del contenedor, en la parte inferior */
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.6); /* Capa oscura */
    display: flex;
    justify-content: center;
    align-items: center;
    opacity: 0;
    transform: translateY(20px); /* Inicia desplazado hacia abajo */
    transition: opacity 0.5s ease, transform 0.5s ease, border-radius 0.3s ease; /* Transición suave */
    backdrop-filter: blur(5px); /* Añade un blur a la capa */
}

/* Efecto hover en el contenedor */
.image-contrainer:hover {
    transform: translateY(-5px); /* Eleva un poco el contenedor al hacer hover */
    box-shadow: 0 8px 15px rgba(0, 0, 0, 0.3); /* Sombra suave en el hover */
    border-radius: 50%; /* Cambia el contenedor a circular */
}

/* Efecto hover en la capa oscura */
.image-contrainer:hover .overlay {
    opacity: 1; /* Muestra la capa */
    top: 0; /* La capa se desliza hacia arriba */
    transform: translateY(0); /* Resetea el desplazamiento vertical */
    border-radius: 50%; /* Cambia el borde de la capa a circular */
}

.image-contrainer:hover .image-name {
    opacity: 1;
    transform: translateY(0); /* Resetea el desplazamiento del texto */
}

/* Ajustes del texto dentro del overlay */
.overlay .image-name {
    color: #fff; /* Texto completamente blanco */
    font-size: 1.8rem; /* Aumenta el tamaño del texto */
    font-weight: bold; /* Texto más grueso */
    text-align: center;
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.5s ease, transform 0.5s ease;
}

/* Texto debajo de la imagen en móvil */
.image-name-mobile {
    text-align: center;
    font-size: 1.8rem;
    margin-top: 8px;
}

/* Ocultar el texto en pantallas más grandes */
@media (min-width: 768px) {
    .image-name-mobile {
        display: none;
    }
}

:root {--color-primary: #fb6a12;--color-primary-dark: #d74e00;--color-secondary: #0090d8;--color-text: #555;--color-white: #fff;--color-gray-light: #f5f6fa;--color-gray-border: #eaeaea;--border-radius: 6px;--transition-fast: 0.18s;--transition-medium: 0.3s;--transition-slow: 0.44s;}

/* Reset y base */
* { box-sizing: border-box; }
body {margin: 0;line-height: 1.6;}

/* Cabecera móvil sticky */
.cabecera-movil-atida {width: 100%;background: var(--color-white);border-bottom: 1px solid var(--color-gray-border);position: sticky;top: 0;z-index: 100;}
.container-flex {display: flex;align-items: center;justify-content: space-between;padding: 0.7rem 1rem;max-width: 100%;background: inherit;}
.linea-uno {border-bottom: 1px solid var(--color-gray-border);}
.linea-dos {display: flex;align-items: center;gap: 12px;padding: 0.55rem 1rem;background: #fff;border-bottom: 1px solid var(--color-gray-border);}

/* Logo */
.logo-movil {height: 32px;min-width: 120px;display: flex;align-items: center;}
.logo-movil img {max-height: 100%;width: 76%;margin-left: 1px;margin-bottom: 18px;}

/* Iconos cabecera */
.iconos-movil {display: flex;align-items: center;gap: 6px;}
.icono-btn {background: #fff;border-radius: 50%;width: 38px;height: 38px;display: flex;align-items: center;justify-content: center;font-size: 1.35em;border: none;box-shadow: 0 2px 4px rgba(244,67,54,0.2);color: #555;transition: background var(--transition-fast), color var(--transition-fast);cursor: pointer;position: relative;text-decoration: none;}
.icono-btn:hover,
.icono-btn:active,
.icono-btn:focus {background: var(--color-primary);color: var(--color-white);outline: none;}
.carrito-cantidad {position: absolute;top: 7px;right: -6px;background: #e74c3c;color: #fff;font-size: 0.7em;border-radius: 10px;min-width: 18px;padding: 0 4px;font-weight: bold;text-align: center;line-height: 1.2;}

/* Menú hamburguesa nivel 2 */
.btn-hamburguesa {background: #fff;color: var(--color-primary);width: 38px;height: 38px;border-radius: 50%;border: none;display: flex;align-items: center;justify-content: center;transition: background var(--transition-fast), color var(--transition-fast);margin-right: 8px;}
.btn-hamburguesa:hover,
.btn-hamburguesa:active,
.btn-hamburguesa:focus {background: var(--color-primary);color: #fff;outline: none;}
input.searchNavigation {margin-top: 0px;}

/* Buscador responsive nivel 2 */
.visible-xs-block {flex: 1;display: flex !important;align-items: center;margin-left: 0;margin-bottom: 0;}
.search-izq-nav2.buscador,
.search-izq-nav.buscador {width: 100%;display: flex;align-items: center;margin-top: 0px;}
.searchNavigation {width: 100%;padding: 8px 12px;border: none;background: transparent;font-size: 1em;color: #222;border-radius: 20px;outline: none;transition: background var(--transition-fast), box-shadow var(--transition-fast);}
.searchNavigation:focus {background: #fff;box-shadow: 0 0 0 2px #fb6a1233;}
#buscadorEscritorio::placeholder {color: #888;font-weight: 400;font-size: 1em;opacity: 1;}

/* Oculta botones Algolia si aparecen */
.visible-xs-block .ais-SearchBox-submit,
.visible-xs-block .ais-SearchBox-reset,
.visible-xs-block .ais-SearchBox-loadingIndicator {display: none !important;}

/* Responsive */
@media (max-width: 600px) {.container-flex { padding: 1.1rem 0.5rem; }.logo-movil { min-width: 90px; height: 30px; }.icono-btn, .btn-hamburguesa { width: 32px; height: 32px; font-size: 1.1em; }.linea-dos { padding: 0.45rem 0.5rem; gap: 8px; }.search-izq-nav2.buscador { padding: 2px 7px; }.searchNavigation { font-size: 0.97em; padding: 7px 8px; }}

/* Mejoras de accesibilidad */
@media (prefers-reduced-motion: reduce) {
  * { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}
button:focus-visible, a:focus-visible { outline: 2px solid var(--color-primary); outline-offset: 2px; }

/* Overlay para fondo */
.menu-hamburguesa-overlay {position: fixed;inset: 0;background: rgba(30, 40, 50, 0.5);z-index: 2000;opacity: 0;pointer-events: none;transition: opacity var(--transition-medium);}
.menu-hamburguesa-overlay.visible {opacity: 1;pointer-events: auto;}

/* Panel hamburguesa principal */
.menu-hamburguesa-panel {position: fixed;top: 0;left: 0;width: 85vw;max-width: 340px;height: 100vh;background: var(--color-white);z-index: 2100;transform: translateX(-100%);transition: transform var(--transition-slow) cubic-bezier(.4,0,.2,1);display: flex;flex-direction: column;border-radius: 0 18px 18px 0;outline: none;overflow: hidden;}
.menu-hamburguesa-panel.abierto { transform: translateX(0); }

/* Panel hijos: lateral animado desde la derecha */
.panel-hijos {position: absolute;top: 0; left: 0; right: 0; bottom: 0;background: var(--color-white);transform: translateX(100%);transition: transform var(--transition-slow) cubic-bezier(.77,.2,.05,1);z-index: 2;}
.panel-hijos.active { transform: translateX(0); }

/* Header del panel principal e hijos */
.menu-hamburguesa-mobile-header {position: relative;padding: 0 20px;height: 60px;background: var(--color-secondary);color: var(--color-white);display: flex;align-items: center;justify-content: space-between;font-size: 1.2em;font-weight: 700;flex-shrink: 0;}
.hijos-header { background: var(--color-primary); }
.menu-hamburguesa-mobile-title { flex: 1; text-align: center; font-size: 1.12em; }
.menu-hamburguesa-mobile-close,
.menu-hamburguesa-hijos-back {background: none;border: none;font-size: 2em;color: var(--color-white);cursor: pointer;width: 45px; height: 45px;display: flex; align-items: center; justify-content: center;transition: background var(--transition-fast);border-radius: 50%;}
.menu-hamburguesa-mobile-close:hover,
.menu-hamburguesa-hijos-back:hover {background: rgba(255, 255, 255, 0.1);}

/* Lista principal del menú */
.menu-hamburguesa-mobile-ul {padding: 0;margin: 0;list-style: none;font-family: 'Baloo Bhaina 2', cursive, Arial, sans-serif;overflow-y: auto;flex: 1;max-height: calc(100vh - 60px);}
.menu-hamburguesa-mobile-ul > li {border-bottom: 1px solid #f4f4f4;position: relative;}
.menu-hamburguesa-mobile-ul > li:last-child { border-bottom: none; }
.menu-hamburguesa-mobile-ul > li > a {display: flex;align-items: center;justify-content: space-between;font-size: 17px;font-family: inherit;font-weight: 600;color: #555;padding: 14px 18px 14px 16px;text-decoration: none;transition: background var(--transition-fast), color var(--transition-fast);cursor: pointer;}
.menu-hamburguesa-mobile-ul > li > a:hover,
.menu-hamburguesa-mobile-ul > li > a:focus {background: #fff4eb;color: var(--color-primary-dark);outline: none;}

/* Submenús */
.menu-hamburguesa-mobile-ul ul {background: var(--color-white);margin: 0;border-radius: 0 0 12px 12px;box-shadow: 0 3px 12px -8px var(--color-primary);max-height: 0;overflow: hidden;opacity: 0;transition: max-height var(--transition-slow) cubic-bezier(.77,.2,.05,1), opacity 0.33s cubic-bezier(.77,.2,.05,1);list-style: none;}
.menu-hamburguesa-mobile-ul > li.open > ul {max-height: 999px;opacity: 1;}
.menu-hamburguesa-mobile-ul ul li { padding: 0; margin: 0; }
.menu-hamburguesa-mobile-ul ul a {display: block;color: #222;font-size: 1.01em;padding: 11px 22px;text-decoration: none;background: none;border-radius: 7px;transition: background var(--transition-fast), color var(--transition-fast);margin: 1px 8px;font-weight: 500;}
.menu-hamburguesa-mobile-ul ul a:hover,
.menu-hamburguesa-mobile-ul ul a:focus {background: var(--color-primary);color: var(--color-white) !important;outline: none;}

span.sub-arrow {position: absolute;right: 37px;}

/* Responsive para panel hamburguesa */
@media (max-width: 600px) {.menu-hamburguesa-panel { width: 96vw; max-width: none; }}

/* Prevenir scroll del body cuando el menú está abierto */
.menu-abierto { overflow: hidden; }

	/* Buscador */
	.buscador {display: flex;align-items: center;justify-content: center;width: 150%;}
	#search {border-radius: 7px;padding: 4px 10px;box-shadow: 0 2px 6px rgba(0,40,120,0.04);min-width: 220px;}
	.search-izq {flex: 1;}
	.search {border: none;background: transparent;font-size: 1em;padding: 8px 8px;border-radius: 4px;outline: none;color: #222;width: 100%;}
	.search::placeholder {color: #bbb;font-style: italic;}
	.lupa {width: 28px;height: 28px;margin-left: 8px;opacity: 0.88;transition: opacity .15s;vertical-align: middle;}
	.lupa:hover { opacity: 1; }

	/* Menú de usuario y carrito */
	.contenedorCarritoCabecera {background: #fff !important;font-size: initial;display: flex;align-items: center;gap: 10px;border-radius: 6px;padding: 4px 9px;box-shadow: 0 1px 6px rgba(0,60,110,0.05);}
	.contenedorCarritoCabecera.tienda {background: #fff;}
	.menu-carrito-cosas {font-size: 1em;margin-right: 4px;}
	.menu-carrito-total-cosas {font-weight: 700;color: #009ee3;margin-left: 2px;font-size: 1.04em;}
	.menu-carrito-importe {font-weight: 600;color: #19a84b;font-size: 1.01em;margin-left: 7px;}
	.enlaceSuperiorLogin a {color: #007bb5;font-weight: 500;text-decoration: none;margin-right: 6px;}
	.enlaceSuperiorLogin a:hover {color: #00588c;text-decoration: underline;}
	.bi {vertical-align: middle;margin-right: 3px;}
	.container.logoCabecera.navMenuFixed {width: 100%;height: auto !important;background: white;margin-top: -11px !important;margin-left: -15px;}
	
	/* Responsive */
	@media (max-width:1100px) {
	  .container.logoCabecera, #header { padding: 7px 0 6px 0; }
	  .Logo { width: 100%; }
	  .buscador { width: 100%; }
	}
	@media (max-width:800px) {
	  .container.logoCabecera, #header { padding: 4px 0 3px 0; }
	  .Logo, .buscador { width: 100%; min-width: 0;}
	  .contenedorCarritoCabecera { gap: 4px; padding: 2px 3px; }
	  .logoHeader { max-width: 120px; width: 80px; }
	}
	@media (max-width:480px) {
	  .container.logoCabecera, #header { padding: 2px 0 2px 0; }
	  .Logo, .buscador { width: 100%; }
	  .logoHeader { max-width: 85px; width: 65px;}
	  .contenedorCarritoCabecera { gap: 2px; font-size: 0.97em; padding: 1px 2px; }
	}