/* Contenedor principal */

.no-scroll {
    overflow: hidden !important;
}
.module-filter{
    display: flex;
    justify-content: space-between;
    margin-bottom: 13px;
}
.fp-col1{
    flex: 1 1 auto;
    position: relative;
}
.fp-tag-filters{
    display: flex;
    gap: 10px;
    align-items: flex-start;
}
.fp-filter-boton{
    display: flex;
    gap: 10px;
    max-width: 440px;
    background-color: #F2F2F2;
    border-radius: 30px;
    position: relative;
    width: fit-content;
 
}
.tags-filters {   display: flex;
    gap: 10px;
       flex-wrap: wrap; 
}
.tags-filters h4{
    font-weight: 400;
    text-transform: uppercase;
    padding: 10px 20px 8px;
    margin-bottom: 0;
    font-size: 16px;
    display: flex;
    justify-content: space-between;
    cursor: pointer;
    align-items: center; 
    border-radius: 30px;
     background-color: #DFDFDF; 
       gap: 10px;
}
.module-filter.open .fp-filter-boton{
     width: 100%;
    flex-direction: column;
      z-index: 1001;
}
.module-filter i{
    padding: 10px;
    margin: -15px;
    display: flex;
}
.fp-filter-boton i svg{
    transform: rotate(45deg);
} 
.module-filter.open .fp-filter-boton i svg{
    transform: rotate(0deg);
}
 .fp-filters{
    display: none;
    flex-direction: column;
    gap: 10px;
    width: calc(100% - 30px);
    max-width: 440px;
    position: absolute;
    z-index: 1000;
    top: 46px;
}
.module-filter.open  .fp-filters{
    display: flex;
}
.fp-filters:after{
    content:"";
    display: block;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    backdrop-filter: blur(8px);
    -webkit-backdrop-filter: blur(8px);
    z-index: -1;
}
.fp-filters li.oculto{
    display: none;
}
.fp-filter-block{
    background-color: #DFDFDF;
    border-radius: 10px;
    position: relative;
}
.fp-filter-boton h4,
.fp-filter-block h4{
    font-weight: 400;
    text-transform: uppercase;
    padding: 10px 20px 8px;
    margin-bottom: 0;
    font-size: 16px;
    display: flex;
    justify-content: space-between; 
       cursor: pointer;
       align-items: center;
}
.fp-filter-boton h4{
    gap: 10px;
}
.fp-filter-block h4 i{
transform: rotate(180deg);
    padding: 10px;
    margin: -10px;
}
.fp-filter-block ul{
    display: flex;
    flex-direction: column;
    gap: 5px;
    padding: 0px 20px;
    margin-bottom: 15px;

}
.fp-filter-block.cerrado{
    border-radius: 50px;
}
.fp-filter-block.cerrado ul{
    display: none;
}
.fp-filter-block.cerrado i{
    transform: rotate(0deg);
}
.fp-filter-block  a{
    display: flex;
    align-items: center;
    gap: 5px;
    font-weight: 400;
    font-size: 16px;
    text-transform: uppercase;
}
.fp-filter-block  a span{
    background-color: #ffffffdb;
    padding: 5px 10px;
    border-radius: 20px;
    display: inline-block;
}
.fp-filter-block .seleccion:after {
    content:url("data:image/svg+xml;base64,PHN2ZyB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHdpZHRoPSIxOSIgaGVpZ2h0PSIxOSIgdmlld0JveD0iMCAwIDE5IDE5IiBmaWxsPSJub25lIj4KPGxpbmUgeDE9IjQuNzczMDEiIHkxPSI0LjQxOTM4IiB4Mj0iMTMuOTY1NCIgeTI9IjEzLjYxMTgiIHN0cm9rZT0iYmxhY2siIHN0cm9rZS13aWR0aD0iMS41Ii8+CjxsaW5lIHgxPSI0LjQxOTM4IiB5MT0iMTMuNjExOCIgeDI9IjEzLjYxMTgiIHkyPSI0LjQxOTM4IiBzdHJva2U9ImJsYWNrIiBzdHJva2Utd2lkdGg9IjEuNSIvPgo8L3N2Zz4=");
}



.fp-orden-wrapper {
    position: absolute;
     right: 15px;
     max-width: calc(100% - 162px);
}

.fp-orden-selected {
    background: #F2F2F2;
    padding: 8px 14px;
    border-radius: 20px;
    cursor: pointer;
    display: flex;
    font-weight: 400;
    gap: 10px;
    text-wrap-mode: nowrap;
    text-wrap: nowrap;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    position: relative;
    padding-right: 30px;
}
.fp-orden-selected span{
    position: absolute;
    right: 10px;
}

.fp-orden-list {
    display: none;
    margin-top: 6px;
    padding: 0;
    list-style: none;
    position: absolute;
    text-align: right;
    right: 0;
    z-index: 99;
}

.fp-orden-list li {
    background: rgba(223, 223, 223, 0.92);
    margin-bottom: 5px;
    padding: 7px 14px;
    border-radius: 20px;
    cursor: pointer;
    white-space: nowrap;
    float: right;
}

.fp-orden-list li:hover {
    background: #d7d7d7;

}

/* Abierto */
.fp-orden-wrapper.open .fp-orden-list {
    display: block;
}

.fp-filter-block ul{

    overflow-y: auto;
    scrollbar-width: none;
    position: relative;
}
.fp-filter-block.is-overflow:not(.cerrado):after, 
.fp-filter-block.is-overflow:not(.cerrado):before{
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    background: linear-gradient(180deg, rgba(223, 223, 223, 0) 0%, rgba(223, 223, 223, 1) 80%);
    height: 30px;
    bottom: 11px;
    display: block;
    clear: inherit;
    pointer-events: none;
  }  
   .fp-filter-block.is-overflow:not(.cerrado):before{
    z-index: 1;
    background: linear-gradient(0deg, rgba(223, 223, 223, 0) 0%, rgba(223, 223, 223, 1) 80%);
    height: 30px;
    bottom: inherit;
    top:32px
  }  
@media (max-width: 1024px) {
    .fp-tag-filters {
        flex-direction: column;
    }
}
@media (max-width: 769px) {
    .module-filter.open .fp-orden-wrapper{
            display: none;
        }
    .fp-filters{
        width: 100%;
    }
    
}
.fp-no-results{
    text-align: center;
    padding: 20px;
    font-size: 140%;
    color: #000;
}
.faceted-overlay {
    position: fixed;
    inset: 0;
    background: rgba(255,255,255,.6);
    z-index: 9999;
    display: none;
}

.faceted-overlay.active {
    display: block;
}
.overlay__inner{
    justify-content: center;
    display: flex;
    align-items: center;
    height: 100%;
}

.spinner {
    display: block;
    width: 80px;
    height: 80px;
    border: 6px solid #c60c00;
    border-top-color:  #000;
    border-radius: 50%;
    animation: spin .8s linear infinite;
}

@keyframes spin {
    to { transform: rotate(360deg); }
}
