/*CSS PERIS*/
.tooltip {
  position: absolute;
  z-index: 1070;
  display: block;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 12px;
  font-style: normal;
  font-weight: normal;
  line-height: 1.42857143;
  text-align: left;
  text-align: start;
  text-decoration: none;
  text-shadow: none;
  text-transform: none;
  letter-spacing: normal;
  word-break: normal;
  word-spacing: normal;
  word-wrap: normal;
  white-space: normal;
  filter: alpha(opacity=0);
  opacity: 0;

  line-break: auto;
}

.tooltip.in {
  filter: alpha(opacity=90);
  opacity: .9;
}

.tooltip.top {
  padding: 5px 0;
  margin-top: -3px;
}

.tooltip.right {
  padding: 0 5px;
  margin-left: 3px;
}

.tooltip.bottom {
  padding: 5px 0;
  margin-top: 3px;
}

.tooltip.left {
  padding: 0 5px;
  margin-left: -3px;
}

.tooltip-inner {
  max-width: 200px;
  padding: 3px 8px;
  color: #fff;
  text-align: center;
  background-color: #000;
  border-radius: 4px;
}

.tooltip-arrow {
  position: absolute;
  width: 0;
  height: 0;
  border-color: transparent;
  border-style: solid;
}

.tooltip.top .tooltip-arrow {
  bottom: 0;
  left: 50%;
  margin-left: -5px;
  border-width: 5px 5px 0;
  border-top-color: #000;
}

.tooltip.top-left .tooltip-arrow {
  right: 5px;
  bottom: 0;
  margin-bottom: -5px;
  border-width: 5px 5px 0;
  border-top-color: #000;
}

.tooltip.top-right .tooltip-arrow {
  bottom: 0;
  left: 5px;
  margin-bottom: -5px;
  border-width: 5px 5px 0;
  border-top-color: #000;
}

.tooltip.right .tooltip-arrow {
  top: 50%;
  left: 0;
  margin-top: -5px;
  border-width: 5px 5px 5px 0;
  border-right-color: #000;
}

.tooltip.left .tooltip-arrow {
  top: 50%;
  right: 0;
  margin-top: -5px;
  border-width: 5px 0 5px 5px;
  border-left-color: #000;
}

.tooltip.bottom .tooltip-arrow {
  top: 0;
  left: 50%;
  margin-left: -5px;
  border-width: 0 5px 5px;
  border-bottom-color: #000;
}

.tooltip.bottom-left .tooltip-arrow {
  top: 0;
  right: 5px;
  margin-top: -5px;
  border-width: 0 5px 5px;
  border-bottom-color: #000;
}

.tooltip.bottom-right .tooltip-arrow {
  top: 0;
  left: 5px;
  margin-top: -5px;
  border-width: 0 5px 5px;
  border-bottom-color: #000;
}

.numero,
.numero_entero {
  text-align: right;
}


/*#sel_entrega div.activo span {
    border: 2px solid #E2007A;
       background: #E2007A;
    color: #fff;
}*/

#sel_entrega div.activo .primero {

  background: #bdbbbb;
  color: inherit;

}

#sel_entrega div span {
  padding: 7px;
  background: #dbdbdb;
  width: 100%;
  display: block;
}

#sel_entrega div .col-md-6 {
  padding: 5px;
}

#sel_entrega div {
  /*border-radius: 6px;*/
  /*padding: 10px 4px;
    margin:5px;*/

}

#sel_entrega .row,
#presupuesto .row {
  /*border-radius: 6px;*/
  /*padding: 10px 4px;
    margin:5px;*/
  margin-left: 0px;
  margin-right: 0px;

}


/* OJALES*/
#ojales {}

#ojales .item .opt {

  border-radius: 6px;
  padding: 10px 4px;
}

.owl-carousel .item .opt.activo {
  border: 2px solid #E2007A;
}

.owl-carousel .item .opt {

  border-radius: 6px;
  padding: 10px 4px;
}


/*.owl-carousel .item.activo {
    border: 2px solid #E2007A;
}
.owl-carousel .item{

    border-radius: 6px;
    padding: 10px 4px;
}*/

#attributes .attribute_list {

  padding-bottom: 5px;
}



#quantity_wanted_p input {
  width: 100%;
  height: 34px;
  text-align: right;
}

.misplugins .row label {
  font-weight: 400;
  padding-top: 7px;
}

.product_attributes {
  padding: 0px;
}

#presupuesto #precio_presupesto {
  color: #E2007A;
  font-weight: 700;
  font-size: 1.3em;
}

/*boton carro */
.box-info-product .exclusive {
  padding: 0;
  border-top: 1px solid #E2007A;
  border-right: 1px solid #E2007A;
  border-left: 1px solid #E2007A;
  border-bottom: 1px solid #E2007A;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  position: relative;
  display: block;
  background: #E2007A;
}

.box-info-product .exclusive span {
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
  font-weight: 700;
  font-size: 15px;
  line-height: 22px;
  border-top: 1px solid #c7c7c7;
  border-right: 1px solid #c7c7c7;
  border-left: 1px solid #c7c7c7;
  border-bottom: 1px solid #c7c7c7;
  text-shadow: none;
  padding: 12px 10px 14px 60px;
  color: #fff;
  display: block !important;
  text-transform: uppercase;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

.box-info-product .exclusive:before {
  font-family: "FontAwesome";
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  color: #fff;
  font-size: 25px;
  line-height: 47px;
  text-shadow: 0 1px #015883;
  content: "\f07a";
  z-index: 2;
  width: 51px;
  text-align: center;
  border: 1px solid #c7c7c7;
}

.box-info-product .exclusive:after {
  background: none;
}

.box-info-product .exclusive {
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  -webkit-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

.box-info-product .exclusive:hover {
  background: #19a2db;
}

.box-info-product .exclusive:hover {
  background-image: none;

}

#peris span.error {

  padding-left: 15px;
  color: #f31616;
  font-style: italic;
}

#peris input.error {

  border-color: #f31616;

}

#peris span.info {

  padding-left: 15px;
  color: #19a2db;
  font-style: italic;
}

#peris input.info {

  border-color: #19a2db;

}



/*CLASES GENERICAS*/
h1,
h2,
h3,
h4 {
  font-family: "Varela Round", sans-serif;
}

/*.page-footer a {*/
/*  color: #009fe3 !important;*/
/*}*/

.btn {
  border-radius: 10px !important;
}

.btn.btn-touchspin {
  border-radius: 2px !important;
}

.btn-info,
.btn-primary,
.btn-primary:hover {
  background-color: #009fe3 !important;
}

#_desktop_logo .cls-1 {
  fill: #fff;
  stroke: none;
}

#_desktop_logo svg {
  width: 100%;
}

/*Agregado por Marcos: el <img> del logo (renderLogo en helpers.tpl) no tenia ningun estilo propio, solo el height="50" fijo del HTML (mas grande que el archivo real, 230x42, con perdida de nitidez) y sin limite de ancho, asi que a partir de 768px (cuando #_desktop_logo pasa a ser una columna angosta, col-md-2) el logo se desbordaba por encima del buscador en vez de encogerse. max-width:100% lo ata al ancho real de la columna y max-height evita que crezca de mas en pantallas grandes*/
#_desktop_logo img {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 2.5rem;
}

/*Agregado por Marcos: .hidden-sm-down (wrapper de #_desktop_logo dentro de .row) es block, no flex, asi que su contenido queda pegado arriba en vez de centrado en la fila de 50px del header. Antes no se notaba porque la img siempre medía justo esos 50px; ahora que escala (ver regla de arriba) hace falta centrarla a mano. Scopeado a .header-nav .row para no afectar otros usos de .hidden-sm-down en el sitio*/
.header-nav .row>.hidden-sm-down {
  display: flex;
  align-items: center;
}

.bebas-neue-regular-slider {
  font-family: "Bebas Neue", sans-serif;
  font-style: normal;
  letter-spacing: 1px;
}

.varela-round-regular {
  font-family: "Varela Round", sans-serif;
  font-weight: 600;
  font-style: normal;
}

h1 {
  color: #009fe3 !important;
}

.unvisible {
  display: none !important;
}

body .container {
  max-width: 1920px;
  width: 100%;
  margin: 0 auto;
  padding: 0;
}

main {
  overflow-x: hidden;
}

#content-wrapper {
  padding: 0;
}

body#index h2 {
  font-size: 2rem;
  font-weight: 600;
  margin-bottom: 2rem;
  text-align: left;
  text-transform: none !important;
  font-family: "Varela Round", sans-serif;
}

.hidden,
.is-hidden {
  display: none !important;
}

.form-control,
.input-group .form-control:not(:first-child):not(:last-child) {
  padding: .5rem 1rem;
  color: #7a7a7a;
  background: #fff;
  border: 1px solid #d3d3d3;
  border-radius: 5px;
}

.form-control:focus {
  outline: .1875rem solid #eceeef;
  border-color: #d3d3d3;
}

.btn-link,
.btn-link:active,
.btn-link:focus,
.btn-link:focus-visible {
  border: 0 !important;
  outline: none !important;
  box-shadow: none !important;
  border: none !important;
}

button,
button:focus,
button:active,
button:focus-visible,
button:visited,
button:hover,
.btn,
.btn:focus,
.btn:active,
.btn:focus-visible,
.btn:hover,
a:focus,
a:active,
a:focus-visible,
input:focus,
textarea:focus,
select:focus {
  outline: none !important;
  box-shadow: none !important;
}



.top-logo .cls-1 {
  fill: #fff;
  stroke: none !important;
}

/*Agregado por Marcos: theme.css define .top-logo img{width:auto;max-height:2rem} pero sin tope de ancho, asi que al forzar las 3 columnas del nav mobile a 33.33% (ver @media max-width:767px), el logo se desbordaba de su columna en vez de encogerse. max-width:100% lo ata al ancho real de su columna, igual que ya hicimos con el logo de escritorio*/
.top-logo img {
  max-width: 100%;
}

#header {
  box-shadow: none;
}

#header .header-nav {
  display: flex;
  align-items: center;
  padding: 15px 70px;
  max-height: none;
  border: none;
  background: #bd3484 url(../img/top_bg.gif) no-repeat center 50%;
  background-size: cover
}

body#checkout #header .header-nav {
  padding: 15px 70px;
}

#header .header-nav .user-info {
  margin-top: 0;
}

#search_widget {
  width: 100%;
  overflow: hidden;
}

#search_widget form input {
  border-radius: 25px;
  background-color: white;
  border: 1px solid #706f6f;
  padding: 10px 40px 10px 20px;
}

#search_widget form i {
  right: 25px;
  top: 3px;
}

#header .header-nav .blockcart {
  padding: 0;
  background: none;
  margin-left: .6rem;
}

#header .header-nav .blockcart .cart-products-count {
  color: white;
  position: relative;
  top: -25px;
}

#header .header-nav .cart-preview.active {
  background: transparent;
}

#header .header-top {
  padding: 0;
  background: #f8f9f9;
  width: 99%;
}

#header .header-top a[data-depth="0"] {
  color: #575756;
  text-transform: none;
}

.sp-login-link svg {
  fill: white;
  stroke: none;
}

#js-product-list-top {
  display: none;
}

/* Estilo general de la barra sticky */
.header-nav.is-sticky,
.header-top.is-sticky {
  position: fixed !important;
  top: -2px;
  left: 0;
  right: 0;
  z-index: 1000;
  background: #fff;
  /* o el color que use tu theme */
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
  transition: all 0.25s ease-in-out;
}

.ets_mm_megamenu.is-sticky {
  position: fixed !important;
  top: 78px;
  left: 0;
  z-index: 500 !important;
}

/* Buscador por encima SIEMPRE */
#nbajaxsearch {
  position: relative !important;
  z-index: 2147483647;
}

.nbajaxsearch-results {
  z-index: 2147483647 !important;
}


.search-results {
  position: absolute;
  top: 100%;
  left: 0;
  width: 100%;
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 6px;
  box-shadow: 0 4px 15px rgba(0, 0, 0, 0.1);
  z-index: 9999;
  display: none;
}

.ps8-suggestions {
  list-style: none;
  margin: 0;
  padding: 0;
}

.suggestion-item a {
  display: flex;
  align-items: center;
  padding: 8px 12px;
}

.suggestion-item img {
  width: 40px;
  height: 40px;
  margin-right: 10px;
  border-radius: 4px;
}

.suggestion-item:hover {
  background: #f4f4f4;
  cursor: pointer;
}



/* Para que no haya salto visual, reservamos su altura */
.header-nav.is-sticky+* {
  padding-top: var(--header-height, 120px);
}



.carousel .carousel-item figure {
  width: 100%;
}

.carousel .carousel-item .caption {
  left: initial;
  right: 28%;
}

.carousel .carousel-item .caption .display-1 {
  display: none;
}

