/* CHILD THEME CUSTOM STYLE */


/* Estilo para el icono de "Inicio de Sesión" en el Header de la web */
.tvcmsmobile-cart-acount-text #tvcmsmobile-account-button .tvcms-header-myaccount .tv-header-account .tv-account-wrapper .tv-myaccount-btn svg path {
	fill: transparent !important;
}

/* INDEX (HOME PAGE) *************************************************************************/
/* Para el estilo de los productos en Index */
/*.page-home .products .product-description {
	max-height:	25em !important;
	min-height:	25em !important;

}
.page-home .products .tvall-product-star-icon {
	position: relative;
    top: 2.85em;
}
.page-home .products .product-price-and-shipping {
	position: relative;
    top: 2.85em;
}
.page-home .products .tvproduct-add-to-cart {
	position: relative;
    top: 5em;
}*/
/* =======================================
   PRODUCTOS EN CARRUSEL (Owl Carousel)
   ======================================= */

/* ============================================
   UNIFICADO PARA TODAS LAS SECCIONES DE PRODUCTO
   (cualquier carrusel/lista con .product-miniature)
   ============================================ */

/* 1) Igualar celdas del carrusel de Owl */
.owl-stage-outer .owl-stage {
  display: flex !important;
  align-items: stretch !important;
}
.owl-stage-outer .owl-item {
  display: flex !important;
  align-items: stretch !important;
  height: auto !important; /* anula heights inline de Owl */
}

/* 2) Tarjeta de producto: ocupa el 100% de su celda */
.item.product-miniature.tvall-product-wrapper-info-box,
.item.product-miniature.js-product-miniature {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  background: #fff;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 1px 2px rgba(0,0,0,.08);
  box-sizing: border-box;
}

/* 3) Media (imagen) uniforme */
.thumbnail-container { padding: 12px 12px 0; }
.tvproduct-image .tvproduct-defult-img,
.thumbnail-container img[itemprop="image"] {
  width: 100%;
  aspect-ratio: 1 / 1;   /* usa 4/3 si lo prefieres */
  object-fit: cover;
  border-radius: 8px;
  display: block;
}

/* 4) Cuerpo: el wrapper solo estira */
.tvproduct-info-box-wrapper {
  flex: 1;
  display: flex;
  flex-direction: column;
  padding: 12px;
  box-sizing: border-box;
}

/* 5) Layout INTERNO real (grid estable) */
.tvproduct-info-box-wrapper .product-description {
  display: grid;
  grid-template-rows:
    1.2rem                        /* categoría/meta: 1 línea fija */
    minmax(calc(1.4rem * 5), auto)/* título: hasta 5 líneas */
    auto                          /* rating/reseñas */
    1fr                           /* espaciador elástico */
    auto                          /* precio */
    auto;                         /* botón */
  row-gap: 6px;
  flex: 1;
  height: 100%;
}

/* Categoría/meta: 1 línea exacta */
.tvproduct-cat-name {
  font-size: .9rem;
  color: #6b7280;
  line-height: 1.2rem;
  height: 1.2rem;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* Título: 5 líneas (alineado entre tarjetas) */
.tvproduct-name.product-title {
	padding-bottom: 0 !important;
}
.tvproduct-name.product-title h6 {
  margin: 0;
  font-size: 1rem;
  line-height: 1.4rem;
  color: #111827;
  word-break: break-word;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 5;           /* ← cinco líneas */
  overflow: hidden;
  min-height: calc(1.4rem * 5);     /* reserva el alto */
	
	
	    letter-spacing: -0.5px;
    word-spacing: -1px;
}

/* Rating/reseñas: espacio mínimo y sin baile */
.tvall-product-star-icon {
  margin: 0;
  display: flex;
  align-items: center;
  gap: 6px;
  color: #6b7280;
  letter-spacing: 0;
}
.tvall-product-review { font-size: .9rem; }

/* Precio + botón pegados abajo (misma altura en todas) */
.tv-product-price.tvproduct-name-price-wrapper {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin: 0;            /* la fila anterior 1fr empuja esto abajo */
}
.tv-product-price .price {
  font-weight: 700;
  font-size: 1.05rem;
  color: #111827;
}
.tvproduct-cart-btn { margin: 0; }
.tvproduct-cart-btn .btn.add-to-cart {
  width: 100%;
  padding: 10px 12px;
  border: none;
  border-radius: 10px;
  background: #facc15;
  color: #111827;
  font-weight: 600;
  text-transform: uppercase;
  cursor: pointer;
  transition: background .2s;
}
.tvproduct-cart-btn .btn.add-to-cart:hover { background: #000 !important; border: 1px solid #121212 !important; }
.tvproduct-cart-btn .btn.add-to-cart:disabled { opacity: .6; cursor: not-allowed; }


.tv-header-cart .tv-cart-icon:hover {
    background-position: 0 13px !important;
}

/* 6) Varias banderas/acciones */
.tvproduct-flags { pointer-events: none; }
.tvcmsproduct-compare-btn,
.tvproduct-wishlist { margin-top: 6px; }

/* 7) Responsive: mantiene alineación reduciendo líneas del título */
@media (max-width: 992px) {
  .tvproduct-info-box-wrapper .product-description {
    grid-template-rows:
      1.2rem
      minmax(calc(1.4rem * 3), auto)
      auto
      1fr
      auto
      auto;
  }
  .tvproduct-name.product-title h6 {
    -webkit-line-clamp: 5;
    min-height: calc(1.4rem * 5);
  }
}
@media (max-width: 560px) {
  .tvproduct-info-box-wrapper .product-description {
    grid-template-rows:
      1.2rem
      minmax(calc(1.4rem * 2), auto)
      auto
      1fr
      auto
      auto;
  }
  .tvproduct-name.product-title h6 {
    -webkit-line-clamp: 6;
    min-height: calc(1.4rem * 6);
	  text-align: center !important;
  }
	
.tvproduct-wrapper .tvall-product-star-icon {
		flex-direction: column !important;
	}
	
	.product-price-and-shipping {
		margin: 0 auto !important;
	}
	
}





/* ============================================
   NUESTRAS CATEGORÍAS (solo dentro de .eqcats)
   Igualar altura de tarjetas + alinear interior
   ============================================ */

/* =========================================================
   NUESTRAS CATEGORÍAS (solo afecta a tvcategory-chain-slider)
   ========================================================= */

/* 1) La fila/contendor estira todas las columnas */
.tvcategory-chain-slider .tvcategory-chain-slider-content-box{
  display:flex;
  flex-wrap:wrap;
  align-items:stretch;
}

/* 2) Cada columna también estira su tarjeta */
.tvcategory-chain-slider .tvcategory-chain-slider-wrapper-info{
  display:flex;
}

/* 3) Tarjeta base (dos clases suelen ir juntas) */
.tvcategory-chain-slider .tvcategory-chain-slider-wrapper.tvcategory-chain-slider-info-wrapper{
  display:flex;
  flex-direction:column;
  width:100%;
  height:100%;
  background:#fff;
  border-radius:12px;
  box-shadow:0 1px 2px rgba(0,0,0,.06);
  overflow:hidden;
  box-sizing:border-box;
  padding:16px;
}

/* 4) Layout interno en GRID: filas con altura reservada
      [logo] [título 2 líneas] [lista 6 líneas] [espaciador] [botón]
*/
.tvcategory-chain-slider .tvcategory-chain-slider-wrapper.tvcategory-chain-slider-info-wrapper{
  /* ya declarado arriba; añadimos el grid al interior real */
}
.tvcategory-chain-slider .tvcategory-chain-slider-wrapper.tvcategory-chain-slider-info-wrapper{
  /* nada extra aquí; el grid lo aplicamos al propio contenido */
}
.tvcategory-chain-slider .tvcategory-chain-slider-wrapper.tvcategory-chain-slider-info-wrapper{
  /* aseguramos que el contenido ocupa todo */
}
.tvcategory-chain-slider .tvcategory-chain-slider-wrapper.tvcategory-chain-slider-info-wrapper > *{
  /* no necesario; seguimos con bloques concretos abajo */
}

/* BLOQUES concretos del interior */
.tvcategory-chain-slider .tvcategory-chin-img-block{
  height:56px;                    /* fijo para que todas coincidan */
  display:flex;
  align-items:center;
  justify-content:flex-start;
  gap:10px;
  border-bottom:1px solid #eee;
  padding-bottom:12px;
  margin-bottom:12px;
}
.tvcategory-chain-slider .tvcategory-chin-img-block img{
  width:56px;height:56px;object-fit:contain;display:block;
}

/* Título: 2 líneas exactas para alinear */
.tvcategory-chain-slider .tvcategory-chain-slider-wrapper h3,
.tvcategory-chain-slider .tvcategory-chain-slider-wrapper h4{
  margin:0 0 8px 0;
  font-size:1.1rem;
  line-height:1.2rem;
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;           /* máx. 2 líneas */
  overflow:hidden;
  min-height:calc(1.2rem * 2);    /* reserva 2 líneas */
}

/* Lista: reservamos ~6 líneas; si hay más, se ocultan */
.tvcategory-chain-slider .tvcategory-chain-slider-wrapper ul{
  margin:0;
  padding-left:18px;
  list-style:none;
  line-height:1.2rem;
  max-height:calc(1.2rem * 6);    /* 6 líneas visibles */
  overflow:hidden;                 /* usa auto si prefieres scroll */
  color:#374151;
}
.tvcategory-chain-slider .tvcategory-chain-slider-wrapper ul li{ margin:4px 0; }

/* Espaciador elástico: empuja CTA al fondo */
.tvcategory-chain-slider .tvcategory-chain-slider-wrapper .tvcat-spacer{ margin-top:auto; }

/* Botón al fondo, misma altura en todas */
.tvcategory-chain-slider .tvcategory-chain-slider-wrapper .view-all,
.tvcategory-chain-slider .tvcategory-chain-slider-wrapper .btn{
  margin-top:auto;                 /* si no existe .tvcat-spacer */
  display:inline-block;
  width:100%;
  text-align:center;
  padding:10px 12px;
  border:none;
  border-radius:10px;
  background:#facc15;
  color:#111827;
  font-weight:600;
  text-transform:uppercase;
  cursor:pointer;
  transition:background .2s;
}
.tvcategory-chain-slider .tvcategory-chain-slider-wrapper .view-all:hover,
.tvcategory-chain-slider .tvcategory-chain-slider-wrapper .btn:hover{
  background:#eab308;
}

/* Ajuste fino si esta sección usara Owl */
.tvcategory-chain-slider .owl-stage-outer .owl-stage{
  display:flex !important;
  align-items:stretch !important;
}
.tvcategory-chain-slider .owl-stage-outer .owl-item{
  display:flex !important;
  align-items:stretch !important;
  height:auto !important;
}

/* Opcional: mismo alto visual entre filas si el grid Bootstrap mete gutters grandes */
@media (min-width: 768px){
  .tvcategory-chain-slider .tvcategory-chain-slider-wrapper-info.col-md-3{ display:flex; }
}





/* Para dar espacio superior a la sección "Productos Mejor Vendidos" en Index */
.tvcmsbest-seller-product h2 {
	margin-top: 6.5%;
}



/* Para el estilo del banner del buscador en Index */
.ttvattrsearch .ttvattrsearch-wrapper {
	background: #0456b8 !important;
}

.ttvattrsearch .ttvattrsearch-wrapper .tvattrsearch-wrapper-content .tvcmsattrsearch-wrapper {
	font-weight: bold !important;
}

/* Para el estilo de los botones de las tarjetas de Productos */
.tvproduct-cart-btn .tvproduct-add-to-cart {
	background-color: #0456b8 !important;
	border: 1px solid #4a99f7 !important;
}




/* Para el estilo del botón "Ver Mapa" en Footer */
.tvfooter-map #tvfooter-map-btn {
	    background-color: #0456b8 !important;
}
.tvfooter-map #tvfooter-map-btn:hover {
	    background-color: #000 !important;
}


