/* offers-list-by-tag shortcode styles */

/************
* FILTERS
*************/

button {
    font-family: var(--wp--preset--font-family--akko-pro);
}

body .alp-btn {
    background-color: transparent;
    border: 0;
    cursor: pointer;
    outline: none;
}

body .alp-btn:focus-visible {
    outline: 2px solid var(--alperia-turchese-secondary-700, #1D7990);
    outline-offset: 2px;
}

.alp-filter-modal {
    position: fixed;
    inset: 0;
    z-index: 100;
    background-color: rgba(0, 0, 0, 0.35);
}

/* ── Filter bar row ── */
.alp-filter-modal-inner {
   position: fixed;
   left: 0;
   bottom: 0;
   z-index: 14;
   background-color: var(--alperia-white);
   right: 0;
   border-top-left-radius: 32px;
   border-top-right-radius: 32px;
   padding: 20px 16px;
    -webkit-box-shadow: 0px -4px 4px -1px rgba(12, 12, 13, 0.1);
    box-shadow: 0px -4px 4px -1px rgba(12, 12, 13, 0.1);
    transform: translateY(100%);
    transition: all 0.3s ease-in-out ;
}

.alp-filter-modal-inner .alp-filter-modal-title {
    font-size: 22px;
    line-height: 120%;
    font-weight: 500;
    margin: 0 0 40px;
 }

 .alp-filter-modal-inner .alp-content-close {
    text-align: right;
    margin-bottom: 40px;
 }

 .alp-filter-modal-inner .alp-filter-modal-close {
    display: inline-flex;
    align-items: center;
    border: none;
    padding: 4px;
    position: relative;
 }

  .alp-filter-modal-inner .alp-filter-modal-close::before {
    content: '';
    width: 100%;
    height: 1px;
    top: 100%;
    left: 0;
    right: 0;
    background-color: currentColor;
    position: absolute;
  }

.alp-icon-font {
    font-size: 24px;
    line-height: 24px;
}

@media screen and (max-width: 767px) {
    body.alp-filter-modal-open {
        overflow: hidden;
    }
}

@media screen and (min-width: 767px) {
    .alp-filter-modal {
        display: none;
    }
}

/******************
* COLLAPSE FILTERS
*******************/
.alp-filter-group .alp-filter-group-btn {
    outline: none;
    font-weight: 300;
    font-size: 16px;
    line-height: 130%;
    color: var(--alperia-gray);
    padding: 8px 0;
    display: inline-flex;
    align-self: center;
}

.alp-filter-group .alp-filter-group-btn:focus-visible {
    outline: 2px solid var(--alperia-turchese-secondary-700, #1D7990);
    outline-offset: 2px;
}

.alp-filter-group .alp-filter-group-btn .alp-label-filter {
    position: relative;
    display: inline-flex;
    flex-direction: column;
    justify-content: space-between;
    align-items: center;
}

.alp-filter-group .alp-filter-group-btn .alp-label-filter::after {
    content: attr(data-text);
    content: attr(data-text) / "";
    font-weight: 500;
    visibility: hidden;
    overflow: hidden;
    user-select: none;
    pointer-events: none;
    height: 0;
}

@media speech {
    .alp-filter-group .alp-filter-group-btn .alp-label-filter::after {
        display: none;
    }
}

.alp-filter-group .alp-filter-group-btn.has-selection .alp-label-filter {
    font-weight: 500;
}

.alp-filter-group .alp-filter-group-btn:hover,
.alp-filter-group .alp-filter-group-btn:focus,
.alp-filter-group .alp-filter-group-btn:focus-visible,
.alp-filter-group .alp-filter-group-btn.has-selection .alp-label-filter {
   color: var(--alperia-turchese-secondary-700);
}

.alp-filter-group .alp-filter-group-btn.is-open {
    color: var(--alperia-turchese-secondary-700);
    /* font-weight: 500; */
 }

.alp-filter-group .alp-filter-group-btn .alp-icon-filter,
.alp-filter-group .alp-filter-group-btn,
.alp-filter-group,
.alp-filter-option-label::before { 
    transition: all 0.3s ease-in-out;
}

.alp-filter-group .alp-filter-group-btn:not(.is-open) .alp-icon-filter {
    transform: rotate(180deg);
}

.alp-filter-group .alp-filter-group-btn .alp-icon-filter {
   margin-left: 8px;
   color: var(--alperia-turchese-secondary-700);
}

.alp-filter-options {
    padding-left: 0;
    list-style-type: none;
    margin-top: 8px;
    background-color: var(--alperia-gray-0);
    padding: 4px 16px;
    display: flex;
    gap: 8px;
    border-radius: 8px;
}

 .alp-filter-options .alp-filter-item {
    padding: 12px 90px 12px 12px;
    display: flex;
}

.alp-filter-cb-styled {
    appearance: none;
    opacity: 0;
    margin: 0;
}

.alp-filter-option-label {
    position: relative;
    font-size: 14px;
    line-height: 130%;
    padding-left: 34px;
    cursor: pointer;
    display: inline-block;
}

.alp-filter-option-label::before {
    content: '';
    width: 16px;
    height: 16px;
    border: 1px solid var(--alperia-turchese-secondary-700);
    left: 0;
    border-radius: 4px;
}

.alp-filter-option-label::after,
.alp-filter-option-label::before {
    position: absolute;
}

.alp-filter-option-label::after {
    font-family: 'alp-icons';
    font-size: 24px;
    line-height: 24px;
    color: var(--alperia-white);
    top: 50%;
    transform: translateY(-50%);
    left: -3px;
}

 .alp-filter-cb-styled:checked + .alp-filter-option-label::before {
    background-color: var(--alperia-turchese-secondary-700);
}

 .alp-filter-cb-styled:checked+.alp-filter-option-label::after {
    content: "\e901";
}

.alp-filter-modal-inner .alp-filter-modal-body .alp-filter-group {
    margin-bottom: 16px;
}

.alp-filter-modal-inner .alp-filter-modal-body .alp-filter-group:last-child {
    margin-bottom: 20px;
}

.alp-filter-modal-inner.alp-show-modal {
    transform: translateY(0);
}

.alp-filter-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

@media screen and (max-width: 767px) {
    .alp-filter-bar.alp-is-dual {
        justify-content: flex-end;
    }
}

.alp-filter-bar .alp-filter-mobile-open {
    font-size: 14px;
    line-height: 130%;
    font-weight: 300;
    color: var(--alperia-turchese-secondary-700);
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 10px;
    margin: -10px;
}

@media screen and (max-width: 767px) { 
    .alp-filter-cancel-wrapper {
        display: none;
    } 
}

.alp-filter-group-panel {
    overflow: hidden;
    height: 0;
    transition: height 0.3s ease-in-out;
}

.alp-filter-bar .alp-filter-trentino-item {
    padding: 12px 8px;

}

/**************************
* COLLAPSE FILTERS DESKTOP
***************************/
 /* Hide elemant add js area-hidden="true" */
@media screen and (max-width: 767px) {
.alp-desktop .alp-filter-group {
        display: none;
    }
}

@media screen and (min-width: 767px) {
    /* Hide elemant add js area-hidden="true" */
    .alp-filter-bar .alp-filter-mobile-open,
    .hidden-modal {
        display: none;
    }

    .alp-filter-groups {
        padding: 2px 0 6px 0;
        border-bottom: 1px solid var(--alperia-gray-100);
        align-items: center;
        display: flex;
        width: 100%;
    }

   .alp-filter-groups .alp-content-filter-groups {
        flex: 1;
        display: flex;
        gap: 8px;
    }

    .alp-filter-groups .alp-content-filter-groups .alp-filter-group-btn {
     padding: 8px 16px 8px 0;
    }

    .alp-filter-cancel-wrapper {
        margin-top: 16px;
        display: none;
    }

    .alp-filter-cancel-wrapper.is-visible {
        display: block;
    }

   .alp-filter-cancel-wrapper .alp-filter-cancel-all {
    padding: 0;
    text-decoration: underline;
    text-underline-offset: 4px;
   }
}

/************
* TABS LIST
*************/
.alp-template-offers-list .alp-wrapper-category .alp-list-content-category,
.alp-docs-tabs-outer .alp-docs-tabs {
    list-style-type: none;
    display: flex;
    align-items: center;
    margin-bottom: 20px;
    padding-left: 0;
    flex-wrap: wrap;
    margin-left: -12px; /* Padding button tab */
    margin-right: -8px; /* Padding button tab */
}

.alp-template-offers-list .alp-list-content-category .alp-category-item,
.alp-docs-tabs-outer .alp-docs-tabs .alp-category-item {
    flex: 1;
    box-sizing: border-box;
    display: flex;
}

@media screen and (min-width: 767px) {
    .alp-template-offers-list .alp-wrapper-category .alp-list-content-category {
        justify-content: center;
        margin-left: 0;
        margin-right: 0;
    }

    .alp-template-offers-list .alp-list-content-category .alp-category-item,
    .alp-docs-tabs-outer .alp-docs-tabs .alp-category-item {
        flex: none;
        min-width: 174px;
    }
}

.alp-template-offers-list .alp-category-item .alp-category-link,
.alp-docs-tabs-outer .alp-docs-tabs .alp-category-item .alp-doc-tab {
    padding: 12px 8px 20px 12px;
    text-decoration: none;
    font-size: 16px;
    line-height: 130%;
    font-weight: 500;
    color: var(--alperia-turchese-secondary-700);
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    position: relative;
    border: 1px solid transparent;
    border-radius: 8px;
    outline: none;
    width: 100%;
    margin-left: -1px;
    margin-right: -1px;
    transition: all 0.3s ease-in-out;
}

@media screen and (min-width: 767px) {
    .alp-template-offers-list .alp-category-item .alp-category-link,
    .alp-docs-tabs-outer .alp-docs-tabs .alp-category-item .alp-doc-tab {
        padding: 14px 20px 14px 12px;
    }
}

.alp-template-offers-list .alp-category-item .alp-category-link::before,
.alp-docs-tabs-outer .alp-docs-tabs .alp-category-item .alp-doc-tab::before {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    height: 0.5px;
    background-color: var(--alperia-gray-100);
    width: 100%;
    transition: all 0.3s ease-in-out;
}

.alp-template-offers-list .alp-category-item .alp-category-link:hover:not(:focus-visible)::before,
.alp-template-offers-list .alp-category-item .alp-category-link.active:not(:focus-visible)::before,
.alp-docs-tabs-outer .alp-docs-tabs .alp-category-item .alp-doc-tab:hover:not(:focus-visible)::before,
.alp-docs-tabs-outer .alp-docs-tabs .alp-category-item .alp-doc-tab.is-active:not(:focus-visible)::before {
    background-color: var(--alperia-turchese-secondary-700);
    height: 4px;
}

.alp-template-offers-list .alp-category-item .alp-category-link:hover,
.alp-docs-tabs-outer .alp-docs-tabs .alp-category-item .alp-doc-tab:not(:disabled):hover,
.alp-docs-tabs-outer .alp-docs-tabs .alp-category-item .alp-doc-tab:not(:focus, :focus-visible):hover {
    color: var(--alperia-turchese-secondary-800);
}

.alp-template-offers-list .alp-category-item .alp-category-link:focus-visible,
.alp-docs-tabs-outer .alp-docs-tabs .alp-category-item .alp-doc-tab:focus-visible,
.alp-docs-tabs-outer .alp-docs-tabs .alp-category-item .alp-doc-tab:focus {
    border-color: var(--alperia-turchese-secondary-700);
    -webkit-box-shadow: 0px 0px 0px 4px var(--alperia-focus);
    box-shadow: 0px 0px 0px 4px var(--alperia-focus);
}

.alp-template-offers-list .alp-category-item .alp-category-link:focus-visible::before,
.alp-docs-tabs-outer .alp-docs-tabs .alp-category-item .alp-doc-tab:focus-visible::before,
.alp-docs-tabs-outer .alp-docs-tabs .alp-category-item .alp-doc-tab:focus::before {
    z-index: -1;
}

.alp-template-offers-list .alp-category-item .alp-category-link .alp-icon-category {
    font-size: 24px;
    line-height: 24px;
}

.alp-template-offers-list .alp-filter-modal-footer {
    padding-top: 4px;
    display: flex;
    flex-direction: column;
    gap: 20px;
}

 .alp-filter-modal-footer .alp-filter-modal-apply,
 .alp-filter-modal-footer .alp-filter-modal-cancel {
    cursor: pointer;
    width: 100%;
}

.alp-template-offers-list .alp-filter-modal-footer .alp-filter-modal-cancel {
    background-color: transparent;
    border: none;
    text-decoration: underline;
}

/************
* CARDS LIST
*************/
.alp-offers-list {
    margin-top: 40px;
    transition: opacity 0.15s ease;
}

/* Full-replace transition (fetchOffers): fade out old content before DOM swap */
.alp-offers-list.alp-offers-replacing {
    opacity: 0;
    pointer-events: none;
}

.alp-template-offers-list .alp-offers-list .offers-list .alp-card-offer:not(:last-child) {
    margin-bottom: 20px;
}

@media screen and (min-width: 767px) {
    .alp-template-offers-list .alp-offers-list .offers-list .alp-card-offer:not(:last-child) {
        margin-bottom: 0;
    }

    .alp-template-offers-list .alp-offers-list .offers-list {
        display: flex;
        flex-wrap: wrap;
        gap: 20px;
    }

    .alp-template-offers-list .alp-offers-list .offers-list .alp-card-offer {
        flex: 0 0 auto;
        width: calc(50% - 20px);
    }
}

@media screen and (max-width: 1200px) {
    .alp-template-offers-list .alp-offers-list .offers-list .alp-card-offer .alp-card-button-actions {
        flex-direction: column;
    }

    .alp-template-offers-list .alp-offers-list .offers-list .alp-card-offer .alp-card-button-actions .alp-btn-link {
        width: 100%;
    }
}

@media screen and (min-width: 1024px) {
    .alp-template-offers-list .alp-offers-list .offers-list .alp-card-offer {
        width: calc(33.33333333% - 20px);
    }
}

/************
* LOAD MORE
*************/
.alp-load-more-wrapper {
    text-align: center;
    margin-top: 40px;
}

.alp-load-more-btn {
    text-decoration: underline;
    text-underline-offset: 4px;
}

/************
* LOADING SPINNER (load-more / infinite scroll)
*************/
.alp-offers-spinner {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 24px 0;
}

.alp-offers-spinner[hidden] {
    display: none;
}

.alp-offers-spinner .alp-spinner-icon {
    width: 28px;
    height: 28px;
    border: 3px solid rgba(0, 84, 122, 0.15);
    border-top-color: var(--apleria-blu-900, #00547A);
    border-radius: 50%;
    animation: alp-spinner-spin 0.7s linear infinite;
}

@keyframes alp-spinner-spin {
    to {
        transform: rotate(360deg);
    }
}

/************
* VIEW ALL CTA
*************/
.alp-view-all-wrapper {
    text-align: center;
    margin-top: 24px;
}

/* Desktop: sentinel element injected by JS; never visible */
.alp-scroll-sentinel {
    height: 0;
    visibility: hidden;
    pointer-events: none;
}

/* Fade-in for infinite scroll items */
@keyframes alp-offer-fadein {
    from { opacity: 0; transform: translateY(12px); }
    to   { opacity: 1; transform: translateY(0); }
}

.alp-offer-appear {
    /* animation: alp-offer-fadein 0.3s ease both; */
}

/**************
* EMPTY STATE
***************/
.alp-offers-empty {
    text-align: center;
    padding: 24px;
    background-color: var(--alperia-gray-50);
    border: 1px solid var(--alperia-gray-100);
    border-radius: 8px;
    height: 222px;
    margin-top: 40px;
}

@media screen and (min-width: 767px) { 
    .alp-offers-empty {
        height: 444px;
    }
}

.alp-offers-empty .alp-title-empty,
.alp-offers-empty .alp-description-empty {
    color: var(--alperia-gray);
    font-size: 16px;
    line-height: 140%;
}

.alp-offers-empty .alp-title-empty {
    margin: 0;
    font-weight: 500;
}

.alp-offers-empty .alp-description-empty {
    font-weight: 300;
    margin: 8px 0 0;
}

/* .sr-only — visually hidden utility (WCAG). Da aggiungere via DS.
.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
} */

@media (prefers-reduced-motion: reduce) {
    .alp-filter-modal-inner,
    .alp-filter-group .alp-filter-group-btn .alp-icon-filter,
    .alp-filter-group,
    .alp-filter-option-label::before,
    .alp-filter-group-panel,
    .alp-template-offers-list .alp-category-item .alp-category-link,
    .alp-template-offers-list .alp-category-item .alp-category-link::before,
    .alp-offers-list {
        transition: none;
    }

    .alp-offers-spinner .alp-spinner-icon {
        animation: none;
    }
}