.carousel .carousel-item .caption h1 {
  font-size: 2.8rem;
  text-align: right;
  letter-spacing: 1px;
  margin: 0;
  line-height: 3.9rem;
}

.carousel .carousel-item .caption h1 span {
  padding: 0 10px;
  background-color: #0a070c;
}

/*MENU*/
#header .header-top .menu {
  padding-left: 0;
}

.top-menu[data-depth="0"] {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

#header .menu,
#header .menu>ul>li {
  display: block;
}

/*.top-menu a[data-depth="0"]{font-size: 0.85rem;}*/
#header .top-menu a[data-depth="0"]:hover,
a:hover {
  color: #bd3484;
}

.BlockHeading {
  padding: 65px 70px;
}

.BlockHeading h1 {
  font-size: 2.25rem;
  line-height: 1.4;
}

body#index #wrapper {
  padding-top: 0;
}

body#index .carousel,
.carousel .carousel-inner {
  margin-bottom: 0;
  height: auto;
}

#category #wrapper,
#category #wrapper .breadcrumb {
  padding: 0 70px;
}

#my-account #wrapper .breadcrumb,
#identity #wrapper .breadcrumb,
#addresses #wrapper .breadcrumb,
#history #wrapper .breadcrumb,
#order-detail #wrapper .breadcrumb,
#order-slip #wrapper .breadcrumb,
#wrapper .breadcrumb #discount {
  position: sticky;
  border-bottom: .0625rem solid #dfdfdf;
  padding-bottom: 1rem;
}

#category #wrapper .breadcrumb {
  padding: 1.563rem 0 0 0 !important;
}

#category .products.row,
#products .products,
.featured-products .products,
.product-accessories .products,
#products #js-product-list-top {
  padding: 0 70px;
  justify-content: start;
  gap: 2%
}

#index #wrapper{
  background-color: #fff;
}

#product #wrapper,
#order-detail #wrapper {
  padding-left: 70px;
  padding-right: 70px;
}

.products .product {
  padding: 0;
}

.pagination {
  display: none;
}

#custom-text {
  padding: 2rem 0;
  margin-bottom: 1.5rem;
  text-align: center;
  background: none;
  border-radius: 0;
}

.IconosHomeBlock {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 5px 85px;
  background-color: #f8f8f8;
}

.IconosHomeBlock div {
  display: flex;
  align-items: center;
}

.IconosHomeBlock div span {
  margin-left: 5px;
  color: #706f6f;
  font-size: 15px;
}

/* modificado por marcos */
.AcabadosBlock {
  padding: 100px 85px;
  background-color: white;
}

.textos-index {
  padding: 100px 85px;
  line-height: 1.5rem;
}

.textos-index p {
  font-size: 1rem;
}

/* modificado por marcos */
.AcabadosBlock h2,
.CTABlock h2 {
  font-size: 2.167rem;
  margin-bottom: 25px;
}

.AcabadosBlock h3 {
  font-size: 1.3rem;
}

.AcabadosBlock .AcabadosDestacados {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

.AcabadosBlock .AcabadosDestacados .Block image {
  object-fit: cover;
  height: auto;
}

/* modificado por marcos */
.AcabadosBlock .AcabadosDestacados .Block p {
  font-size: 1rem;
  line-height: 1.5rem
}

.CTABlock {
  background-color: #dadada;
  padding: 40px;
}

.CTABlock p {
  font-size: large;
}

/* En la home se oculta en los listados, pero no en las miniaturas del megamenú */
body#index :not(.mm-product-description)>.psproducthtml-block {
  display: none;
}


#index .featured-products {
  padding: 25px 70px;

}

.featured-products h2 {
  padding: 0;
  max-width: 1800px;
  margin-left: auto !important;
  margin-right: auto !important;
}

#index .featured-products .products {
  padding: 0;
  max-width: 1800px;
  margin: 0 auto;
  gap: 1%
}

.featured-products.piensa,
.featured-products.piensa h2 {
  text-align: center !important;
}

.featured-products.piensa .h4 {
  margin-bottom: 25px;
}

.featured-products .btn,
.featured-products .all-product-link {
  display: none;
}

#footer {
  background: #bd3484 url(../img/bg-footer.jpg) no-repeat center top;
  padding: 65px 100px;
  /*margin-top: 65px;*/
  background-size: cover
}

.footer-container {
  padding: 0;
}

.footer-container .h3,
.footer-container .h4 {
  color: white;
  text-transform: none;
  font-size: 1.02rem;
  font-weight: 700;
  letter-spacing: 0.05em;
}

.footer-container p {
  color: white;
  font-size: 0.8rem;
}

.footer-container li {
  margin-bottom: 0.85rem;
}

.footer-container li a {
  font-size: 0.85rem;
  color: #fff;
  letter-spacing: 1px;
}

.footer-container li a:hover {
  text-decoration: underline;
  color: #fff;
}


.block-social {
  padding: 10px 0;
  text-align: center;
}

.block-social p {
  margin-bottom: 0;
}

.block-social ul {
  justify-content: center;
}

.block-social ul li {
  width: 32px;
  height: 32px;
  background: none;
  border-radius: 25px;
}

.block-social ul li:hover {
  background: none;
}

.block-social ul li a {
  display: inline-flex;
}

.block-social ul li a span {
  display: none;
}

.block-social .footer-links a {
  color: #1d1d1b;
}

/*PRODUCTOS*/
.product-miniature .thumbnail-container {
  padding: 0px;
  border-radius: 15px;
  /*box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15);*/
}

/* ultimas 2 agregadas por marcos */
/* el marco (borde + radio) va en el <picture> y recorta, asi el zoom
   de la imagen queda dentro sin agrandar el cuadro */
.product-miniature .thumbnail-container .product-thumbnail picture {
  display: block;
  width: fit-content;
  max-width: 100%;
  margin: 0 auto;
  border-radius: 15px;
  border: 3px solid white;
  overflow: hidden;
  isolation: isolate;
  /* Safari: respeta el radio al recortar con transform */
  line-height: 0;
}

.product-miniature .thumbnail-container .product-thumbnail img {
  aspect-ratio: 1/1;
  object-fit: cover;
  transition: transform 0.3s ease;
}

/* zoom in al pasar el mouse sobre la miniatura */
.product-miniature.js-product-miniature .thumbnail-container .product-thumbnail {
  overflow: hidden;
  display: block;
}

.product-miniature.js-product-miniature:hover .thumbnail-container .product-thumbnail img {
  transform: scale(1.08);
}

.product-miniature .product-title a {
  font-weight: 600;
  color: #000;
  font-size: .97rem;
}

a.btn-add-to-cart,
a.btn-buy {
  display: block;
  padding: 10px 25px;
  text-align: center;
  color: #fff;
  transition: .2s ease-in-out background-color !important;
  border-radius: 10px;
}

a.btn-buy {
  background-color: #009fe3;
}

a.btn-buy:hover {
  background-color: #49c3ff;
}

a.btn-add-to-cart {
  background-color: #009640;
}

a.btn-add-to-cart:hover {
  background-color: #24bf43;
}

/*CARRITO: detalle de atributos plegable ("Ver detalles" junto al precio)*/
/* checkbox oculto pero enfocable con teclado */
.cart-line-attributes-check {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
  pointer-events: none;
}

.cart-line-attributes-toggle {
  display: inline-block;
  margin: 0 0 0 10px;
  cursor: pointer;
  color: #009de4;
  font-size: 0.8rem;
  font-weight: 600;
  vertical-align: middle;
  user-select: none;
}

.cart-line-attributes-toggle::after {
  content: "\25BE";
  /* flecha abajo */
  display: inline-block;
  margin-left: 4px;
  transition: transform 0.2s ease;
}

.cart-line-attributes-check:checked~.product-price .cart-line-attributes-toggle::after {
  transform: rotate(180deg);
}

.cart-line-attributes-check:focus-visible~.product-price .cart-line-attributes-toggle {
  outline: 2px solid #009de4;
  outline-offset: 2px;
}

.cart-line-attributes {
  display: none;
}

.cart-line-attributes-check:checked~.cart-line-attributes {
  display: block;
}

.cart-line-attributes p {
  margin: 0;
}

/*PÁGINA PRODUCTO*/
/*body#product .product-cover{height:480px;}*/
.product-images li.thumb-container .thumb {
  border-radius: 10px;
}

.product-images li.thumb-container .thumb.selected,
.product-images li.thumb-container .thumb:hover {
  border: none !important;
}

.product-container {
  margin-top: 25px;
  /* agregado por marcos */
  margin-right: 0;
  margin-left: 0;
  padding: 0 .8%;
}

.product-container h2 {
  font-size: clamp(1.4rem, 2.5vw, 2.4rem);
  text-transform: none;
}

.product-container .product-prices {
  margin-top: 0;
}

.product-container .product-prices .product-price {
  font-size: 1.2rem;
}

#product h1 {
  font-size: 1.6rem;
}

.product-price {
  color: #009fe3;
}

#product #content {
  max-width: none;
}

.product-description h1 {
  color: #5b5b5b;
  margin-bottom: 20px;
}

.product-cover img {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover;
  border-radius: 20px;
}

/*.BlockInfoExpedicion{display: flex;align-items: center;justify-content: space-between;}*/


/*COLLAPSIBLE PRODUCTOS*/
.cont-collapsible {
  padding: 10px 0;
}

/*.cont-collapsible .product-description{margin-bottom:25px;}*/
.cont-collapsible h3 {
  padding: 15px 25px;
  border-radius: 20px 20px 0 0;
  background: #a8d2ff;
  color: #444444;
  font-size: 1em;
  font-weight: 400;
  margin: 0;
}

.cont-collapsible #fsch-heading-10 {
  display: none;
}

.cont-collapsible .card {
  border: 1px solid #ececec;
  border-radius: 0 0 20px 20px;
}

.cont-collapsible .card-block {
  padding: 1.5rem 1.5rem 2rem
}

.cont-collapsible .card-block .card {
  border-radius: 0;
  border: none;
}

.cont-collapsible h5 {
  font-weight: 400;
  cursor: pointer;
  margin-bottom: 20px !important;
  position: relative;
}

.cont-collapsible h5 .fa-check-circle {
  margin-right: 10px;
  color: #21834d;
}

.cont-collapsible h5 .fa-chevron-down {
  position: absolute;
  right: 0;
}

.cont-collapsible .card-block.pt-0 {
  padding-top: 0;
}

/*PERIS*/
/*esto al contenedor padre mejor para que presupuesto este incluido*/
/*.box-info-product {*/
/**/
/*  padding: 25px 25px 0 25px;*/
/*}*/
.misplugins {
  padding: 25px;
}

.box-info-product h3 {
  color: #e2007a;
  font-size: 1.6em;
  font-weight: 500;
  margin: 35px 0;
}

.box-info-product label {
  text-align: left !important;
  margin-right: 12px;
  width: 135px;
}

.box-info-product #medidas,
.box-info-product #refuerzo,
.box-info-product #emboltorio_bobina,
.box-info-product #num_ficheros,
.box-info-product #emboltorio_posicion_ojal,
.box-info-product #emboltorio_numero_ojales,
.box-info-product #revision,
.box-info-product #refproducto,
.box-info-product #vaina,
.box-info-product #emboltorio_diametro_vaina,
.box-info-product #quantity_wanted_p,
.box-info-product #refuerzo,
.box-info-product .sel_materiales,
.box-info-product #embalaje,
.box-info-product #tintablanca,
.box-info-product #imagen-invertida,
.box-info-product [id^="seleccion_"] {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 1rem;
  width: 100%
}

#quantity_wanted_p input {
  height: auto;
}

/*.box-info-product #medidas{gap:30px;align-items: center;justify-content: space-between;width: 97%;}*/
/*.box-info-product #medidas label{width:50%;}*/

.box-info-product #medidas div,
.box-info-product #emboltorio_bobina div,
.box-info-product #num_ficheros div,
.box-info-product #emboltorio_posicion_ojal div,
.box-info-product #emboltorio_numero_ojales div,
.box-info-product #revision div,
.box-info-product #refproducto div,
.box-info-product #vaina div,
.box-info-product #emboltorio_diametro_vaina div,
.box-info-product #seleccion_68 div,
.box-info-product #seleccion_600 div,
.box-info-product #seleccion_84 div,
.box-info-product #seleccion_164 div,
.box-info-product #seleccion_252 div,
.box-info-product #seleccion_161 div {
  display: flex;
  align-items: center;
  justify-content: start;
}

.bootstrap-touchspin {
  justify-content: space-around;
  width: 100%;
}

/*.box-info-product #medidas div div{justify-content: end;}*/

.box-info-product .select,
.select {
  display: flex;
  align-items: center;
  width: 75.5%;
  justify-content: end;
  gap: 5px;
}