/* Para el estilo delos botones "Ver Todos" de la sección "Nuestras Categorías" en Index */
.tvcategory-chain-slider .tvcategory-chain-slider-wrapper .btn {
	background-color: #0456b8 !important;
}
.tvcategory-chain-slider .tvcategory-chain-slider-wrapper .btn:hover {
	background-color: #000 !important;
}



/* Para el estilo del modal popup del Carrito de Compra */
#blockcart-modal .modal-header {
	background: #0456b8 !important;
}
#blockcart-modal .modal-body .tvall-inner-btn {
	background-color: #0456b8 !important;
}
#blockcart-modal .modal-body .tvall-inner-btn:hover {
	background-color: #000 !important;
}


/* Para el estilo del popup del Carrito */
#_desktop_cart .ttvcart-product-list-btn-wrapper .ttvcart-product-list-viewcart, #_desktop_cart .ttvcart-product-list-btn-wrapper .ttvcart-product-list-checkout {
	background-color: #0456b8 !important;
	border: 1px solid #fff;
}
#_desktop_cart .ttvcart-product-list-btn-wrapper .ttvcart-product-list-viewcart a {
	padding: 2em 0;
}
#_desktop_cart .ttvcart-product-list-btn-wrapper .ttvcart-product-list-viewcart:hover, #_desktop_cart .ttvcart-product-list-btn-wrapper .ttvcart-product-list-checkout:hover {
	background-color: #000 !important;
	border: 1px solid #fff;
}

/* Poner imagen de fondo */
/*html, main {
	background-image: url("/themes/v2_autotrics_child/assets/img/fondo-carbono-1.jpg") !important;
}*/

/* Eliminar padding del cuerpo de la web */
.tv-main-div.tv-box-layout.container {
	padding: 0 !important;
}

/* Poner ancho completo (dentro de su contenedor) a las imágenes del slider de Index */
.tvmain-slider-img.tv-img-responsive {
	width: 100% !important;
}


/* Poner imagen de sustitución al icono del Carrito */
/* Icono personalizado del carrito */
/*.header.dropdown.js-dropdown.hidden-sm-down > a {
    background-image: url("/themes/v2_autotrics_child/assets/img/default-raci.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;

    display: inline-block;
    width: 50px;
    height: 50px;
}*/

.tv-cart-icon-main svg {
    display: none;
}

.tv-cart-icon-main {
    background-image: url("/themes/v2_autotrics_child/assets/img/default_raci.png");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    width: 130px;   /* ajusta */
    height: 130px;  /* ajusta */
}



body {
	background-color: #000;
	background:
	/*url(https://rhyatgaugepods.es/modules/sathemeconfigurator/views/img/backgrounds/default-raci-h.jpg) top center no-repeat;
	url(https://rhyatgaugepods.es/modules/sathemeconfigurator/views/img/backgrounds/default-raci-r.jpg) top center repeat-x;*/
	url(https://rhyatgaugepods.es/modules/sathemeconfigurator/views/img/backgrounds/default-raci-bg.jpg) top center repeat;
	background-position: top center;
	background-position: top center, top center, center bottom !important;
}
.tvcmsdesktop-top-second {
	background-color: #000;
	background: url(https://rhyatgaugepods.es/modules/sathemeconfigurator/views/img/backgrounds/default-raci-h.jpg) top center repeat;
}






/***************************************************
 * 1. Carrito fijo (sin salto en hover)
 ***************************************************/
.tvheader-cart-btn-wrapper,
.tvheader-cart-btn-wrapper a,
.tv-cart-icon.tvheader-right-icon.tv-cart-icon-main {
    transform: none !important;
    transition: none !important;
}

/***************************************************
 * 2. Contenedor icono + contador (carrito)
 ***************************************************/
.tvcart-icon-text-wrapper {
    position: relative;
    display: inline-block;
}

/* caja que contiene el número del carrito, centrada sobre la imagen */
.tv-cart-cart-inner {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    pointer-events: none; /* para que el hover siga siendo del botón */
}

/* estilo del número del carrito */
.tv-cart-cart-inner .cart-products-count {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 22px;          /* ajusta si hace falta para encajar en el círculo rojo */
    height: 22px;
    font-size: 20px !important;
    font-weight: 700;
    color: #fff;
    text-shadow: 0 0 3px #000;
    background: transparent;
}


.tv-cart-cart-inner {
	top: 43% !important;
    	left: 33% !important;
}
.tvheader-cart-btn-wrapper .cart-products-count {
	background-color: transparent !important;
	color: #fff !important;
	font-weight: bold !important;
	height: 25px !important;
    	width: 25px !important;
}

/***************************************************
 * 3. Posición y color de iconos (login y buscar)
 ***************************************************/

/* posicionamos los bloques de login y búsqueda */
#_desktop_user_info,
#_desktop_search {
    position: absolute;
    top: -20px;      /* subir/bajar ambos: más negativo = más arriba */
    color: #fff;
}

/* distancia horizontal desde el borde derecho */
#_desktop_user_info {
    right: 140px;    /* usuario */
}

#_desktop_search {
    right: 180px;    /* lupa, un poco más a la izquierda */
}

/* color y tamaño de los iconos para que se vean en blanco */
#_desktop_user_info i,
#_desktop_user_info .material-icons,
#_desktop_search i,
#_desktop_search .material-icons {
    color: #fff !important;
    font-size: 22px;
    opacity: 0.9;
}

