

/* GLOBAL HERO */

section.buscador {
   margin:0;
   background-color:var(--pseudo-black);
   position:relative;
   background-repeat: no-repeat;
   background-position: right;
}



section.buscador .hero {
   display:flex;
   align-items:center;
   justify-content:space-between;
   gap:1.5rem;
   padding:15px 0px;
}

@media(max-width:1024px) {
   section.buscador .hero {
      height:auto;
      flex-direction:column;
      gap:1rem;
      padding:25px 0;
   }

   section.buscador .container {
      display:none;
   }
}

section.buscador .search-engine {
   display:flex;
   justify-content:flex-end;
   gap:2rem;
   width:100%;
   margin: 0 auto;
}

@media(max-width:1024px) {
   section.buscador .search-engine {
      border:none;
      padding:0;
   }
}

section.buscador .search-engine .group-select {
   display:flex;
   gap:1rem;
}

section.buscador .search-engine .group-select .item.not-button {
   margin-top:4px;
}
@media(max-width:1024px) {
   section.buscador .search-engine .group-select {
      flex-direction:column;
      width:100%;
   }
}
.input__wrapper__search .input {
   position: relative;
 }

 @media(max-width:1024px) {
   .input__wrapper__search {
      height:40px;
   }
 }
 .input__wrapper__search .input__label {
   position: absolute;
   left: 0;
   top: 0;
   margin: 4px;
   transform: translate(10%, -20%);
   transform-origin: 0 0;
   background-color:var(--white);
   transition: transform 120ms ease-in;
   display:flex;
   align-items:center;
 }

 .input__wrapper__search .input__label svg {
   padding-right:5px;
 }
 .input__wrapper__search .input__field {
   box-sizing: border-box;
   width: 100%;
   border: none;
   border-radius:5px;
   line-height:39px;
 }
 .input__wrapper__search .input__field:not(:-moz-placeholder-shown) + .input__label {
   transform: translate(0.25rem, -120%) scale(0.8);
 }
 .input__wrapper__search .input__field:not(:-ms-input-placeholder) + .input__label {
   transform: translate(0.25rem, -120%) scale(0.8);
 }
 .input__wrapper__search .input__field:focus + .input__label, .input__field:not(:placeholder-shown) + .input__label {
   transform: translate(0.25rem, -120%) scale(0.8);
 }

 .btn-submit .btn-search-engine {
   height:100%;
   font-weight:500;
   font-size:20px;
   background:var(--background-gold);
   color:var(--white);
   border-radius:5px;
   transition: all 0.1s linear;
 }

 .btn-submit .btn-search-engine:disabled{
   background-image: none;
    cursor: not-allowed;
    opacity: .4;
    pointer-events: none;
    color:#666666;
    background-color: #e6e6e6;
    font-weight:400;
 }

 .btn-submit .btn-search-engine:hover {
   transform: scale(1.05);
    transition: all 0.1s linear;
    background: var(--secondary-color);
 }

 @media(max-width:1024px) {
   .btn-submit .btn-search-engine {
      width:100%;
   }
 }


.boton-mas-opciones {
   background-color:var(--white);
   padding:5px 15px;
   cursor:pointer;
   border-radius:5px;
   transition: all 0.2s;
}

@media(max-width:768px) {
   .boton-mas-opciones {
      justify-content:center;
   }
}


.boton-mas-opciones i {
   font-size:18px;
   transition: all 0.2s;
}

.boton-mas-opciones p {
   font-size:20px;
}

.boton-mas-opciones:hover {
   background:var(--background-gold);
   transition: all 0.2s ease-in-out;
}

.boton-mas-opciones:hover i {
   transform:rotate(360deg);
   transition: all 0.2s ease-in-out;
}

.boton-mas-opciones:hover i, .boton-mas-opciones:hover p {
   color:var(--white);
   transition: all 0.2s ease-in-out;
}

.boton-mas-opciones:hover svg {
   fill:var(--white);
   transition: all 0.2s ease-in-out;
}

section.buscador .video-foto {
   text-align:center;
   position:relative;
}

section.buscador .video-foto .video-foto-inner {
   background:var(--background-gold);
   padding:0px 30px;
   box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
}
section.buscador .video-foto p {
   margin:0;
   padding:0;
}

section.buscador .video-foto span {
   font-weight:600;
   cursor:pointer;
   color:var(--secondary-color);
}

section.buscador .video-foto span:hover {
   text-decoration:underline;
}

.button_mobile_favoritos {
   display:none;
}

@media(max-width:1024px) {
   .button_mobile_favoritos {
      display:block;
      text-align:center;
   }
   .button_mobile_favoritos .button__full {
      display:block;
      margin:0;
      padding:10px;
      color:var(--white);
      font-size:18px;
   }

   .button_mobile_favoritos i {
      margin-right:5px;
   }
}


/* BUSCADOR AVANZADO */

.busqueda__avanzada .container {
   padding:0;
   position:relative;
   padding-top:20px;
   overflow:scroll;
   height:60vh;
}

.busqueda__avanzada .container .info__filters {
   box-sizing:border-box;
   position:fixed;
   background:var(--pseudo-black);
   margin-top:-21px;
   width:100%;
   text-align:center;
   z-index:1;
}

.busqueda__avanzada .container .info__filters p {
   margin:0;
   font-size:14px;
   color:var(--white);
   padding:0px 20px;

}