/* Agregado por Claude: #medidas comparte el flex/space-between de las filas de
   un solo campo (ver selector compartido mas arriba), pero tiene 2 campos
   (Ancho/Alto) en vez de 1. Antes eran 4 hijos sueltos repartidos por
   space-between, lo que rompia el alineado segun el ancho de pantalla y
   obligaba a "pinchar" el input de Alto con position:absolute en cada
   breakpoint (ver reglas eliminadas mas abajo). Ahora cada campo va envuelto
   en .campo-medida, asi #medidas solo reparte 2 bloques, igual que reparte
   label+input en las demas filas. */
.box-info-product #medidas {
  flex-wrap: wrap;
  row-gap: 10px;
}

.box-info-product #medidas .campo-medida {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex: 0 1 46%;
}

.box-info-product #medidas .campo-medida label {
  width: 135px;
}

/* El input de las demas filas arranca siempre al 24.5% del ancho total de la
   fila (gracias a justify-content:space-between + .select al 75.5%, sin
   importar el largo del label). #medidas tiene 2 columnas de 46% cada una,
   asi que replicamos esa misma logica pero relativa al 46% de cada columna:
   24.5% / 46% = 53.26% de gap, es decir el input debe medir el 46.74%
   restante de SU columna para que su borde izquierdo caiga en el mismo
   24.5% del ancho total que las demas filas. */
.box-info-product #medidas .campo-medida .select {
  width: 46.74%;
  margin-right: 0;
}

.bootstrap-touchspin,
.box-info-product #quantity_wanted_p div {
  display: flex;
  float: none;
  gap: 5px;
}

/*OWL OJALES*/
.owl-carousel,
.owl-stage-outer {
  width: 100%;
}

.owl-stage {
  display: flex;
}

.owl-item {
  flex: 0 0 auto;
}

.owl-stage-outer {
  overflow: hidden;
}

#product .owl-carousel {
  width: 76%;
  /* originalmente era 20 y 45*/
  padding: 10px 25px;
  /*float: right;*/
  margin: 0 0 0 auto;
}

/*#product .owl-carousel{margin-bottom:25px;}*/
#product .owl-carousel.owl-drag .owl-item {
  text-align: center;
  float: left;
  position: relative;
  margin-right: 0 !important;
}

#product .owl-carousel.owl-drag .owl-item img {
  display: block;
  margin: auto;
  transform-style: preserve-3d;
  border: 2px solid #d3d3d3 !important;
  border-radius: 6px;
  padding: 10px 4px;
}

#product .owl-nav {
  position: absolute;
  left: 0;
  top: 35%;
  width: 100%;
}

#product .owl-nav button {
  font-size: 1.4rem !important;
  color: #e6007e !important;
  position: absolute;
}

#product .owl-nav button:hover {
  background: none !important;
}

#product .owl-nav button.owl-before,
#product .owl-nav button.owl-prev {
  left: 0;
}

#product .owl-nav button.owl-next {
  right: 0;
}

#product .owl-nav button span {
  display: none;
}

#product .item .opt {
  text-align: center;
}

#product .item .opt.activo {
  border: none !important;
}

#product .item .opt.activo+div {
  color: #009fe3;
}

#product .item .opt.activo img {
  border: 2px solid #009fe3 !important;
  border-radius: 6px;
  padding: 10px 4px;
}

.owl-carousel .owl-item img {
  max-width: 100%;
  height: auto;
}


/*ENTREGA / PRECIO*/
.MostrarCOnSinIva {
  display: flex;
  align-items: center;
  justify-content: end;
  gap: 5px;
  font-size: 0.85em;
}

.MostrarCOnSinIva div#coniva,
.MostrarCOnSinIva div#siniva {
  padding: 3px 6px;
  border-radius: 5px;
  border: 1px solid #ececec;
}

.MostrarCOnSinIva div.activo {
  border: none;
  background-color: #05a6f7;
  color: white;
}


#presupuesto {
  padding: 15px;
  background-color: #f8ad36;
  border-radius: 20px;
}

#presupuesto .Titulo {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-bottom: 5px;
}

#presupuesto .Titulo label {
  font-size: 1.4rem;
  color: white;
}

#ContBloquesPago {
  display: flex;
  /*agregado por marcos*/
  /*era center*/
  align-items: flex-start;
  /*Agregado por Marcos: wrap por defecto (no solo <=1024px) para que se acomode al ancho real de .misplugins en vez de al viewport*/
  flex-wrap: wrap;
  justify-content: center;
  gap: 5px;
}

#fecha_entrega,
#neto_presupesto,
#precio_presupesto,
#impuestos_presupesto {
  border-radius: 10px;
  background: white;
  padding: 10px;
  text-align: center;
  /*Agregado por Marcos: antes era width:100%. Con basis 150px las 4 entran en una fila cuando hay lugar (crecen parejo) y solo pasan a 2x2 cuando no entran*/
  flex: 1 1 150px;
  min-width: 0;
  /*Agregado por Marcos: clamp en vez de tamaño fijo para que escale con el ancho real, sin saltos por breakpoint*/
  font-size: clamp(10px, calc(9px + 0.15vw), 12px) !important;
  color: #000 !important;
}

#fecha_entrega b,
#neto_presupesto b,
#precio_presupesto b,
#impuestos_presupesto b,
#precio_presupesto b {
  /*Agregado por Marcos: clamp en vez de tamaño fijo (reemplaza el parche puntual que había en el rango 1300-1559px)*/
  font-size: clamp(12px, calc(12px + 0.625vw), 19px) !important;
}

/*#ContBloquesPago .box-cart-bottom,
.box-cart-bottom .add-to-cart {
  width: 100%;
}
*/

.add-to-cart {
  background: #009640;
  border-radius: 10px;
  padding: 20px 15px;
  font-weight: 600;
  text-transform: uppercase;
  transition: .2s ease-in-out background;
}

.add-to-cart:hover:not(.disabled) {
  background: #24bf43 !important;
}


/*Agregado por Marcos: 768px = breakpoint real donde .product-container pasa de 1 a 2 columnas (col-md-6), asi que es el punto donde arranca el layout "de escritorio" para esta caja. De aca para arriba, en AMBOS estados (sticky flotante y unstick liberado) el titulo ("Tu presupuesto"/"Tu Presupuesto") ocupa su propia fila completa, y las 4 cajas de datos se fuerzan a compartir 1 sola fila entre ellas (el boton, cuando esta visible, sigue en su propia fila via la regla ya existente de box-cart-bottom). Tipografia con vw (no cqw): escala con el ancho del viewport.*/
@media (min-width: 768px) {

  /*Agregado por Marcos: #floating-title (sticky) es hijo flex de #ContBloquesPago (ver base) y necesita su propia linea completa para que las 4 cajas queden solas en la fila siguiente. #fixed-title/.Titulo (unstick) ya ocupa su propia fila por ser bloque normal, hermano de #ContBloquesPago (#presupuesto no es flex)*/
  #floating-title {
    flex-basis: 100%;
  }

  #fecha_entrega,
  #neto_presupesto,
  #precio_presupesto,
  #impuestos_presupesto {
    /*Agregado por Marcos: basis 0 (en vez de 150px) para que las 4 cajas se repartan el ancho parejo y nunca partan a una segunda fila*/
    flex: 1 1 0;
    min-width: 0;
    padding: clamp(6px, 1.4vw, 10px);
    font-size: clamp(9px, calc(6px + 0.6vw), 12px) !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  #fecha_entrega b,
  #neto_presupesto b,
  #precio_presupesto b,
  #impuestos_presupesto b {
    font-size: clamp(11px, calc(7px + 0.75vw), 16px) !important;
    white-space: nowrap;
  }
}

.info_cart {
  padding: 10px 0 0 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.info_cart label {
  color: #b0b0b0;
  text-align: left;
  max-width: 100% !important;
  margin: 0;
}

.info_cart div {
  display: flex;
  gap: 10px;
  align-items: center;
}

/*GRID PRODUCTOS*/
.category-cover {
  width: 100%;
  min-height: 400px;
  /* ajusta según diseño */
  display: flex;
  flex-direction: column;
  justify-content: center;
  /* centra verticalmente */
  align-items: flex-start;
  /* alinea a la izquierda */
  padding: 6rem;
  /* espacio interno */

  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  color: #fff;
  /* texto legible sobre el fondo */
  position: relative;
}

/* Opcional: superposición oscura para mejorar legibilidad */
/*.category-cover::before {
  content: "";
  position: absolute;
  inset: 0;
  background: rgba(0,0,0,0.4);
  z-index: 0;
}
*/
.block-category.card-block {
  padding: 0;
}

.category-cover h1,
.category-cover .block-category-inner {
  position: relative;
  z-index: 1;
  /* encima de la superposición */
  max-width: 800px;
  /* controla el ancho del texto */
}

.category-cover h1 {
  font-family: "Varela Round", sans-serif;
  text-transform: none !important;
  font-size: 3.5rem;
  color: white;
  margin-bottom: 1rem;
}

#category-description p {
  color: #2e3092 !important;
  font-weight: 600 !important;
}

.category-cover .block-category-inner {
  font-size: 1.125rem;
  line-height: 1.6;
}

.thumbnail-container .no-variants {
  position: absolute;
  bottom: 80px;
  left: 15px;
  width: 90%;
  z-index: 9;
}

.product-miniature .product-price-and-shipping {
  font-weight: 500;
  color: #fff;
  padding: 10px 25px;
  background-color: #575656;
  border-radius: 10px;
  position: absolute;
  bottom: 80px;
  left: 15px;
  width: 90%;
  z-index: 99;
}

.mm-product-description {
  width: 100%;
}

.mm-product-description>.product-price-and-shipping {
  font-weight: initial;
  color: initial;
  padding: initial;
  background-color: initial;
  border-radius: initial;
  position: initial;
  bottom: initial;
  left: initial;
  width: initial;
  z-index: initial;
  margin-top: 10px;
}

.mm_block_type_product .thumbnail-container .thumbnail {
  border: none
}

.mm-product-description>.product-price-and-shipping>.price {
  color: #fff;
  padding: 2%;
  border-radius: 7px;
  background-color: #575656;
}

.product-price-and-shipping.hidden-price {
  display: none;
}

.product-miniature .thumbnail-container:focus .product-description::after,
.product-miniature .thumbnail-container:hover .product-description::after {
  border: none !important;
}

.category-custom-title {
  display: block;
  padding: 65px 0 25px 0;
  text-align: center;
  font-size: 2rem;
  color: #1d1d1b;
  font-family: "Varela Round", sans-serif;
  font-weight: 600;
  font-style: normal;
}

#subcategories {
  border: none;
  max-width: 1600px;
  margin: 0 auto;
}

#subcategories ul li {
  width: calc(100% / 3 - 20px);
  text-align: left;
}

#subcategories ul li .subcategory-image picture {
  width: 100%;
  height: 230px;
  display: flex;
}

#subcategories ul li .subcategory-image picture img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 10px;
}

#subcategories ul li .subcategory-image a,
#subcategories ul li:hover .subcategory-image a {
  border: none;
  padding: 0;
}

#subcategories ul li h5 {
  font-size: 1.2rem;
}

#subcategories ul li .subcategory-name {
  text-transform: none;
  color: #ec008c;
}

#subcategories ul li .subcategory-name:hover {
  color: #1d1d1b;
}

#sel_entrega {
  display: flex;
  align-items: end;
  justify-content: end;
  gap: 5px;
  text-align: center;
  margin-top: 10px;
}

#sel_entrega .BloqueEstimada {
  gap: 5px;
  display: grid;
}

#sel_entrega .BloqueEstimada div,
#sel_entrega .Unds {
  border-radius: 10px;
  padding: 15px;
  color: #575756;
  /*background-color: #ececec;*/
  color: #575756;
  font-weight: 500;
  font-size: 1rem;
}

#sel_entrega div span {
  background: none !important;
  padding: 0 !important;
}

#sel_entrega div.activo {
  color: #575756;
}

#sel_entrega .Uds span {
  border-radius: 10px;
  padding: 15px 30px;
  color: #575756;
  background-color: #ececec;
  font-weight: 500;
  font-size: 1rem;
}

#sel_entrega .Uds.activo span {
  color: #575756 !important;
}

#sel_entrega .importe {
  display: flex;
  align-items: center;
  justify-content: center;
}

#sel_entrega .fecha,
#sel_entrega .importe,
#sel_entrega .Unds {
  background-color: #ececec;
}

#sel_entrega span {
  font-size: 1rem;
  font-weight: 600;
}

#sel_entrega .activo .fecha {
  background-color: #68c8f3;
}

#sel_entrega div.activo .fecha span {
  color: #fff;
}

#sel_entrega .activo .importe {
  background-color: #009fe3;
  color: white;
}

#sel_entrega .importe .tachado {
  text-decoration: line-through;
  scale: 0.9;
}

#sel_entrega .row {
  width: 100% !important;
  display: block;
}

/*#sel_entrega .row:last-child {width: 0!important;}*/

.spfu-spin {
  animation: spfu-rotate 0.9s linear infinite;
  display: inline-block;
  font-size: 18px;
}