/* pequeños ajustes finos de alineación vertical individual */
#_desktop_user_info {
    margin-top: 2px;    /* ajusta + / - si ves que queda 1–2 px desalineado */
}

#_desktop_search {
    margin-top: 2px;    /* igual que arriba, solo para la lupa */
}

#_desktop_search {
	top: -60px !important;
}
#_desktop_search svg path {
	fill: #fff !important;
}

#tvcmsdesktop-account-button button svg path {
	fill: #fff !important;
}


/* Icono de inicio de sesion */
#tvcmsdesktop-account-button {
	top: -95px;
	right: -19em;
}

/***** Quitar barra vertical junto al icono de usuario *****/

/* Quita cualquier borde que el tema añada en esa zona */
/*.tv-header-account,
.tv-account-wrapper,
.tvcms-header-myaccount,
.tv-header-account *,
.tv-account-wrapper *,
.tvcms-header-myaccount * {
    border-left: none !important;
    border-right: none !important;
}*/

/* Mata posibles pseudo-elementos usados como separador */
/*.tv-header-account:before,
.tv-header-account:after,
.tv-account-wrapper:before,
.tv-account-wrapper:after,
.tvcms-header-myaccount:before,
.tvcms-header-myaccount:after {
    content: none !important;
    display: none !important;
    background: none !important;
    width: 0 !important;
    height: 0 !important;
}*/


/* Icono inicio de sesion */
#tvcmsdesktop-account-button {
	top: -95px;
	right: -24em;
}
#tvcmsdesktop-account-button:after {
	display: none;
}

/* Cuadro de opciones de inicio de sesion */
.tvcms-header-myaccount .tv-account-dropdown {
	top: 4.5em !important;
	right: -30px !important;
}

/* Cuadro de texto del buscador */
.tvsearch-open {
	display: block !important;
}
.tvsearch-top-wrapper .tvsearch-header-display-wrappper {
	position: relative !important;
    top: -4.3em !important;
    left: 15.5em !important;
    width: 125% !important;
}
.tvheader-top-search-wrapper {
	display: none;
}
.tvcmssearch-wrapper .tvheader-top-search-wrapper-info-box input.tvcmssearch-words {
	max-height: 3em;
}


/* Quitar el margin superior de la web */
.tv-main-div {
	margin-top: 0 !important;
}


/* Logo de la web en header */
.tv-header-logo img.logo {
	position: relative !important;
	top: -2.5em !important;
}


/* Estilo para el seleccionador de idioma */
#tvcmsdesktop-language-selector .tv-language-btn .tv-language-span, #tvcmsdesktop-language-selector .tv-language-btn .material-icons.expand-more {
	position: relative;
	top: -1em;
	color: #fff !important;
}




/***************************************************
 * FULL WIDTH REAL PARA EL BANNER
 ***************************************************/

/* El wrapper principal ocupa 100% de pantalla */
.tvcms-newsletter-wrapper {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Hace que el banner salga del .container y se haga full-width */
.tvcms-newsletter-wrapper .container {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* Lo mismo para la fila interior */
.tvcms-newsletter-wrapper .tvcms-newsletter-inner {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
}

/* La columna del banner ocupa realmente el ancho completo */
.tvcms-newsletter-wrapper .tvcms-newsletter-inner > div:last-of-type {
    width: 100% !important;
    max-width: 100% !important;
    flex: 0 0 100% !important;
    padding: 0 !important;
}

/* Banner FULL WIDTH con imagen */
.tvcms-newsletter-wrapper .tvnewsletter-banner-content {
    background-image: url('/themes/v2_autotrics_child/assets/img/envios-internacionales.jpg') !important;
    background-size: cover !important;
    background-position: center center !important;
    background-repeat: no-repeat !important;

    width: 100% !important;
    min-height: 450px !important;
    padding: 60px 30px !important;
    box-sizing: border-box;

    display: flex;
    flex-direction: column;
    justify-content: center;
}
.block_newsletter.tv-newsletter-wrapeer {
	display: none;
}
.tvnewsletter-banner-content h1, .tvnewsletter-banner-content h2 {
	display: none;
}
.tvcms-newsletter-wrapper .container {
    max-width: 100% !important;
    padding: 0 !important;
}





/***************************************************
 * FOCUS VISIBLE ACCESIBLE GLOBAL (toda la web)
 ***************************************************/

/* Para todos los elementos navegables con teclado */
/*a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[role="button"]:focus-visible,
[tabindex]:focus-visible {
    border-radius: 5px !important;
    outline: #075AB1 solid 2px !important;
    outline-offset: 2px !important;
}*/

/* Fallback para navegadores que solo soportan :focus */
/*a:focus,
button:focus,
input:focus,
select:focus,
textarea:focus,
[role="button"]:focus,
[tabindex]:focus {
    border-radius: 5px !important;
    outline: #075AB1 solid 2px !important;
    outline-offset: 2px !important;
}*/

/* Estilo para el icono de lupa (buscador) del Header */
.tvsearch-open {
	width: 12%;
    margin-left: 88%;
}

/* Estilo para navegación con tabulador (para Accesibilidad) */
a:focus, button:focus, input:focus, select:focus, textarea:focus, a:focus-visible, button:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible {	
	border-radius: 5px !important;
	outline: #075AB1 solid 2px !important;
	outline-offset: 2px !important;
}
a:focus .tv-cart-icon-main, a:focus-visible .tv-cart-icon-main {
    outline: 2px solid #075AB1 !important;
    outline-offset: 2px !important;
    border-radius: 6px !important;
}
.tvsearch-open:focus, .tvsearch-open:focus-visible {
	outline: 2px solid #075AB1 !important;
    outline-offset: 2px !important;
    border-radius: 6px !important;
}






/* Para el estilo del banner-buscador de Index */
.tvattrsearch-wrapper-content {
	display: flex;
	justify-content: space-around;
}
.tvattrsearch-wrapper-content .multiselect-wrapper .multiselect {
	    width: 15em !important;
}



/* Estilo para el Banner Slider de "Pago Seguro" y "Manómetros para coche" en Index */
.tvcmsbannerslider .tvbannerslider-title .tvbannerslider-dec h2, .tvcmsbannerslider .tvbannerslider-title .tvbannerslider-dec p {
	color: #fff;
	font-weight: bold;
}
.tvcmsbannerslider .tvcms-bannerslider-pagination-wrapper .tvbannerslider-prev, .tvcmsbannerslider .tvcms-bannerslider-pagination-wrapper .tvbannerslider-next {
	display: none;
}




/* Foco accesible en los botones del slider */
.tvcms-slider-offerbanner-wrapper .tvmain-slider-button:focus,
.tvcms-slider-offerbanner-wrapper .tvmain-slider-button:focus-visible {
    border-radius: 5px !important;
    outline: #075AB1 solid 2px !important;
    outline-offset: 2px !important;
}


/* Estilo para poner borde para navegación con tabulador en el banner/buscador (Attr Search) en Index */
.overSelect:focus, .overSelect:focus-visible {
	outline: 2px solid #075AB1;
    border-radius: 4px;
}




/* Para el banner / buscador de Attr Search */
/* ===== Buscador Attr Search ===== */

/* 1) Asegurarnos de que el bloque del buscador es visible */
.ttvattrsearch {
    display: block !important;
    position: relative !important;
    z-index: 2 !important;
}

/* 2) El overlay no debe bloquear clics ni foco en el <select> real */
.ttvattrsearch .overSelect {
    pointer-events: none !important;
}

/* 3) Borde azul cuando el SELECT tiene foco
      (pero aplicado a la caja visible .selectBox) */
.ttvattrsearch .multiselect .selectBox:focus-within {
    outline: 2px solid #fff !important;
    outline-offset: 2px !important;
    border-radius: 4px !important;
}

/* 4) Borde azul en el botón BUSCAR */
.ttvattrsearch .tvcmsattrsearch-wrapper button[type="submit"]:focus,
.ttvattrsearch .tvcmsattrsearch-wrapper button[type="submit"]:focus-visible {
    outline: 2px solid #fff !important;
    outline-offset: 2px !important;
    border-radius: 4px !important;
}


/***************************************************
 * CARRITO — ICONO DEFAULT EN MÓVIL Y TABLET
 * (sin modificar comportamiento de escritorio)
 ***************************************************/

/* Ocultar icono default en escritorio */
.tv-cart-icon-default {
    display: none;
}

/* ===========================
   MÓVIL + TABLET (≤ 1024px)
   =========================== */
@media (max-width: 1024px) {

    /***********************************************
     * 1) Ocultar la imagen especial del carrito
     ***********************************************/
    .tv-cart-icon-main {
        background-image: none !important;
        background-repeat: no-repeat;
        background-position: center;
        background-size: contain;
        width: auto !important;
        height: auto !important;
    }

    /***********************************************
     * 2) Asegurar que el SVG original sigue oculto
     ***********************************************/
    .tv-cart-icon-main svg {
        display: none !important;
    }

    /***********************************************
     * 3) Mostrar el icono default de Prestashop
     ***********************************************/
    .tv-cart-icon-default {
        display: inline-flex !important;
        align-items: center;
        justify-content: center;
        font-size: 28px !important; /* tamaño del icono */
        color: #000 !important;      /* o #fff si lo quieres blanco */
    }
	
	/* Estilo para el banner / buscador del módulo Attr Search en Index */
	.tvcmsattrsearch .tvattrsearch-wrapper-content {
		justify-content: unset;
		flex-direction: column;
	}
	.tvcmsattrsearch .tvattrsearch-wrapper-content .multiselect-wrapper {
		width: 100% !important;
	}
	.tvcmsattrsearch .tvattrsearch-wrapper-content .tvcmsattrsearch-wrapper {
		width: 100% !important;
	}
	.tvcmsattrsearch .tvattrsearch-wrapper-content .multiselect-wrapper .multiselect {
		width: 100% !important;
	}
	.tvcmsattrsearch .tvattrsearch-wrapper-title .ttvtitle-wrapper .ttvcms-main-title {
		text-align: center;
	}
	
	
	
	/* Estilo para la sección de "Nuestras Categorías" en Index */

.tvcmstabcategory-product-slider .tvtabcategory-product-slider .tvcmstabcategory-product-slider-main-title-wrapper .tvtabcategory-product-pagination {
	display: none;
}
.tvcmstabcategory-product-slider .tvtabcategory-product-slider .tvtabcategory-tab-product .tvtabcategory-all-tab .tvtabcategory-product-sub-title-block .tvtabcategory-product-inner .tvtabcategory-product-li {
	width: 100%;
}
	
	
	
	
}


/***************************************************
 * BUSCADOR — SOLO DENTRO DEL MENÚ MÓVIL / TABLET
 ***************************************************/
@media (max-width: 1024px) {

  /***********************************************
   * 1) Ocultar bloque de buscador bajo el header
   *    (el que se ve ahora en móvil)
   ***********************************************/
  .tvcmsmobile-header-search-logo-wrapper {
    display: none !important;
  }

  /***********************************************
   * 2) Estilos del buscador dentro del slidebar
   ***********************************************/
  #tvcms-mobile-view-header .tvmobile-slidebar .search-inside-mobile-menu {
    display: block;
    padding: 10px 15px;
  }

  #tvcms-mobile-view-header .tvmobile-slidebar .search-inside-mobile-menu form {
    width: 100%;
  }

  #tvcms-mobile-view-header .tvmobile-slidebar .search-inside-mobile-menu .tvheader-top-search,
  #tvcms-mobile-view-header .tvmobile-slidebar .search-inside-mobile-menu .tvheader-top-search-wrapper-info-box,
  #tvcms-mobile-view-header .tvmobile-slidebar .search-inside-mobile-menu input.tvcmssearch-words {
    width: 100%;
    max-width: 100%;
  }

  /* Altura cómoda del input */
  #tvcms-mobile-view-header .tvmobile-slidebar .search-inside-mobile-menu input.tvcmssearch-words {
    height: 40px;
    line-height: 40px;
  }

  /***********************************************
   * 3) Anular tus “hacks” de posición del buscador
   *    cuando está dentro del menú móvil
   ***********************************************/
  #tvcms-mobile-view-header .tvmobile-slidebar .search-inside-mobile-menu .tvsearch-header-display-wrappper {
    position: static !important;
    top: auto !important;
    left: auto !important;
    width: 100% !important;
  }

  #tvcms-mobile-view-header .tvmobile-slidebar .search-inside-mobile-menu .tvheader-top-search-wrapper {
    display: block !important;
  }

  #tvcms-mobile-view-header .tvmobile-slidebar .search-inside-mobile-menu .tvsearch-open {
    width: auto;
    margin-left: 0;
  }
}