.busqueda__avanzada .hystmodal__window {
   width:50%;
   border-radius:5px;
}

@media(max-width:768px) {
   .busqueda__avanzada .hystmodal__window {
      width:95%;
      margin:0 auto;
   }
}

.busqueda__avanzada .title__wrapper {
   text-align:center;
   padding:10px;
   background:var(--background-gold);
   box-shadow: rgba(0, 0, 0, 0.12) 0px 1px 3px, rgba(0, 0, 0, 0.24) 0px 1px 2px;
}

.busqueda__avanzada .title__wrapper p {
   margin:0;
   font-weight:600;
   font-size:24px;
   color:var(--white);
}

.busqueda__avanzada .options {
   margin-bottom:80px;
   padding:0px 20px;
}

.busqueda__avanzada .options p {
   margin:20px 0px;
}

.busqueda__avanzada .advanced-filters {
   text-align:center;
}

.busqueda__avanzada .title p {
   font-size:24px;
   font-weight:600;

}


.busqueda__avanzada .advanced-filters .item_inner {
   display:flex;
   flex-wrap:wrap;
   justify-content:center;
   gap:1rem;
}

.busqueda__avanzada .advanced-filters .item_inner .item {
   padding:0px 10px;
   border-radius:5px;
   border:1px solid var(--pseudo-black);
   transition:all 0.3s;
   cursor:pointer;
   color:var(--pseudo-black);
   transition: transform 0.1s linear;
}

.busqueda__avanzada .advanced-filters .item_inner .item.activa {
   background:var(--primary-color);
   color:var(--white);
   border:1px solid var(--primary-color);
   transform:scale(1.10);
   transition: transform 0.1s linear;
}

.busqueda__avanzada .advanced-filters .item_inner .item:hover {
   background:var(--primary-color);
   color:var(--white);
   border:1px solid var(--primary-color);
}

.busqueda__avanzada .advanced-filters .item_inner .item p {
   margin:0;


}

.busqueda__avanzada .apply-changes {
   text-align:right;
   background-color:var(--pseudo-black);
   padding:10px 10px 10px 20px;
   position:fixed;
   bottom:0;
   box-sizing:border-box;
   width:100%;
}

.busqueda__avanzada .apply-changes .btn__wrapper {
   display:flex;
   align-items:center;
   justify-content:space-between;
}

.busqueda__avanzada .apply-changes button {
   height: 100%;
    font-weight: 400;
    font-size: 20px;
    background: var(--background-gold);
    color: var(--white);
    border-radius: 5px;
}

.edad-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px; /* separación entre inputs */
  flex-wrap: wrap;
  margin: 15px 0;
}

.edad-wrapper label {
  font-size: 14px;
  font-weight: 500;
  margin-right: 5px;
}

.input-edad {
  width: 70px; /* mismo ancho para que queden equilibrados */
  padding: 8px 10px;
  font-size: 14px;
  text-align: center;
  border: 1px solid #ccc;
  border-radius: 6px; /* redondeado como los botones */
  outline: none;
  transition: border-color 0.2s, box-shadow 0.2s;
}

.altura-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px; /* separación entre inputs */
  flex-wrap: wrap;
  margin: 15px 0;
}

.altura-wrapper label {
  font-size: 14px;
  font-weight: 500;
  margin-right: 5px;
}

.input-altura {
  width: 70px; /* mismo ancho para que queden equilibrados */
  padding: 8px 10px;
  font-size: 14px;
  text-align: center;
  border: 1px solid #ccc;
  border-radius: 6px; /* redondeado como los botones */
  outline: none;
  transition: border-color 0.2s, box-shadow 0.2s;
}

.peso-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px; /* separación entre inputs */
  flex-wrap: wrap;
  margin: 15px 0;
}

.peso-wrapper label {
  font-size: 14px;
  font-weight: 500;
  margin-right: 5px;
}

.input-peso {
  width: 70px; /* mismo ancho para que queden equilibrados */
  padding: 8px 10px;
  font-size: 14px;
  text-align: center;
  border: 1px solid #ccc;
  border-radius: 6px; /* redondeado como los botones */
  outline: none;
  transition: border-color 0.2s, box-shadow 0.2s;
}

.input-edad:focus {
  border-color: #d4af37; /* dorado igual al botón "Aplicar" */
  box-shadow: 0 0 4px rgba(212, 175, 55, 0.4);
}

.filtro-tallapecho{
   padding: 0px 10px;
   border-radius: 5px;
   border: 1px solid var(--pseudo-black);
   transition: all 0.3s;
   cursor: pointer;
   color: var(--pseudo-black);
   transition: transform 0.1s linear;
}

.filtro-tallapecho.opened{
   background: initial;
   color: var(--white);
   border: 1px solid var(--primary-color);
}

.filtro-tallapecho.opened .custom-select-trigger:hover{
   background: initial;
   color: var(--white);
   border: 1px solid var(--primary-color);
}

.custom-select-wrapper .filtro-tallapecho:hover{
   background: var(--primary-color);
   color: var(--white);
   border: 1px solid var(--primary-color);
}

.filtro-tallapecho .custom-select-trigger:hover{
   background: var(--primary-color);
   color: var(--white);
   border: 1px solid var(--primary-color);
}

.filtro-tallapecho .custom-option:hover{
   background: var(--primary-color);
   color: var(--white);
   border: 1px solid var(--primary-color);
}