@keyframes spfu-rotate {
  from {
    transform: rotate(0deg);
  }

  to {
    transform: rotate(360deg);
  }
}



.ContInfoEntrega {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

#btnInfoEntrega,
#btnInfoEntrega:focus,
#btnInfoEntrega:focus-visible,
#btnInfoEntrega:active {
  border: none;
  outline: none;
  background: none;
  cursor: pointer;
}

/* PANEL DE INFORMACIÓN (inicio oculto y suave al aparecer) */
.info-entrega {
  display: block;
  /* evita salto de layout */
  opacity: 0;
  transform: translateY(-10px) scale(0.97);
  visibility: hidden;
  transition:
    opacity 0.3s ease,
    transform 0.35s cubic-bezier(0.22, 1, 0.36, 1),
    visibility 0s linear 0.3s;
  z-index: 10;
  pointer-events: none;

}

/* CUANDO ESTÁ VISIBLE */
.info-entrega.show {
  opacity: 1;
  transform: translateY(0) scale(1);
  visibility: visible;
  transition:
    opacity 0.3s ease,
    transform 0.35s cubic-bezier(0.22, 1, 0.36, 1),
    visibility 0s;
  pointer-events: auto;
}

/* TRIÁNGULO SUPERIOR */
.arrow-up {
  width: 0;
  height: 0;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  border-bottom: 8px solid #0dcaf0;
  margin-left: auto;
  margin-right: 8px;
  /* ajusta la posición bajo el icono info */
  transition: all 0.3s ease;
}

/* EFECTO DE SOMBRA Y SUAVIDAD */
.info-entrega .p-3 {
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.15);
  transition: box-shadow 0.3s ease;
}

.info-entrega.show .p-3 {
  box-shadow: 0 6px 18px rgba(0, 0, 0, 0.25);
}

/*HTML LONAS*/
:root {
  --box-bg: #ececec;
  --box-radius: 10px;
  --box-padding: 1rem;
}

body {
  background-color: #FFF;
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial;
}

.SeoLonas {
  margin: 0 0 45px 0;
  padding: 0 80px !important;
}

/*.SeoLonas h3, .faqs h3{text-align: center;color:#1d1d1b;font-size:2.2rem;}*/
p.descripcion {
  text-align: center;
  margin: 0;
}

h2,
h3 {
  color: #221e1f;
}

body#product .product-description h2 {
  font-size: 1.8rem;
  margin-bottom: 20px;
}

body#product .product-description h3 {
  font-size: 1.4rem;
  margin-bottom: 20px;
}

body#product .product-description p {
  color: #58595b;
}

.grid {
  margin-top: 45px;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.5rem;
}

.grid-4 {
  display: grid;
  margin-top: 25px;
  grid-template-columns: repeat(4, 1fr);
  /* 4 columnas iguales */
  gap: 1.5rem;
}

.column {
  display: grid;
  grid-template-rows: 1fr 1fr;
  /* dos filas iguales */
  gap: 1.5rem;
}

.AcabadosCristales .column {
  grid-template-rows: auto;
}


/*FAQS*/


.faqs {
  padding: 65px 100px 75px !important;
  margin: 65px auto 0 auto !important;
  background-color: #f5f9fb;
}

.faq-container {
  max-width: 950px;
  margin: 45px auto;
}

.faq-item {
  margin-bottom: 12px;
}

.faq-header {
  background: #ffffff;
  border: 2px solid #f48ec6;
  border-radius: 8px;
  font-size: 1.2rem;
  padding: 14px 18px;
  font-weight: 600;
  cursor: pointer;
  color: #e6007e;
  display: flex;
  align-items: center;
  justify-content: space-between;
  transition: all .25s ease;
}

.faq-header .bi-plus-circle-fill {
  color: #e6007e;
}

.faq-header .bi-dash-circle-fill {
  color: #fff;
}



.faq-header:hover {
  background: #fdf2f8;
}

.faq-header:not(.collapsed) {
  background: #e6007e;
  color: #fff;
}

.faq-icon {
  font-size: 1.4rem;
  margin-left: 10px;
}

.faq-body {
  padding: 18px 20px;
  background: #f8f8f8;
  border-left: 2px solid #f48ec6;
  border-right: 2px solid #f48ec6;
  border-bottom: 2px solid #f48ec6;
  border-radius: 0 0 8px 8px;
  margin-top: -5px;
  line-height: 1.6;
  color: #6f6f6e;
  font-size: 1.2rem;
}




/* Responsive: 1 columna en móvil */
@media (max-width: 575.98px) {
  .grid-4 {
    grid-template-columns: 1fr;
  }
}


/* Versión móvil */
@media (max-width: 767.98px) {
  .grid {
    grid-template-columns: 1fr;
  }

  .column {
    grid-template-rows: none;
  }
}

/* Responsive: 2 columnas en tablet */
@media (max-width: 991.98px) {
  .grid-4 {
    grid-template-columns: repeat(2, 1fr);
  }
}




.box {
  background: #ececec;
  border-radius: 10px;
  padding: 1rem;
  display: flex;
  /* permite flexibilidad interna */
  flex-direction: column;
  gap: 0.75rem;
  height: 100%;
  /* ocupa todo el alto de su celda */
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
  transition: transform 160ms ease, box-shadow 160ms ease;
}

.box h4 {
  margin: 0;
  font-size: 1.25rem;
  color: #e6007e;
}

.thumb {
  width: 100%;
  height: 180px;
  overflow: hidden;
  border-radius: calc(var(--box-radius) - 2px);
}

.thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.box p {
  margin: 0;
  line-height: 1.4;
}


/* === NUEVO GRID 2 COLUMNAS CON 3 CAJAS === */
.grid-2-lonas {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 2rem;
  /* espacio entre columnas */
  margin-top: 25px;
}

/* Columna con 3 cajas */
.column-lonas {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  /* espacio entre cajas */
}

/* Caja con imagen a la izquierda y texto a la derecha */
.box-lonas {
  display: grid;
  grid-template-columns: 220px 1fr;
  /* imagen izquierda y texto derecha */
  gap: 1rem;
  align-items: start;
}

.thumb-lonas {
  width: 210px;
  height: 210px;
  overflow: hidden;
  border-radius: 8px;
}

.thumb-lonas img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}

.box-lonas h4 {
  margin: 0 0 0.5rem 0;
  font-size: 1.2rem;
  color: #e6007e;
  /* color solicitado */
}

.box-lonas p {
  margin: 0;
  line-height: 1.4;
}

/* === RESPONSIVE === */

/* En tablets (≤991px): 1 columna general y la imagen se hace más grande */
@media (max-width: 991.98px) {
  .grid-2-lonas {
    grid-template-columns: 1fr;
    /* una sola columna */
  }

  .box-lonas {
    grid-template-columns: 150px 1fr;
    /* imagen un poco más grande en tablet */
  }

  .thumb-lonas {
    width: 150px;
    height: 150px;
  }
}

/* En móviles pequeños (≤575px): apilar imagen encima del texto */
@media (max-width: 575.98px) {
  .box-lonas {
    grid-template-columns: 1fr;
    /* apila imagen y texto */
  }

  .thumb-lonas {
    width: 100%;
    height: 200px;
    /* imagen full width */
  }

  .box-lonas h4 {
    margin-top: 0.5rem;
    font-size: 1.1rem;
    text-align: center;
  }

  .box-lonas p {
    text-align: center;
  }
}



.cta-section {
  background-color: #ececec;
  margin: 65px 0;
  padding: 3rem 100px;
  display: flex;
  justify-content: center;
}

.cta-container {
  text-align: left;
}

.cta-container h2 {
  font-family: "Varela Round", sans-serif;
  font-size: 2.2rem;
  color: #e6007e;
  /* color título */
  margin-bottom: 1rem;
  padding: 0 !important;
}

.cta-container p {
  font-size: 1rem;
  color: #232323;
  line-height: 24px;
  margin-bottom: 2rem;
}

/* Botones */
.cta-buttons {
  display: flex;
  justify-content: center;
  gap: 10px;
  flex-wrap: wrap;
  /* Para que se acomoden en móviles */
}

.btn-cta {
  display: inline-block;
  padding: 0.5rem 2.5rem;
  border: 1px solid #00a0e3;
  /* azul */
  color: #00a0e3;
  border-radius: 5px;
  text-decoration: none;
  transition: all 0.3s ease;
  background-color: #fff;
  font-size: 1.2rem;
  font-weight: 500;
  line-height: 21px;
  min-width: 215px;
  text-align: center;
}

.btn-cta:hover {
  background-color: #00a0e3;
  color: #fff;
}


/*MEGA MENU*/
a,
a:hover {
  transition: all ease 0.03s;
}

.ets_mm_megamenu_content {
  padding: 0 70px;
}

.ets_mm_megamenu_content .h4 {
  text-transform: none;
  color: #969696 !important;
}

.ets_mm_megamenu_content .h4 a {
  color: #151515 !important;
}

.ets_mm_megamenu_content .h4 a:hover {
  color: #ce0162 !important;
}

.mm_columns_ul,
.mm_columns_contents_ul {
  border-radius: 0 0 .5rem .5rem;
}

.mm_columns_ul li:nth-last-of-type(1)>div {
  border-radius: 0 0 .5rem .5rem;
}

.layout_layout1 .ets_mm_megamenu_content {
  border-top: none;
  border-bottom-color: #c6c6c6;
  background-color: #f7f7f7 !important;
}

.mm_menu_content_title {
  background: transparent !important;
  padding: 7px 20px;
  min-height: 0;
  color: #575756;
  font-size: 16px;
  text-transform: none;
  transition: all ease 0.03s;
}

.mm_menu_content_title:hover {
  color: #ce0162;
  transition: all ease 0.03s;
}

.ets_mm_categories li a:hover {
  color: #009de4 !important;
}

.ets_mm_block>.h4 {
  border: none;
  border-top: 1px solid #c6c6c6;
  padding-top: 10px;
}

.layout_layout1 .mm_menus_li {
  width: auto !important;
}

.RegistPro {
  float: right !important;
  background-color: #009de4;
  transition: all ease 0.03s;
}

.RegistPro:hover {
  background-color: #0287c5;
  transition: all ease 0.03s;
}

.RegistPro a::before {
  background-color: transparent !important;
}

.RegistPro .mm_menu_content_title {
  color: white;
}

.layout_layout1:not(.ybc_vertical_menu) .mm_menus_li>a {
  font-weight: 400;
}

.layout_layout1 .ets_mm_block_content ul li a {
  line-height: 22px;
  font-weight: 400;
}

.layout_layout1 .ets_mm_block_content ul li a::before {
  content: none;
}

/*.mm_blocks_li{border-top:1px solid  #c6c6c6;border-bottom:1px solid  #c6c6c6;padding: 10px;}*/
.layout_layout1 .mm_menus_li,
.mm_tabs_li .mm_columns_contents_ul,
.mm_tabs_li .mm_columns_contents_ul {
  border: none !important;
}

.layout_layout1:not(.ybc_vertical_menu) .mm_menus_li>a {
  background: transparent !important;
}

.mm_tab_toggle_title {
  padding: 9px 15px 9px 35px;
}

.MatEco .mm_menu_content_title {
  color: #00b126;
  transition: all ease 0.03s;
}

.MatEco .mm_menu_content_title:hover {
  color: #038d21;
  transition: all ease 0.03s;
}


.top-menu[data-depth="1"] {
  padding: 15px;
}

.top-menu .sub-menu ul[data-depth="1"]>li {
  float: none;
}

.top-menu a.dropdown-submenu {
  text-transform: none;
}

#header a:hover {
  color: #d00063;
}



.product-images>li.thumb-container picture {
  width: 200px;
  height: 160px;
  display: inline-block;
}

.product-images>li.thumb-container .thumb {
  width: 100%;
  height: 100%;
  border-radius: 10px;
  object-fit: cover;
}



.block_newsletter {
  background-color: #f8ac38;
  padding: 35px 200px;
  max-width: none !important;
  margin: 75px 0;
}

.block_newsletter #block-newsletter-label {
  font-weight: 600;
}

.block_newsletter form input[type=email] {
  border: none !important;
  border-radius: 5px 0 0 5px;
}

.block_newsletter .btn-primary {
  background-color: white !important;
  color: #000 !important;
  margin-left: 0 !important;
  border-radius: 0 5px 5px 0 !important;
}

#order-items hr {
  border-top-color: #e2e2e2;
}

.definition-list dl dd,
.definition-list dl dt {
  flex: 0 0 49% !important;
}


/* Evita que el header recorte la capa */
#header,
.header,
.header-top,
.header-nav {
  overflow: visible !important;
}

/* Base en blanco */
.header-help-contact {
  color: #fff;
}

.header-help-contact .help-title {
  letter-spacing: .5px;
  font-weight: 500;
}