/***************************************************
 * LOGO HEADER — RESPONSIVE PC / TABLET / MÓVIL
 ***************************************************/

/* El logo siempre fluido dentro de su contenedor */
.tv-header-logo img.logo {
    max-width: 100%;
    height: auto;
}

/* Tablet + móvil (ancho <= 1024px) */
@media (max-width: 1024px) {

    /* Quitar el desplazamiento vertical del logo
       y centrarlo en el header móvil/tablet */
    .tv-header-logo img.logo {
        position: static !important;  /* anula position: relative */
        top: auto !important;         /* anula top: -2.5em */
        transform: none !important;

        display: block;
        margin: 5px auto;             /* centrado horizontal */
        max-width: 180px;             /* ajusta tamaño del logo si lo ves muy grande/pequeño */
        height: auto;
    }

    /* Asegurar que el contenedor móvil lo centra */
    #tvcms-mobile-view-header .tvcmsmobile-header-logo-right-wrapper {
        text-align: center;
    }
}


/***************************************************
 * HEADER MÓVIL — GARANTIZAR VISIBILIDAD DEL CARRITO
 * EN PANTALLAS MUY ESTRECHAS (≤ 350px)
 ***************************************************/
@media (max-width: 350px) {

  /* Usamos flex en la banda superior del header móvil */
  #tvcms-mobile-view-header .tvcmsmobile-header-menu-offer-text {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
  }

  /* Quitamos floats de las 3 columnas para que flex mande */
  #tvcms-mobile-view-header .tvcmsmobile-header-menu,
  #tvcms-mobile-view-header .tvcmsmobile-header-logo-right-wrapper,
  #tvcms-mobile-view-header .tvcmsmobile-cart-acount-text {
    float: none !important;
    padding: 0 6px;
  }

  /* Orden:
     1) menú hamburguesa a la izquierda
     2) iconos (usuario + carrito) a la derecha
     3) logo en segunda fila, centrado y a ancho completo
  */
  #tvcms-mobile-view-header .tvcmsmobile-header-menu {
    order: 1;
    flex: 0 0 auto;
  }

  #tvcms-mobile-view-header .tvcmsmobile-cart-acount-text {
    order: 2;
    flex: 0 0 auto;
    margin-left: auto;
    text-align: right;
  }

  #tvcms-mobile-view-header .tvcmsmobile-header-logo-right-wrapper {
    order: 3;
    flex: 0 0 100%;
    text-align: center;
    margin-top: 4px;
  }

  /* Logo móvil un pelín más pequeño para que todo respire */
  #tvcms-mobile-view-header #tvcmsmobile-header-logo img.logo {
    max-width: 150px;
    height: auto;
  }

  /* Ajuste fino del tamaño de iconos (usuario + carrito) en muy estrecho */
  #tvcms-mobile-view-header #tvcmsmobile-account-button svg,
  #tvcms-mobile-view-header .tv-cart-icon-default {
    font-size: 22px !important;
  }
}


/***************************************************
 * LOGO MÁS GRANDE EN TABLET Y MÓVIL
 ***************************************************/

/* Tablet + móvil hasta 1024px */
@media (max-width: 1024px) {
  /* Logo en header móvil/desktop en vistas pequeñas */
  .tv-header-logo img.logo {
    max-width: 220px !important;  /* antes ~180px */
    height: auto;
  }
	/* Estilo para el logo de la web en Header */
	#tvcms-mobile-view-header.mobile-header-1 .tvcmsmobile-header-logo-right-wrapper {
		width: 50% !important;
	}
}

/***************************************************
 * LOGO CABECERA: CENTRADO EN MÓVIL Y TABLET
 * (todas las resoluciones hasta 1024px)
 ***************************************************/
@media (max-width: 1024px) {

  /* Contenedor principal del header móvil:
     lo ponemos en flex y centramos verticalmente */
  #tvcms-mobile-view-header .tvcmsmobile-header-menu-offer-text {
    display: flex;
    align-items: center;          /* centro vertical */
    justify-content: space-between; /* izquierda menú, centro logo, derecha iconos */
  }

  /* Bloque del logo en el header móvil */
  #tvcmsmobile-header-logo {
    flex: 0 0 auto;
    text-align: center;           /* por si el tema usa inline-block */
  }

  /* Imagen del logo: centrada en su bloque */
  #tvcms-mobile-view-header #tvcmsmobile-header-logo img.logo {
    display: block;
    margin: 0 auto;              /* centra horizontalmente */
    height: auto;
    /* si quieres limitar tamaño en móvil/tablet, descomenta:
       max-width: 230px;
    */
  }
}

/* Móviles MUY estrechos (≤ 350px) con logo en segunda fila */
@media (max-width: 350px) {
  #tvcms-mobile-view-header #tvcmsmobile-header-logo img.logo {
    max-width: 180px !important;  /* antes 150px */
    height: auto;
  }
}

/***************************************************
 * BANNER PRINCIPAL HOME (tvmain-slider)
 * Altura fija por resolución + imagen llena todo
 ***************************************************/

/* --- MÓVIL PEQUEÑO (≤575px) --- */
@media (max-width: 575px) {

  /* Damos altura a toda la “cadena” del carrusel */
  .page-home #tvmain-slider,
  .page-home #tvmain-slider .owl-stage-outer,
  .page-home #tvmain-slider .owl-stage,
  .page-home #tvmain-slider .owl-item,
  .page-home #tvmain-slider .tvimage.tvslider-list,
  .page-home #tvmain-slider picture {
      height: 260px !important;   /* AJUSTA ESTE VALOR A TU GUSTO */
  }

  /* La imagen rellena la altura */
  .page-home #tvmain-slider .tvmain-slider-img.tv-img-responsive {
      width: 100% !important;
      height: 100% !important;
      object-fit: cover;          /* recorta por los lados, no deforma */
      max-height: none !important;
  }

  /* Un poco más de aire para los textos dentro del banner */
  .page-home #tvmain-slider .tvmain-slider-content-inner {
      padding-top: 1.2rem;
      padding-bottom: 1.2rem;
  }
}


/* --- TABLET / MÓVIL GRANDE (576px–1024px) --- */
@media (min-width: 576px) && (max-width: 1024px) {

  .page-home #tvmain-slider,
  .page-home #tvmain-slider .owl-stage-outer,
  .page-home #tvmain-slider .owl-stage,
  .page-home #tvmain-slider .owl-item,
  .page-home #tvmain-slider .tvimage.tvslider-list,
  .page-home #tvmain-slider picture {
      height: 320px !important;   /* AJUSTA SI LO QUIERES MÁS ALTO */
  }

  .page-home #tvmain-slider .tvmain-slider-img.tv-img-responsive {
      width: 100% !important;
      height: 100% !important;
      object-fit: cover;
      max-height: none !important;
  }

  .page-home #tvmain-slider .tvmain-slider-content-inner {
      padding-top: 1.5rem;
      padding-bottom: 1.5rem;
  }
}


/* --- ESCRITORIO (≥1025px) --- */
@media (min-width: 1025px) {

  .page-home #tvmain-slider,
  .page-home #tvmain-slider .owl-stage-outer,
  .page-home #tvmain-slider .owl-stage,
  .page-home #tvmain-slider .owl-item,
  .page-home #tvmain-slider .tvimage.tvslider-list,
  .page-home #tvmain-slider picture {
      height: 420px !important;   /* ALTURA EN PC */
  }

  .page-home #tvmain-slider .tvmain-slider-img.tv-img-responsive {
      width: 100% !important;
      height: auto !important;  /* ← deja la proporción original */
      object-fit: contain !important;  /* ← muestra la imagen entera, sin cortes */
      max-height: none !important;
  }

  .page-home #tvmain-slider .tvmain-slider-content-inner {
      padding-top: 1.8rem;
      padding-bottom: 1.8rem;
  }
}

/***************************************************
 * CARRITO — CONTADOR EN TABLET / MÓVIL
 * (badge pequeño en la esquina, no centrado encima)
 ***************************************************/
@media (max-width: 1024px) {

  /* El wrapper sigue siendo relativo para poder posicionar el badge */
  .tvcart-icon-text-wrapper {
    position: relative;
    display: inline-block;
  }

  /* Recolocar el contenedor del contador:
     esquina superior derecha del icono, sin centrado */
  .tv-cart-cart-inner {
    position: absolute !important;
    top: -4px !important;
    right: -4px !important;
    left: auto !important;
    transform: none !important;
    pointer-events: none;
  }

  /* Estilo del número: badge redondo tipo “contador por defecto” */
  .tv-cart-cart-inner .cart-products-count,
  .tvheader-cart-btn-wrapper .cart-products-count {
    display: flex !important;
    align-items: center;
    justify-content: center;

    width: 18px !important;
    height: 18px !important;
    line-height: 18px !important;

    border-radius: 50% !important;
    background-color: #f44336 !important; /* rojo contador */
    color: #fff !important;
    font-size: 11px !important;
    font-weight: 600 !important;
    text-shadow: none !important;
  }
}



/***************************************************
 * HEADER MÓVIL / TABLET
 * Mismo fondo que escritorio, adaptado
 ***************************************************/
@media (max-width: 1199.98px) {

  /* Fondo general del header móvil */
  #tvcms-mobile-view-header,
  #tvcms-mobile-view-header .tvcmsmobile-header-menu-offer-text {
    background-image: url("https://rhyatgaugepods.es/modules/sathemeconfigurator/views/img/backgrounds/default-raci-h.jpg");
    background-repeat: no-repeat;
    background-position: top center;
    background-size: cover;   /* se adapta a alto/alto, sin deformar */
    background-color: #000;   /* fallback por si no carga la imagen */
  }

  /* Evitar que columnas internas pongan fondo blanco encima */
  #tvcms-mobile-view-header .tvcmsmobile-header-menu-offer-text,
  #tvcms-mobile-view-header .tvcmsmobile-header-logo-right-wrapper,
  #tvcms-mobile-view-header .tvcmsmobile-header-menu,
  #tvcms-mobile-view-header .tvcmsmobile-cart-acount-text {
    background-color: transparent !important;
  }
}


/***************************************************
 * ICONOS DEL HEADER (LOGIN + CARRITO) EN BLANCO
 ***************************************************/

/* Icono de usuario (SVG) tanto en header desktop
   como en el header móvil (clon del botón) */
#tvcmsdesktop-account-button button svg,
#tvcms-mobile-view-header #tvcmsmobile-account-button button svg {
  fill: #ffffff !important;
  stroke: #ffffff !important;
}

/* Por si algún elemento usa fill/stroke propios */
#tvcmsdesktop-account-button button svg path,
#tvcmsdesktop-account-button button svg circle,
#tvcmsdesktop-account-button button svg rect,
#tvcmsdesktop-account-button button svg line,
#tvcmsdesktop-account-button button svg polyline,
#tvcmsdesktop-account-button button svg polygon,
#tvcms-mobile-view-header #tvcmsmobile-account-button button svg path,
#tvcms-mobile-view-header #tvcmsmobile-account-button button svg circle,
#tvcms-mobile-view-header #tvcmsmobile-account-button button svg rect,
#tvcms-mobile-view-header #tvcmsmobile-account-button button svg line,
#tvcms-mobile-view-header #tvcmsmobile-account-button button svg polyline,
#tvcms-mobile-view-header #tvcmsmobile-account-button button svg polygon {
  fill: #ffffff !important;
  stroke: #ffffff !important;
}

/* Icono de carrito por defecto (Material Icons)
   en el header desktop y en el header móvil */
.tv-header-cart .tv-cart-icon-default,
#tvcms-mobile-view-header .tv-cart-icon-default {
    color: #ffffff !important;
}

/* Por si en algún breakpoint llega a verse el SVG del carrito */
.tv-header-cart .tv-cart-icon-main svg path {
    fill: #ffffff !important;
}

/***************************************************
 * HEADER MÓVIL/TABLET (>350px)
 * Alinear login + carrito a la derecha
 * y alinear verticalmente icono y contador
 ***************************************************/
@media (min-width: 351px) and (max-width: 1024px) {

  /* Bloque que contiene los dos iconos (usuario + carrito):
     los pegamos al borde derecho y reducimos la separación */
  #tvcms-mobile-view-header .tvcmsmobile-cart-acount-text {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 4px;              /* distancia entre login y carrito */
    padding-right: 8px;    /* pegado al borde derecho */
  }

  /* Sin márgenes raros en los contenedores de cada icono */
  #tvcms-mobile-view-header .tvcmsmobile-cart-acount-text > div {
    margin: 0 !important;
  }

  /* Quitamos padding lateral que el tema pone a los iconos
     y que hacía que el carrito se metiera hacia dentro */
  #tvcms-mobile-view-header .tvheader-right-icon {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* Wrapper del carrito para posicionar el badge */
  #tvcms-mobile-view-header .tvcart-icon-text-wrapper {
    position: relative;
    display: inline-block;
  }

  /* Contador del carrito: justo encima del icono,
     prácticamente en la misma vertical del borde derecho */
  #tvcms-mobile-view-header .tv-cart-cart-inner {
    position: absolute !important;
    top: -6px !important;
    right: -2px !important;   /* pequeño “overhang” como los badges nativos */
    left: auto !important;
    transform: none !important;
    pointer-events: none;
  }
	
	
	/* Estilo para los iconos de "Incicio de Sesión" y "Carrito" del Header */
	#tvcms-mobile-view-header .tvheader-right-icon {
			margin-right: -1.5em !important;
	}
		#tvcmsmobile-account-button .tvcms-header-myaccount {
			margin-right: -1.5em !important;
	}
	
	
	/* Estilo para el menú móvil (Menu Hamburguesa) */
	#tvcmsmobile-search {
		margin-top: 10% !important;
	}
	.tvmega-menu-title {
		display: none !important;
	}
	#tvmobile-lang .tv-language-btn .tv-language-span, #tvmobile-lang .tv-language-btn .material-icons, #tvcmsdesktop-language-selector .tv-language-btn .material-icons.expand-more {
		color: #000 !important;
	}
	.tv-language-dropdown li a span {
	    position: relative !important;
		top: -1em !important;
	}
	
	
	
	
	
	
}