.header-help-contact .help-contact-inferior {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.header-help-contact .help-whatsapp {
  text-decoration: underline;
}

.header-help-contact .help-whatsapp i,
.header-help-contact .help-whatsapp span {
  color: #fff;
}

.header-help-contact .btn-link i {
  transition: transform .25s ease;
}

/* Rotación del chevron cuando está abierto */
.header-help-contact .btn-link[aria-expanded="true"] i {
  transform: rotate(180deg);
}

/* Capa tipo dropdown: absoluta y encima del header */
.drop-layer {
  position: absolute;
  top: calc(100% + 8px);
  /* justo bajo el trigger */
  right: 0;
  /* alineada al borde derecho del bloque */
  z-index: 2500;
  /* por encima del header */
  min-width: 240px;
  max-width: 360px;

  /* Oculta por defecto (sin colapsar el layout) */
  opacity: 0;
  transform: translateY(-6px);
  pointer-events: none;
  transition: opacity .18s ease, transform .18s ease;
}

/* Estado visible */
.drop-layer.is-open {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

/* Tarjeta interna: fondo blanco y esquinas redondeadas, texto oscuro */
.drop-card {
  background: #fff;
  color: #212529;
  /* texto NO blanco para contraste */
  border-radius: .5rem;
  box-shadow: 0 10px 24px rgba(0, 0, 0, .15), 0 2px 6px rgba(0, 0, 0, .1);
  border: 1px solid rgba(0, 0, 0, .06);
  padding: 1rem;
  font-size: .9rem;
  display: flex;
  align-items: flex-start;
}

.drop-card .bi-info-circle {
  color: #ce0162;
  margin-top: .1rem;
}

#_desktop_user_info {
  display: flex;
  align-items: center;
}

#_desktop_user_info,
.user-info {
  overflow: visible !important;
}


/* Botón y chevron */
.user-info .btn-link i {
  transition: transform .25s ease;
}

.user-info .btn-link[aria-expanded="true"] i {
  transform: rotate(180deg);
}

#header .header-nav .user-info {
  margin-left: 2.5rem;
  margin-right: 0.5rem;
}

/* Dropdown capa flotante */
.drop-layer {
  position: absolute;
  top: calc(100% + 8px);
  right: 0;
  z-index: 2500;
  min-width: 220px;
  opacity: 0;
  transform: translateY(-6px);
  pointer-events: none;
  transition: opacity .18s ease, transform .18s ease;
}

.drop-layer.is-open {
  opacity: 1;
  transform: translateY(0);
  pointer-events: auto;
}

/* Tarjeta interna */
#accountDropdown .drop-card {
  display: block;
  text-align: left;
  background: #fff;
  color: #212529;
  border-radius: .5rem;
  box-shadow: 0 10px 24px rgba(0, 0, 0, .15), 0 2px 6px rgba(0, 0, 0, .1);
  border: 1px solid rgba(0, 0, 0, .06);
  padding: 1rem;
}

.drop-card a.dropdown-item {
  display: block;
  padding: .5rem 1rem .5rem 0;
  color: #212529;
  text-decoration: none;
  font-size: .9rem;
}

.drop-card a.dropdown-item:hover {
  background: #f8f9fa;
}

.drop-card .dropdown-divider {
  margin: .25rem 0;
}

.psproducthtml-block {
  padding: 0 10px;
}

.psproducthtml-block ul li {
  font-size: 14px;
  font-weight: 500;
  color: #505050;
}

.psproducthtml-block ul li i {
  margin-right: 5px;
}

.bloque-info {
  background: #dbf4ff;
  margin: 16px 0;
  transition: height .4s ease-in-out;
  position: relative;
  border-radius: 10px;
}

.bloque-info .chevron {
  position: absolute;
  top: -10px;
  right: 20px;
  width: 0;
  height: 0;
  border-left: 12px solid transparent;
  border-right: 12px solid transparent;
  border-bottom: 12px solid #dbf4ff;
  margin-left: auto;
  margin-right: 8px;
}

.bloque-info .cont {
  padding: 40px 38px 24px 24px;
}

.bloque-info .btn-cerrar {
  position: absolute;
  top: 15px;
  right: 15px;
  color: #0188c7;
}

.bloque-info,
.bloque-info p {
  font-size: 0.8rem;
  font-weight: 400;
  color: #494949;
}

/*CATEGORIA: bloque bajo el h2 -> subcategorías (izq.) + descripción adicional (der.)*/
/* h2 del módulo h2categoryheader como etiqueta rosa sobre el borde del banner */
.block-category .category-custom-title {
  position: relative;
  z-index: 2;
  display: inline-block;
  margin: -1.6rem 0 1.75rem 8rem;
  padding: .6rem 1.4rem;
  background-color: #E2007A;
  color: #fff;
  font-size: 1.5rem;
  text-align: left;
}

.category-intro {
  display: flex;
  align-items: flex-start;
  gap: 2rem;
  max-width: 1200px;
  margin: 0 auto 2.5rem;
  padding: 0 30px;
}

.category-intro-subcats {
  flex: 3 1 0;
  min-width: 0;
}

.category-intro .category-additional-description {
  flex: 2 1 0;
  min-width: 0;
}

/* subcategorías en formato compacto: miniatura + nombre, 3 columnas */
.category-intro #subcategories {
  max-width: none;
  margin: 0;
  padding: 0;
  border: none;
  background: transparent;
}

.category-intro #subcategories ul {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1.25rem 1.5rem;
  margin: 0;
}

.category-intro #subcategories ul li {
  display: flex;
  align-items: flex-start;
  gap: .75rem;
  width: auto;
  min-width: 0;
  margin: 0;
  text-align: left;
}

.category-intro #subcategories ul li .subcategory-image {
  flex: 0 0 55px;
  padding: 0;
}

.category-intro #subcategories ul li .subcategory-image a,
.category-intro #subcategories ul li:hover .subcategory-image a {
  padding: 0;
  border: none;
}

.category-intro #subcategories ul li .subcategory-image picture {
  width: 55px;
  height: 55px;
}

.category-intro #subcategories ul li .subcategory-image picture img {
  border-radius: 4px;
}

.category-intro #subcategories ul li h5 {
  margin: 0;
  font-size: .8rem;
  line-height: 1.3;
}

.category-intro #subcategories ul li .subcategory-name {
  color: #1d1d1b;
  font-weight: 600;
}

.category-intro #subcategories ul li .subcategory-name:hover {
  color: #E2007A;
}

/* descripción adicional (HTML libre del editor del BO) */
.category-intro .category-additional-description h2,
.category-intro .category-additional-description h3 {
  margin: 0 0 1rem;
  color: #1d1d1b;
  font-family: "Varela Round", sans-serif;
  font-size: 1.25rem;
  font-weight: 600;
}

.category-intro .category-additional-description p {
  color: #444;
  font-size: .85rem;
  line-height: 1.8;
}

@media (max-width: 767px) {
  .block-category .category-custom-title {
    margin: 1rem 0 1.25rem 15px;
    font-size: 1.2rem;
  }

  .category-intro {
    flex-direction: column;
    gap: 1.5rem;
    padding: 0 15px;
  }

  .category-intro #subcategories ul {
    grid-template-columns: repeat(2, 1fr);
  }
}

/*MÓDULO H2 DINÁMICO*/
.category-custom-title {
  text-align: center;
  margin: 20px auto 10px;
  font-size: 2rem;
  font-weight: 600;
}

.category-custom-paragraph {
  text-align: left;
  max-width: 1200px;
  margin: 0 auto 25px;
  line-height: 1.6;
  font-size: 1rem;
  color: #555;
}




/* --- Resumen de pedido elegante --- */
.table th {
  font-weight: 700 !important;
  text-transform: uppercase;
  letter-spacing: 0.5px;
}

.table tbody td {
  vertical-align: middle;
}

.table tbody td.text-dark {
  font-weight: 600 !important;
}

.table-hover tbody tr:hover {
  background-color: #f9fafb;
}

.table-striped>tr:nth-of-type(odd) {
  background-color: #fcfcfc;
}

.table .fs-4 {
  font-size: 1.4rem !important;
}

.table .fs-6 {
  font-size: 1rem !important;
}

.letter-spacing-1 {
  letter-spacing: 0.5px;
}

/*AREA DEL CLIENTE*/
/* === LAYOUT GENERAL === */

.page-addresses .address {
  border-radius: 14px;
  padding: 2rem;
  color: #333;
  border: 1px solid #e5e5e5;
  transition: all 0.25s ease;
}

.welcome-user {}

.account-layout {

  display: flex;
  flex-wrap: nowrap;
}

/* === SIDEBAR === */
.account-sidebar {
  padding: 10.5rem 1.5rem 2rem;
  width: 16rem;
  height: 100%;
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  background-color: #fff;
  /* gris suave */
  box-shadow: 2px 0 8px rgba(0, 0, 0, 0.08);
  border-right: 1px solid #dddddd;
  overflow-y: auto;
  z-index: 50;
  transition: all 0.3s ease;
}

/* Scrollbar elegante */
.account-sidebar::-webkit-scrollbar {
  width: 6px;
}

.account-sidebar::-webkit-scrollbar-thumb {
  background-color: rgba(0, 0, 0, 0.2);
  border-radius: 3px;
}

/* === CONTENIDO PRINCIPAL === */
.account-content {
  flex-grow: 1;
  padding: 2rem;
  transition: margin-left 0.3s ease;
}


/* === NAV LINKS === */
.account-sidebar .nav-link {
  color: #444;
  font-weight: 500;
  display: flex;
  align-items: center;
  padding: 0.6rem 0.85rem;
  border-radius: 8px;
  margin-bottom: 0.3rem;
  transition: all 0.2s ease;
  text-decoration: none;
}

.account-sidebar .nav-link i {
  font-size: 1.1rem;
  margin-right: 0.6rem;
}

.account-sidebar .nav-link:hover,
.account-sidebar .nav-link.active {
  background-color: #fff;
  color: #009fe3;
  transform: translateX(3px);
}

/* === CABECERA DEL SIDEBAR === */
.account-sidebar h5 {
  font-weight: 600;
  color: #333;
}

.account-sidebar .bi-person-circle {
  color: #777;
}

/* === GRID ADAPTATIVO (sin Bootstrap) === */
#my-account-links {
  display: flex;
  flex-wrap: wrap;
  gap: 1.5rem;
}

#my-account-links>a {
  flex: 0 0 100%;
  text-decoration: none;
}

@media (min-width: 576px) {
  #my-account-links>a {
    flex: 0 0 calc(50% - 1.5rem);
  }
}

@media (min-width: 992px) {
  #my-account-links>a {
    flex: 0 0 calc(33.333% - 1.5rem);
  }

  /* agregado por marcos */
  .product-container .col-md-6 {
    padding: 0;
  }

}

/* === TARJETAS === */
#my-account-links>a {
  background: #ffffff;
  border-radius: 14px;
  padding: 4rem 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #333;
  border: 1px solid #e5e5e5;
  transition: all 0.25s ease;
  position: relative;
  overflow: hidden;
}

/* Efecto de overlay premium */
#my-account-links>a::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, #009fe3 0%, #00b8ff 100%);
  opacity: 0;
  transition: opacity .25s ease;
  z-index: 0;
}

/* CONTENIDO */
#my-account-links .link-item {
  text-align: center;
  display: flex;
  flex-direction: column;
  gap: .6rem;
  font-weight: 600;
  letter-spacing: .3px;
  position: relative;
  z-index: 1;
}

/* ICONOS */
#my-account-links .link-item i {
  font-size: 2.4rem;
  color: #444;
  transition: color .25s ease, transform .25s ease;
}

/* HOVER */
#my-account-links>a:hover {
  transform: translateY(-6px);
  border-color: #009fe3;
  box-shadow: 0 12px 28px rgba(0, 0, 0, .1);
}

#my-account-links>a:hover::before {
  opacity: .08;
}

#my-account-links>a:hover i {
  color: #009fe3;
  transform: translateY(-3px);
}

/* SMALL TEXT */
#my-account-links .link-item span,
#my-account-links .link-item {
  font-size: 1rem;
  align-items: center;
}

/* Touch-friendly en móvil */
@media (max-width: 575px) {
  #my-account-links>a {
    padding: 1.7rem 1rem;
    border-radius: 10px;
  }

  #my-account-links .link-item i {
    font-size: 2rem;
  }
}

/* === RESPONSIVE === */
@media (max-width: 992px) {
  .account-sidebar {
    position: relative;
    width: 100%;
    height: auto;
    top: 0;
    box-shadow: none;
    border-right: none;
  }

  .account-content {
    margin-left: 0;
  }

  .account-sidebar .nav-link {
    justify-content: center;
    font-size: 0.95rem;
  }

  .account-sidebar .nav-link i {
    margin-right: 0.4rem;
  }
}

/* === TOQUES FINALES === */
.account-sidebar hr {
  margin: 1rem 0;
  border-color: #ddd;
}