/* SOLO TABLETS */
@media (min-width: 769px) and (max-width: 1024px) {
	/* Estilo para el logo de la web en Header */
	#tvcms-mobile-view-header .tvcmsmobile-header-menu-offer-text .tvcmsmobile-header-logo-right-wrapper {
		position: relative;
		left: 12em;
		top: -0.5em;
	}
}
/* SOLO MOVILES */
@media (min-width: 351px) and (max-width: 768px) {
	/* Estilo para el logo de la web en Header */
	#tvcms-mobile-view-header .tvcmsmobile-header-menu-offer-text .tvcmsmobile-header-logo-right-wrapper {
		position: relative;
		left: 3.5em;
		top: -2em;
	}
	
	/* Para el estilo del contenedor horizontal del Header */
	#tvcms-mobile-view-header .tvcmsmobile-header-menu-offer-text {
		max-height: 150px !important;
		padding-top: 20%;
	}
	#tvcmsmobile-header-logo {
		position: relative;
    	top: -2.5em;
	}
	
	
	
}

/* Estilo para el banner "Pago 100% Seguro y "" en Index */
.tvcmsbannerslider .tvbannerslider-title .tvbannerslider-button {
	background-color: #0456b8 !important;
	border: 1px solid #4a99f7 !important;
}
.tvcmsbannerslider .tvbannerslider-title .tvbannerslider-button:hover {
	background-color: #000 !important;
	border: none !important;
}

/***************** PÁGINA PRODUCTO ********************/
/* Para el estilo del Otón "Add to cart" de la Página de Producto */
.product-actions .product-add-to-cart .tvcart-btn-model .tvall-inner-btn {
	background-color: #0456b8 !important;
	border: 1px solid #4a99f7 !important;
}
.product-actions .product-add-to-cart .tvcart-btn-model .tvall-inner-btn .material-icons {
	color: #fff !important;
}
.product-actions .product-add-to-cart .tvcart-btn-model .tvall-inner-btn:hover {
	background-color: #000 !important;
}
/* Para no mostrar los mensajes de alert de "error", "warnings" o "info" en la Página de Producto */
#product .alert.ajax-error, #product .alert.ajax-warning, #product .alert.ajax-info {
	display: none;
}

/*********** PÁGINA CARRITO ******************/
/* Para el estilo de los botones "Continuar Comprando" y "Finalizar Compra" en la Página de Carrito */
.cart-grid .cart-grid-body .tv-continue-shopping-btn {
	background-color: #0456b8 !important;
	border: 1px solid #4a99f7 !important;
}
.cart-grid .cart-grid-body .tv-continue-shopping-btn .material-icons {
	color: #fff !important;
}
.cart-grid .cart-grid-body .tv-continue-shopping-btn:hover {
	background-color: #000 !important;
}
.cart-grid .cart-summary .checkout .text-sm-center {
	margin-top: 5%;
}
.cart-grid .cart-summary .checkout .text-sm-center .tvprocess-to-checkout {
	background-color: #0456b8 !important;
	border: 1px solid #4a99f7 !important;
}
.cart-grid .cart-summary .checkout .text-sm-center .tvprocess-to-checkout .material-icons {
	color: #fff !important;
}
.cart-grid .cart-summary .checkout .text-sm-center .tvprocess-to-checkout:hover {
	background-color: #000 !important;
}
/* Estilo para el botón de "PayPal" en la Página de Carrito */
body#cart .checkout.cart-detailed-actions [data-container-bnpl] {
  margin-top: 2.5em !important;   /* desplaza hacia abajo */
}

/*********** PÁGINA CHECKOUT ******************/
/* Para el estilo del botón "continuar" en la Página de Checkout  */
.tvcheckout-process-left .tvall-inner-btn {
	background-color: #0456b8 !important;
	border: 1px solid #4a99f7 !important;
}
.tvcheckout-process-left .tvall-inner-btn:hover {
	background-color: #000 !important;
}

.tvheader-checkout .tvcmsdesktop-top-header-box {
	text-align: center !important;
}
.tvheader-checkout .tvcmsdesktop-top-header-box .tvcms-header-logo-wrapper {
	position: relative !important;
    left: 33.5% !important;
}


/* Imagen del logo: tamaño por defecto (escritorio grande) */
.tvcmsdesktop-top-header-wrapper.tvheader-checkout #tvcmsdesktop-logo .tv-header-logo .logo {
  height: auto;
  max-width: 400px;
}

/* TABLET (≈ 576–991px): logo un poco más pequeño */
@media (min-width: 576px) and (max-width: 991.98px) {
  .tvcmsdesktop-top-header-wrapper.tvheader-checkout #tvcmsdesktop-logo .tv-header-logo .logo {
    max-width: 190px;
  }
}

/* Para el estilo del botón submit de la Página de Registro */
.register-form .form-footer .tvall-inner-btn {
	background-color: #0456b8 !important;
	border: 1px solid #4a99f7 !important;
}
.register-form .form-footer .tvall-inner-btn:hover {
	background-color: #000 !important;
}
.register-form .form-control-label {
	display: none;
}


/*********** PÁGINA CONTACTO – RECAPTCHA A LA IZQUIERDA Y BOTÓN A LA DERECHA ***********/
@media (min-width: 992px) {

  /* Hacemos que el formulario sea el contexto de posicionamiento */
  body#contact #contact-form {
    position: relative;
    padding-bottom: 80px; /* espacio extra por si movemos el captcha hacia arriba */
  }

  /* Footer con el botón: lo ponemos en flex pegado a la derecha */
  body#contact #contact-form .form-footer {
    display: flex;
    justify-content: flex-end;
    align-items: center;
    gap: 20px;
    padding-left: 340px;  /* deja “hueco” a la izquierda para el reCAPTCHA */
  }

  /* El contenedor del reCAPTCHA (el bloque que envuelve el widget) */
  body#contact #contact-form .g-recaptcha {
    position: absolute;
    left: 0;           /* pegado al borde izquierdo del formulario */
    bottom: 30px;      /* altura aproximada para alinearlo con el botón */
  }
}

/***************** PÁGINA CONTACTO ********************/
/* Para el estilo del cuadro de Recaptcha en la Página de Contacto */
#contact #captcha-box {
	position: relative;
    left: -52.2em;
    top: -5.5em;
}
/* Tablet: ancho <= 992px */
@media (max-width: 992px) {
  #contact #captcha-box {
    /* anulamos el desplazamiento “bestia” de escritorio */
    left: 0;
    top: 0;
    margin: 1.5rem auto 0;   /* lo centramos bajo el formulario */
  }
}
/* Móvil: ancho <= 576px */
@media (max-width: 576px) {
  #contact #captcha-box {
    left: 0;
    top: 0;
    margin: 1rem auto 0;
    display: flex;
    justify-content: center;  /* que el recaptcha quede centrado en el ancho del móvil */
  }
  /* por si acaso, evitamos desbordes horizontales */
  #contact #captcha-box > div {
    max-width: 100%;
  }
}
/* MÓVIL: ordenar primero el reCAPTCHA y luego el botón */
@media (max-width: 576px) {

  /* Contenedor donde están captcha + botón  */
  #contact form {
    display: flex;
    flex-direction: column;  /* apila vertical */
  }

  /* reCAPTCHA primero */
  #contact #captcha-box {
    order: 1;
    left: 0;
    top: 0;
    margin: 0 0 1rem 0;      /* un poco de espacio debajo del captcha */
  }

  /* botón submit después del reCAPTCHA */
  #contact button[type="submit"],
  #contact input[type="submit"] {
    order: 2;
    align-self: center;      /* opcional, para centrar el botón */
  }
}



/* Para el estilo del botón de submit del formulario de contacto en Página Contacto */
.contact-form .form-fields .form-footer .tvall-inner-btn {
	background-color: #0456b8 !important;
	border: 1px solid #4a99f7 !important;
}
.contact-form .form-fields .form-footer .tvall-inner-btn:hover {
	background-color: #000 !important;
}


/* Estilo para el resto de botones de la web */
.tvall-inner-btn {
	background-color: #0456b8 !important;
	border: 1px solid #4a99f7 !important;
}
.tvall-inner-btn .material-icons {
	color: #fff;
}
.tvall-inner-btn:hover {
	background-color: #000 !important;
}

/* Estilo para hacer menos alto el campo del textarea en la Página de Contacto */
.tvcontact-area-text {
    min-height: 127.5px;
}


/* ===== Página CMS /envios: tamaño uniforme de banderas ===== */
.page-cms-1 #content img {
  height: 20px !important;  /* un pelín más grande que la de España (15px) */
  width: auto !important;   /* respeta proporción de cada bandera */
  max-width: none !important;
  display: inline-block;
  vertical-align: middle;
}


/* Estilo para el color de los texto de los botones */
.tvmain-slider-button.tvall-inner-btn:hover {
	border: none !important;
}
.tvmain-slider-button.tvall-inner-btn span, .tvmain-slider-button.tvall-inner-btn span:hover {
	color: #fff !important;
}
.tvmain-slider-btn .tvall-inner-btn:after {
	box-shadow: 0 0 0 1px #4a99f7 !important;
}

/***************** PÁGINA ENVÍOS ********************/
/***************************************************
 * PÁGINA ENVÍOS (CMS id=1) – BLOQUE BANDERAS
 ***************************************************/

/* Contenedor general de las banderas */
.page-cms-1 .shipping-tracking-grid {
  margin: 2rem 0;
}

/* Cada país: bloque centrado vertical en móvil/tablet (stacked) */
.page-cms-1 .shipping-country {
  text-align: center;
  margin-bottom: 1.5rem;
}

/* Banderas: todas mismo tamaño */
.page-cms-1 .shipping-flag {
  display: block;
  margin: 0 auto 0.5rem;
  width: 32px !important;  /* un poco más grande que la de España original */
  height: auto !important;
}

/* Nombre del país */
.page-cms-1 .shipping-country h3 {
  margin: 0 0 0.5rem;
  font-size: 1rem;
  font-weight: 700;
}

/* Párrafo de enlaces (Correos, GLS, etc.) */
.page-cms-1 .shipping-country p {
  margin: 0;
}

/* Nota de debajo ("Si no puedes rastrear...") */
.page-cms-1 .shipping-note {
  margin-top: 1rem;
}

.shipping-tracking-grid .shipping-country {
	display: inline-flex;
	margin-bottom: 3%;
	width: 100%;
}
.shipping-tracking-grid .shipping-country h3 {
	font-size: 1.5em;
	font-weight: bold;
	position: relative;
    top: 1.2em;
	margin-left: 3%;
}
.shipping-tracking-grid .shipping-country p {
	font-weight: bold;
	margin-left: 5%;
	position: relative;
    top: 1.3em;
}
.shipping-tracking-grid .shipping-country p a {
	font-weight: bold;
    text-decoration: underline;
}
.shipping-tracking-grid .shipping-country p a:hover {
	color: #0456b8 !important;
}

@media (min-width: 351px) and (max-width: 1024px) {
	
	.shipping-tracking-grid .shipping-country img {
		width: auto;
        height: 35px;
	}
	.shipping-tracking-grid .shipping-country h3 {
		top: 0.3em;
	}
	.shipping-tracking-grid .shipping-country p {
		top: 0;
	}
	
}

@media (min-width: 351px) and (max-width: 768px) {
	
	.shipping-tracking-grid .shipping-country h3 {
		font-size: 1.2em;
    	letter-spacing: -0.5px;
		top: 0.5em;
	}
	.shipping-tracking-grid .shipping-country p {
		letter-spacing: -0.5px;
	}
	
}

/* ===== SOLO ESCRITORIO: banderas en una línea ===== */
@media (min-width: 992px) {
  .page-cms-1 .shipping-tracking-grid {
    display: flex;
    justify-content: space-between;
    gap: 2rem;
    align-items: flex-start; /* todos los bloques alineados arriba */
  }

  .page-cms-1 .shipping-country {
    flex: 1 1 0;
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  /* Opcional: que todos los textos de los países “ocupen” similar altura */
  .page-cms-1 .shipping-country p {
    margin-top: auto;
  }
}


/* Para el estilo de la barra inferior sticky de "Mi cuenta", "Añadir a la cesta" y "Scroll Top" */
.tvcmsright-sticky .tvright-sticky .tvright-sticky-wrapper {
	display: flex;
	justify-content: center;
}
.tvcmsright-sticky .tvright-sticky .tvright-sticky-wrapper div {
	width: 100%;
}

/* Media Query para los texto de los títulos de las secciones (etiquetas h2) */
@media (min-width: 351px) and (max-width: 768px) {
	
	.cms-description h2 {
		font-size: 2em !important;
	}
	
}

/* Para el estilo de las imágenes de las marcas del banner encima del mapa en Index */
#index .owl-carousel .owl-item .tvbrandlist-slider-wrapper-info .tvbrand-img-block img {
	min-width: 10em !important;
}
@media (min-width: 351px) and (max-width: 768px) {
	
	/*.owl-carousel.owl-drag .owl-item {
		margin: 0 1% !important;
	}*/
	.tvbrand-img-block {
		min-width: 12em !important;
	}
	#index .owl-carousel .owl-item .tvbrandlist-slider-wrapper-info .tvbrand-img-block img {
		height: 3em;
		min-width: auto !important;
	}

}



/* Para no mostrar los textos "¡Disponible sólo en Internet!" y "Nuevo" que se mostraban al hacer hover en la tarjeta de un producto  en Index */
.tvproduct-wrapper .tvproduct-image .tvproduct-online-new-wrapper {
	display: none;
}



/* Estilo para la imagen del "Programa del Kit Digital" encima de footer en Index */
/* Contenedor del banner (opcional, por si quieres ajustar márgenes) */
.divImgProgKitDigital {
  width: 100%;
  margin: 0;           /* ajusta si quieres margen superior/inferior */
  padding: 0;
}
/* Imagen responsive al 100% */
.divImgProgKitDigital img {
  display: block;
  width: 65%;         /* ocupa el 100% del ancho del contenedor */
  max-width: 100%;     /* evita que se pase */
  height: auto;        /* respeta la proporción original */
  margin: 0 auto !important;
}
@media (min-width: 351px) and (max-width: 768px) {
	
	.divImgProgKitDigital img {
		width: 100% !important;
	}
	
}





/* Estilo para el banner de "Categorías Destacadas" en Index */
/*.tvcmscategory-slider .tvcategory-slider-wrapper-info .tvcategory-slider-title {
	border-radius: 25px;
	background-color: #0456b8 !important;
	border: 1px solid #4a99f7 !important;
}
.tvcmscategory-slider .tvcategory-slider-wrapper-info .tvcategory-slider-title .tvcategory-img-block {
	padding-top: 5%;
}
.tvcmscategory-slider .tvcategory-slider-wrapper-info .tvcategory-slider-title .tvcategory-img-block .tv-img-responsive {
	height: 5em !important;
	object-fit: cover;
	filter: drop-shadow(1px 1px 1px 1px #fff);
	filter: drop-shadow(1px 1px #fff) drop-shadow(1px -1px #fff) drop-shadow(-1px 1px #fff) drop-shadow(-1px -1px #fff);
}
.tvcmscategory-slider .tvcategory-slider-info-box {
	margin-top: 1em !important;
	margin-bottom: 1em;
}
.tvcmscategory-slider .tvcategory-slider-wrapper-info .tvcategory-slider-info-title {
	color: #fff !important;
	font-size: 1.2em !important;
	text-shadow: 1px 1px 2px #fff !important;
}
.tvcmscategory-slider .tvcategory-slider-wrapper-info .tvcategory-slider-title:hover {
	background-color: #fff !important;
	border: 1px solid #4a99f7 !important;	
}
.tvcmscategory-slider .tvcategory-slider-wrapper-info .tvcategory-slider-title:hover .tvcategory-slider-info-title {
	color: #000 !important;
}
@media (min-width: 351px) and (max-width: 768px) {
	
	.tvcmscategory-slider .tvcategory-slider-wrapper-info .tvcategory-slider-title {
		background-color: #fff !important;
		border: 1px solid #4a99f7 !important;	
	}
	.tvcmscategory-slider .tvcategory-slider-wrapper-info .tvcategory-slider-title .tvcategory-slider-info-title {
		color: #000 !important;
	}
	
}*/