.nav-link.text-danger:hover {
  background-color: #f8d7da;
  color: #a71d2a !important;
}

/* Estado base: oculta */
#spfuUploadModal {
  display: none;
  opacity: 0;
}

.btn-upload-history {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  padding: 10px !important;
}

/* Estado visible (la que activamos por JS) */
#spfuUploadModal.spfu-open {
  display: block !important;
  opacity: 1 !important;
}


/* Si quieres una animación suave */
#spfuUploadModal {
  transition: opacity .2s ease;
}

.spfu-file-list {
  list-style: none;
  padding-left: 0;
  margin-top: 8px;
  font-size: 13px;
}

.spfu-file-item {
  margin-bottom: 4px;
  display: flex;
  align-items: center;
  gap: 6px;
}

.spfu-file-item i {
  font-size: 16px;
}

/* Lista contenedora */
.spfu-file-list-wrapper {
  padding: 10px 5px;
}

/* UL */
.spfu-file-list {
  list-style: none;
  margin: 0;
  padding: 0;
  border-radius: 4px;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: start;
  gap: 5px;
}

/* Items cebreados */
.spfu-file-item {
  padding: 8px 20px;
  display: flex;
  align-items: center;
  gap: 8px;
  background: #fee9a7;
  border-radius: 25px;
}


.spfu-file-item:last-child {
  border-bottom: none;
}

/* Iconos */
.spfu-file-item i {
  font-size: 1.2rem;
}

#sticky-box {
  position: fixed;
  /*agregado por marcos*/
  /*right: 20px;*/
  /*bottom: 20px;*/
  /*era 50*/
  right: 75px;
  bottom: 30px;
  /*Agregado por Marcos*/
  /* width: calc(100% - 75px); */
  /* /*era900*/
  /* max-width: 850px; */
  border-radius: 20px;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.15);
  z-index: 10;
  transition: transform .3s ease;
}

#sticky-box.unstick {
  position: static !important;
  transform: none !important;
  width: auto !important;
  max-width: none !important;
  bottom: auto !important;
  box-shadow: unset;
}

#spfu-files-table {
  margin-top: 25px;
}



#spfu-toast-container {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 999999;
  display: flex;
  flex-direction: column;
  gap: 10px;
  pointer-events: none;
}

.spfu-toast {
  min-width: 280px;
  max-width: 360px;
  padding: 14px 18px;
  border-radius: 10px;
  color: #fff;
  font-size: 14px;
  opacity: 0;
  transform: translateY(20px);
  pointer-events: auto;
  cursor: pointer;
  box-shadow: 0 4px 18px rgba(0, 0, 0, 0.15);
  transition: all .35s ease;
}

.spfu-toast-show {
  opacity: 1;
  transform: translateY(0);
}

.spfu-toast-success {
  background: #2ecc71;
}

.spfu-toast-warning {
  background: #f1c40f;
  color: #000;
}

.spfu-toast-error {
  background: #e74c3c;
}

.spfu-toast-info {
  background: #3498db;
}


#panelado_warning {
  display: flex;
  align-items: center;
  gap: 8px;
  box-sizing: border-box;

  max-height: 0;
  opacity: 0;
  overflow: hidden;

  padding: 0 12px;
  margin-top: 0;

  background: #ffeedb;
  border-radius: 10px;
  color: #494949;
  font-size: 14px;

  transition:
    height 0.3s ease,
    opacity 0.25s ease,
    padding 0.25s ease,
    margin-top 0.25s ease;
}

#panelado_warning.show {
  /* ajusta según el contenido */
  opacity: 1;
  padding: 40px 38px 24px 24px;
  margin: 15px 0;
  max-height: fit-content;

}

.panelado-warning-container {
  display: flex;
  align-items: flex-start;
  gap: 5px
}

#panelado_warning .warning-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: #494949;
}

#panelado_warning .warning-icon svg {
  width: 18px;
  height: 18px;
  display: block;
}

#panelado_warning .warning-text {
  line-height: 1.4;
}

/* Errores de validacion de medidas en peris: caja .bloque-info en tono rojo,
   sin boton de cerrar (como #panelado_warning). Se abre/cierra con las clases
   collapse/in de Bootstrap, por eso el padding va en el contenedor interno y no
   en el bloque (si no, la animacion de altura salta). */
.bloque-info.bloque-error {
  background: #ffe3e3;
}

.bloque-error .error-container {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 16px 24px;
}

.bloque-error .error-icon {
  display: flex;
  flex-shrink: 0;
  color: #f31616;
}

.bloque-error .error-icon svg {
  width: 18px;
  height: 18px;
  display: block;
}

.bloque-error .error-text {
  margin: 0;
  line-height: 1.4;
}


.spfu-thumb-wrapper {
  position: relative;
  display: inline-block;
}

.spfu-thumb-preview {
  position: absolute;
  top: 0;
  left: 110%;
  max-width: 250px;
  max-height: 250px;
  padding: 4px;
  background: #fff;
  border: 1px solid #ccc;
  border-radius: 6px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.25);

  opacity: 0;
  pointer-events: none;
  transition: opacity .18s ease-out, transform .18s ease-out;
  transform: translateY(4px);
  z-index: 99999;
}

.spfu-thumb-wrapper:hover .spfu-thumb-preview {
  opacity: 1;
  transform: translateY(0);
}

select#diametro_vaina {
  width: calc(100% - 22px);
  max-width: 100%;
}




/*MEDIAQUERIES NUBEADO*/
/*@media (min-width: 1600px) {
  .container {
      width: 1580px;
      max-width: 100%;
  }
}
  */






@media (min-width: 992px) {

  #address #wrapper,
  #addresses #wrapper,
  #authentication #wrapper,
  #cms #wrapper,
  #identity #wrapper,
  #my-account #wrapper,
  #password #wrapper,
  #registration #wrapper,
  #cart #wrapper,
  #checkout #wrapper,
  #order-confirmation #wrapper,
  #module-psfilecontrol-uploadcenter #wrapper,
  #discount #wrapper,
  #history #wrapper,
  #order-detail #wrapper,
  #order-slip #wrapper,
  #discount #wrapper,
  #module-psgdpr-gdpr #wrapper,
  #module-spfileupload-pendingfiles #wrapper,
  #module-spfileupload-uploadcenter #wrapper,
  #search #wrapper {
    padding: 20px 70px;
    min-height: 100vh;
  }

  #identity #wrapper,
  #order-detail #wrapper,
  #address #wrapper,
  #addresses #wrapper,
  #my-account #wrapper,
  #order-slip #wrapper,
  #history #wrapper,
  #discount #wrapper,
  #module-psgdpr-gdpr #wrapper,
  #module-spfileupload-pendingfiles #wrapper,
  #module-spfileupload-uploadcenter #wrapper,
  #identity #footer,
  #address #footer,
  #addresses #footer,
  #my-account #footer,
  #module-psgdpr-gdpr #footer,
  #module-spfileupload-pendingfiles #footer,
  #module-spfileupload-uploadcenter #footer,
  #order-slip #footer,
  #history #footer,
  #discount #footer {
    padding-left: 20rem;
  }

  /*body#my-account footer, 
    body#identity footer,
    body#history footer,
    body#address footer,
    body#addresses footer,
    body#my-account .block-social,
    body#identity .block-social,
    body#history .block-social,
    body#addresses .block-social,
    body#my-account .block-social
    {
      display: none !important;
    }*/


}

@media (max-width: 992px) {

  #category .products.row,
  #products .products,
  .featured-products .products,
  .product-accessories .products,
  #products #js-product-list-top {
    padding: 0 2%;
    justify-content: center;
  }

}

@media (min-width: 1300px) and (max-width: 1559px) {

  #products .products,
  .featured-products .products,
  .product-accessories .products {
    padding: 0 !important;
  }

  .block_newsletter {
    padding: 35px 100px;
  }

  #medidas #ancho,
  #medidas #alto {
    margin: 0;
  }

  .box-info-product #quantity_wanted_p {
    gap: 5px;
  }

  #quantity_wanted_p input {
    width: 100%;
  }

  .box-info-product #quantity_wanted_p .select {
    margin-right: 0;
  }

  .add-to-cart {
    font-size: 0.8rem !important;
  }

  .bootstrap-touchspin,
  .box-info-product #quantity_wanted_p div {
    margin-right: 2px;
  }

  #quantity_wanted_p input {
    width: 100%;
    margin-left: -8px;
  }

  .bootstrap-touchspin .input-group-btn-vertical {
    margin-right: -1px;
  }
}


@media (min-width: 1681px) and (max-width: 1920px) {

  #quantity_wanted_p input {
    width: 100%;
  }

  #product .owl-carousel.owl-drag .owl-item img {
    max-width: 150px;
  }
}






/*.home-swiper-mobile img {
  width: 100%;
  height: auto;
  display: block;
}

.product-cover-swiper {
  width: 100%;
  height: 480px;
  overflow: hidden;
}

.product-cover-swiper .swiper-wrapper {
  height: 100%;
}

.product-cover-swiper .swiper-slide {
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.product-cover-swiper picture,
.product-cover-swiper img {
  width: 100%;
  height: 100%;
}

.product-cover-swiper img {
  object-fit: cover; 
  display: block;
}
*/

.mi-swiper-test {
  display: none;
}

.scroll-box-arrows {
  display: none !important;
}

#main .images-container .js-qv-mask.scroll {
  display: none !important;
}