/* Para el estilo de los cuadros de "Disponible" o "" en la Página de Producto */
#product-availability { 
	background-color: #198754 !important;
}




/* PARA RECAPTCHA */
/*************************************************
 * 1) LAYOUT GENERAL (REGISTRO)
 *************************************************/
/* Contenedor principal del contenido en la página de registro */
body#registration #content.page-content,
body#registration .register-form,
body#registration .card {
  position: relative;
  z-index: 1;
  overflow: visible !important;   /* que nada recorte el recaptcha */
}
/*************************************************
 * 2) WRAPPER DEL RECAPTCHA "CUADRO" (v2)
 *    Si el módulo pinta un <div class="g-recaptcha"> en el wrapper
 *************************************************/
body#registration #registration-recaptcha-wrapper,
body#authentication #login-recaptcha-wrapper {
  width: 100%;
  margin: 20px auto;
  display: flex;
  justify-content: center;        /* centra horizontalmente */
  align-items: center;
  text-align: center;
  position: relative;
  z-index: 9999;
  overflow: visible !important;
}
body#registration #registration-recaptcha-wrapper .g-recaptcha,
body#authentication #login-recaptcha-wrapper .g-recaptcha {
  flex-shrink: 0;
}
/*************************************************
 * 3) BADGE DEL RECAPTCHA INVISIBLE / v3
 *    (el cuadrito pequeño con el logo que ves abajo a la izquierda)
 *    CENTRADO EN TODAS LAS RESOLUCIONES
 *************************************************/
/* Regla base: escritorio */
html body .grecaptcha-badge {
  position: fixed !important;
  left: 50% !important;
  right: auto !important;
  transform: translateX(-50%) !important;
  bottom: 32px !important;        /* ajusta la altura si quieres */
  z-index: 99999 !important;
}
/* Tablet */
@media (max-width: 991.98px) and (min-width: 768px) {
  html body .grecaptcha-badge {
    bottom: 24px !important;
  }
}
/* Móvil */
@media (max-width: 767.98px) {
  html body .grecaptcha-badge {
    bottom: 16px !important;
  }
}


.grecaptcha-badge {
  border: 5px solid red !important;
}


/* Estilo para la "Descripción Corta" y "Descripción" del producto en la Página de Producto */
.tvproduct-page-wrapper .product-description p {
	margin: 0;
	padding: 0;
}
.tvproduct-page-wrapper .product-description p.MsoNormal {
	padding-bottom: 1%;
}
.tvproduct-page-wrapper .product-description p.MsoNormal img {
	margin: 0 auto;
}


/* Para el estilo del cuadro de Recaptcha en Página Checkout */
/*#checkout #captcha-box {
	position: relative !important;
    left: -13.6em !important;
    top: 4.2em !important;
}*/


/* Estilo para las bullets de la galeria de imágenes del producto en la Página de Producto */
@media (max-width: 1200px) {
    .product-1 .tvvertical-slider .product-images {
        max-height: 330px !important;
    }
	.tvvertical-slider .product-images .slick-dots {
		bottom: -7px !important;
	}
}


/* Para pagina contacto */
@media (min-width: 351px) and (max-width: 768px) {
	
	#checkout #customer-form {
		margin-left: 0 !important;
	}
	/*#checkout #captcha-box {
		left: 2.2em !important;
    	top: 0.5em !important;
	}*/
	/* Para el botón de "Continuar" en mitad de formulario de Checkout */
	#checkout #checkout-personal-information-step .form-footer {
		margin-top: 7%;
	}
	#checkout #checkout-personal-information-step .form-footer .continue {
			float: none !important;
			width: 95%;
	}
	
}


/* Para el estilo de los carruseles de productos en Index */
@media (min-width: 351px) and (max-width: 768px) {
	
	.tvtab-product-wrapper .tvtab-product .tvtab-main-title-wrapper, .tvtab-product-wrapper .tvtab-product .tvcmsmain-title-wrapper, .tvtab-product-wrapper .tvtab-featured-pagination-next-pre-btn {
		margin-bottom: 0 !important;
	}
	
	.owl-carousel .owl-item {
		margin: 0 !important;
	}
	
	.owl-carousel .tvtabproduct-main-block .thumbnail-container {
		padding: 12px 5px !important;
	}
	.owl-carousel .tvtabproduct-main-block .thumbnail-container .tvproduct-info-box-wrapper .product-description .tvproduct-cart-btn .tvproduct-add-to-cart {
		line-height: 1 !important;
	}
    .owl-carousel .owl-carousel.owl-drag .owl-item {
		width: 100% !important;
        margin: 0 !important;
	}
	
}



/* MÓVIL: cuando la fila del menú está en sticky, ocultar logo y reducir alto */
@media (max-width: 768px) {

  /* Cuando dentro del header exista la banda con la clase .sticky... */
  #tvcms-mobile-view-header:has(.tvcmsmobile-header-menu-offer-text.sticky) 
  .tvcmsmobile-header-logo-right-wrapper {
    display: none !important;
  }

  /* ...y de paso hacemos la cabecera más baja */
  #tvcms-mobile-view-header:has(.tvcmsmobile-header-menu-offer-text.sticky) {
    padding-top: 0 !important;
  }

  /* Ajustar la propia banda sticky para que sea finita */
  #tvcms-mobile-view-header .tvcmsmobile-header-menu-offer-text.sticky {
    padding-top: 1em !important;
    padding-bottom: 1em !important;
    /*background-image: none !important;
	background-color: #000 !important;*/
  }
	/* Logo centrado dentro de la banda sticky */
  #tvcms-mobile-view-header .tvcmsmobile-header-menu-offer-text.sticky::before {
    content: "";
    position: absolute;                 /* se posiciona respecto al propio sticky,
                                           que ya es 'position: fixed/sticky' */
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 350px;                       /* ajusta a tu gusto */
    height: 79px;                       /* idem */
    background-image: url("https://rhyatgaugepods.com/img/logo-1762168241.jpg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
    pointer-events: none;               /* para no bloquear clics en menú/iconos */
  }
}


/* Para el estilo del cuadro de Recaptcha en mitad de formulario de Checkout */
#checkout #checkout-guest-form #customer-form div div:last-child {
	display: flex;
	flex-direction: column;
}
@media (max-width: 768px) {
	#checkout #captcha-box + div {
		margin: 0 auto;
	}
	#checkout #checkout-guest-form #customer-form div div:last-child {
		margin: 0 auto !important;
	}
	#checkout #checkout-guest-form #customer-form div div:last-child > div {
		margin-top: 3%;
	}
}
/* Para ele estilo de los botones "Continuar" en Checkout */
#checkout #checkout-guest-form #customer-form .form-footer .continue {
	float: left !important;
}
@media (max-width: 768px) {	
	#checkout #checkout-guest-form #customer-form .form-footer .continue {
		float: none !important;
	}	
}



/* Para el estilo del banner de WhatsApp en Index */
.tvcustom-inquiry-wrapper {
	background-color: #26d366 !important;
}
/*.tvcustom-inquiry-wrapper .tvcustom-inquiry-content-inner .tvcustom-inquiry-block-cust img {
	filter: contrast(500%);
}*/
.tvcustom-inquiry-wrapper .tvcustom-inquiry-content-inner .tvcustom-btn-caption-inner .tvcms-cust-btn-caption {
	border-radius: 25px;
}
@media (max-width: 768px) {	
	.tvcustom-inquiry-wrapper .tvcustom-btn-caption {
		text-align: center !important;
		position: relative;
		top: 1em !important;
	}	
}


/* Evitar que el <select> nativo se despliegue en el filtro attr search */
.tvattrsearch-wrapper-content .multiselect .selectBox select {
  pointer-events: none;    /* no recibe clics → no se abre el desplegable azul */
  outline: none;           /* sin borde de foco feo */
}


/* Para el estilo de la barra del banner/buscador en la Página de Resultado de la Búsqueda */
#module-tvcmsattrsearch-productsearch .tvcmsattrsearch .ttvattrsearch-wrapper {
	background-color: #0456b8 !important;
	display: flex;
	justify-content: space-around;
}
.ttvattr_search_submit_button:hover {
	background-color: #fff !important;
    color: #000 !important;
    font-weight: bold !important;
}


/* Estilo para la imagen de fondo del banner del módulo tvcmsbannerslider en Index */
/*.tvcmsbannerslider-wrapper {
	background-image: url("/themes/v2_autotrics_child/assets/img/tablero-de-instrumentos-de-coche.jpg");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
}*/
/* Banner del módulo tvcmsbannerslider */
.container-fluid.tvcmsbannerslider.tvcms-all-bannerslider {
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
}