@media (max-width: 767px) {

  .mi-swiper-test {
    display: block;
  }

  #header .header-nav {
    padding: 15px 25px;
  }

  /*Fila 1 mobile: logo a la izquierda, carrito a la derecha (rediseño navbar mobile)*/
  #header .header-nav .mobile-row-1 {
    display: flex;
    align-items: center;
    justify-content: space-between;
  }

  /*Fila 2 mobile: botón de menú + buscador + ícono de usuario, dentro de la misma barra que antes solo tenía el botón "Menu" (rediseño navbar mobile)*/
  .mobile-nav-bar {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 15px;
    position: relative;
  }

  /*width fijo: sin esto, el 100% del .container interno de ets_megamenu infla el tamaño "auto" del flex item y ocupa toda la fila*/
  .mobile-nav-bar .ets_mm_megamenu {
    order: 1;
    flex: 0 0 auto;
    width: 48px;
  }

  /*background/border !important: .ets_mm_megamenu_content trae un gradiente blanco->gris y un border-top/bottom (layout1.css) con la misma especificidad que esta regla; sin !important gana por orden de carga y deja un recuadro/línea inconsistente detrás del botón de menú*/
  .mobile-nav-bar .ets_mm_megamenu_content,
  .mobile-nav-bar .ets_mm_megamenu_content .container,
  .mobile-nav-bar .ets_mm_megamenu_content_content {
    width: auto;
    padding: 0;
    margin: 0;
    background: transparent !important;
    border: none !important;
  }

  .mobile-nav-bar .mobile-search-wrapper {
    order: 2;
    flex: 1 1 auto;
    min-width: 0;
  }

  .mobile-nav-bar #_mobile_user_info {
    order: 3;
    flex: 0 0 auto;
    display: flex;
    align-items: center;
  }

  /*El ícono/texto de usuario son blancos por defecto (pensado para el fondo rosa del header); acá el fondo es claro, así que se oscurecen para que se vean. El saludo "Hola, Nombre" del usuario logado se oculta para mantener la fila compacta (solo ícono, igual que el estado no logado)*/
  .mobile-nav-bar #_mobile_user_info .sp-login-link svg {
    fill: #333;
    stroke: #333;
    width: 44px;
    height: 44px;
  }

  .mobile-nav-bar #_mobile_user_info .sp-account-trigger .bi-person-circle {
    font-size: 32px;
  }

  .mobile-nav-bar #_mobile_user_info .sp-account-trigger span {
    display: none;
  }

  /*El <button data-drop-toggle> (el que realmente abre el dropdown) es hermano del ícono, no su contenedor; al ocultar el texto de adentro quedaba sin área clickeable visible y el clic caía sobre el ícono, que no tiene listener. Se estira el botón para que cubra todo el trigger (ícono incluido)*/
  .mobile-nav-bar #_mobile_user_info .sp-account-trigger {
    position: relative;
  }

  .mobile-nav-bar #_mobile_user_info .sp-account-trigger button[data-drop-toggle] {
    position: absolute;
    inset: 0;
  }

  .mobile-nav-bar #_mobile_user_info .sp-account-trigger,
  .mobile-nav-bar #_mobile_user_info .sp-account-trigger i,
  .mobile-nav-bar #_mobile_user_info .sp-account-trigger .btn-link {
    color: #333 !important;
  }

  /*Botón "Menu" compacto: antes ocupaba el ancho completo de su fila, ahora comparte espacio con buscador y usuario, así que se oculta el texto y queda solo el ícono*/
  .mobile-nav-bar .ybc-menu-toggle {
    width: auto;
    padding: 12px;
    font-size: 0;
  }

  /*top:100% en vez de un valor fijo en px: el dropdown de cuenta ahora cuelga de la fila 2 (.mobile-nav-bar, position:relative), no de la fila 1 como antes*/
  .drop-layer {
    position: absolute;
    top: 100%;
    right: 0;
    left: 0;
    z-index: 2500;
    min-width: 100%;
    max-width: 100%;
  }

  /*Bloque de idioma/moneda/contacto reubicado al final del drawer de categorías (antes vivía en #mobile_top_menu_wrapper, oculto). Los módulos de idioma/moneda/contacto no están activos en esta tienda, así que hoy queda vacío; se oculta para no dejar un hueco en blanco y aparece solo si en el futuro hay contenido real*/
  .mm_menus_mobile_extra {
    background: #ececec;
    padding: 10px 15px 20px;
  }

  #_mobile_currency_selector:empty,
  #_mobile_language_selector:empty,
  #_mobile_contact_link:empty {
    display: none;
  }

  .mm_menus_mobile_extra:not(:has(> *:not(:empty))) {
    display: none;
  }

  #accountDropdown .drop-card {
    border-radius: 0;
  }

  .drop-card a.dropdown-item {
    padding: .8rem 1rem .8rem 0;
    font-size: 1.2rem;
  }

  .ets_mm_megamenu.hook-default {
    margin: 0;
    padding: 0;
  }

  .ets_mm_megamenu_content {
    padding: 0;
  }

  .ybc-menu-toggle {
    padding: 20px;
    display: flex;
    align-items: center;
    justify-content: end;
  }

  .ybc-menu-toggle .icon-bar {
    width: 30px;
    height: 3px;
  }

  .ets_mm_megamenu .mm_menus_ul .close_menu {
    display: none !important;
  }

  .transition_floating .mm_menus_ul {
    background-color: white;
  }

  .ets_mm_megamenu:not(.transition_slide) .mm_columns_ul {
    display: block;
    visibility: visible;
  }

  .ets_mm_megamenu span.arrow {
    display: none;
  }

  .mm_menu_content_title {
    font-size: 1.2rem;
    font-weight: 700;
    padding: 12px 15px 12px 0;
  }

  .mm_tab_toggle_title {
    padding: 12px 15px 12px 15px;
  }

  .layout_layout1 .mm_menus_li {
    width: 100% !important;
  }

  .mm_tab_has_child::after {
    border-right: 2px solid #999;
    border-top: 2px solid #999;
    width: 10px;
    height: 10px;
  }

  .mm_menus_li>a {
    padding: 5px 15px;
  }

  .BlockHeading {
    padding: 20px 40px;
  }

  .BlockHeading h1 {
    font-size: 1.6rem;
  }

  .IconosHomeBlock {
    overflow-x: auto;
    padding: 5px 20px;
    align-items: baseline;
  }

  .IconosHomeBlock div {
    text-align: center;
    line-height: 12px;
    min-width: 100px;
    display: block;
    padding: 10px 10px;
  }

  .IconosHomeBlock div svg {
    width: 36px;
    height: 36px;
    margin-bottom: 5px;
  }

  .IconosHomeBlock div span {
    font-size: 14px;
  }

  #carousel {
    display: none;
  }

  .ns-mobile-swiper-wrapper {
    display: block;
  }

  body#index h2 {
    font-size: 1.6em;
    text-align: center;
    margin-bottom: 1rem;
  }

  #products .products,
  .featured-products .products,
  .product-accessories .products,
  #products #js-product-list-top {
    padding: 0 20px;
  }

  #index .featured-products {

    padding: 50px 2%;

  }

  #index .featured-products .products {
    justify-content: center;
    gap: 2%;
  }

  .product {
    margin-bottom: 2%;
  }

  #products .products-section-title,
  .featured-products .products-section-title,
  .product-accessories .products-section-title {
    margin: 1rem 0;
  }

  .products.row {
    margin-left: 0;
    margin-right: 0;
  }

  .featured-products.mt-3 {
    margin-top: 0 !important;
  }

  .products .product {
    width: 45% !important;
    /*flex: 0 0 50% !important;*/
    max-width: 45% !important;
  }

  .box-info-product {
    padding: 15px;
  }

  .box-info-product #medidas,
  .box-info-product #refuerzo,
  .box-info-product #num_ficheros,
  .box-info-product #revision,
  .box-info-product #refproducto,
  .box-info-product #vaina,
  .box-info-product #emboltorio_diametro_vaina,
  .box-info-product #seleccion_68,
  .box-info-product #seleccion_600,
  .box-info-product #medidas div,
  .box-info-product #seleccion_252,
  .box-info-product #embalaje div {
    display: block !important;
  }

  #medidas #ancho,
  #medidas #alto {
    width: 100% !important;
    max-width: none !important;
    display: inline-block !important;
  }

  .box-info-product .select,
  .box-info-product #medidas {
    width: 95% !important;
  }

  .box-info-product #medidas label,
  .box-info-product label {
    width: 100% !important;
    max-width: none !important;
  }

  .SeoLonas p.descripcion {
    padding: 1em;
  }

  .product-miniature .thumbnail-container {
    margin-bottom: 0;
  }

  .product-miniature .product-price-and-shipping {
    padding: 10px 20px;
  }

  .product-miniature .thumbnail-container .product-thumbnail {
    height: 195px;
  }

  .product-miniature .product-description {
    padding: 0 5px;
    height: 50px;
  }

  .product-miniature .product-price-and-shipping,
  .thumbnail-container .no-variants {
    bottom: 60px;
    left: 10px;
  }

  .thumbnail-container .psproducthtml-block ul li {
    font-size: 12px;
  }

  .category-cover {
    background-image: none !important;
    padding: 15px;
    min-height: fit-content;
  }

  .category-cover h1 {
    color: #1d1d1b;
    font-size: 1.8em;
  }

  .category-custom-title {
    font-size: 1.4rem;
    padding: 0 20px;
  }

  #category-description p {
    margin-bottom: 0 !important;
    color: #848485 !important;
    ;
    font-size: 14px !important;
  }

  #category #wrapper {
    padding: 0 20px;
  }

  #category .products.row {
    padding: 0;
  }

  #product #wrapper,
  #order-detail #wrapper {
    padding-left: 2%;
    padding-right: 2%;
    padding-top: 0;
  }

  body#product .product-cover,
  .product-cover img {
    height: auto !important;
  }

  body#product .js-qv-mask {
    display: none;
  }

  .box-info-product label,
  .box-info-product .select,
  .select,
  .box-info-product #medidas .select {
    width: 100% !important;
  }

  .box-info-product #medidas .select {
    margin-right: 0;
  }

  .cont-collapsible .card-block {
    padding: 20px 15px;
  }

  .cont-collapsible .card-block img {
    height: auto !important;
  }

  .product-cover-swiper {
    height: auto;
  }

  #product .owl-carousel {
    width: 100%;
    float: none;
  }

  .cta-section {
    margin: 35px 0;
    padding: 3rem;
  }

  .cta-container h2,
  .SeoLonas h3,
  .faqs h3 {
    font-size: 1.6rem;
    text-align: center;
  }

  .btn-cta {
    width: 100%;
    text-align: center;
  }

  .cta-container p {
    text-align: center;
  }

  .AcabadosBlock,
  .textos-index {
    padding: 0 30px;
  }

  .SeoLonas {
    padding: 0 15px !important;
  }

  .block_newsletter {
    padding: 45px;
    margin: 45px 0;
  }

  .AcabadosBlock .AcabadosDestacados {
    display: grid;
  }

  .block_newsletter #block-newsletter-label {
    text-align: center;
  }

  #footer {
    padding: 25px;
    margin-top: 0;
  }

  .footer-container .container {
    padding: 0 15px;
  }

  .footer-container .material-icons {
    color: white;
  }

  .footer-container .links ul {
    background-color: transparent;
  }

  .footer-container .links ul>li {
    border: none;
    margin: 0;
  }

  .footer-container .links ul>li a {
    color: white;
  }

  .footer-container .wrapper {
    padding: 0 !important;
  }

  .block-social ul {
    margin-bottom: 0;
  }

  .block-social ul li {
    margin-right: 5px !important;
  }

  .grid-4 {
    grid-template-columns: repeat(1, 1fr);
  }

  .faqs {
    padding: 45px 15px 25px !important;
  }

  body#product .breadcrumb {
    display: none;
  }

  #sticky-box {
    position: relative;
    border-radius: 20px
  }

  body#my-account #wrapper,
  body#identity #wrapper,
  body#addresses #wrapper,
  body#address #wrapper,
  body#order-slip #wrapper,
  body#discount #wrapper,
  body#module-psgdpr-gdpr #wrapper,
  body#module-spfileupload-pendingfiles #wrapper,
  body#module-spfileupload-uploadcenter #wrapper {
    padding: 30px;
  }

  .account-sidebar {
    display: none;
  }

}

/* 5 productos por fila en escritorio */
@media (min-width: 1200px) {
  .products .product {
    /*width: 20% !important;*/
    flex: 0 0 18% !important;
    max-width: 18% !important;
  }
}

/* Ajustes para tablets: 3 por fila */
@media (min-width: 768px) and (max-width: 1199px) {

  .ets_mm_megamenu.is-sticky {
    top: 68px;
  }

  #header .header-nav {
    padding: 10px 20px;
  }

  #product #wrapper,
  #order-detail #wrapper {
    padding-left: 40px;
    padding-right: 40px;
  }

  .products .product {
    width: 30% !important;
    flex: 0 0 30% !important;
    max-width: 30% !important;
  }

}


.box-info-product #medidas.is-hidden,
.box-info-product #refuerzo.is-hidden,
.box-info-product #vaina.is-hidden,
.box-info-product #emboltorio_bobina.is-hidden,
.box-info-product #num_ficheros.is-hidden,
.box-info-product #emboltorio_posicion_ojal.is-hidden,
.box-info-product #emboltorio_numero_ojales.is-hidden,
.box-info-product #revision.is-hidden,
.box-info-product #refproducto.is-hidden,
.box-info-product #emboltorio_diametro_vaina.is-hidden,
.box-info-product #seleccion_68.is-hidden,
.box-info-product #seleccion_600.is-hidden,
.box-info-product #seleccion_84.is-hidden,
.box-info-product #seleccion_164.is-hidden,
.box-info-product #quantity_wanted_p.is-hidden,
.box-info-product #materiales.is-hidden,
.box-info-product #seleccion_264.is-hidden,
.box-info-product #seleccion_252.is-hidden,
.box-info-product #seleccion_363.is-hidden,
.box-info-product #embalaje.is-hidden,
.box-info-product #seleccion_331.is-hidden,
.box-info-product #seleccion_313.is-hidden,
.box-info-product #seleccion_161.is-hidden {
  display: none;
}

@media (max-width: 1024px) {

  .box-info-product #medidas.is-visible,
  .box-info-product #refuerzo.is-visible,
  .box-info-product #vaina.is-visible,
  #emboltorio_diametro_vaina.is-visible,
  #emboltorio_posicion_ojal.is-visible,
  #emboltorio_numero_ojales.is-visible,
  .box-info-product #emboltorio_bobina.is-visible,
  .box-info-product #num_ficheros.is-visible,
  .box-info-product #emboltorio_posicion_ojal.is-visible,
  .box-info-product #emboltorio_numero_ojales.is-visible,
  .box-info-product #revision.is-visible,
  .box-info-product #refproducto.is-visible,
  .box-info-product #seleccion_68.is-visible,
  .box-info-product #seleccion_600.is-visible,
  .box-info-product #seleccion_84.is-visible,
  .box-info-product #seleccion_164.is-visible,
  .box-info-product #quantity_wanted_p,
  .box-info-product #materiales.is-visible,
  .box-info-product #seleccion_264.is-visible,
  .box-info-product #seleccion_252.is-visible,
  .box-info-product #seleccion_363.is-visible,
  .box-info-product #embalaje.is-visible,
  .box-info-product #seleccion_331.is-visible,
  .box-info-product #seleccion_313.is-visible,
  .box-info-product #seleccion_161.is-visible {
    display: block;
  }

  .box-info-product label,
  .box-info-product .select,
  .select,
  .box-info-product #medidas .select {
    width: 100%;
  }

  #medidas div {
    margin-bottom: 10px;
  }

  #medidas div label {
    margin: 0;
  }

  .box-info-product #medidas {
    position: relative;
  }

  .box-info-product #medidas .select #alto {
    position: relative;
    right: initial;
  }

  .box-info-product #medidas .btn-cerrar {
    position: absolute;
    top: 0;
    right: 0;
  }

  .numero,
  .numero_entero {
    text-align: left;
  }

  .bootstrap-touchspin,
  .box-info-product #quantity_wanted_p div {
    margin-right: 0;
  }

  #quantity_wanted_p input {
    width: 95%;
    text-align: left;
  }

  #product .owl-carousel {
    padding: 25px;
  }

  #sel_entrega .BloqueEstimada div,
  #sel_entrega .Unds {
    padding: 10px;
  }

  #sel_entrega span {
    font-size: 13px;
  }

  /*Agregado por Marcos: el wrap de #ContBloquesPago ahora es el comportamiento por defecto (ver regla base), se saca de aca por quedar duplicado*/
}


#sel_entrega {
  display: grid;
  justify-content: normal;
  grid-template-rows: 50px 50px;
  gap: 5px;
  align-items: stretch;
}

/* agregado por marcos: columnas segun el nº de plazos visibles (1 a 5). product.js publica --plazos;
   el orden (mas rapido a la izquierda) sale del style="order" de peris.tpl, asi que no hace falta
   fijar grid-column por plazo. Cada .fecha va a la fila 1 y su .importe a la 2, en la misma columna */
#sel_entrega.sel-entrega-plazos {
  grid-template-columns: auto repeat(var(--plazos, 4), minmax(0, 1fr));
}

/* ocupa la celda vacia de arriba de .Unds para que la primera .fecha no se meta en la columna 1 */
#sel_entrega.sel-entrega-plazos::before {
  content: "";
  grid-column: 1;
  grid-row: 1;
}

#sel_entrega.sel-entrega-plazos .fecha {
  grid-row: 1;
}

#sel_entrega.sel-entrega-plazos .importe {
  grid-row: 2;
}

#sel_entrega .Unds {
  grid-column: 1;
  grid-row: 2;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #e9e9e9;
  border-radius: 8px;
}

#sel_entrega>div[id^="filaEstimada_"] {
  display: contents;
}

#sel_entrega .BloqueEstimada {
  display: contents;
}

#sel_entrega .fecha,
#sel_entrega .importe {
  display: flex;
  align-items: center;
  justify-content: center;
  background: #e9e9e9;
  border-radius: 8px;
  min-height: 50px;
}

#sel_entrega .activo .fecha,
#sel_entrega .activo .importe {
  background: #10a5dc;
  color: #fff;
  font-weight: 600;
}

@media (max-width: 600px) {

  #sel_entrega {
    display: grid;
    grid-template-rows: auto auto auto;
    gap: 5px;
  }

  #sel_entrega.sel-entrega-plazos {
    grid-template-columns: repeat(var(--plazos, 4), minmax(0, 1fr));
  }

  #sel_entrega.sel-entrega-plazos::before {
    display: none;
  }

  /* La fila de unidades ocupa todo el ancho */
  #sel_entrega .Unds {
    grid-column: 1 / -1;
    grid-row: 3;
    min-height: 48px;
    width: 100%;
  }

  #sel_entrega>div[id^="filaEstimada_"] {
    display: contents;
  }

  #sel_entrega .BloqueEstimada {
    display: contents;
  }

  #sel_entrega .fecha,
  #sel_entrega .importe {
    min-height: 50px;
    padding: 6px 4px;
    text-align: center;
    font-size: 13px;
    line-height: 1.2;
  }
}

#alto {
  width: 100%;
}

label[for="lancho"]:last-of-type {
  margin-left: auto;
}

/*agregado por marcos*/
.page-home {
  background-color: white;
}

/*checkout*/
#checkout-personal-information-step {
  border-radius: 1rem 1rem 0 0;
}

#checkout-payment-step {
  border-radius: 0 0 1rem 1rem;
}

.js-input-column .js-parent-focus {
  gap: 10px;
}

#js-checkout-summary,
.cart-container,
.cart-summary,
.cart-order-name {
  border-radius: 1rem;
}

.nombre-pedido {
  display: flex;
  align-items: center;
  gap: 2rem;
  margin-bottom: 1rem;
}

/* nombre del pedido en el resumen del checkout (solo lectura) */
.cart-summary-order-name {
  margin: 0 0 .75rem;
  padding-bottom: .75rem;
  border-bottom: 1px solid #f1f1f1;
  word-break: break-word;
}

/* en el carrito va dentro de su propia card */
.cart-order-name .nombre-pedido {
  margin-bottom: 0;
}

.nombre-pedido label {
  margin-bottom: 0;
  text-align: left;
}

.nombre-pedido input {
  min-width: 30%;
}

/* order confirmation */

.confirmation-header-table {
  width: 100%;
  border-radius: 1rem;
}

.confirmation-header {
  border-left: 5px solid green;
  border-radius: .5rem;
  box-shadow: rgba(233, 233, 233, 0.2) 0px 7px 29px 0px;
}

.confirmation-muted {
  padding: 1%;
  padding-bottom: 0;
  color: #7a7a7a;
  border-right: 1px solid #e1e1e1;
}

.confirmation-header-field {
  padding: 1%;
  padding-top: 0;
  color: #232323;
  border-right: 1px solid #e1e1e1;
  font-weight: 800;
}

.confirmation-table-wrapper {
  border-radius: 8px;
  overflow: hidden;
  border: 1px solid #ccc;
  margin-top: 0 !important;
  padding: 0 !important;
}

section.definition-list,
section.page-order-confirmation {
  padding: 0 2%;
  border-radius: 1rem;
  box-shadow: rgba(233, 233, 233, 0.2) 0px 7px 29px 0px;
}

/* order-confirmation-table: limitar tamaño de imagen de producto */

.order-confirmation-table .order-line .image {
  display: block !important;
  width: 100% !important;
}

.order-confirmation-table .order-line .image picture,
.order-confirmation-table .order-line .image img {
  display: block !important;
  width: 100% !important;
  max-width: 80px !important;
  height: auto !important;
  object-fit: contain !important;
  margin: 0 auto !important;
  aspect-ratio: 1/1 !important;
  object-fit: cover !important;
}


/*generales*/
.mm_menu_content_title {
  padding-left: 0;
}

.order-detail-image {
  border-radius: 50px;
  object-fit: contain;
  aspect-ratio: 1/1;
  width: 100%;
}

.RegistPro .mm_menu_content_title {
  padding-left: 20px;
}

.btn-primary {
  background-color: #f8ad36 !important;
  transition: background-color ease-in-out .3s;
}

.btn-primary:hover {
  background-color: #ff8f00 !important;
  transition: background-color ease-in-out .3s;
}

#blockEmailSubscription_displayHome {
  background-color: #93d0ec;
}

#my-account .row,
#identity .row,
#addresses .row,
#history .row,
#order-slip .row,
#discount .row,
#module-psgdpr-gdpr .row,
#module-spfileupload-pendingfiles .row,
#module-spfileupload-uploadcenter .row,
#checkout .row,
#cart .row {
  margin-left: 0;
  margin-right: 0;
}

/*cart*/
#cart-entrega-estimada {
  justify-content: left !important;
  background-color: rgb(255, 239, 222);
  padding: 1rem !important;
  border: 1px solid burlywood;
  border-radius: .4rem;
}

.cart-grid-body {
  padding-left: 0;
}

.cart-grid-right {
  padding-right: 0;
}

.modal-header {
  background-color: #e9ffe1 !important;
  border-radius: .7rem .7rem 0 0 !important;
}

.modal-content {
  border-radius: .7rem !important;
}

/*product*/
.product-config {
  background-color: white;
  border-radius: 1rem;
  box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
}

#medidas>.campo-medida:nth-of-type(2) {
  flex: 0 1 51%;
  justify-content: end;
}

@media (max-width: 1450px) {

  #medidas>.campo-medida:nth-of-type(2) {
    flex: 0 1 50%;
  }
}

@media (max-width: 1050px) {

  .campo-medida {
    justify-content: unset !important;
  }
}

.misplugins .encabezado {
  margin-top: 1rem;
  margin-bottom: .2rem;
}

.owl-carousel .owl-item img {
  width: auto !important;
}

.owl-carousel.conloop .item,
.owl-carousel.sinloop .item {
  width: 160px;
}

.owl-carousel .owl-stage-outer {
  padding: 2% 0;
  border-radius: .7rem;
}

.item .opt img {
  background-color: white;
}

.product-description {
  max-width: 1000px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.product-short-description p {
  line-height: 1.5;
  color: #252525;
}

.product-description h2 {
  text-align: center;
  color: #009fe3;
  margin: 40px 0;
}

.product-description p {
  line-height: 1.5;
  font-size: 1rem;
}

.product-description h3 {
  margin: 20px 0;
}

.swiper-wrapper {
  aspect-ratio: 16 / 9;
}

/* agregado por marcos: el radio va en el contenedor, no solo en las img; si no, durante el
   deslizamiento las slides quedan cortadas por las esquinas rectas del .swiper.
   isolation crea un contexto de apilamiento para que el clip redondeado se aplique tambien
   a la capa compuesta del translate3d del swiper-wrapper (Chrome/Safari) */
.product-cover-swiper {
  border-radius: 20px;
  overflow: hidden;
  isolation: isolate;
}

.product-short-description ul,
.product-description ul {
  padding-left: revert;
}

.product-short-description li,
.product-description li {
  list-style: initial;
  color: #58595b;
  line-height: 2;
}

.on-sale {
  background-color: #fb3131 !important;
}

/* Categories */

/*Muestrario CTA*/
.cta-info-container {
  max-width: 1200px;
  display: flex;
}

.cta-info {
  width: 60%;
}

.cta-info>ul {
  list-style: initial;
  padding-left: 1rem;
}

.cta-info>ul>li {
  margin: .5rem 0;
}

.cta-info-img {
  width: 40%;
}

.cta-info-img>img {
  width: 100%;
  object-fit: cover;
  aspect-ratio: 4/3;
  border-radius: 1rem;
}

.cta-buttons {
  margin-top: 2rem;
}

/* ERROR 404 */

#pagenotfound #wrapper {

  min-height: 60dvh;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0;
}

#pagenotfound #wrapper>div,
.page-not-found {
  min-width: 80%;
  margin: 0 auto !important;
}

.page-not-found {

  border: 1px solid #eaeaea;
  border-radius: 1rem;

}

.container-404 {
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  max-width: 1200px;
}

.info-404 {
  width: 50%;
}

.image-404 {
  width: 50%;
  aspect-ratio: 4/3;
}

@media (max-width: 799px) {
  .cta-info-container {
    flex-direction: column-reverse;
    align-items: center;
    gap: 1rem;
  }

  .cta-info {
    width: 100%;
  }

  .cta-info-img {
    width: 80%;
  }

  .cta-info>ul {
    padding-left: 2rem;
  }

  .container-404 {
    flex-direction: column-reverse;
  }

  .info-404 {
    width: 100%;
  }

  .image-404 {
    width: 100%;
  }
}

@media (max-width: 400px) {
  .cta-info-img {
    width: 100%;
  }

}

#category #wrapper {
  padding: 0;
  background-color: white;
}

#category #wrapper nav {
  margin: 0 70px 30px;
}

.faqs h3 {
  font-size: 2.2rem;
  color: #e6007e;
  text-align: center;
}

.products {

  max-width: 1600px;
  margin: 0 auto;
}

/* History */
#history tr {
  height: 70px !important;
}

#history .table-labeled .label {
  padding: 10px !important;
  border-radius: 10px !important;
}

.history-invoice {
  padding: 10px 20px;
  background-color: #01B887;
  border-radius: 10px;
}

.history-pdf {
  color: white;
  font-size: 1.7rem;
}

/* Peris */

.inv-img {
  display: flex;
  align-items: center;
}

.ayuda-peri-container {
  display: flex;
  /*align-items: center;*/
}

.ayuda-peri-img-container {
  width: 30%
}

.ayuda-peri-img {
  width: 100%;
  border-radius: .4rem
}

.ayuda-peri-html {
  margin-left: 2rem;
  width: 70%
}

.ayuda-peri-html-100 {
  width: 100%
}

/*Paginas usuario*/

.page-customer-account #content {
  border: 1px solid #e5e5e5;
  border-radius: 1rem;
}

/* paginas del footer */
/* terminos */

.footer-page-panel-1,
.footer-page-panel-2 {
  padding: 2%;
  border: 2px solid #c5c5c5;
  border-radius: 1rem;
  background-color: white;
  margin: 2% auto;
  max-width: 1600px;
  box-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
}

.footer-gov {
  text-align: left;
  width: 90%;
  margin: 1% auto;
}

#content.page-content.page-cms {
  background-color: #f6f6f6 !important;
}

#content.page-content.page-cms h3 {
  margin: 2rem auto;
}

#content.page-content.page-cms li {
  line-height: 2;
}

/* Toques Responsive */
/* Generales */

@media (max-width: 770px) {
  .nbajaxsearch-wrapper {
    margin: 0 auto;
    z-index: 0 !important;

  }

  .breadcrumb {
    margin: 1rem 0;
  }

  .row {
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  .btn-primary {
    display: block;
    margin: 0 auto;
  }

}

@media (max-width: 440px) {

  .products .product {
    width: 50% !important;
    /*flex: 0 0 50% !important;*/
    max-width: 50% !important;
  }
}