@font-face {
    font-family: Outfit;
    src: url("../fonts/Outfit-Regular-gN1U0kN.ttf") format("truetype");
}

@font-face {
    font-family: Outfit-Bold;
    src: url("../fonts/Outfit-Bold-VuCwDP0.ttf") format("truetype");
}
@font-face {
    font-family: Outfit-Medium;
    src: url("../fonts/Outfit-Medium-1kU1yXv.ttf") format("truetype");
}
@font-face {
    font-family: Outfit-SemiBold;
    src: url("../fonts/Outfit-SemiBold-Wmdxcj_.ttf") format("truetype");
}
@font-face {
    font-family: Outfit-Light;
    src: url("../fonts/Outfit-Light-1o2Xalu.ttf") format("truetype");
}
@font-face {
    font-family: Outfit-ExtraLight;
    src: url("../fonts/Outfit-ExtraLight-gmwg8iw.ttf") format("truetype");
}
@font-face {
    font-family: Outfit-Black;
    src: url("../fonts/Outfit-Black-5E-6DqZ.ttf") format("truetype");
}
@font-face {
    font-family: Outfit-ExtraBold;
    src: url("../fonts/Outfit-ExtraBold-wxS1czR.ttf") format("truetype");
}

:root {
    --primary-original: #098988;
    --primary-light-70: #AEE1D8;
    --primary-light-90: #D7F0EC;
    --primary-light-90-alpha: #D7F0EC80;
    --primary-dark-40: #015960;
    --primary-dark-70: #0B1E1E;

    --neutral-original: #BDBDBD;
    --neutral-light-70: #EFEFEF;
    --neutral-light-90: #F9F9F9;
    --neutral-white: #FFFFFF;
    --neutral-black: #3D3D3D;
    --neutral-dark-40: #7C7C7C;
    --neutral-dark-70: #525252;

    --secondary-original: #0095B7;
    --secondary-light-70: #90E1ED;
    --secondary-light-90: #DCFCFF;
    --secondary-dark-40: #087896;
    --secondary-dark-70: #10617A;

    --accent-original: #EA8B3E;
    --accent-dark-40: #E77628;
    --accent-dark-70: #D85E1E;
    --accent-light-90: #FCEDD8;

    --color-black: #000000;

    --success-100: #2FCF79;
    --success-10: #E8F1E8;

    /*--alert-100: #F47775;*/
    /*--alert-10: #F7E9E9;*/
    --alert-100: var(--accent-dark-70);
    --alert-10: var(--accent-light-90);

    --warning-100: #FFAF66;
    --warning-10: #FCF2EC;

    /*--secondary-color: #50e3c2;*/
    /*--background-color: #f5f7fa;*/
    /*--text-color: #333333;*/
    --font-family: 'Outfit', sans-serif;

    --font-small: 0.9rem;
    --spacing-1: 4px;
    --spacing-2: 8px;
    --spacing-3: 12px;
    --spacing-4: 16px;
    --spacing-5: 24px;
    --spacing-6: 32px;
    --spacing-7: 48px;
    --spacing-8: 64px;
    --spacing-9: 80px;
    --spacing-10: 96px;
    --spacing-11: 128px;
    --spacing-12: 150px;
    --spacing-13: 200px;
    --spacing-14: 300px;
    --spacing-15: 400px;
    --radius-1: 5px;
    --radius-2: 10px;
    --radius-3: 15px;
    --radius-4: 20px;
    --radius-5: 25px;
    --radius-6: 35px;
    --radius-7: 50px;
    --radius-8: 75px;
    --radius-9: 100px;
    --box-shadow-default: 0 5px 10px 0 #00000040;
    --box-shadow-1: 0px 0px 30px 0px #1A436C26;
    --transition-buttons: 0.15s;

    --font-11px: 0.6875rem;
    --font-12px: 0.75rem;
    --font-14px: 0.875rem;
    --font-16px: 1rem;
    --font-18px: 1.125rem;
    --font-20px: 1.25rem;
    --font-22px: 1.375rem;
    --font-23px: 1.4375rem;
    --font-24px: 1.5rem;
    --font-27px: 1.6875rem;
    --font-30px: 1.875rem;
    --font-32px: 2rem;
    --font-38px: 2.375rem;
    --font-54px: 3.375rem;
    --font-68px: 4.25rem;
    --font-100px: 6.25rem;

}

/*------------------------------------*\
  ------------- #RESET -------------
\*------------------------------------*/

* {
    box-sizing: border-box;
    margin:  0;
    padding: 0;
}

body {
    font-family: Outfit, sans-serif;
    background-color: var(--color-white);
    color: var(--primary-original);
    padding-top: 96px;
    min-width: 300px;
}

body.no-scroll {
    overflow: hidden;
}

.body--homepage {
    padding-top: unset;
}

.body--secondary-light-90 {
    background-color: var(--secondary-light-90);
}

h1, h2, h3, h4, h5 {
    font-family: Outfit-ExtraBold, sans-serif;
    color: var(--primary-dark-40);
    font-weight: normal;
}

h6 {
    font-family: Outfit-Medium, sans-serif;
    color: var(--primary-dark-40);
    font-weight: normal;
}

h1 {
    font-size: var(--font-100px);
}
h2 {
    font-size: var(--font-68px);
}
h3 {
    font-size: var(--font-54px);
}
h4 {
    font-size: var(--font-38px);
}
h5 {
    font-size: var(--font-27px);
}
h6 {
    font-size: var(--font-23px);
}

p {
    line-height: 1.6rem;
}

.subtitle1 {
    font-family: Outfit-Bold, sans-serif;
    font-weight: normal;
    font-size: var(--font-18px);
}
.subtitle1--primary-dark {
    color: var(--primary-dark-40);
}
.subtitle2 {
    font-family: Outfit-Bold, sans-serif;
    font-weight: normal;
    font-size: var(--font-16px);
}
.caption {
    font-family: Outfit, sans-serif;
    font-weight: normal;
    font-size: var(--font-14px);
}
.footnote {
    font-family: Outfit-Light, sans-serif;
    font-weight: normal;
    font-size: var(--font-11px);
}

b {
    font-family: Outfit-Bold, sans-serif;
    font-weight: normal;
}

strong {
    font-family: Outfit-Bold, sans-serif;
    font-weight: normal;
}

a {
    text-decoration: none;
    color: var(--color-white);
}

textarea {
    resize: none;
}

.hidden {
    display: none !important;
}

.only-mobile {
    display: none !important;
}

.nowrap {
    white-space: nowrap;
}

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

/** NUMBER INPUT ***************************************************************************/
.input-number {
    display: flex;
    align-items: center;
    gap: 12px;
    font-family: sans-serif;
    color: #098988;
}

.input-number__label {
    color: #098988;
}

.input-number__wrapper {
    display: flex;
    align-items: center;
    background: var(--neutral-white);
    border: 1px solid var(--primary-original);
    border-radius: 16px;
    padding: 13px 16px;
    width: fit-content;
    height: 48px;
}

.input-number__field {
    width: 34px;
    height: 20px;
    border: none;
    background: none;
    font-size: 16px;
    text-align: center;
    outline: none;
    color: var(--primary-original);
}

.input-number__controls {
    display: flex;
    flex-direction: column;
    margin-left: 6px;
}

.input-number__btn {
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    line-height: 1;
    height: 12px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.input-number__btn:hover svg path {
    stroke: #0BB0AA;
}

/** CUSTOM DROPDOWN ****************************************************************************/
.custom-dropdown {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
    padding: 16px;
}
.custom-dropdown--info {
    background-color: var(--neutral-light-90);
    border-radius: 16px;
}
.custom-dropdown__header {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
    border-radius: 16px;
    font-size: var(--font-16px);
    line-height: 1.6rem;
    letter-spacing: 0.0025rem;
    color: var(--primary-dark-40);
}
.custom-dropdown__header::before {
    content: '';
    position: absolute;
    right: 16px;
    top: 50%;
    transform: translateY(-50%) rotate(0deg);
    width: 24px;
    height: 24px;
    background-image: url("../images/icons/CaretDown-ECUTGVL.svg");
    background-repeat: no-repeat;
    background-size: contain;
    pointer-events: none;
    transition: transform 0.3s ease;
}
.custom-dropdown.active .custom-dropdown__header::before {
    transform: translateY(-50%) rotate(180deg);
}
.custom-dropdown__body {
    display: none;
    /*min-width: 160px;*/
    /*box-shadow: var(--box-shadow-1);*/
    /*border-radius: 16px;*/
    /*z-index: 1;*/
    /*right: 0;*/
    /*margin-top: 4px;*/
}
.custom-dropdown.active .custom-dropdown__body {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.custom-dropdown__item {
    color: var(--primary-dark-40);
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    font-size: var(--font-16px);
    line-height: 1.6rem;
    letter-spacing: 0.0025rem;
}

.search__calendar {
    /*width: fit-content !important;*/
}

/* Placeholder color for the input fields */
::placeholder,
.search__calendar::placeholder,
.custom-select .ts-control input::placeholder,
.search__autocomplete .ts-control input::placeholder,
.search__destination .ts-control input::placeholder
{
    color: var(--primary-original)
}

.custom-select.custom-select--placeholder-orange .ts-control input::placeholder {
    color: var(--accent-original);
}

.custom-select--fit-content {
    width: fit-content !important;
    min-width: 140px;
}

.accent {
    color: var(--accent-original);
}

/** RENTAL TYPE SELECTOR ***************************************************************************/
.rental-type-selector {
    display: flex;
    flex-direction: column;
    gap: 24px;
    background: var(--secondary-light-90);
    border-radius: 1rem;
}

.rental-type-selector__title {
    font-size: var(--font-16px);
    margin-bottom: 0.25rem;
    color: var(--primary-dark-40);
}

.rental-type-selector__subtitle {
    font-size: var(--font-14px);
    margin-bottom: 1rem;
    color: var(--primary-dark-40);
}

.rental-type-selector__options {
    display: flex;
    gap: 24px;
}

.rental-type-selector__input {
    display: none;
}

.rental-type-selector__label {
    flex: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    padding: 8px 12px;
    border: 1px solid var(--primary-dark-40);
    border-radius: 32px;
    cursor: pointer;
    transition: all 0.2s ease-in-out;
    height: 36px;
    /*min-width: 200px;*/
    letter-spacing: 0.004rem;
    line-height: 100%;
    color: var(--primary-dark-40);
}

.rental-type-selector__label:hover {
    /*background-color: #ccf2f4;*/
}

.rental-type-selector__input:checked + .rental-type-selector__label {
    background-color: var(--neutral-white);
    color: var(--primary-dark-40);
    border-color: var(--primary-dark-40);
}

.rental-type-selector__icon {
    width: 24px;
    height: 24px;
    font-size: 1.25rem;
}

/** FILTER RANGE SLIDER ***************************************************************************/
.filter-range {
    /*background-color: #e0f9fc;*/
    background-color: var(--secondary-light-90);
    padding: 0 10px;
    border-radius: 8px;
    /*max-width: 350px;*/
    width: 100%;
    color: var(--primary-dark-40);
}

.range-values {
    margin-top: 5px;
    font-weight: normal;
    font-family: Outfit-Bold, sans-serif;
    text-align: right;
    font-size: var(--font-16px);
    letter-spacing: 0.001rem;
    line-height: 1.6rem;
}

.filter-range .noUi-horizontal .noUi-handle {
    height: 20px;
    width: 20px;
    top: -5px;
    right: -10px; /* half the width */
    border-radius: 16px;
    border: 3px solid var(--primary-original);
}
.filter-range .noUi-target {
    box-shadow: none;
    border: none;
}
.filter-range .noUi-handle::before,
.filter-range .noUi-handle::after
{
    display: none;
}
.filter-range .noUi-horizontal {
    margin-top: 10px;
    height: 10px;
}
.filter-range__label {
    font-weight: normal;
    font-size: var(--font-14px);
    letter-spacing: 0.004rem;
    line-height: 1.6rem;
}

/** ADVANCED FILTERS ***************************************************************************/
.advanced-filters {
    background-color: var(--secondary-light-90);
    padding: 24px;
    /*border-radius: 16px;*/
    display: flex;
    flex-direction: column;
    gap: 24px;
}
.advanced-filters__sections {
    display: flex;
    flex-direction: column;
    gap: 32px;
}
.advanced-filters__section {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.advanced-filters__filter {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 24px;
}
.advanced-filters__content {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.advanced-filters__row {
    width: 100%;
    display:  flex;
    gap: 24px;
}
.advanced-filters__title {
    font-size: var(--font-16px);
    color: var(--primary-dark-40);
}
.advanced-filters__subtitle {
    font-size: var(--font-14px);
    color: var(--primary-dark-40);
}
.advanced-filters__control {
    position: relative;
    width: 100%;
}
.advanced-filters__label {
    position: absolute;
    top: -6px;
    left: 16px;
    font-size: var(--font-14px);
    color: var(--primary-dark-40);
    background-color: transparent;
    z-index: 2;
    text-overflow: ellipsis;
    max-width: 90%;
    padding: 0 4px;
    overflow: hidden;
    white-space: nowrap;
    line-height: 100%;
    letter-spacing: 0.004rem;
    font-weight: normal;
}
.advanced-filters__buttons {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    margin-top: 16px;
}
.filter-checkboxes__list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    /*grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));*/
}
.filter-checkboxes__item {
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    gap: 8px;
    font-size: var(--font-14px);
    color: var(--neutral-black);
    white-space: nowrap;
}
.filter-checkboxes__label {
    cursor: pointer;
    color: var(--neutral-black);
    word-break: break-word;
    line-height: 1.6rem;
    letter-spacing: 0.004rem;
}
.custom-checkbox label.filter-checkboxes__label {
    padding-left: 28px;
    min-height: 24px;
    font-size: var(--font-14px);
}
.custom-checkbox label.filter-checkboxes__label::before {
    width: 20px;
    height: 20px;
    top: 2px;
}

label.filter-checkboxes__label {
    font-size: var(--font-14px);
}




/** ADVANCED FILTERS SELECT (TOM SELECT) ***************************************************************************/
.advanced-filters__select {
    width: 100%;
    min-width: 240px;
    height: 48px;
    padding: 0 8px;
    border-radius: 16px;
    background-color: var(--neutral-white);
    font-family: Outfit, sans-serif;
    font-size: var(--font-16px);
    color: var(--primary-original);
    border: solid 1px var(--primary-light-70);
    letter-spacing: 0.0025rem;
}
.advanced-filters__select .ts-control {
    position: relative;
    border-radius: 16px;
    /*padding: 0 12px;*/
    font-size: var(--font-16px);
    line-height: 1.6rem;
    height: 48px;
    border: none;
    background-color: transparent !important;
    flex-direction: column;
    justify-content: center;
}
.advanced-filters__select .ts-control::before {
    content: '';
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%) rotate(0deg);
    width: 24px;
    height: 24px;
    background-image: url("../images/icons/CaretDown-ECUTGVL.svg");
    background-repeat: no-repeat;
    background-size: contain;
    pointer-events: none;
    transition: transform 0.3s ease;
}
.advanced-filters__select.input-active .ts-control::before,
.custom-select.dropdown-active .ts-control::before {
    transform: translateY(-50%) rotate(180deg);
}
.advanced-filters__select .ts-dropdown {
    /*margin: 0;*/
    font-size: var(--font-16px);
    line-height: 1.6rem;
    border-radius: 16px;
}
.advanced-filters__select .ts-dropdown,
.advanced-filters__select .ts-control,
.advanced-filters__select .ts-control input {
    color: var(--primary-dark-40);
    font-family: inherit;
    font-size: var(--font-16px);
    line-height: normal;
    /*padding-right: 32px;*/
}
.advanced-filters__select .ts-dropdown .option {
    padding: 10px 16px;
    /*border-bottom: 1px solid var(--primary-light-70);*/
}
.advanced-filters__select .ts-dropdown .option:first-child {
    border-top-left-radius: 16px;
    border-top-right-radius: 16px;
}
.advanced-filters__select .ts-dropdown .option:last-child {
    border-bottom-left-radius: 16px;
    border-bottom-right-radius: 16px;
    border-bottom: unset;
}
.advanced-filters__select .ts-dropdown-content {
    /*max-height: 300px; !* Imposta un'altezza massima per la dropdown *!*/
}
.advanced-filters__select .ts-control .item {
    width: inherit;
}
.advanced-filters__select .ts-control input::placeholder {
    color: var(--neutral-original);
}

.advanced-filters__select.plugin-clear_button.form-select .clear-button,
.advanced-filters__select.plugin-clear_button.single .clear-button {
    right: max(var(--ts-pr-caret), 30px);
}

/** ADVANCED FILTERS SELECT MULTIPLE (TOM SELECT) ***************************************************************************/
.advanced-filters__select-multiple {
    width: 100%;
    min-width: 240px;
    padding: 4px 8px;
    border-radius: 16px;
    background-color: var(--neutral-white);
    font-family: Outfit, sans-serif;
    font-size: var(--font-16px);
    color: var(--primary-original);
    border: solid 1px var(--primary-light-70);
    letter-spacing: 0.0025rem;
}
.advanced-filters__select-multiple .ts-control {
    position: relative;
    border-radius: 16px;
    /*padding: 0 12px;*/
    font-size: var(--font-16px);
    line-height: 1.6rem;
    min-height: 48px;
    border: none;
    background-color: transparent !important;
    flex-direction: row;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
}
.advanced-filters__select-multiple .ts-control::before {
    content: '';
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%) rotate(0deg);
    width: 24px;
    height: 24px;
    background-image: url("../images/icons/CaretDown-ECUTGVL.svg");
    background-repeat: no-repeat;
    background-size: contain;
    pointer-events: none;
    transition: transform 0.3s ease;
}
.advanced-filters__select-multiple.input-active .ts-control::before,
.custom-select.dropdown-active .ts-control::before {
    transform: translateY(-50%) rotate(180deg);
}
.advanced-filters__select-multiple .ts-dropdown {
    /*margin: 0;*/
    font-size: var(--font-16px);
    line-height: 1.6rem;
    border-radius: 16px;
}
.advanced-filters__select-multiple .ts-dropdown,
.advanced-filters__select-multiple .ts-control,
.advanced-filters__select-multiple .ts-control input {
    color: var(--primary-dark-40);
    font-family: inherit;
    font-size: var(--font-16px);
    line-height: normal;
}
.advanced-filters__select-multiple .ts-dropdown .option {
    padding: 10px 16px;
    /*border-bottom: 1px solid var(--primary-light-70);*/
}
.advanced-filters__select-multiple .ts-dropdown .option:first-child {
    border-top-left-radius: 16px;
    border-top-right-radius: 16px;
}
.advanced-filters__select-multiple .ts-dropdown .option:last-child {
    border-bottom-left-radius: 16px;
    border-bottom-right-radius: 16px;
    border-bottom: unset;
}
.advanced-filters__select-multiple .ts-dropdown-content {
    /*max-height: 300px; !* Imposta un'altezza massima per la dropdown *!*/
}
.advanced-filters__select-multiple .ts-control .item {
    background-color: var(--primary-light-90);
    color: var(--primary-dark-40);
    border-radius: 16px;
    padding: 4px 12px;
    font-size: var(--font-16px);
    line-height: 1.2rem;
    height: auto;
    max-width: 100%;
}
.advanced-filters__select-multiple .ts-control input {
    flex: 1;
    min-width: 120px;
    border: none !important;
    box-shadow: none !important;
    font-size: var(--font-16px);
    line-height: 1.6rem;
    padding: 8px 0 !important;
}
.advanced-filters__select-multiple .ts-control input::placeholder {
    color: var(--neutral-original);
}

.advanced-filters__select-multiple.ts-wrapper.multi .ts-control > div {
    cursor: pointer;
    margin: 0 3px 3px 0;
    padding: 4px 12px;
    background: var(--primary-light-90);
    color: var(--primary-dark-40);
    border: 0 solid #d0d0d0;
}

.advanced-filters__select-multiple.ts-wrapper.plugin-remove_button:not(.rtl) .item .remove {
    /*border-left: 1px solid #d0d0d0;*/
    /* margin-left: 6px; */
    display: flex !important;
    align-items: center;
    justify-content: center;
    transition: opacity .2s ease-in-out;
    border: none !important;
    margin-left: unset;
}

.advanced-filters__select-multiple.ts-wrapper.plugin-remove_button .item .remove:hover {
    background: none !important;
    opacity: 0.6;
}


/** SEARCH SORT ****************************************************************************/
.search__sort {
    position: relative;
    display: inline-block;
}

.search__sort-dropdown {
    position: absolute;
    top: 100%;
    left: 0;
    margin-top: 4px;
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 16px;
    box-shadow: 0 2px 6px rgba(0,0,0,0.15);
    z-index: 1000;

    display: none; /* nascosto di default */
}

.search__sort-dropdown.align-right {
    left: auto;
    right: 0;
}

.search__sort-dropdown.align-left {
    left: 0;
    right: auto;
}

.search__sort-dropdown.is-active {
    display: block; /* visibile quando attivo */
}

.search__sort-list {
    list-style: none;
    margin: 0;
    overflow-y: scroll;
    max-height: 200px;
}

.search__sort-item {
    display: flex;
    align-items: center;
    gap: 6px;
    padding: 10px 16px;
    cursor: pointer;
}
.search__sort-item:first-child {
    border-top-left-radius: 16px;
    border-top-right-radius: 16px;
}
.search__sort-item:last-child {
    border-bottom-left-radius: 16px;
    border-bottom-right-radius: 16px;
}

.search__sort-item:hover {
    background: #f5fafd;
}
.search__sort-link {
    white-space: nowrap;
}




/** CONTAINER **************************************************************************/
.container {
    width: 100%;
    max-width: 1440px;
    margin: 0 auto;
}
.container--header {
    width: 100%;
    max-width: 1440px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
}

.container--footer {
    width: 100%;
    max-width: 1440px;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 16px;
    line-height: 1.5;
    justify-content: center;
    vertical-align: middle;
}

.container--wide {
    /*width: 90%;*/
    max-width: 1600px;
    margin: 0 auto;
}

.container--flex {
    display: flex;
    justify-content: space-between;
}

.container--big-gap {
    gap: 128px;
}

.text--white {
    color: var(--neutral-white);
}
.text--black {
    color: var(--neutral-black);
}

/** LOGO ***************************************************************************/
.logo {
    width: 127px;
    height: 56px;
    background-image: url("../images/logo-eeGlDF9.svg");
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    display: inline-block;
}

.logo--light {
    background-image: url("../images/logo-light-8-x8-zB.svg");
}
.header.open .logo {
    background-image: url("../images/logo-eeGlDF9.svg");
}
.header.open .logo--light {
    background-image: url("../images/logo-eeGlDF9.svg");
}

.back-link {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: var(--font-16px);
    color: var(--primary-original);
    text-decoration: none;
    padding: 8px 0;
    letter-spacing: 0.0125rem;
    line-height: 1.6rem;
}

/** ICONS ***************************************************************************/
.icon {
    width: 24px;
    height: 24px;
    background-size: cover;
    background-repeat: no-repeat;
    flex-shrink: 0;
    display: inline-block;
    z-index: 1;
}

.icon--large {
    width: 56px;
    height: 56px;
}

.icon--small {
    width: 20px;
    height: 20px;
    margin-right: 4px;
}

.icon--very-small {
    width: 16px;
    height: 16px;
}

.icon--extra-small {
    width: 12px;
    height: 12px;
    margin-right: 4px;
}

.icon-anchor {
    background-image: url("../images/icons/Anchor-dgHA2Fl.svg");
}
.icon-arrow-left {
    background-image: url("../images/icons/ArrowLeft-jlpchzx.svg");
}
.icon-arrow-left-dark {
    background-image: url("../images/icons/ArrowLeftDark-lptE_XA.svg");
}
.icon-arrow-right {
    background-image: url("../images/icons/ArrowRight-oR4dxxp.svg");
}
.icon-arrows-out-simple-dark {
    background-image: url("../images/icons/ArrowsOutSimpleDark-oq2zHQ_.svg");
}
.icon-bed-dark {
    background-image: url("../images/icons/BedDark-Y0NAX8B.svg");
}
.icon-calendar {
    background-image: url("../images/icons/CalendarBlank-vBmYR6i.svg");
}
.icon-calendar-dark {
    background-image: url("../images/icons/CalendarBlankDark-ApdDk8Y.svg");
}
.icon-calendar-gray {
    background-image: url("../images/icons/CalendarBlankGray-VWYyvFf.svg");
}
.icon-caret-down-dark {
    background-image: url("../images/icons/CaretDownDark-BKu9lG1.svg");
}
.icon-caret-left {
    background-image: url("../images/icons/CaretLeft-KJnX3W4.svg");
}
.icon-caret-left-light {
    background-image: url("../images/icons/CaretLeftLight-fkay8bW.svg");
}
.icon-caret-left-dark {
    background-image: url("../images/icons/CaretLeftDark-IEHB8V4.svg");
}
.icon-caret-left-gray {
    background-image: url("../images/icons/CaretLeftGray-cVxBBim.svg");
}
.icon-caret-right {
    background-image: url("../images/icons/CaretRight-nKvim3J.svg");
}
.icon-caret-right-dark {
    background-image: url("../images/icons/CaretRightDark-Ian7qQP.svg");
}
.icon-caret-right-gray {
    background-image: url("../images/icons/CaretRightGray-FEIK6FH.svg");
}
.icon-caret-right-light {
    background-image: url("../images/icons/CaretRightLight-ciN2yfo.svg");
}
.icon-caret-up-down {
    background-image: url("../images/icons/CaretUpDown-fdmYvRU.svg");
}
.icon-caret-up-down--up {
    /* mostra la parte superiore della sprite */
    background-position: top;
    width: 24px;
    height: 12px;
    background-size: cover;
}
.icon-caret-up-down--down {
    /* mostra la parte inferiore della sprite */
    background-position: bottom;
    width: 24px;
    height: 12px;
    background-size: cover;
}
.icon-chevron-right {
    background-image: url("../images/icons/CaretRight-nKvim3J.svg");
}
.icon-clock-user-accent {
    background-image: url("../images/icons/ClockUserAccent-BOtT5PN.svg");
}
.icon-door-dark {
    background-image: url("../images/icons/DoorDark-4E_-0KX.svg");
}
.icon-ellipse-gray {
    background-image: url("../images/icons/EllipseGray-JgGCxQp.svg");
    width: 3px;
    height: 3px;
}
.icon-envelope-simple-dark {
    background-image: url("../images/icons/EnvelopeSimpleDark-JIvYn3u.svg");
}
.icon-file-text-light {
    background-image: url("../images/icons/FileTextLight-0ZD5gfC.svg");
}
.icon-error {
    background-image: url("../images/icons/Error-Njx6XDZ.svg");
}
.icon-heart {
    background-image: url("../images/icons/Heart-7V9MW7X.svg");
}
.icon-heart-light {
    background-image: url("../images/icons/HeartLight-44Wux8V.svg");
}
.icon-heart-dark {
    background-image: url("../images/icons/HeartDark-l2lL7Hq.svg");
}
.icon-heart-orange {
    background-image: url("../images/icons/HeartOrange-m-nwVCj.svg");
}
.icon-image {
    background-image: url("../images/icons/Image-0vKJgFk.svg");
}
.icon-info {
    background-image: url("../images/icons/Info-xrQq4jS.svg");
}
.icon-logo-light-captain {
    background-image: url("../images/icons/LogoLightCaptain-TSVcQXM.svg");
}
.icon-logo-light {
    background-image: url("../images/icons/LogoLight-eiXW7bf.svg");
}
.icon-map {
    background-image: url("../images/icons/MapTrifold-DyMiegg.svg");
}
.icon-map-light {
    background-image: url("../images/icons/MapTrifoldLight-NxZMsch.svg");
}
.icon-map-light-selected {
    background-image: url("../images/icons/MapTrifoldLightSelected-lmH68al.svg");
}
.icon-map-dark {
    background-image: url("../images/icons/MapTrifoldDark-Q_iD-0_.svg");
}
.icon-map-pin {
    background-image: url("../images/icons/MapPin-UDZ2y-P.svg");
}
.icon-map-pin-dark {
    background-image: url("../images/icons/MapPinDark-_AqnKO-.svg");
}
.icon-map-pin-area {
    background-image: url("../images/icons/MapPinArea-qLZ1u8g.svg");
}
.icon-map-pin-area-light {
    background-image: url("../images/icons/MapPinAreaLight-VotX8MH.svg");
}
.icon-menu-light {
    background-image: url("../images/icons/MenuLight-Kury5II.svg");
}
.icon-menu-dark {
    background-image: url("../images/icons/MenuDark-hvC2ABp.svg");
}
.icon-pencil-simple-light {
    background-image: url("../images/icons/PencilSimpleLight-SCO5T_o.svg");
}
.icon-phone-dark {
    background-image: url("../images/icons/PhoneDark-S6iOpcQ.svg");
}
.icon-sailboat {
    background-image: url("../images/icons/Sailboat-4thHDKN.svg");
}
.icon-sailboat-light {
    background-image: url("../images/icons/SailboatLight-tcthBH8.svg");
}
.icon-sailboat-dark {
    background-image: url("../images/icons/SailboatDark-HuGGTLN.svg");
}
.icon-search-light {
    background-image: url("../images/icons/MagnifyingGlassLight-blsCrCN.svg");
}
.icon-share-network {
    background-image: url("../images/icons/ShareNetwork-7XLXU2W.svg");
}
.icon-shield-check {
    background-image: url("../images/icons/ShieldCheck-XFVTFHp.svg");
}
.icon-sort-ascending {
    background-image: url("../images/icons/SortAscending-wPIBxhF.svg");
}
.icon-sort-descending {
    background-image: url("../images/icons/SortDescending-AEiRdEF.svg");
}
.icon-skipper-dark {
    background-image: url("../images/icons/SkipperDark-UN8FkG8.svg");
}
.icon-sliders {
    background-image: url("../images/icons/Sliders-qdI7AxE.svg");
}
.icon-star-four {
    background-image: url("../images/icons/StarFour-H0pm5JK.svg");
}
.icon-star-four-empty {
    background-image: url("../images/icons/StarFourEmpty-oc95mta.svg");
}
.icon-toilet-dark {
    background-image: url("../images/icons/ToiletDark-u7clC3U.svg");
}
.icon-upload-simple-light {
    background-image: url("../images/icons/UploadSimpleLight-MBm_iOu.svg");
}
.icon-user {
    background-image: url("../images/icons/User-gGkVZpi.svg");
}
.icon-user-light {
    background-image: url("../images/icons/UserLight-AnS-axe.svg");
}
.icon-users-three {
    background-image: url("../images/icons/UsersThree-1VVTFYJ.svg");
}
.icon-users-dark {
    background-image: url("../images/icons/UsersDark-IaI2PqZ.svg");
}
.icon-x {
    background-image: url("../images/icons/X-rKwcush.svg");
}
.icon-x-circle {
    background-image: url("../images/icons/XCircle-1TQGnLH.svg");
}
.icon-x-circle-light {
    background-image: url("../images/icons/XCircleLight-YKXoN44.svg");
}
.icon-x-dark {
    background-image: url("../images/icons/XDark-rKwcush.svg");
}
.icon-x-light {
    background-image: url("../images/icons/XLight-Er71SnY.svg");
}



/** ERROR MESSAGE ******************************************************************/
.error {
    color: var(--alert-100);
}

.form__input--error {
    border: 1px solid var(--alert-100) !important;
    background-color: var(--alert-10) !important;
}

.form__error-message {
    color: var(--alert-100);
    font-size: var(--font-12px);
    font-weight: normal;
    line-height: 1rem;
    letter-spacing: 0.004rem;

    position: absolute;
    top: calc(100% + 2px);
    left: 0;
    width: 100%;
    text-align: left;
    z-index: 1;
    margin: 0;
}

.toastify.error__dialog,
.error__dialog {
    background-color: var(--accent-dark-70);
    background-image: none;
    padding: 16px;
    border-radius: 16px;
    display: flex;
    flex-direction: column;
    gap: 8px;
    max-width: 400px;
    margin: 0 auto;
}
.error__dialog-title {
    color: var(--neutral-white) !important;
    font-size: var(--font-16px);
    font-family: Outfit-Bold, sans-serif;
    line-height: 1.6rem;
    letter-spacing: 0.001rem;
}
.error__dialog-message {
    color: var(--neutral-white) !important;
    font-size: var(--font-16px);
    font-family: Outfit, sans-serif;
    line-height: 1.6rem;
    letter-spacing: 0.0025rem;
}

.error-page {
    background-color: var(--secondary-light-90);
    padding: 64px;
    /*display: flex;*/
    /*flex-direction: column;*/
    /*align-items: center;*/
    /*justify-content: center;*/
    /*height: calc(100vh - 96px);*/
    /*padding: 64px;*/
    /*text-align: center;*/
    /*gap: 24px;*/
}

/** CHIP **************************************************************************/
.chip {
    padding: 8px 16px;
    border-radius: 32px;
    font-size: var(--font-14px);
    font-family: Outfit, sans-serif;
    color: var(--primary-original);
    background-color: var(--primary-light-90);
    cursor: default;
    user-select: none;
    letter-spacing: 0.004rem;
    display: flex;
    align-items: center;
    gap: 8px;
    width: fit-content;
}
.chip--no-wrap {
    white-space: nowrap;
}

.chip--primary-outline {
    background-color: transparent;
    border: 1px solid var(--primary-original);
}

.chip--accent {
    background-color: var(--accent-light-90);
    color: var(--accent-original);
}

.chip--neutral {
    background-color: var(--neutral-light-90);
    color: var(--neutral-dark-40);
}

.chip--primary {
    background-color: var(--primary-original);
    color: var(--neutral-white);
}

.chip--error {
    background-color: var(--alert-10);
    color: var(--alert-100);
}
.chip--success {
    background-color: var(--success-10);
    color: var(--success-100);
}
.chip--warning {
    background-color: var(--warning-10);
    color: var(--warning-100);
}

.chip--draft {
    background-color: var(--neutral-light-90);
    color: var(--neutral-dark-40);
}

.chip--reserved {
    background-color: #caedfa;
    color: #007bff;
}
.chip--partially-paid {
    background-color: var(--warning-10);
    color: var(--warning-100);
}
.chip--paid {
    background-color: var(--success-10);
    color: var(--success-100);
}
.chip--completed {
    background-color: var(--success-10);
    color: var(--success-100);
}
.chip--cancelled {
    background-color: var(--alert-10);
    color: var(--alert-100);
}
.chip--expired {
    background-color: var(--alert-10);
    color: var(--alert-100);
}
.chip--failed {
    background-color: var(--alert-10);
    color: var(--alert-100);
}
.chip--unknown {
    background-color: var(--neutral-light-90);
    color: var(--neutral-dark-40);
}

/* TOOLTIP **********************************************************************/
.tooltip__container {
    position: relative;
    display: inline-block;
    cursor: pointer;
}
.tooltip__content {
    position: absolute;
    bottom: 125%; /* Posiziona sopra l'elemento */
    left: 50%;
    transform: translateX(-50%);
    color: var(--accent-dark-70);
    background-color: var(--accent-light-90);
    padding: 8px 12px;
    border-radius: 8px;
    font-size: var(--font-14px);
    line-height: 1.4rem;
    letter-spacing: 0.0025rem;
    z-index: 1;
    max-width: 400px;
    min-width: min(400px, 80vw);
}

/* BUTTON **********************************************************************/
.btn {
    font-family: Outfit, sans-serif;
    border: none;
    border-radius: 32px;
    padding: 12px 24px;
    cursor: pointer;
    gap: 10px;
    height: 48px;
    display: flex;
    justify-content: center;
    letter-spacing: 0.0125rem;
    width: 100%;
    font-size: var(--font-16px);
    vertical-align: middle;
    align-items: center;

    -webkit-tap-highlight-color: transparent; /* rimuove il blue flash sui WebKit/Chrome mobile */
    -webkit-touch-callout: none;               /* evita il menu contestuale su iOS */
    touch-action: manipulation;                /* migliora il comportamento touch (riduce ritardi) */
}

.btn--no-shadow {
    box-shadow: none !important;
}

.btn--no-wrap {
    white-space: nowrap;
}

.btn--primary {
    background-color: var(--primary-original);
    color: var(--neutral-white);
}

.btn--primary:hover,
.btn--primary:focus,
.btn--primary:active
{
    background-color: var(--primary-original) !important;
    color: var(--neutral-white) !important;
}

.btn--primary-outline {
    background-color: transparent;
    color: var(--primary-original);
    border: 2px solid var(--primary-original);
}

.btn--primary-outline:hover,
.btn--primary-outline:focus,
.btn--primary-outline:active
{
    background-color: transparent !important;
    color: var(--primary-original) !important;
}

.btn--accent,
.btn--orange {
    background-color: var(--accent-original);
    color: var(--neutral-white);
}

.btn--white {
    background-color: var(--neutral-white);
    color: var(--primary-original);
    box-shadow: var(--box-shadow-1);
}

.btn--white-outline {
    background-color: transparent;
    color: var(--neutral-white);
    border: 2px solid var(--neutral-white);
}

.btn--menu {
    width: fit-content;
}

.btn--small {
    width: fit-content;
}

.btn--medium {
    width: 200px;
}

.btn--lower {
    height: 36px;
    padding: 8px 12px;
    gap: 10px;
    font-size: var(--font-14px);
    letter-spacing: 0.004rem;
}

/** HOVER **************************************************************************/
.hoverizzato {
    cursor: pointer;
    transition: opacity .2s ease-in-out;
}
.hoverizzato:hover {
    opacity: 0.6;
}

/** SPINNER *************************************************************************/
.overlay {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    /*background-color: rgba(0, 0, 0, 0.5); !* Sfondo semitrasparente *!*/
    z-index: 99998; /* Dietro lo spinner */
    /*background-color: var(--primary-light-90);*/
    background-color: var(--primary-light-90-alpha);
    justify-content: center;
    align-items: center;
}
.overlay__content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 19px;
    text-align: center;
    width: 100%;
    max-width: 704px;
}
.overlay__subtext {
    font-size: var(--font-16px);
    color: var(--neutral-black);
    line-height: 1.6rem;
    letter-spacing: 0.0025rem;
}
.spinner {
    display: none;
    /*position: fixed;*/
    /*top: calc(50% - 20px);*/
    /*left: calc(50% - 20px);*/
    transform: translate(-50%, -50%);
    z-index: 99999; /* Assicurati che sia sopra gli altri elementi */
    width: 50px;
    height: 50px;
    border: 5px solid rgba(0, 0, 0, 0.1);
    border-top: 5px solid var(--primary-original);
    border-radius: 50%;
    animation: spin 1s linear infinite;
}

.flex {
    display: flex;
}
.items-center {
    align-items: center;
}
.gap-2 {
    gap: 0.5rem;
}

/** PROGRESS BAR ******************************************************************/
.progress-container {
    width: 300px;
    height: 8px;
    background-color: var(--neutral-white);
    border-radius: 40px;
    overflow: hidden;
}

.progress-bar {
    height: 100%;
    background-color: var(--secondary-original);
    transition: width 0.5s ease; /* animazione fluida */
    border-radius: 40px;
}

/** MODAL *************************************************************************/
.modal {
    display: none;
    position: fixed;
    z-index: 9999;
    left: 0; top: 0;
    width: 100vw; height: 100vh;
    background: rgba(0,0,0,0.5);
    justify-content: center;
    align-items: center;
}
.modal.active {
    display: flex;
}
.modal__content {
    background-color: var(--secondary-light-90);
    padding: 0;
    border-radius: 16px;
    position: relative;
    min-width: 240px;
    max-width: 90vw;
    /*max-height: 80vh; !* Limita l’altezza *!*/
    width: 90%;
    /*margin-bottom: 40px;*/
    overflow: hidden;
}
.modal__header {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: var(--neutral-white);
    text-align: center;
    border-top-left-radius: 16px;
    border-top-right-radius: 16px;
    height: 70px;
}
.modal__title {
    font-size: var(--font-16px);
    font-family: Outfit-Bold, sans-serif;
    font-weight: normal;
    color: var(--primary-dark-40);
    line-height: 1.6rem;
    letter-spacing: 0.001rem;
}
.modal__body {
    max-height: 80vh; /* Limita l’altezza */
    overflow-y: auto; /* Abilita lo scroll verticale */
}
.modal__close {
    position: absolute;
    top: 1rem; right: 1rem;
    background: none;
    border: none;
    font-size: 2rem;
    cursor: pointer;
}


/** CUSTOM CHECKBOX ***************************************************************************/
/* Nasconde la checkbox nativa */
.custom-checkbox {
    display: inline-flex;
    align-items: center;
    cursor: pointer;
    gap: 8px;
    user-select: none; /* Impedisce la selezione del testo durante il clic */
}

.custom-checkbox input[type="checkbox"] {
    display: none;
}

.custom-checkbox label {
    position: relative;
    padding-left: 32px;
    min-height: 24px;
    display: flex;
    align-items: center;
    cursor: pointer;
}
.custom-checkbox label.disabled {
    cursor: default;
}

.custom-checkbox label::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 24px;
    height: 24px;
    background: url("../images/icons/CheckboxUnchecked-k5uM9k3.svg") no-repeat center center;
    background-size: contain;
    transition: background-image 0.2s;
}

.custom-checkbox input[type="checkbox"]:checked + label::before {
    background-image: url("../images/icons/CheckboxChecked-nXRBduH.svg");
}

.custom-checkbox input[type="checkbox"]:disabled + label::before {
    background-image: url("../images/icons/CheckboxUncheckedDisabled-Tjz3MUS.svg");
    opacity: 0.6;
    cursor: not-allowed;
}
.custom-checkbox input[type="checkbox"]:checked:disabled + label::before {
    background-image: url("../images/icons/CheckboxCheckedDisabled-_si4aK-.svg");
    opacity: 0.6;
    cursor: not-allowed;
}


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

/** CUSTOM SELECT ****************************************************************************/
/** TOM SELECT *****************************************************************************/


.ts-dropdown {
    z-index: 10000 !important;
}

/* Nasconde il caret originale */
.custom-select .ts-control::after,
.search__destination .ts-control::after
{
    display: none;
}

/* Aggiunge il caret personalizzato */
.custom-select .ts-control {
    position: relative;
    border-radius: 16px;
    /*padding: 0 12px;*/
    font-size: var(--font-16px);
    line-height: 1.6rem;
    height: 48px;
    border: none;
    background-color: transparent !important;
    flex-direction: column;
    justify-content: center;
}

.custom-select--outline {
    border: solid 1px var(--primary-light-70);
    background-color: var(--neutral-white);
    height: 48px;
    padding: 0 8px;
    border-radius: 24px;
}

.custom-select--small {
    font-size: var(--font-14px);
}
.custom-select.custom-select--small .ts-dropdown,
.custom-select.custom-select--small .ts-control,
.custom-select.custom-select--small .ts-control input {
    font-size: var(--font-14px);
    color: var(--primary-dark-40);
    padding: 0;
}
.custom-select.custom-select--small .ts-control,
.custom-select.custom-select--small .ts-control input {
    height: 20px;
    line-height: 1.6rem;
}
.custom-select.custom-select--small .ts-control::before {
    background-image: url("../images/icons/CaretDownDark-BKu9lG1.svg");
    width: 20px;
    height: 20px;
}
.custom-select.custom-select--small .ts-control input::placeholder {
    color: var(--primary-dark-40);
}

/* L'icona del caret personalizzata */
.custom-select .ts-control::before {
    content: '';
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%) rotate(0deg);
    width: 24px;
    height: 24px;
    background-image: url("../images/icons/CaretDown-ECUTGVL.svg");
    background-repeat: no-repeat;
    background-size: contain;
    pointer-events: none;
    transition: transform 0.3s ease;
}

/* Quando la dropdown è aperta, ruota il caret */
.custom-select.input-active .ts-control::before,
.custom-select.dropdown-active .ts-control::before {
    transform: translateY(-50%) rotate(180deg);
}

.custom-select .ts-dropdown {
    /*margin: 0;*/
    font-size: var(--font-16px);
    line-height: 1.6rem;
    border-radius: 16px;
}

.custom-select .ts-dropdown,
.custom-select .ts-control,
.custom-select .ts-control input {
    color: var(--primary-original);
    font-family: inherit;
    font-size: var(--font-16px);
    line-height: normal;
    /*padding-right: 32px;*/
}

.custom-select .ts-dropdown .option {
    padding: 10px 16px;
    /*border-bottom: 1px solid var(--primary-light-70);*/
}
.custom-select .ts-dropdown .option:first-child {
    border-top-left-radius: 16px;
    border-top-right-radius: 16px;
}

.custom-select.plugin-clear_button.form-select .clear-button,
.custom-select.plugin-clear_button.single .clear-button {
    right: max(var(--ts-pr-caret), 30px);
}

.custom-select .ts-dropdown .option:last-child {
    border-bottom-left-radius: 16px;
    border-bottom-right-radius: 16px;
    border-bottom: unset;
}

.custom-select .ts-dropdown-content {
    /*max-height: 300px; !* Imposta un'altezza massima per la dropdown *!*/
}


/** CUSTOM SELECT MULTI ******************************/
.custom-select-multi.ts-wrapper.multi .ts-control  {
    width: 200px;
    max-width: 200px;
}
.custom-select-multi .ts-control {
    /*border: solid 1px var(--primary-light-70);*/
    border: none;
    background-color: transparent !important;
    /*font-size: var(--font-16px);*/
    /*background-color: var(--neutral-white);*/
    color: var(--primary-original);
    height: 48px;
    padding: 0 8px;
    border-radius: 16px;
    display: flex;
    align-items: center;
    flex-wrap: nowrap; /* forza tutto su una riga */
    overflow: hidden;  /* nasconde l'eccesso */
    text-overflow: ellipsis; /* mostra "..." se non entra */
    white-space: nowrap; /* impedisce andata a capo */
    outline: none;
    /*max-width: calc(100% - 40px); !* lascia spazio per caret e padding *!*/
    cursor: pointer;
}
.custom-select-multi .ts-dropdown .ts-option {
    padding: 13px 12px;
}
/* Placeholder color for the input fields */
.custom-select-multi .ts-input::placeholder {
    color: var(--primary-original)
}

.custom-select-multi.plugin-dropdown_input .dropdown-input {
    outline: none;
    font-size: var(--font-16px);
    line-height: 1.6rem;
    height: 48px;
    padding: 0 16px !important;
}
.custom-select-multi.plugin-dropdown_input.focus.dropdown-active .ts-control {
    /*border: 1px solid var(--primary-light-70);*/
    border: none;
}
.custom-select-multi .ts-dropdown,
.custom-select-multi .ts-control,
.custom-select-multi .ts-control input {
    color: var(--primary-original);
    font-family: inherit;
    font-size: var(--font-16px);
    line-height: normal;
    min-width: 9rem;
}

.custom-select-multi .ts-dropdown {
    border-radius: 16px;
}

/** CUSTOM SELECT MULTI - OPTION CHECKBOX ******************************/
.custom-select-multi input[type="checkbox"] {
    display: none;
}

.custom-select-multi .ts-option-label {
    position: relative;
    padding-left: 32px;
    min-height: 24px;
    display: flex;
    align-items: center;
    cursor: pointer;
}

.custom-select-multi .ts-option-label::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 24px;
    height: 24px;
    background: url("../images/icons/CheckboxUnchecked-k5uM9k3.svg") no-repeat center center;
    background-size: contain;
    transition: background-image 0.2s;
}

.custom-select-multi input[type="checkbox"]:checked + .ts-option-label::before {
    background-image: url("../images/icons/CheckboxChecked-nXRBduH.svg");
}

.custom-select-multi.ts-wrapper.multi .ts-control > .item {
    display: inline; /* mostra in linea */
    background: none;
    border: none;
    padding: 0 2px 0 0;
    margin: 0;
    font-weight: normal;
    color: inherit;
}

.custom-select-multi.ts-wrapper.multi .ts-control > .item::after {
    content: ", ";
}

.custom-select-multi .ts-control > .item:last-child::after {
    content: "";
}

.custom-select-multi .ts-control::before {
    content: '';
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%) rotate(0deg);
    width: 24px;
    height: 24px;
    background-image: url("../images/icons/CaretDown-ECUTGVL.svg");
    background-repeat: no-repeat;
    background-size: contain;
    pointer-events: none;
    transition: transform 0.3s
    ease;
}

.custom-select-multi.dropdown-active .ts-control::before {
    transform: translateY(-50%) rotate(180deg);
}



/* Contenitore con ellipsis */
.custom-ellipsis {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    width: 100%;
    max-width: calc(100% - 24px);
}

/* Nasconde le pillole originali */
.custom-select-multi .ts-control > .item {
    display: none !important;
}

.search__control .custom-select-multi .ts-control > * {
    display: unset;
}

.search__select.custom-select-multi .ts-control > input {
    padding-right: unset !important;
}





/** SEARCH DESTINATION (TOM SELECT) ****************************************************************************/
.search__destination {
    width: 100%;
    min-width: 240px;
    max-width: 240px;
    height: 48px;
    /* padding: 13px 16px 13px 48px; */
    /*padding: 0 0 13px 48px;*/
    padding: 0 0 0 40px;
    border-radius: 16px;
    background-color: var(--neutral-white);
    font-family: Outfit, sans-serif;
    font-size: var(--font-16px);
    color: var(--primary-original);
    border: solid 1px var(--primary-light-70);
    letter-spacing: 0.0025rem;
}
.search__form--small .search__destination,
.search__form--small .search__select {
    min-width: 190px;
    width: 100%;
    max-width: 190px;
    height: 36px;
    padding: 0 0 0 30px;
    border-radius: 32px;
}
.search__form--small .search__destination .ts-control {
    padding-right: 30px !important;
}
.search__form--small .search__destination .ts-control span.fi {
    display: none;    /* nascondo l'icona della bandiera */
    /*width: 20px;*/
}
/** larghezza minima icone bandiere */
.fi {
    min-width: 20px;
}
.search__destination .ts-control {
    position: relative;
    border-radius: 16px;
    /*padding: 0 12px;*/
    font-size: var(--font-16px);
    line-height: 1.6rem;
    height: 48px;
    border: none;
    background-color: transparent !important;
    flex-direction: column;
    justify-content: center;
}
.search__form--small .search__destination .ts-control,
.search__form--small .search__select .ts-control {
    height: 36px !important;
}
.search__destination .ts-control::before {
    content: '';
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%) rotate(0deg);
    width: 24px;
    height: 24px;
    background-image: url("../images/icons/CaretDown-ECUTGVL.svg");
    background-repeat: no-repeat;
    background-size: contain;
    pointer-events: none;
    transition: transform 0.3s ease;
}
.search__form--small .search__destination .ts-control::before,
.search__form--small .search__select .ts-control::before {
    width: 20px;
    height: 20px;
}
.search__destination .ts-control.input-active::before,
.search__destination .ts-control.dropdown-active::before {
    /*transform: translateY(-50%) rotate(180deg);*/
}
.search__destination.input-active .ts-control::before, .custom-select.dropdown-active .ts-control::before {
    transform: translateY(-50%) rotate(180deg);
}
.search__destination .ts-dropdown {
    /*margin: 0;*/
    font-size: var(--font-16px);
    line-height: 1.6rem;
    border-radius: 16px;
}

.search__destination.plugin-dropdown_input.focus.dropdown-active .ts-control {
    border: none;
}
.search__destination.plugin-dropdown_input .dropdown-input {
    outline: none;
    font-size: var(--font-16px);
    line-height: 1.6rem;
    height: 48px;
    padding: 0 16px;
}
.search__destination.plugin-dropdown_input .ts-control {
    outline: none !important;
}

.search__destination .ts-dropdown,
.search__destination .ts-control,
.search__destination .ts-control input {
    color: var(--primary-original);
    font-family: Outfit, sans-serif;
    font-size: var(--font-16px);
    line-height: normal;
    /*padding-right: 32px;*/
}

.ts-dropdown .dropdown-input-wrap > input
{
    font-family: Outfit, sans-serif;
}

.search__form--small .search__destination .ts-dropdown,
.search__form--small .search__destination .ts-control,
.search__form--small .search__destination .ts-control input,
.search__form--small .search__select .ts-dropdown,
.search__form--small .search__select .ts-control,
.search__form--small .search__select .ts-control input {
    font-size: var(--font-14px);
    line-height: normal;
}


.search__destination .ts-dropdown .option {
    padding: 10px 16px;
    /*border-bottom: 1px solid var(--primary-light-70);*/
}
.search__destination .ts-dropdown .option:first-child {
    /*border-top-left-radius: 16px;*/
    /*border-top-right-radius: 16px;*/
}
.search__destination .ts-dropdown .option:last-child {
    border-bottom-left-radius: 16px;
    border-bottom-right-radius: 16px;
    border-bottom: unset;
}
.search__destination .ts-dropdown-content {
    /*max-height: 300px; !* Imposta un'altezza massima per la dropdown *!*/
}
.search__destination .ts-control .item {
    width: inherit;
}
.search__destination .ts-control .item,
.search__destination .ts-control .item span:not(.fi) {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    /*padding-right: 20px !important; !* spazio per il caret *!*/
}

.search__select .ts-control > input {
    text-overflow: ellipsis !important;
    padding-right: 30px !important; /* spazio per il caret */
}
.search__form--small .search__select .ts-control > input {
    padding-right: 20px !important; /* spazio per il caret */
}

/** SEARCH CONTROL (TOM SELECT) ****************************************************************************/
/* Dropdown più larga (puoi usare un valore fisso o auto) */
.search__control .ts-wrapper .ts-dropdown {
    min-width: 240px; /* o 300px, o quello che vuoi */
    width: max-content; /* così si adatta al contenuto */
}

/* Il wrapper resta largo quanto decidi tu */
.search__control .ts-wrapper {
    /*width: 160px; !* oppure 100%, oppure max-width *!*/
}

/* La casella interna prende sempre tutta la larghezza del wrapper */
.search__control .ts-wrapper .ts-control {
    /*width: 90% !important;*/
    overflow: hidden;
    text-overflow: ellipsis;
    display: flex;       /* così il testo non rompe la larghezza */
    flex-wrap: nowrap;   /* evita che l'item si allarghi oltre */
    /*align-items: center;*/
    /*justify-content: center;*/
}

.search__control .ts-control > * {
    display: flex;
}

.search__control .ts-wrapper .ts-control .item {
    width: inherit;
    max-width: calc(100% - 20px); /* lascia spazio per caret e padding */
    /*flex: 1 1 auto;*/
    /*min-width: 0;             !* necessario per text-overflow *!*/
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.search__control .has-items .ts-control input
{
    /*width: 1px !important;  !* così l'input non sposta mai il testo *!*/
    display: none !important;
}


/** CALENDAR ****************************************************************************/
.flatpickr-months {
    height: 48px !important;
    display: flex;
    align-items: center;
}

.flatpickr-current-month input.cur-year,
.flatpickr-current-month span.cur-month {
    color: var(--primary-original) !important;
    font-family: Outfit-Bold, sans-serif;
    font-size: var(--font-16px) !important;
    letter-spacing: 0.0001rem;
}

.dayContainer .flatpickr-day {
    color: var(--primary-original);
}

/* Giorno di partenza */
.flatpickr-day.startRange {
    background-color: var(--primary-original) !important;
    color: white;
}

/* Giorno di arrivo */
.flatpickr-day.endRange {
    background-color: var(--primary-original) !important;
    color: var(--neutral-white) !important;
}

/* Giorni intermedi (facoltativo) */
.dayContainer .flatpickr-day.inRange {
    background-color: var(--primary-light-70) !important;
    box-shadow: -5px 0 0 var(--primary-light-70), 5px 0 0 var(--primary-light-70);
    border: var(--primary-light-70) solid 1px;
}

.dayContainer .flatpickr-day.selected,
.dayContainer .flatpickr-day.startRange,
.dayContainer .flatpickr-day.endRange,
.dayContainer .flatpickr-day.selected.inRange,
.dayContainer .flatpickr-day.startRange.inRange,
.dayContainer .flatpickr-day.endRange.inRange,
.dayContainer .flatpickr-day.selected:focus,
.dayContainer .flatpickr-day.startRange:focus,
.dayContainer .flatpickr-day.endRange:focus,
.dayContainer .flatpickr-day.selected:hover,
.dayContainer .flatpickr-day.startRange:hover,
.dayContainer .flatpickr-day.endRange:hover,
.dayContainer .flatpickr-day.selected.prevMonthDay,
.dayContainer .flatpickr-day.startRange.prevMonthDay,
.dayContainer .flatpickr-day.endRange.prevMonthDay,
.dayContainer .flatpickr-day.selected.nextMonthDay,
.dayContainer .flatpickr-day.startRange.nextMonthDay,
.dayContainer .flatpickr-day.endRange.nextMonthDay {
    background: var(--primary-original);
    -webkit-box-shadow: none;
    box-shadow: none;
    color: #fff;
    border-color: var(--primary-original) !important;
}

.flatpickr-day.inRange,
.flatpickr-day.prevMonthDay.inRange,
.flatpickr-day.nextMonthDay.inRange,
.flatpickr-day.today.inRange,
.flatpickr-day.prevMonthDay.today.inRange,
.flatpickr-day.nextMonthDay.today.inRange,
.flatpickr-day:hover,
.flatpickr-day.prevMonthDay:hover,
.flatpickr-day.nextMonthDay:hover,
.flatpickr-day:focus,
.flatpickr-day.prevMonthDay:focus,
.flatpickr-day.nextMonthDay:focus
{
    border-color: transparent !important;
}

.flatpickr-calendar.rangeMode.multiMonth .flatpickr-days .dayContainer:nth-child(n+1) .flatpickr-day.inRange:nth-child(7n+7) {
    -webkit-box-shadow: -5px 0 0 var(--primary-light-70), 1px 0 0 var(--primary-light-70) !important;
    box-shadow: -5px 0 0 var(--primary-light-70), 1px 0 0 var(--primary-light-70) !important;
}

.flatpickr-day.selected.startRange + .endRange:not(:nth-child(7n+1)),
.flatpickr-day.startRange.startRange + .endRange:not(:nth-child(7n+1)),
.flatpickr-day.endRange.startRange + .endRange:not(:nth-child(7n+1)) {
    /*-webkit-box-shadow: -10px 0 0 #569ff7;*/
    /*box-shadow: -10px 0 0 #569ff7;*/
    -webkit-box-shadow: -10px 0 0 var(--primary-original) !important;
    box-shadow: -10px 0 0 var(--primary-original) !important;
}

.flatpickr-calendar.multiMonth .flatpickr-days .dayContainer:nth-child(n+2) .flatpickr-day.inRange:nth-child(7n+1) {
    -webkit-box-shadow: -1px 0 0 var(--primary-light-70), 5px 0 0 var(--primary-light-70) !important;
    box-shadow: -1px 0 0 var(--primary-light-70), 5px 0 0 var(--primary-light-70) !important;
}

/* Freccia indietro */
.flatpickr-prev-month {
    background: url("../images/icons/CaretLeft-KJnX3W4.svg") no-repeat center center;
    background-size: 16px 16px;
    margin-left: 8px;
    height: 48px !important;
}



/* Freccia avanti */
.flatpickr-next-month {
    background: url("../images/icons/CaretRight-nKvim3J.svg") no-repeat center center;
    background-size: 16px 16px;
    margin-right: 8px;
    height: 48px !important;
}

.flatpickr-prev-month svg {
    display: none;
}
.flatpickr-next-month svg {
    display: none;
}

/* Sabato */
.flatpickr-day.saturday {
    color: var(--primary-dark-40);
    font-family: Outfit-Bold, sans-serif;
    font-weight: normal;
}
.flatpickr-day.busy-day {
    color: var(--alert-100) !important;
    background-color: var(--alert-10) !important;
    box-shadow: -5px 0 0 var(--alert-10), 5px 0 0 var(--alert-10);
    /*border: 1px solid var(--alert-100) !important;*/
    border-radius: unset !important;
}
.flatpickr-calendar .flatpickr-days .dayContainer:nth-child(n+1) .flatpickr-day.busy-day:nth-child(7n+7)
/*.dayContainer:nth-child(n+2) .flatpickr-day.busy-day:nth-child(7n+1) */
{
    /*background-color: yellow !important;*/
    border-top-left-radius: 8px !important;
    border-bottom-left-radius: 8px !important;
}
.flatpickr-calendar .flatpickr-days .dayContainer:nth-child(n+1) .flatpickr-day.busy-day:nth-child(7n+5) {
    /*background-color: yellow !important;*/
    border-top-right-radius: 8px !important;
    border-bottom-right-radius: 8px !important;
}

.flatpickr-day.busy-day > .flatpickr-day:not(.busy-day) {
    color: var(--alert-100) !important;
    background-color: var(--alert-10) !important;
    box-shadow: -5px 0 0 var(--alert-10), 5px 0 0 var(--alert-10);
    /*border: 1px solid var(--alert-100) !important;*/
    border-radius: 8px !important;
}
/** DIALOG ANIMATION *******************************************************************/
/* Stato iniziale del popup */
.swal2-popup {
    opacity: 0;
    transform: scale(0.95);
    transition: all 0.3s ease-in-out !important;
}

/* Quando si apre */
.swal2-show {
    opacity: 1 !important;
    transform: scale(1) !important;
}

/* Quando si chiude */
.swal2-hide {
    opacity: 0 !important;
    transform: scale(0.95) !important;
}



/** DIALOG *****************************************************************************/
.dialog__title,
.swal2-popup.dialog__container .swal2-title {
    font-size: 1.4rem;
    line-height: 1.6rem;
    font-family: Outfit-Bold, sans-serif;
    font-weight: normal;
    color: var(--primary-original);
    text-align: left;
    padding: 32px;
}

.dialog__title--center,
.swal2-popup.dialog__container .swal2-title--center {
    text-align: center;
}

.dialog__popup {
    border-radius: 16px;
}

.dialog__close {
    position: absolute;
    top: 32px;
    right: 32px;
    width: 24px;
    height: 24px;
    cursor: pointer;
}

.dialog__text {
    font-size: 1rem;
    line-height: 1.6rem;
    font-family: Outfit, sans-serif;
    color: var(--color-black);
    text-align: left;
    padding: 0 1.6em 1em !important;
    /*padding: 0 32px;*/
}

.dialog__footer-text {
    font-size: var(--font-14px);
    line-height: 1.6rem;
    letter-spacing: 0.004rem;
    font-family: Outfit, sans-serif;
    color: var(--neutral-dark-40);
}

.dialog__buttons {
    display: flex;
    /*justify-content: space-between;*/
    align-items: center;
    gap: 8px;
    margin-top: 32px;
    width: 100%;
    padding: 0 1.6rem;
}

.dialog__buttons--right {
    justify-content: flex-end;
}

.dialog__button {
    width: fit-content !important;
}

.dialog__form-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 8px;
    margin-bottom: 16px;
}

.dialog__form-group {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.dialog__form-group .custom-select .ts-control {
    width: 100%;
    border-radius: 10px;
    border: 1px solid var(--primary-original);
}

.dialog__label {
    font-size: 0.9rem;
    line-height: 1.2rem;
    letter-spacing: -0.02rem;
    font-family: Outfit, sans-serif;
    color: var(--primary-original);
    text-align: left;
}

.dialog__input {
    display: block;
    width: 100%;
    height: 48px;
    padding: 12px 16px;
    font-size: 1rem;
    border-radius: 10px;
    border: 1px solid var(--primary-original);
    background-color: var(--neutral-white);
    outline: none;
}

.swal2-file-upload {
    padding: 32px;
}

.swal2-file-label {
    display: inline-block;
    padding: 10px 16px;
    background: var(--primary-original);
    color: var(--neutral-white);
    border-radius: 8px;
    cursor: pointer;
    font-weight: 500;
    transition: background 0.2s;
}
.swal2-file-label:hover {
    /*background: var(--primary-dark-40);*/
    /*    cursor: pointer;*/
    /*    transition: opacity .2s ease-in-out;*/
}

.swal2-file-input {
    display: none; /* nascosto */
}

.swal2-file-preview {
    display: block;
    margin: 1rem auto 0 auto;
    max-width: 100%;
    border-radius: 10px;
    box-shadow: 0 2px 6px rgba(0,0,0,0.2);
}





/** HEADER ****************************************************************************/
header {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    height: 96px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 24px 64px;
    background-color: var(--neutral-white);
    z-index: 1000;
}

.header--transparent {
    position: absolute;
    background-color: transparent;
}

.header--scroll {
    opacity: 0;
    transform: translateY(-20px);
    transition: opacity 0.3s ease, transform 0.3s ease;
}

.header--scroll.hidden {
    opacity: 0;
    transform: translateY(-20px);
}

.header--scroll:not(.hidden) {
    opacity: 1;
    transform: translateY(0);
}

header .logo {
    font-size: var(--font-24px);
    /*font-weight: bold;*/
    font-family: Outfit-Bold, sans-serif;
    font-weight: normal;
}

.header__left {
    display: flex;
    align-items: center;
    gap: 64px;
}

.header__right {
    display: flex;
    align-items: center;
    gap: 40px;
}

.header__menu {
    display: none;
}

.header__mobile {
    display: none;
}

.header__link {
    display: flex;
    flex-direction: column;
    gap: 4px;
    align-items: center;
    justify-content: center;
}

.header--transparent .header__link {
    color: var(--neutral-white);
}

.header__avatar {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    object-fit: cover;
    border: 2px solid var(--primary-original);
    background-color: var(--primary-light-70);
    display: flex;
    align-items: center;
    justify-content: center;
}


/** MAIN ****************************************************************************/
.main {
    /*margin-top: 96px;*/
    /*min-height: calc(100vh - 96px);*/
}

/** FOOTER ***************************************************************************/
footer {
    background-image: url("../images/bg-pattern-white-WU0brWs.svg");
    background-position-y: -30px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 64px;
    line-height: 1.5;
    justify-content: center;
    vertical-align: middle;
    color: var(--primary-dark-40);
}

.footer__row {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.footer__left {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 16px;
}

.footer__socials {
    display: flex;
    gap: 16px;
}

.footer__right {
    flex: 2;
    display: flex;
    justify-content: flex-start;
    align-items: flex-start;
    gap: 48px;
}

.footer__column {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.footer__header {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.footer__body {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.footer__body-row {
    display: flex;
    gap: 8px;
    align-items: center;
}

.footer__title {
    color: var(--primary-original);
    font-family: Outfit-Bold, sans-serif;
    font-weight: normal;
}

.footer__logo {
    font-size: var(--font-24px);
    font-family: Outfit-Bold, sans-serif;
    font-weight: normal;
}

.footer__glueglue {
    padding-top: 30px;
    display: flex;
    gap: 12px;
}
.footer__glueglue-text {
    font-size: var(--font-16px);
}
.footer__glueglue-logo {
    width: 95px;
    height: 24px;
}








/*************************************************************************************
/** HOMEPAGE *************************************************************************
 ***********************************************************************************/

/** HERO *************************************************************************/
.hero {
    background-image: linear-gradient(180deg, rgba(0, 149, 183, 0.48) 0%, rgba(0, 149, 183, 0.24) 11.54%, rgba(0, 149, 183, 0) 50.48%, rgba(1, 89, 96, 0.32) 72.6%, rgba(1, 89, 96, 0.8) 100%), url("../images/hero-bg-98qIFe9.webp");
    background-size: cover, cover;
    background-repeat: no-repeat;
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 56px;
    align-items: start;
    padding: 128px 64px 64px;
    /*min-height: 100vh;*/
}

.hero__intro {
    display: flex;
    flex-direction: column;
    align-items: start;
    gap: 16px;
}

/** SEARCH *************************************************************************/
#toggle-search {
    cursor: pointer;
}
#toggle-search i {
    transition: transform .3s ease;
}
#toggle-search i.rotated {
    transform: rotate(180deg);
}

.search {
    /*width: 100%;*/
    width: fit-content;
    /*margin-top: 64px;*/
}
.search__form {
    display: flex;
    /*flex-wrap: wrap;*/
    gap: 8px;
    background: #FFFFFFB2;
    padding: 24px;
    border-radius: 64px;
    box-shadow: 0 0 30px 0 #01596026;
    backdrop-filter: blur(4px);
}
.search__form--transparent {
    background: transparent;
    box-shadow: none;
    backdrop-filter: none;
    padding: 0;
}
.search__control {
    /*flex: 1;*/
    position: relative;
    width: 100%;
    /*max-width: 300px;*/
    display: flex;
    gap: 8px;
}
.search__form--small .search__control {
    height: 36px;
}
.custom-input__wrapper {
    position: relative;
    width: 100%;
}
.custom-input__label {
    position: absolute;
    top: -10px;
    left: 16px;
    font-size: var(--font-14px);
    color: var(--primary-original);
    /*background-color: var(--neutral-white);*/
    background-color: transparent;
    padding: 0 4px;
    z-index: 2;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: 90%;
}
.custom-input__label:before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 3px; /* regola leggermente in base alla posizione del bordo */
    height: 6px; /* spessore della "patch" che copre il bordo */
    background-color: var(--neutral-white); /* colore dell'input */
    z-index: -1; /* va dietro al testo della label */
    border-radius: 4px; /* per allinearsi ai bordi stondati dell'input */
}
.search__label {
    position: absolute;
    top: -10px;
    left: 16px;
    font-size: var(--font-14px);
    color: var(--primary-original);
    /*background-color: var(--neutral-white);*/
    background-color: transparent;
    padding: 0 4px;
    z-index: 2;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    max-width: 90%;
}
.search__icon {
    position: absolute;
    top: 50%;
    left: 1rem;
    transform: translateY(-50%);
    pointer-events: none;
    width: 24px;
    height: 24px;
    background-size: cover;
    background-repeat: no-repeat;
    z-index: 3;
}
.search__form--small .search__icon,
.search__icon--small {
    width: 20px;
    height: 20px;
    left: 0.75rem;
    line-height: 20px;
}
.search__field {
    width: 100%;
    min-width: 200px;
    height: 48px;
    /*padding: 13px 16px 13px 48px;*/
    padding: 8px 12px 8px 54px;
    border-radius: 16px;
    background-color: var(--neutral-white);
    font-family: Outfit, sans-serif;
    font-size: var(--font-16px);
    color: var(--primary-original);
    border: solid 1px var(--primary-light-70);
    letter-spacing: 0.0025rem;
}
.search__form--small .search__field,
.search__field--small {
    height: 36px;
    padding: 8px 12px 8px 36px;
    font-size: var(--font-14px);
}
.search__field:focus {
    outline: none;
    box-shadow: 0 0 30px 0 #01596026;
    border: solid 1px var(--primary-original);
}
.search__field--large {
    min-width: 250px;
}
.search__form--small .search__field--large {
    min-width: 210px;
}

/** SEARCH AUTOCOMPLETE (TOM SELECT) ****************************************************************************/
.search__autocomplete {
    width: fit-content;
    min-width: 240px;
    height: 48px;
    /*padding: 13px 16px 13px 48px;*/
    padding: 0 0 13px 48px;
    border-radius: 16px;
    background-color: var(--neutral-white);
    font-family: Outfit, sans-serif;
    font-size: var(--font-16px);
    color: var(--primary-original);
    border: solid 1px var(--primary-light-70);
    letter-spacing: 0.0025rem;
}
.search__autocomplete .ts-control {
    width: 100%;
    height: 48px;
    /*padding: 0 16px;*/
    background-color: transparent !important;
    font-family: Outfit, sans-serif;
    font-size: var(--font-16px);
    color: var(--primary-original);
    border: none;
    letter-spacing: 0.0025rem;
}
.search__autocomplete .ts-control input {
    font-family: Outfit, sans-serif;
    font-size: var(--font-16px);
    letter-spacing: 0.0025rem;
}
.search__autocomplete .ts-dropdown {
    width: 100%;
    max-height: 300px;
    overflow-y: auto;
    border-radius: 16px;
    background-color: var(--neutral-white);
}

.search__autocomplete .ts-dropdown,
.search__autocomplete .ts-control,
.search__autocomplete .ts-control input {
    color: var(--primary-original) !important;
    font-family: inherit;
    font-size: var(--font-16px) !important;
    line-height: normal;
}



.search__select {
    display: flex;
    width: 100%;
    min-width: 240px;
    height: 48px;
    /*padding: 13px 16px¶ 13px 48px;*/
    /*padding: 0 0 13px 48px;*/
    padding: 0 0 0 40px;
    border-radius: 16px;
    background-color: var(--neutral-white);
    font-family: Outfit, sans-serif;
    font-size: var(--font-16px);
    color: var(--primary-original);
    border: solid 1px var(--primary-light-70);
    letter-spacing: 0.0025rem;
}
.search__button {
    white-space: nowrap;
}

.hero__partners {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 80px;
    /*margin-top: 64px;*/
    white-space: nowrap;
    color: var(--neutral-white);
}
.hero__logo-partners {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 40px;
}

.hero__footer {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 24px;
    /*margin-top: 96px;*/
    color: var(--neutral-white);
}

.hero__footer-title-container {
    display: flex;
    gap: 16px;
    align-items: center;
}

.hero__footer-title,
.hero__footer-subtitle {
    color: var(--neutral-white);
}

.hero__footer-link {
    display: inline-flex;
    align-items: center;
}

.hero__footer-image {
    width: 229px;
    height: 63px;
}


/** DESTINATIONS *************************************************************************/
.destinations {
    background-color: var(--secondary-light-90);
    display: flex;
    flex-direction: column;
    /*align-items: center;*/
    gap: 64px;
    padding: 80px 64px;
}
.destinations__container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 32px;
    width: 100%;
    /*max-width: 1200px;*/
    /*margin: 0 auto;*/
}
.destinations__title {
    letter-spacing: 0.0025rem;
}
.destinations__footer {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 24px;
    color: var(--primary-original);
}

.destinations__grid {
    width: 100%;
    display: grid;
    /*grid-template-columns: repeat(auto-fill, minmax(310px, 1fr));*/
    grid-template-columns: repeat(4, minmax(200px, 1fr));
    align-items: center;
    gap: 24px;
}
.destination-card {
    position: relative;
    width: 100%;
    /*max-width: 644px;*/
    height: 442px;
    border-radius: 16px;
    overflow: hidden;
    background: #f9ffff;
    box-shadow: 0 4px 4px 0 #00000040;
    display: flex;
    flex-direction: column;
    gap: 24px;
}
.destination-card::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(360deg, rgba(0, 0, 0, 0.25) 54.86%, rgba(0, 0, 0, 0) 100%);
    border-radius: 16px;
    z-index: 1;
    pointer-events: none;
}
.destination-card--full {
    grid-column: span 2;
    width: 100%;
}
.destination-card__image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
    transition: opacity 0.4s ease;
}
/* di base immagine visibile, video nascosto */
.destination-card__video {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover; /* riempie tutta la card */
    transition: opacity 0.4s ease;
    opacity: 0;
    pointer-events: none;
}
.destination-card.destination-card--has-video:hover .destination-card__video {
    opacity: 1;
}

.destination-card.destination-card--has-video:hover .destination-card__image {
    opacity: 0;
}
.destination-card__content {
    position: absolute;
    bottom: 0;
    left: 0;
    padding: 24px;
    display: flex;
    flex-direction: column;
    gap: 32px;
    flex: 1;
    z-index: 2;
}
.destination-card__content-top {
    display: flex;
    flex-direction: column;
    gap: 12px;
}
.destination-card__country {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    border-radius: 32px;
    background-color: var(--primary-light-90);
    padding: 8px 12px;
    position: absolute;
    top: 24px;
    right: 24px;
    color: var(--primary-original);
    font-size: var(--font-14px);
    letter-spacing: 0.004rem;
    line-height: 1.6rem;
    min-width: 86px;
    width: fit-content;
    height: 36px;
}



/** PRICE *************************************************************************/
.price {
    display: flex;
    gap: 80px;
    padding: 120px 64px;
}
.price__left {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 16px;
    font-family: Outfit, sans-serif;
    font-weight: normal;
    font-size: var(--font-18px);
    line-height: 1.4;
    letter-spacing: 0.005rem;
    color: var(--color-black);
    padding: 64px 0 0 64px;
}
.price__right {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    flex: 1;
    background-size: cover;
    background-position: left center;
}
.price__img-wrapper {
    overflow: hidden;
    border-radius: 300px 16px 16px 16px;
    max-width: 614px;
    aspect-ratio: 614 / 480;
    width: 100%;
    margin: 0 auto;
}
.price__img {
    width: 172%;
    height: 100%;
    object-fit: cover;
    object-position: 50% 100%;
    display: block;
    margin-left: -12%; /* negativo = taglia più a sinistra | positivo = taglia più a destra */
}
.price__content {
    display: flex;
    flex-direction: column;
    gap: 32px;
}
.price__footer {
    display: flex;
    flex-direction: column;
    gap: 8px;
    margin-top: 64px;
    color: var(--color-black);
}
.price__img-stripe {
    width: 100%;
    max-width: 121px;
    height: auto;
}
.price__img-background {
    width: auto;
    height: 100%;
    object-fit: cover;
    display: block;
}

/** HOW ************************************************************************/
.how {
    background-color: var(--primary-original);
    background-image: url("../images/bg-pattern-primary-7ACKYse.svg");
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 64px;
    padding: 64px;
}
.how__container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 80px;
    width: 100%;
}
.how__title {
    color: var(--neutral-white);
    letter-spacing: 0.0025rem;
    text-align: center;
}
.how__items {
    flex: 1;
    display: flex;
    justify-content: space-between;
    gap: 32px;
    width: 100%;
}
.how__item {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 32px;
    text-align: center;
    color: var(--neutral-white);
    max-width: 363px;
}
.how__item-img {
    width: 240px;
    height: auto;
}
.how__item-content {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.how__item-title {
    color: var(--neutral-white);
}

/** DESTINATION BLOG *************************************************************************/
.destination-blog {
    background-color: var(--neutral-white);
    display: flex;
    flex-direction: column;
    gap: 64px;
    padding: 64px 0;
}


/** BLOG *************************************************************************/
.blog {
    background-color: var(--neutral-white);
    display: flex;
    flex-direction: column;
    gap: 64px;
    padding: 64px;
}
.blog__container {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 40px;
    width: 100%;
    /*padding: 0 64px;*/
}
.blog__items {
    display: flex;
    gap: 24px;
    width: 100%;
}
.blog__items.flickity-enabled {
    display: block;
}
.blog__footer {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    width: 100%;
}
.blog__footer .carousel-controls {
    justify-self: end;
}
.blog__items--column
{
    flex-direction: column;
    justify-content: center;
}
.blog__item {
    display: flex;
    justify-content: space-between;
    /*gap: 128px;*/
    width: 100%;
    align-items: center;
}
.blog__item--max {
    max-width: 421px;
    max-height: 411px;
}
.blog__item--reverted {
    flex-direction: row-reverse;
}
.blog__item-image-wrapper {
    max-width: 636px;
    width: 100%;
    height: 464px;
    overflow: hidden;
    position: relative;
}
.blog__item-image-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* riempie il box senza deformare */
    display: block;
    /*clip-path: path('M-1 143.368V226.07V238.661V325.941L-1 464C43.8051 464 244.554 463.714 265.976 463.714C281.113 463.714 384.792 463.714 451.466 463.714L570.188 463.714C615 463.714 645.937 418.849 630.008 376.964L520.268 88.4078C500.282 35.8721 449.122 0 392.951 0L314.566 0C258.169 0 38.1296 0.28612 -1 0.286059V54.6573V75.8334V143.368Z');*/
    border-radius: 16px 300px 16px 16px;
}
.blog__item--reverted .blog__item-image-wrapper img {
    /*clip-path: path('M636 143.368V226.07V238.661V325.941L636 464C591.195 464 390.446 463.714 369.024 463.714C353.887 463.714 250.208 463.714 183.534 463.714L64.8116 463.714C20.0001 463.714 -10.9375 418.849 4.99161 376.964L114.732 88.4078C134.718 35.8721 185.878 0 242.049 0L320.434 0C376.831 0 596.87 0.28612 636 0.286059V54.6573V75.8334V143.368Z');*/
    border-radius: 300px 16px 16px 16px;
}
.blog__item-content {
    display: flex;
    flex-direction: column;
    gap: 24px;
    max-width: 660px;
    color: var(--primary-dark-40);
    padding: 0 64px;
}
.blog__item-title {
    color: var(--primary-dark-40);
    letter-spacing: 0.0025rem;
    line-height: 1.2;
}
.blog__item-text {
    color: var(--neutral-black);
    font-size: var(--font-18px);
    line-height: 1.2;
    letter-spacing: 0.005rem;
}


/** REVIEW *************************************************************************/
.review {
    background-color: var(--secondary-original);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding: 80px 64px;
}
.review__title {
    color: var(--neutral-white);
    letter-spacing: 0.0025rem;
}
.review__container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 48px;
    width: 100%;
}
.review__items {
    width: 100%;
}
.review__footer {
    width: 100%;
    display: flex;
    justify-content: flex-end;
}
.review__item {
    padding: 32px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 25%;
    box-sizing: border-box;
    height: auto;
    color: var(--neutral-white);
}
.review__item-img {
    width: 100px;
    height: 100px;
    border-radius: 50%;
    object-fit: cover;
}
.review__item-title {
    color: var(--neutral-white);
}
.review__item-text {
    font-family: Outfit, sans-serif;
    font-weight: normal;
    font-size: var(--font-18px);
    line-height: 1.6rem;
    letter-spacing: 0.005rem;
    color: var(--neutral-white);
}


/** FAQ *************************************************************************/
.faq {
    background-color: var(--secondary-light-90);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 64px;
    padding: 64px;
}
.faq__container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 40px;
    width: 100%;
    /*max-width: 800px;*/
}
.faq__items {
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
}
.faq__item {
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;
    background-color: var(--neutral-white);
    border-radius: 16px;
    padding: 24px;
    cursor: pointer;

    -webkit-tap-highlight-color: transparent; /* rimuove il blue flash sui WebKit/Chrome mobile */
    -webkit-touch-callout: none;               /* evita il menu contestuale su iOS */
    touch-action: manipulation;                /* migliora il comportamento touch (riduce ritardi) */
}
.faq__question {
    display: flex;
    justify-content: space-between;
    align-items: center;
    letter-spacing: 0.0015rem;
}
.faq__question.active .chevron {
    transform: rotate(180deg);
    transition: transform 0.3s ease;
}
.faq__answer {
    display: none;
    color: var(--primary-dark-40);
    font-family: Outfit, sans-serif;
    font-weight: normal;
    font-size: var(--font-18px);
    line-height: 1.4;
    letter-spacing: 0.005rem;
}


/** NEWSLETTER *************************************************************************/
.newsletter {
    background-color: var(--primary-original);
    background-image: url("../images/newsletter-1-zBi3Pgd.webp");
    background-position: center;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 32px;
    padding: 64px;
    min-height: 529px;
}
.newsletter__container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 32px;
    width: 100%;
    max-width: 600px;
    color: var(--neutral-white);
}
.newsletter__title {
    color: var(--neutral-white);
    letter-spacing: 0.0025rem;
}
.newsletter__text {
    color: var(--neutral-white);
}
.newsletter__form {
    display: flex;
    flex-direction: column;
    gap: 24px;
    width: 100%;
}
.newsletter__row {
    display: flex;
    gap: 24px;
    width: 100%;
}
.newsletter__field {
    flex: 1;
    height: 48px;
    padding: 13px 16px;
    border-radius: 16px;
    background-color: var(--neutral-white);
    font-family: Outfit, sans-serif;
    font-size: var(--font-16px);
    color: var(--primary-original);
    border: solid 1px var(--primary-light-70);
    letter-spacing: 0.0025rem;
}
.newsletter__field:focus {
    outline: none;
    box-shadow: 0 0 30px 0 #01596026;
    border: solid 1px var(--primary-original);
}
.newsletter__button {
    white-space: nowrap;
}
.newsletter__checkbox-label {
    max-width: 390px;
}
.newsletter__message {
    font-size: var(--font-16px);
    font-family: Outfit, sans-serif;
    font-weight: 600;
    padding: 12px 20px;
    border-radius: 12px;
    width: 100%;
}
.newsletter__message--success {
    background-color: rgba(255, 255, 255, 0.2);
    color: var(--neutral-white);
    border: 1px solid rgba(255, 255, 255, 0.5);
}
.newsletter__message--error {
    background-color: rgba(180, 30, 30, 0.25);
    color: #ffd0d0;
    border: 1px solid rgba(255, 150, 150, 0.5);
}

/** LOGIN ***************************************************************************/
.signup-modal,
.login-modal {
    padding: 0;
    border-radius: 5px;
    overflow: hidden;
}

.login-modal__html-container {
    padding: 0 !important;
}

div:where(.swal2-container),
div:where(.swal2-popup) {
    background-color: var(--secondary-light-90);
}
.swal2-html-container {
    /*padding: 0 !important;*/
}
/* stile da aggiungere al tuo foglio CSS (es. assets/styles/app.css) */
.swal2-popup.login-modal--fullscreen {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    bottom: 0 !important;
    margin: 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    height: 100vh !important;
    max-height: 100vh !important;
    border-radius: 0 !important;
    /*padding: 1rem !important;*/
    overflow: auto !important;
}
.signup-modal__title,
.login-modal__title {
    font-size: var(--font-16px);
    font-weight: normal;
    color: var(--primary-dark-40);
    background-color: var(--neutral-white);
    padding-bottom: 8px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}
.signup,
.login {
    background-color: var(--secondary-light-90);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 32px;
}
.signup__container,
.login__container {
    width: 100%;
    display: flex;
    gap: 0;
}
.signup__left,
.login__left {
    width: 50%;
    display: flex;
    flex-direction: column;
    justify-content: left;
    align-items: flex-start;
    text-align: left;
    gap: 32px;
    padding: 40px 24px;
    margin: 0 auto;
}
.signup__right,
.login__right {
    position: relative;
    width: 50%;
    background-image: url("../images/login-1-hUCbsN2.webp");
    background-color: var(--neutral-white);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}
.signup__title,
.login__title {
    font-size: var(--font-32px);
    letter-spacing: 0.0025rem;
}
.login__subtitle,
.signup__subtitle {
    font-size: var(--font-16px);
    letter-spacing: 0.0025rem;
    color: var(--neutral-black);
}
.signup__text,
.login__text {
    font-family: Outfit, sans-serif;
    font-weight: normal;
    font-size: var(--font-16px);
    line-height: 1.4;
    letter-spacing: 0.0025rem;
    color: var(--neutral-black);
}
.signup__form,
.login__form {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 40px;
}
.signup__form-group,
.login__form-group {
    display: flex;
    flex-direction: column;
    gap: 24px;
}
.signup__form-title,
.login__form-title {
    font-size: var(--font-16px);
    letter-spacing: 0.001rem;
    color: var(--primary-dark-40);
}
.signup__input,
.login__input {
    width: 100%;
    height: 48px;
    padding: 13px 16px;
    border-radius: 16px;
    background-color: var(--neutral-white);
    font-family: Outfit, sans-serif;
    font-size: var(--font-16px);
    color: var(--primary-original);
    border: solid 1px var(--primary-light-70);
    letter-spacing: 0.0025rem;
}
.signup__input:focus,
.login__input:focus {
    outline: none;
    box-shadow: 0 0 30px 0 #01596026;
    border: solid 1px var(--primary-original);
}
.input-container {
    position: relative;
    width: 100%;
}
.input-container input {
    width: 100%;
    padding-right: 48px; /* Spazio per l'icona */
}
.input-icon {
    position: absolute;
    top: 50%;
    right: 16px;
    transform: translateY(-50%);
    width: 24px;
    height: 24px;
    background-size: cover;
    background-repeat: no-repeat;
    z-index: 3;
    display: flex;
    justify-content: center;
}

.input-ghost {
    width: 1px !important;
    height: 1px !important;
    border: none;
}

.login__forgot-password {
    display: flex;
    gap: 10px;
    justify-content: flex-start;
    align-items: center;
    font-size: var(--font-16px);
    color: var(--primary-original);
    padding: 8px;
    width: fit-content;
}

.signup__password-requirements,
.signup__checkbox-label {
    font-size: var(--font-14px);
    color: var(--primary-original);
    line-height: 1.6rem;
    letter-spacing: 0.004rem;
}

.signup__have-account,
.login__no-account {
    font-size: var(--font-14px);
    color: var(--neutral-black);
    line-height: 1.6rem;
    letter-spacing: 0.004rem;
    text-align: center;
}

/** FORGOT PASSWORD ***************************************************************************/
.forgot-password {
    background-color: var(--secondary-light-90);
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 64px;
    /*min-height: calc(100vh - 360px);*/
}
.forgot-password__container {
    display: flex;
    flex-direction: column;
    gap: 24px;
    width: 100%;
    max-width: 642px;
}
.forgot-password__title {
    font-size: var(--font-32px);
    letter-spacing: 0.0025rem;
}
.forgot-password__subtitle {
    font-size: var(--font-16px);
    letter-spacing: 0.0025rem;
    color: var(--neutral-black);
}
.login__form-control {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 8px;
    width: 100%;
    margin-bottom: 20px;
}


/** HOME IN PROGRESS ***************************************************************************/
.home-in-progress {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 32px;
    padding: 64px 32px;
    min-height: calc(100vh - 360px);
    text-align: center;
}
.home-in-progress__title {
    font-size: var(--font-32px);
    letter-spacing: 0.0025rem;
}
.home-in-progress__text {
    font-family: Outfit, sans-serif;
    font-weight: normal;
    font-size: var(--font-18px);
    line-height: 1.4;
    letter-spacing: 0.005rem;
    color: var(--primary-dark-40);
    max-width: 800px;
}


/** USER PROFILE ***************************************************************************/
.user-profile {
    background-color: var(--secondary-light-90);
    padding: 64px;
}
.user-profile__container {
    display: flex;
    flex-direction: column;
    gap: 32px;
}
.user-profile__container-row {
    display: flex;
    gap: 96px;
}
.user-profile__left {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 32px;
}
.user-profile__right {
    flex: 2;
    display: flex;
    flex-direction: column;
    gap: 40px;
}
.user-profile__card {
    background-color: var(--neutral-white);
    border-radius: 16px;
    padding: 40px;
    /*box-shadow: 0px 0px 30px 0px #01596026;*/
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 24px;
    align-items: center;
}
.user-profile__avatar-container {
    position: relative;
    width: fit-content;
}
.user-profile__avatar {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    object-fit: cover;
    /*border: 2px solid var(--primary-original);*/
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: var(--primary-light-70);
}
.user-profile__avatar-icon {
    position: absolute;
    top: -7px;
    right: -10px;
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background-color: var(--primary-original);
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}

.user-profile__points {
    background-color: var(--secondary-light-90);
    color: var(--secondary-dark-40);
    border-radius: 8px;
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding: 24px;
    width: 100%;
}
.user-profile__points-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.user-profile__points-title {
    font-size: var(--font-16px);
    font-family: Outfit-Bold, sans-serif;
    font-weight: normal;
    letter-spacing: 0.001rem;
    color: var(--secondary-dark-40);
}
.user-profile__points-subtitle {
    font-size: var(--font-14px);
    color: var(--secondary-dark-40);
    line-height: 1.6rem;
    letter-spacing: 0.004rem;
    text-align: right;
}
.user-profile__points-value {
    color: var(--secondary-dark-70);
}
.user-profile__points-prize {
    font-size: var(--font-16px);
    letter-spacing: 0.0025rem;
    line-height: 1.6rem;
    text-align: right;
    color: var(--secondary-dark-70);
}
.user-profile__points-role {
    font-size: var(--font-14px);
    color: var(--secondary-dark-40);
    line-height: 19px;
    letter-spacing: -0.02rem;
}
.user-profile__points-row {
    font-size: var(--font-16px);
    color: var(--primary-dark-40);
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: 8px;
}
.user-profile__points-left {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.user-profile__points-right {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: end;
    gap: 0;
}

.user-profile__points-award {
    font-size: var(--font-16px);
    color: var(--secondary-dark-70);
    font-family: Outfit-Bold, sans-serif;
    font-weight: normal;
    text-align: right;
}
.user-profile__points-footer {
    font-size: var(--font-14px);
    font-family: Outfit, sans-serif;
    font-weight: normal;
    letter-spacing: 0.004rem;
    line-height: 1.6rem;
    color: var(--neutral-dark-40);
}

.user-profile__row {
    display: flex;
    flex-direction: column;
    gap: 24px;
}
.form-row,
.user-profile__form-row {
    display: flex;
    gap: 24px;
}

.form-control,
.user-profile__form-control {
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 8px;
    /*margin-bottom: 20px;*/
}
.form-control--label-absolute label,
.user-profile__form-control--label-absolute label {
    position: absolute;
    top: -12px;
    left: 16px;
    background-color: transparent;
    padding: 0 4px;
    z-index: 2;
}
/* pseudo-elemento che copre il bordo dell'input */
.search__label::before,
.form-control--label-absolute label::before,
.user-profile__form-control--label-absolute label::before {
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: 8px; /* regola leggermente in base alla posizione del bordo */
    height: 6px; /* spessore della "patch" che copre il bordo */
    background-color: var(--neutral-white); /* colore dell'input */
    z-index: -1; /* va dietro al testo della label */
    border-radius: 4px; /* per allinearsi ai bordi stondati dell'input */
}
.form-control label,
.user-profile__form-control label {
    font-size: var(--font-14px);
    color: var(--primary-dark-40);
    line-height: 1.6rem;
    letter-spacing: 0.004rem;
}
.form-control span,
.user-profile__form-control span
{
    font-size: var(--font-16px);
    color: var(--primary-dark-40);
    line-height: 1.6rem;
    letter-spacing: 0.0025rem;
}
.user-profile__form-input,
.form-control input,
.user-profile__form-control input
{
    width: 100%;
    height: 48px;
    padding: 13px 16px;
    border-radius: 16px;
    background-color: var(--neutral-white);
    font-family: Outfit, sans-serif;
    font-size: var(--font-16px);
    color: var(--primary-original);
    border: solid 1px var(--primary-light-70);
    letter-spacing: 0.0025rem;
}
.form-control input:focus,
.user-profile__form-input:focus {
    outline: none;
    box-shadow: 0 0 30px 0 #01596026;
    border: solid 1px var(--primary-original);
}

.user-profile__footer {
    margin-top: 128px;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}



/** HERO DESTINATIONS ******************************************************************/
.hero-destinations {
    background-image: url("../images/hero-destinations-1-OjcdIGO.webp");
    background-size: cover, cover;
    background-repeat: no-repeat;
    /*background-position: center 60%;*/
    background-position: center 67%;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 64px;
    padding: 200px 64px;
}
.hero-destinations__intro {
    display: flex;
    flex-direction: column;
    gap: 16px;
    max-width: 758px;
}


/** HERO SEARCH DESTINATION ******************************************************************/
.hero-search-destination {
    position: relative;
    background-image: url("../images/hero-search-destination-1-kV_cDP6.webp");
    background-size: cover, cover;
    background-repeat: no-repeat;
    background-position: center center;
    /*background-position: center 60%;*/
    display: flex;
    flex-direction: column;
    align-items: center;
    /*gap: 64px;*/
    padding: 100px 64px 64px;
    color: var(--neutral-white);
    min-height: 514px;
}
.hero-search-destination::after {
    content: '';
    position: absolute;
    inset: 0;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.25) 0%, rgba(0, 0, 0, 0.25) 50%, rgba(0, 0, 0, 0) 100%);
    z-index: 1;
    pointer-events: none;
}
.hero-search-destination .container {
    position: relative;
    z-index: 2;
}
.hero-search-destination--no-gallery {
    overflow: hidden;
}
.hero-search-destination--no-gallery::after {
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.4) 0%, rgba(0, 0, 0, 0.4) 60%, rgba(0, 0, 0, 0.25) 100%);
}

.results {
    background-color: var(--secondary-light-90);
    padding: 32px 64px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.results--min-height {
    min-height: calc(100vh - 300px);
}
.results__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.results__button {
    border: 1px solid var(--primary-original);
    color: var(--primary-original);
    border-radius: 24px;
    padding: 8px 16px;
    letter-spacing: 0.0025rem;
    background-color: transparent;
    display: flex;
    align-items: center;
    gap: 8px;
}
.results__top-section {
    /* stile normale */
    padding: 16px 64px;
    margin-left: -64px;
    margin-right: -64px;
    display: flex;
    flex-direction: column;
    gap: 16px;
}


.results__top-section--sticky {
    position: sticky;
    top: 96px;
    z-index: 1001;
    background-color: var(--secondary-light-90);
}

.results__per-page {
    display: flex;
    align-items: center;
    gap: 8px;
}


/** BOATS CARDS ******************************************************************/
.boats-grid {
    width: 100%;
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(310px, 1fr));
    gap: 24px;
}
.boat-card {
    border-radius: 16px;
    overflow: hidden;
    background: #f9ffff;
    box-shadow: 0 4px 12px rgba(0,0,0,0.08);
    display: flex;
    flex-direction: column;
    cursor: pointer;
}
.boat-card:hover {
    opacity: 0.8;
    transition: opacity 0.3s ease;
}
.boat-card .flickity-button {
    visibility: hidden;
}
.boat-card:hover .flickity-button {
    visibility: visible;
}

/** Cambia il cursore quando si può trascinare */
.boat-card .flickity-enabled.is-draggable .flickity-viewport {
    cursor: pointer;
}

.boat-card__image {
    position: relative;
    height: 212px;
    overflow: hidden;
}
.boat-card__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
    /*transition: transform 0.5s ease; !* zoom fluido *!*/
}
/* Applica lo zoom quando si è sopra tutta la card */
.boat-card:hover .boat-card__image img {
    /*transform: scale(1.1); !* Effetto zoom *!*/
}
.boat-card__image-carousel {
    width: 100%;
    height: 100%;
    position: relative;
}
.boat-card .flickity-cell {
    width: 100%;
    height: 221px;
    /*margin-right: 10px;*/
}
.boat-card__favorite {
    position: absolute;
    top: 10px;
    right: 10px;
    border: none;
    width: 48px;
    height: 48px;
    font-size: 16px;
    cursor: pointer;
    border-radius: 50%;
    background-color: var(--neutral-white);
    display: flex;
    justify-content: center;
    align-items: center;
}
.boat-card__location {
    background-color: var(--primary-light-90);
    color: var(--primary-original);
    font-size: var(--font-14px);
    padding: 4px 8px;
    position: absolute;
    bottom: 10px;
    left: 10px;
    display: flex;
    align-items: center;
    gap: 8px;
    border-radius: 32px;
}

.boat-card__content {
    background-color: var(--neutral-white);
    padding: 0.5rem 1rem;
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.boat-card__row {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 8px 0;
}
.boat-card__row--light {
    background-color: var(--neutral-light-90);
}

.boat-card__yacht {
    display: flex;
    flex-direction: column;
    gap: 4px;
}

.boat-card__label {
    font-family: Outfit-Light, sans-serif;
    font-size: var(--font-11px);
    color: var(--neutral-dark-70);
    line-height: 1.6rem;
    letter-spacing: 0.005rem;
    display: flex;
    align-items: center;
    gap: 8px;
}

.boat-card__info-content {
    display: flex;
    flex-direction: column;
    gap: 2px;
}

.boat-card__title {
    font-size: var(--font-16px);
    line-height: 1.6rem;
    letter-spacing: 0.0025rem;
    color: var(--primary-dark-40);
}

.boat-card__rating {
    /* TODO: temporaneamente nascosto - rimuovere il commento e ripristinare display:flex quando le recensioni saranno pronte */
    display: none; /* display: flex; */
    background-color: var(--neutral-light-90);
    border-radius: 8px;
    flex-direction: column;
    padding: 4px 8px;
    align-items: center;
    gap: 4px;
    width: fit-content;
    height: fit-content;
    min-height: 48px;
    justify-content: center;
}
.boat-card__rating-vote {
    display: flex;
    align-items: center;
    gap: 4px;
}
.boat-card__rating-values {
    display: flex;
    align-items: center;
    gap: 2px;
}
.boat-card__rating-title {
    font-size: var(--font-12px);
    line-height: 1.2rem;
    letter-spacing: -0.02rem;
    color: var(--primary-dark-40);
    text-align: center;
}
.boat-card__rating-subtitle {
    font-size: var(--font-11px);
    line-height: 1.2rem;
    letter-spacing: -0.02rem;
    color: var(--neutral-dark-70);
    text-align: center;
}
.boat-card__rating-value {
    font-family: Outfit-SemiBold, sans-serif;
    font-size: var(--font-14px);
    font-weight: normal;
    line-height: 1.2rem;
    letter-spacing: -0.02rem;
    color: var(--neutral-black);
}
.boat-card__rating-value--small {
    font-size: var(--font-11px);
}

.boat-card__divider {
    /*margin: 0.5rem 0;*/
    border: none;
    height: 1px;
    background-color: var(--neutral-light-70);
    border-radius: 8px;
}

.boat-card__info {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
}

.boat-card__left {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.boat-card__pricing {
    flex: 3;
    display: flex;
    gap: 9px;
    align-items: center;
}
.boat-card__prices {
    display: flex;
    gap: 7px;
    align-items: center;
}
.boat-card__old-price {
    color: var(--neutral-original);
    letter-spacing: 0.0025rem;
    line-height: 1.6rem;
    text-decoration: line-through;
    white-space: nowrap;
}
.boat-card__new-price {
    color: var(--primary-dark-40);
    font-family: Outfit-Bold, sans-serif;
    font-weight: normal;
    font-size: var(--font-16px);
    letter-spacing: 0.001rem;
    white-space: nowrap;
}
.boat-card__discount {
    background: var(--accent-light-90);
    color: var(--accent-dark-70);
    letter-spacing: 0.004rem;
    line-height: 1.6rem;
    font-size: var(--font-14px);
    padding: 4px 8px;
    border-radius: 16px;
    white-space: nowrap;
}

.boat-card__dates {
    width: fit-content;
    display: flex;
    gap: 8px;
    border-radius: 8px;
    background-color: var(--neutral-white);
    color: var(--neutral-black);
    font-family: Outfit-Light, sans-serif;
    font-size: var(--font-11px);
    font-weight: normal;
    line-height: 1.6rem;
    text-align: center;
    padding: 4px 8px;
    letter-spacing: 0.005rem;
}

.boat-card__button {
    flex: 1;
    white-space: nowrap;
    font-size: var(--font-14px);
    padding: 12px 16px;
    height: 35px;
    width: 76px;
}

.boat-card__footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 16px;
    padding: 8px 16px;
    height: 92px;
}


/** BOOK *************************************************************************/
.book {
    background-color: var(--secondary-light-90);
    padding: 32px;
    display: flex;
    flex-direction: column;
    gap: 32px;
}
.book__container {
    display: flex;
    flex-direction: column;
    gap: 32px;
    width: 100%;
}
.book__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.book__actions {
    display: flex;
    gap: 24px;
    align-items: center;
    justify-content: center;
}
.book__action {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: var(--font-14px);
    color: var(--primary-original);
    cursor: pointer;
    height: 40px;
}

.book__body {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.boat__gallery {
    flex: 1;
    display: grid;
    grid-template-columns: 1fr 1fr;
    position: relative;
    width: 100%;
    gap: 24px;
}
.boat__main-image {
    flex: 1;
    border-radius: 16px;
    /*overflow: hidden;*/
    width: 100%;
    aspect-ratio: 16 / 9;
    background-size: cover;
    background-position: center;
}
.boat__main-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}
.boat__thumbnails {
    flex: 1;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 1fr;
    gap: 24px;
}
.boat__thumbnail {
    width: 100%;
    height: 100%;
    border-radius: 16px;
    overflow: hidden;
    cursor: pointer;
    background-size: cover;
    background-position: center;
}
.boat__thumbnail:hover {
    opacity: 0.8;
    transition: opacity 0.3s ease;
}

.boat__button-all-photos {
    position: absolute;
    bottom: 16px;
    right: 16px;
    z-index: 2;
    cursor: pointer;
    background-color: var(--neutral-light-90);
    color: var(--primary-original);
    display: flex;
    align-items: center;
    gap: 10px;
    border-radius: 32px;
    transition: all 0.3s ease-in-out;
    padding: 12px 16px;
}

.book__gallery {
    position: relative;
    width: 100%;
    flex: 1;
    display: flex;
    gap: 24px;
}
.book__main-image {
    flex: 1;
    border-radius: 16px;
    overflow: hidden;
    height: 100%;
}
.book__main-image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}
.book__thumbnails {
    flex: 1;
    display: grid;
    grid-template-columns: 1fr 1fr;
    grid-template-rows: 1fr 1fr;
    gap: 24px;
}
.book__thumbnail {
    width: 100%;
    height: 100%;
    border-radius: 16px;
    overflow: hidden;
    cursor: pointer;
}
.book__thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}
.book__thumbnail:hover {
    opacity: 0.8;
    transition: opacity 0.3s ease;
}

.book__button-all-photos {
    position: absolute;
    bottom: 16px;
    right: 16px;
    z-index: 2;
    cursor: pointer;
    background-color: var(--neutral-light-90);
    color: var(--primary-original);
    display: flex;
    align-items: center;
    gap: 10px;
    border-radius: 32px;
    transition: all 0.3s ease-in-out;
    padding: 12px 16px;
}

.photos-modal {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--neutral-white);
    display: flex;
    flex-direction: column;
    z-index: 9999;
}
.photos-modal.hidden {
    display: none;
}
.photos-modal__header {
    position: relative;
    background: #f8f8f8;
    padding: 1rem;
    font-weight: bold;
    display: flex;
    justify-content: center;
    align-items: center;
}
.photos-modal__body {
}
.photos-modal__close {
    position: absolute;
    top: 8px;
    right: 16px;
    background: none;
    border: none;
    font-size: 2rem;
    cursor: pointer;
}
.photos-modal__main-carousel {
    flex: 1 1 auto;
    width: 100%;
    min-width: 0;
}
.photos-modal__carousel {
    min-width: 0;
    width: 100%;
    background-color: var(--neutral-light-90);
}
.photos-modal__carousel-cell {
    width: 100% !important;         /* ogni cella prende tutta la larghezza */
    height: 80vh;
    display: flex;
    justify-content: center;
    align-items: center;
    /*background: var(--neutral-black);*/
}
.photos-modal__carousel-cell img {
    width: 100%;
    height: 100%;
    object-fit: contain;          /* mantiene proporzioni e bordi */
}

.book__details {
    display: flex;
    gap: 32px;
}
.book__details-left
{
    flex: 1;
}
.book__details-right
{
    flex: 1;
}

/** BOOK FLEX *******************************************************************/
.book__flex {
    display: flex;
    gap: 16px;
}
.book__flex-column {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.book__flex--space-between {
    justify-content: space-between;
    /*align-items: center;*/
}
.book__flex--align-center {
    align-items: center;
}
.book__flex--align-start {
    align-items: flex-start;
}
.book__flex--gap-8 {
    gap: 8px;
}
.book__flex--gap-10 {
    gap: 10px;
}
.book__flex--gap-16 {
    gap: 16px;
}
.book__flex--gap-24 {
    gap: 24px;
}
.book__flex--gap-32 {
    gap: 32px;
}
.book__flex--gap-40 {
    gap: 40px;
}
.book__flex--gap-48 {
    gap: 48px;
}

.book__flex-1 {
    flex: 1;
}
.book__flex-2 {
    flex: 2;
}
.book__flex-3 {
    flex: 3;
}

.book__title {
    font-family: Outfit-Bold, sans-serif;
    font-weight: normal;
    font-size: var(--font-18px);
    letter-spacing: 0.0015rem;
    color: var(--primary-dark-40);
    line-height: 1.6rem;
}

.book__model {
    font-family: Outfit, sans-serif;
    font-size: var(--font-16px);
    letter-spacing: 0.004rem;
    color: var(--neutral-dark-70);
    line-height: 1.6rem;
    display: flex;
    align-items: center;
    gap: 8px;

}

.book__subtitle {
    font-family: Outfit-Bold, sans-serif;
    font-size: var(--font-16px);
    letter-spacing: 0.0025rem;
    color: var(--primary-dark-40);
    line-height: 1.6rem;
}
.book__caption {
    font-family: Outfit-Bold, sans-serif;
    font-weight: normal;
    font-size: var(--font-14px);
    letter-spacing: 0.004rem;
    color: var(--primary-dark-40);
    line-height: 1.6rem;
}

.book__divider {
    /*margin: 0.5rem 0;*/
    border: none;
    height: 2px;
    background-color: var(--neutral-white);
    border-radius: 8px;
    width: 100%;
}
.book__divider--light {
    background-color: var(--neutral-light-70);
    height: 1px;
}

.book__address {
    display: flex;
    align-items: center;
}

.book__section {
    display: flex;
    flex-direction: column;
    gap: 24px;
}
.book__info {
    display: flex;
    flex-direction: column;
    gap: 18px;
}
.book__info-item {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
    align-items: flex-start;
    height: auto;
}
.book__info-item label {
    white-space: normal;   /* consente di andare a capo */
    word-break: break-word; /* forza l'andare a capo se necessario */
}
.book__info-label {
    font-size: var(--font-14px);
    color: var(--neutral-dark-70);
    letter-spacing: 0.004rem;
}
.book__info-label--total {
    font-family: Outfit-Bold, sans-serif;
    font-weight: normal;
    color: var(--primary-dark-40);
    font-size: var(--font-16px);
    letter-spacing: 0.001rem;
}
.book__info-value {
    font-size: var(--font-14px);
    color: var(--primary-dark-40);
    letter-spacing: 0.004rem;
    display: flex;
    align-items: center;
    gap: 8px;
}
.book__info-value--total {
    font-family: Outfit-ExtraBold, sans-serif;
    font-weight: normal;
    color: var(--primary-dark-40);
    font-size: var(--font-27px);
    line-height: 1.6rem;
    letter-spacing: 0;
}
.book__input {
    width: 100%;
    height: 48px;
    padding: 0 8px;
    border-radius: 8px;
    background-color: var(--neutral-white);
    font-family: Outfit, sans-serif;
    font-size: var(--font-16px);
    color: var(--primary-original);
    border: solid 1px var(--primary-light-70);
    letter-spacing: 0.0025rem;
}
.book__input:focus {
    outline: none;
    border: solid 1px var(--primary-original);
}
.book__input--small {
    height: 32px;
    width: 60px;
}
/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
}
/* Firefox */
input[type=number].book__input {
    -moz-appearance: textfield;
}

.book__card {
    background-color: var(--neutral-white);
    border-radius: 16px;
    padding: 16px;
    /*box-shadow: 0px 0px 30px 0px #01596026;*/
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 16px;
    transition: all 0.3s ease;
}

.book__card--accent {
    background-color: var(--accent-light-90);
    color: var(--accent-dark-70);
}

.book__card--form {
    padding: 24px;
}

.book__card-columns {
    display: flex;
    gap: 48px;
}
.book__card-columns--reverse {
    flex-direction: row-reverse;
}
.book__card-column {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 24px;
}
.book__card-column-top {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.book__card-header {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: var(--font-16px);
    letter-spacing: 0.0025rem;
    line-height: 1.6rem;
}

.book__card-content {
    display: flex;
    flex-direction: column;
    gap: 8px;
    color: var(--neutral-black);
}

.book__card-body {
    font-size: var(--font-14px);
    letter-spacing: 0.004rem;
    line-height: 1.6rem;
    color: var(--neutral-black);
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.book__card-title {
    font-family: Outfit, sans-serif;
    font-weight: normal;
    font-size: var(--font-16px);
    letter-spacing: 0.0025rem;
    line-height: 1.6rem;
    color: var(--accent-dark-40);
}

.book__card-subtitle {
    font-family: Outfit-Bold, sans-serif;
    font-size: var(--font-14px);
    letter-spacing: 0.004rem;
    color: var(--neutral-black);
    line-height: 1.6rem;
}

.book__charter-duration {
    display: flex;
    align-items: center;
    gap: 4px;
    font-size: var(--font-14px);
    color: var(--neutral-black);
    letter-spacing: 0.004rem;
}

.book__checkin-days {
    display: grid;
    grid-template-columns: 1fr 1fr;
    /*flex-direction: column;*/
    /*justify-content: space-between;*/
    gap: 24px;
}
.book__checkin-days-header {
    display: flex;
    flex-direction: column;
    gap: 8px;
}

.book__checkin-days-label {
    font-size: var(--font-12px);
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--neutral-dark-40);
}

.book__checkin-days-badges {
    display: flex;
    gap: 6px;
}

.book__checkin-day-badge {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: var(--font-14px);
    font-weight: 400;
    font-family: Outfit, sans-serif;
    /*background-color: rgba(255, 255, 255, 0.5);*/
    color: var(--neutral-dark-40);
    user-select: none;
    letter-spacing: 0.004rem;
}

.book__checkin-day-badge--active {
    background-color: var(--secondary-light-90);
    color: var(--secondary-dark-70);
    font-weight: 600;
}


.book__details-card {
    display: flex;
    flex-direction: column;
    gap: 16px;
}

.book__location {
    background-color: var(--neutral-white);
    color: var(--primary-dark-40);
    font-size: var(--font-14px);
    letter-spacing: 0.004rem;
    vertical-align: middle;
    line-height: 1.6rem;
    padding: 8px 12px;
    display: flex;
    align-items: center;
    gap: 10px;
    border-radius: 32px;
    width: fit-content;
}

.book__card-image {
    width: 100%;
    height: auto;
    object-fit: contain;
    object-position: left;
    display: block;
    border-radius: 8px;
}

.book__card-vote {
    display: flex;
    align-items: center;
    gap: 24px;
    font-size: var(--font-14px);
    color: var(--neutral-dark-40);
    letter-spacing: 0.004rem;
    line-height: 1.6rem;
}
.book__card-vote-stars {
    display: flex;
    align-items: center;
    gap: 4px;
}
.book__buttons {
    padding-top: 24px;
    display: flex;
    gap: 16px;
    flex-wrap: wrap;
}
.book__buttons .btn {
    flex: 1;
}
.book__view-map {
    display: flex;
    gap: 10px;
    align-items: center;
}

/** BOOK CONFIRMATION *************************************************************************/
.book-confirmation {
    background-color: var(--secondary-light-90);
    padding: 32px;
    display: flex;
    flex-direction: column;
    gap: 32px;
}
.book-confirmation__container {
    display: flex;
    flex-direction: column;
    gap: 32px;
    width: 100%;
}
.book-confirmation__details {
    display: flex;
    gap: 24px;
}
.book-confirmation__details-left
{
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 24px;
}
.book-confirmation__details-right
{
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 24px;
}
.book-confirmation__info-group {
    display: flex;
    flex-direction: column;
    gap: 18px;
}
.book-confirmation__subtitle {
    font-family: Outfit-Bold, sans-serif;
    font-size: var(--font-16px);
    letter-spacing: 0.001rem;
    color: var(--primary-dark-40);
    line-height: 1.6rem;
}
.book-confirmation__info {
    display: flex;
    gap: 24px;
    align-items: center;
}
.book-confirmation__info-item {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.book-confirmation__link {
    text-decoration: underline;
    color: var(--primary-dark-40);
}
.book-confirmation__info-label {
    font-size: var(--font-14px);
    color: var(--primary-dark-40);
    letter-spacing: 0.004rem;
    /*line-height: 1.6rem;*/
}
.book-confirmation__info-value {
    font-size: var(--font-16px);
    color: var(--primary-dark-40);
    /*line-height: 1.6rem;*/
    letter-spacing: 0.0025rem;
    display: flex;
    align-items: center;
    gap: 8px;
}
.book-confirmation__input {
    width: 100%;
    height: 48px;
    padding: 13px 16px;
    border-radius: 16px;
    background-color: var(--neutral-white);
    font-family: Outfit, sans-serif;
    font-size: var(--font-16px);
    color: var(--primary-original);
    border: solid 1px var(--primary-light-70);
    letter-spacing: 0.0025rem;
}
.book-confirmation__input:focus {
    outline: none;
    border: solid 1px var(--primary-original);
}
.book-confirmation__textarea {
    width: 100%;
    height: 157px;
    padding: 13px 16px;
    border-radius: 16px;
    background-color: var(--neutral-white);
    font-family: Outfit, sans-serif;
    font-size: var(--font-16px);
    color: var(--primary-original);
    border: solid 1px var(--primary-light-70);
    letter-spacing: 0.0025rem;
    resize: none;
}
.book-confirmation__textarea:focus {
    outline: none;
    border: solid 1px var(--primary-original);
}
.book-confirmation__actions {
    display: flex;
    gap: 16px;
    margin-top: 16px;
}

.book-confirmation__info-note {
    font-size: var(--font-14px);
    color: var(--neutral-dark-40);
    letter-spacing: 0.004rem;
    /*line-height: 1.6rem;*/
}

.book-confirmation__summary {
    background-color: var(--neutral-white);
    border-radius: 16px;
    padding: 24px;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 24px;
}
.book-confirmation__boat-card {
    display: flex;
    gap: 24px;
}
.book-confirmation__boat-image-wrapper {
    width: 175px;
    height: 87px;
    border-radius: 16px;
    overflow: hidden;
    flex-shrink: 0;
}
.book-confirmation__boat-image-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}
.book-confirmation__boat-info {
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex: 1;
}
.book-confirmation__boat-content {
    width: 100%;
    display: flex;
    gap: 8px;
    justify-content: space-between;
}
.book-confirmation__boat-details {
    display: flex;
    flex-direction: column;
    gap: 4px;
    flex: 1;
}
.book-confirmation__trip-details {
    display: flex;
    gap: 8px;
    font-size: var(--font-11px);
    font-family: Outfit-Light, sans-serif;
    color: var(--primary-dark-40);
    letter-spacing: 0.005rem;
    line-height: 1.6rem;
    align-items: center;
}
.book-confirmation__booking-details {
    display: flex;
    gap: 8px;
    font-size: var(--font-11px);
    font-family: Outfit-Light, sans-serif;
    color: var(--primary-dark-40);
    letter-spacing: 0.005rem;
    line-height: 1.6rem;
    align-items: center;
}
.book-confirmation__vertical-divider {
    border-left: 1px solid var(--neutral-light-70);
    height: 14px;
    align-self: center;
}
.book-confirmation__port {
    display: flex;
    flex-direction: column;
    gap: 2px;
}
.book-confirmation__boat-type {
    font-size: var(--font-14px);
    color: var(--neutral-dark-70);
    letter-spacing: 0.004rem;
    line-height: 1.6rem;
}
.book-confirmation__boat-name {
    font-family: Outfit-Bold, sans-serif;
    font-weight: normal;
    font-size: var(--font-18px);
    letter-spacing: 0.0015rem;
    line-height: 1.6rem;
    color: var(--primary-dark-40);
}
.book-confirmation__boat-base {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: var(--font-14px);
    color: var(--primary-original);
    background-color: var(--primary-light-90);
    padding: 4px 8px;
    letter-spacing: 0.004rem;
    line-height: 1.6rem;
    vertical-align: middle;
    border-radius: 32px;
    width: fit-content;
}
.book-confirmation__summary-divider {
    /*margin: 0.5rem 0;*/
    border: none;
    height: 1px;
    background-color: var(--neutral-light-70);
    border-radius: 8px;
    width: 100%;
}
.book-confirmation__summary-title {
    font-family: Outfit-Bold, sans-serif;
    font-size: var(--font-16px);
    letter-spacing: 0.001rem;
    color: var(--primary-dark-40);
    line-height: 1.6rem;
}
.book-confirmation__summary-section {
    display: flex;
    flex-direction: column;
    gap: 24px;
}
.book-confirmation__summary-item {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 24px;
}
.book-confirmation__summary-label {
    font-size: var(--font-14px);
    color: var(--neutral-black);
    letter-spacing: 0.004rem;
    line-height: 1.6rem;
}
.book-confirmation__summary-label--dark {
    color: var(--primary-dark-40);
}
.book-confirmation__summary-value {
    font-size: var(--font-14px);
    color: var(--primary-dark-40);
    line-height: 1.6rem;
    letter-spacing: 0.0025rem;
}
.book-confirmation__total-price {
    font-family: Outfit-ExtraBold, sans-serif;
    font-weight: normal;
    color: var(--primary-dark-40);
    font-size: var(--font-27px);
    line-height: 1.6rem;
    letter-spacing: 0;
}
.book-confirmation__summary-note {
    font-family: Outfit-Light, sans-serif;
    font-size: var(--font-11px);
    color: var(--primary-dark-70);
    letter-spacing: 0.005rem;
    /*line-height: 1.6rem;*/
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.book-confirmation__summary-note-list {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.book-confirmation__summary-note-item {
    display: flex;
    align-items: center;
    gap: 8px;
}
.book-confirmation__note {
    font-size: var(--font-14px);
    color: var(--neutral-black);
    letter-spacing: 0.004rem;
    /*line-height: 1.6rem;*/
}
.book-confirmation__note-link {
    /*color: var(--primary-original);*/
    text-decoration: underline;
    cursor: pointer;
}


/** NO RESULTS ******************************************************************/
.no-results {
    background-color: var(--secondary-light-90);
    padding: 64px 32px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 32px;
}
.no-results__container {
    display: flex;
    flex-direction: column;
    gap: 32px;
    width: 100%;
    max-width: 600px;
}

/** MAYBE ****************************************************************************/
.maybe {
    background-color: var(--secondary-light-90);
    padding: 32px;
    display: flex;
    flex-direction: column;
    gap: 32px;
}
.maybe__container {
    display: flex;
    flex-direction: column;
    gap: 32px;
    width: 100%;
}

/** MEDIA GALLERY ******************************************************************/
.media-gallery {
    position: relative;
    z-index: 2;
    background-color: transparent;
    padding: 32px;
    display: flex;
    flex-direction: column;
    gap: 32px;
    margin-top: -240px
}
.media-gallery__container {
    display: flex;
    gap: 16px;
    width: 100%;
    overflow-x: auto;
}
.media-gallery__item img,
.media-gallery__item video {
    max-height: 278px;
    width: auto;
    height: auto;
    object-fit: contain; /* mantiene il contenuto intero senza tagliarlo */
    display: block;
    border-radius: 6px;
}

/** PAYMENT SUCCESS ******************************************************************/
.payment-success {
    background-color: var(--secondary-light-90);
    padding: 64px 32px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 32px;
    min-height: 60vh;
}
.payment-success__content {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 32px;
    max-width: 600px;
    text-align: center;
    margin: 0 auto;
}
.payment-success__message {
    color: var(--neutral-black);
    font-size: var(--font-16px);
    line-height: 1.6rem;
    letter-spacing: 0.0025rem;
    text-align: center;
}


/** RESERVATIONS ******************************************************************/
.reservations {
    background-color: var(--secondary-light-90);
    padding: 32px;
    display: flex;
    flex-direction: column;
    gap: 32px;
    min-height: 60vh;
}
.reservations__container {
    display: flex;
    flex-direction: column;
    gap: 32px;
    width: 100%;
}

/** RESERVATION CARD ******************************************************************/
.reservation-card {
    background-color: var(--neutral-white);
    border-radius: 16px;
    width: 100%;
    display: flex;
    gap: 16px;
}
.reservation-card__container {
    display: flex;
    flex-direction: column;
    gap: 16px;
    width: 100%;
}
.reservation-card--horizontal .reservation-card__container {
    flex-direction: row-reverse;
}
.reservation-card__image-container {
    position: relative;
    height: 100%;
    flex: 1;
    width: 100%;
    background-size: cover;
    background-position: center;
}
.reservation-card--horizontal .reservation-card__image {
    border-radius: 0 16px 16px 0;
    min-width: 250px;
    min-height: 125px;
}
.reservation-card--vertical .reservation-card__image {
    border-radius: 16px 16px 0 0;
    min-width: unset;
    min-height: 212px;
}
.reservation-card__image-chip {
    position: absolute;
    top: 10px;
    right: 10px;
    font-size: var(--font-14px);
    padding: 4px 8px;
    display: flex;
    align-items: center;
    gap: 8px;
    border-radius: 32px;
}
.reservation-card__content {
    flex: 1;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 40px;
    padding: 24px;
}
.reservation-card__content-top {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.reservation-card__content-top-header {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.reservation-card__content-top-body {
    display: flex;
    flex-direction: column;
    gap: 24px;
}
.reservation-card__subtitle {
    font-family: Outfit, sans-serif;
    font-size: var(--font-14px);
    letter-spacing: 0.004rem;
    color: var(--neutral-dark-70);
    line-height: 1.6rem;
}
.reservation-card__base {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: var(--font-14px);
    color: var(--primary-dark-40);
    letter-spacing: 0.004rem;
    line-height: 1.6rem;
    vertical-align: middle;
}

.reservation-card__info {
    display: flex;
    gap: 40px;
    align-items: center;
    justify-content: space-between;
    background-color: var(--neutral-light-90);
    padding: 8px;
    border-radius: 8px;
}
.reservation-card__info-item {
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: flex-start;
    height: auto;
}
.reservation-card__info-prices {
    display: flex;
    flex-direction: column;
    gap: 8px;
    align-items: flex-start;
    border-radius: 8px;
    padding: 8px;
    background-color: var(--primary-light-90);
}
.reservation-card__info-price {
    display: flex;
    justify-content: space-between;
    width: 100%;
    align-items: center;
    gap: 8px;
}
.reservation-card__row {
    display: flex;
    gap: 24px;
    align-items: center;
}
.reservation-card__error-message {
    font-size: var(--font-14px);
    color: var(--accent-dark-70);
    background-color: var(--accent-light-90);
    letter-spacing: 0.004rem;
    line-height: 1.6rem;
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 8px;
    border-radius: 8px;
}
.reservation-card__label {
    font-size: var(--font-14px);
    color: var(--neutral-black);
    letter-spacing: 0.004rem;
    line-height: 1.6rem;
}
.reservation-card__value {
    font-size: var(--font-14px);
    color: var(--primary-dark-40);
    line-height: 1.6rem;
    letter-spacing: 0.004rem;
    display: flex;
    align-items: center;
    gap: 8px;
}

.reservation-card__actions {
    display: flex;
    justify-content: flex-start;
    gap: 24px;
    /*flex-wrap: wrap;*/
    flex-shrink: 0;
}

.reservations__missing,
.reservations__next {
    display: flex;
    flex-direction: column;
    gap: 32px;
}

.reservations__previous {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 16px;
}

/** RESERVATION DETAIL ******************************************************************/
.reservation-detail {
    background-color: var(--secondary-light-90);
    padding: 32px;
    display: flex;
    flex-direction: column;
    gap: 32px;
}
.reservation-detail__container {
    display: flex;
    flex-direction: column;
    gap: 32px;
    width: 100%;
}

.reservation-detail__header {
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.reservation-detail__body {
    display: flex;
    flex-direction: column;
    gap: 24px;
}
.yacht-detail__body {
    display: flex;
    flex-direction: column;
    gap: 24px;
}


/** YACHT DETAIL ******************************************************************/
.yacht-detail {
    background-color: var(--secondary-light-90);
    padding: 32px;
    display: flex;
    flex-direction: column;
    gap: 32px;
}
.yacht-detail__container {
    display: flex;
    flex-direction: column;
    gap: 32px;
    width: 100%;
}


/** CHAT BOT ******************************************************************/
.chat-bot {
    position: fixed;
    bottom: 32px;
    right: 64px;
    z-index: 1000;
}
.chat-bot__button {
    width: 64px;
    height: 64px;
    border-radius: 50%;
    background-color: var(--accent-original);
    color: var(--neutral-white);
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    transition: background-color 0.3s ease;
}
.chat-bot__button:hover {
    background-color: var(--accent-dark-40);
}
.chat-bot__icon {
    width: 40px;
    height: 40px;
}
.chat-bot__tooltip {
    position: absolute;
    bottom: calc(100% + 12px);
    right: 0;
    width: 216px;
    min-height: 54px;
    background-color: #015960;
    border-radius: 8px;
    /*padding: 8px 28px 8px 12px;*/
    padding: 16px;
    opacity: 0;
    pointer-events: none;
    transform: translateY(6px);
    transition: opacity 0.3s ease, transform 0.3s ease;
}
.chat-bot__tooltip.is-visible {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0);
}
.chat-bot__tooltip::after {
    content: '';
    position: absolute;
    bottom: -6px;
    right: 22px;
    width: 12px;
    height: 12px;
    background-color: #015960;
    transform: rotate(45deg);
    border-radius: 2px;
}
.chat-bot__tooltip-close {
    position: absolute;
    top: 6px;
    right: 8px;
    background: none;
    border: none;
    color: var(--neutral-white);
    font-size: 10px;
    line-height: 1;
    cursor: pointer;
    padding: 2px;
    opacity: 0.8;
    transition: opacity 0.2s ease;
}
.chat-bot__tooltip-close:hover {
    opacity: 1;
}
.chat-bot__tooltip-text {
    color: var(--neutral-white);
    font-size: 14px;
    letter-spacing: 0.004rem;
    line-height: 1.4;
    margin: 0;
}

/** SPECIAL OFFERS ******************************************************************/
.special-offers {
    background-color: var(--secondary-light-90);
    padding: 32px;
    display: flex;
    flex-direction: column;
    gap: 32px;
    min-height: 60vh;
}
.special-offers--home {
    background-color: var(--secondary-original);
    background-image: url("../images/bg-pattern-secondary-0yUN3yE.svg");
    align-items: center;
    gap: 64px;
    padding: 64px;
    min-height: 745px;
}
.special-offers__container {
    display: flex;
    flex-direction: column;
    gap: 32px;
    width: 100%;
}
.special-offers__container--home {
    align-items: center;
}
.special-offers__carousel {
    width: 100%;
}
.special-offers__carousel-item {
    padding: 0 16px;
}
.special-offers__footer {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    align-items: center;
    width: 100%;
}
.special-offers__footer .carousel-controls {
    justify-self: end;
}

/** BLOGS *******************************************************************/
.blogs {
    background-color: var(--secondary-light-90);
    padding: 32px;
    display: flex;
    flex-direction: column;
    gap: 32px;
    min-height: 60vh;
}
.blogs__container {
    display: flex;
    flex-direction: column;
    gap: 32px;
    width: 100%;
}
.blogs__grid {
    display: grid;
    grid-template-columns: 1fr 1fr 1fr;
    gap: 24px;
    justify-content: center;
    align-items: start;
    grid-auto-rows: auto;
    /*max-width: 1400px;*/
    /*margin: 0 auto;*/
}
/* Assicura che gli elementi figli rispettino la larghezza della colonna */
.blogs__grid > * {
    width: 100%;
    box-sizing: border-box;
    position: static; /* sovrascrive eventuali position:absolute ereditate */
}
.blogs__grid--single-column {
    grid-template-columns: 1fr !important;
}
.blogs__grid--single-row {
    grid-template-rows: 1fr;
    grid-auto-flow: column;
    overflow-x: auto;
    white-space: nowrap;
}
.blogs__grid--three-columns {
    grid-template-columns: repeat(3, 1fr);
}
.blog-card {
    display: flex;
    flex-direction: column;
    gap: 24px;
    width: 100%;
    max-width: 421px;
    box-sizing: border-box;
}
.blog-card__image {
    max-width: 421px;
    width: 100%;
    height: auto;
    max-height: 260px;
    object-fit: cover;
    border-radius: 16px;
}
.blog__items .blog-card {
    min-width: 300px;
    width: 25%;
    max-width: unset;
    padding: 0 12px;
}
.blog__items .blog-card__image {
    height: 200px;
    max-width: unset;
    max-height: unset;
}
.blog-card__content {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.blog-card__title {
    font-family: Outfit-Medium, sans-serif;
    font-weight: normal;
    font-size: var(--font-23px);
    letter-spacing: 0.0015rem;
    color: var(--primary-dark-40);
    line-height: 1.6rem;
}
.blog-card__subtitle {
    font-family: Outfit, sans-serif;
    font-size: var(--font-16px);
    letter-spacing: 0.0025rem;
    color: var(--neutral-black);
    line-height: 1.6rem;
}
.blog-card__footer {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

/** BLOG DETAIL ******************************************************************/
.blog-detail {
    background-color: var(--secondary-light-90);
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 32px;
}
.blog-detail__container {
    display: flex;
    width: 100%;
    gap: 32px;
}
.blog-detail__back-link {
    font-size: var(--font-16px);
    color: var(--primary-dark-40);
    letter-spacing: 0.0025rem;
    line-height: 1.6rem;
    display: flex;
    align-items: center;
    gap: 8px;
}
.blog-detail__main-article {
    flex: 2;
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 32px;
}
.blog-detail__main-article-header {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.blog-detail__image-wrapper {
    width: 100%;
    max-width: 800px;
    height: auto;
    border-radius: 16px;
    overflow: hidden;
}
.blog-detail__image-wrapper img {
    width: 100%;
    height: auto;
    object-fit: cover;
    object-position: center;
    display: block;
}
.blog-detail__image {
    max-height: 460px;
}
.blog-detail__content {
    display: flex;
    flex-direction: column;
    gap: 40px;
}
.blog-detail__content p {
    font-size: var(--font-18px);
    color: var(--neutral-black);
    letter-spacing: 0.005rem;
    line-height: 1.6rem;
}
.blog-detail__content h2, .blog-detail__content h3 {
    font-family: Outfit-Bold, sans-serif;
    font-weight: normal;
    font-size: var(--font-18px);
    color: var(--primary-dark-40);
    letter-spacing: 0.0015rem;
    line-height: 1.6rem;
}
.blog-detail__other-articles {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 24px;
    background-color: var(--neutral-white);
    padding: 16px;
}

/** FIXED BOOKING BUTTON ON MOBILE ******************************************************************/
.book__fixed-button {
    position: fixed;
    bottom: 32px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1000;
    max-width: 500px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.2);
    transition: opacity 0.3s ease;
    /*width: fit-content !important;*/
    width: calc(100% - 40px); /* per avere un po' di margine ai lati */
}

/** REVIEW FORM ********************************************************************/
.review-form {
    background-color: var(--secondary-light-90);
    padding: 24px;
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 16px;
    border-bottom-left-radius: 16px;
    border-bottom-right-radius: 16px;
}
.review-form__popup {
    padding: 0 !important;
}
.review-form__container {
    padding: 0 !important;
    text-align: left;
}
.review-form__body {
    display: flex;
    flex-direction: column;
    gap: 24px;
}
.review-form__title {
    font-family: Outfit-Bold, sans-serif;
    font-weight: normal;
    font-size: var(--font-18px);
    letter-spacing: 0.0015rem;
    color: var(--primary-dark-40);
    line-height: 1.6rem;
}
.review-form__text {
    font-weight: normal;
    font-size: var(--font-16px);
    color: var(--primary-dark-40);
    letter-spacing: 0.0025rem;
    line-height: 1.6rem;
}
.review-form__subtitle {
    font-family: Outfit-Bold, sans-serif;
    font-weight: normal;
    font-size: var(--font-16px);
    color: var(--primary-dark-40);
    letter-spacing: 0.001rem;
    line-height: 1.6rem;
}

.review-form__group {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.review-form__controls {
    display: flex;
    justify-content: space-between;
    gap: 16px;
}

.review-form__stars {
    display: flex;
    align-items: center;
    gap: 4px;
    cursor: pointer;
}

.review-form__star {
    font-size: 2rem;
    transition: transform 0.15s ease, color 0.15s ease;
    color: #f5c518; /* colore per stelle piene */
}

.review-form__star:hover,
.review-form__star:hover ~ .review-form__star {
    transform: scale(1.1);
}

/** GOOGLE MAPS ***********************************************************/
/* Set the size of the gmp-map element that contains the map */
gmp-map {
    height: 300px;
    width: 100%;
    border-radius: 16px;
    box-shadow: 0 4px 20px 0 #01596026;
    /* Per assicurarti che l'ombra sia visibile, potresti aver bisogno anche di overflow: hidden; */
    overflow: hidden;
}



.ghost-boat-cards {
    width: 100%;
    display: flex;
    gap: 24px;
    align-items: center;
    justify-content: flex-start;
    flex-wrap: nowrap;
    overflow-x: hidden;
    overflow-y: hidden;
    padding: 12px;
    box-sizing: border-box;
}

.ghost-boat-card {
    width: 310px;
    max-width: 100%;
    height: auto;
    max-height: 440px;
    object-fit: contain;              /* mantiene proporzioni senza tagliare */
    display: block;
    border-radius: 8px;
}

/** PAGINATION ******************************************************************/
.pagination {
    width: 100%;
    display: flex;
    gap: 8px;
    justify-content: space-between;
    align-items: center;
    flex-wrap: wrap;
}
.pagination__pages {
    margin-top: 32px;
    margin-bottom: 32px;
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 16px;
}
.pagination__page {
    width: 41px;
    height: 48px;
    color: var(--primary-dark-40);
    display: flex;
    align-items: center;
    gap: 10px;
    justify-content: center;
    font-size: var(--font-16px);
    cursor: pointer;
    /*transition: background-color 0.3s ease, color 0.3s ease;*/
    background: none;
    border: none;
}
.pagination__page:hover {
    background-color: var(--primary-original);
    color: var(--neutral-white);
    border-radius: 40px;
}
.pagination__page--active {
    color: var(--primary-original);
    background-color: var(--neutral-white);
    border-radius: 40px;
    border: solid 1px var(--primary-original);
    height: 48px;
    width: 38px;
}
.pagination__ellipsis {
    font-size: var(--font-14px);
    color: var(--primary-dark-40);
}
.pagination__prev {
    width: 124px;
    height: 48px;
}
.pagination__next {
    width: 101px;
    height: 48px;
}
.pagination__prev,
.pagination__next {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    cursor: pointer;
    font-size: var(--font-16px);
    color: var(--primary-original);
    padding: 12px 16px;
    border-radius: 32px;
    background: none;
    border: solid 1px var(--primary-original);
}
.pagination__prev:hover,
.pagination__next:hover {
    color: var(--primary-original);
}
.pagination__prev:disabled,
.pagination__next:disabled {
    cursor: not-allowed;
    opacity: 0.5;
    border: solid 1px var(--primary-light-90);
}
.pagination__per-page-input {
    width: 86px;
    height: 48px;
    padding: 13px 16px;
    border-radius: 16px;
    background-color: var(--neutral-white);
    font-family: Outfit, sans-serif;
    font-size: var(--font-16px);
    color: var(--primary-original);
    border: solid 1px var(--primary-original);
    letter-spacing: 0.0025rem;
    text-align: center;
}
.pagination__per-page-input:focus {
    outline: none;
    border: solid 1px var(--primary-original);
}

/** INSURANCE SMALL ******************************************************************/
.insurance-small {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: var(--font-14px);
    color: var(--primary-dark-70);
    background-color: var(--neutral-light-90);
    padding: 16px;
    border-radius: 8px;
    letter-spacing: 0.004rem;
    line-height: 1.6rem;
}
.insurance-small__link {
    color: var(--primary-original);
    text-decoration: underline;
    cursor: pointer;
}

/** TERMS AND CONDITIONS ******************************************************************/
.terms-and-conditions {
    background-color: var(--secondary-light-90);
    padding: 32px;
    display: flex;
    flex-direction: column;
    gap: 32px;
    min-height: 60vh;


}
.terms-and-conditions__container {
    display: flex;
    flex-direction: column;
    gap: 24px;
    width: 100%;
}
.terms-and-conditions__header {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.terms-and-conditions__content {
    display: flex;
    flex-direction: column;
    gap: 40px;

    font-family: Outfit, sans-serif;
    font-weight: normal;
    font-size: var(--font-16px);
    line-height: 1.6rem;
    letter-spacing: 0.005rem;
    color: var(--neutral-black);
}
.terms-and-conditions__section {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.terms-and-conditions__subtitle {
    font-family: Outfit-Bold, sans-serif;
    font-weight: normal;
    font-size: var(--font-16px);
    letter-spacing: 0.0015rem;
    color: var(--primary-dark-40);
    line-height: 1.6rem;
}

/* CSS */
.terms-and-conditions__content ol,
.terms-and-conditions__content ul {
    padding-left: 1.5rem;           /* rientro principale */
    /*list-style-position: outside;   !* marker fuori dal blocco *!*/
    line-height: 1.5;
}

.terms-and-conditions__content li {
    margin-bottom: 0.5rem;
}

/* Aumenta il rientro per liste annidate */
.terms-and-conditions__content ol ol,
.terms-and-conditions__content ul ul,
.terms-and-conditions__content ol ul,
.terms-and-conditions__content ul ol {
    padding-left: 1.5rem; /* ulteriore rientro per ogni livello */
    margin-top: 0.25rem;
}

.terms-and-conditions__table th {
    text-align: left;
    font-family: Outfit-Bold, sans-serif;
    font-weight: normal;
    font-size: var(--font-14px);
    color: var(--primary-dark-40);
}

/** ABOUT US ******************************************************************/
.about-us {
    background-color: var(--secondary-light-90);
    padding: 64px;
    display: flex;
    flex-direction: column;
    gap: 32px;
    min-height: 60vh;
}
.about-us__container {
    display: flex;
    flex-direction: column;
    gap: 120px;
    width: 100%;
}
.about-us__section {
    display: flex;
    gap: 80px;
    align-items: flex-start;
}
.about-us__section--reverse {
    flex-direction: row-reverse;
}
.about-us__section-content {
    display: flex;
    flex-direction: column;
    gap: 16px;
    flex: 1;
    color: var(--neutral-black);
}
.about-us__section-content ul {
    padding-left: 1.5rem;
}
.about-us__section-content li {
    margin-bottom: 1rem;
}

.about-us__image {
    flex: 1;
    width: 100%;
    /*max-width: 614px;*/
    height: auto;
    border-radius: 16px;
    overflow: hidden;
    margin: 0 auto;
    object-fit: cover;
}
.about-us__image--top-left {
    border-radius: 300px 16px 16px 16px;
}
.about-us__image--top-right {
    border-radius: 16px 300px 16px 16px;
}
.about-us__image-max-height {
    max-height: 460px;
}

/** VISION ******************************************************************/
.vision {
    background-color: var(--primary-original);
    background-image: url("../images/bg-pattern-primary-7ACKYse.svg");
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 64px;
    padding: 64px;
}
.vision__container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: 80px;
    width: 100%;
}
.vision__header {
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: center;
    padding: 0 120px;
}
.vision__title {
    color: var(--neutral-white);
    letter-spacing: 0.0025rem;
    text-align: center;
}
.vision__text {
    font-size: var(--font-18px);
    color: var(--neutral-white);
    letter-spacing: 0.005rem;
    line-height: 1.6rem;
    text-align: center;
}
.vision__items {
    display: flex;
    justify-content: space-between;
    width: 100%;
    gap: 32px;
}
.vision__item {
    display: flex;
    flex-direction: column;
    gap: 32px;
    align-items: center;
}
.vision__item-content {
    display: flex;
    flex-direction: column;
    gap: 16px;
    align-items: center;
}
.vision__item-title {
    font-family: Outfit-Bold, sans-serif;
    font-weight: normal;
    font-size: var(--font-18px);
    letter-spacing: 0.0015rem;
    color: var(--neutral-white);
    line-height: 1.6rem;
    text-align: center;
}
.vision__item-text {
    font-size: var(--font-16px);
    color: var(--neutral-white);
    letter-spacing: 0.0025rem;
    line-height: 1.6rem;
    text-align: center;
}
.vision__item-img {
    width: 240px;
    height: 240px;
    border-radius: 50%;
    object-fit: cover;
}

/** COMPLAINT FORM ******************************************************************/
.complaint-form {
    background-color: var(--secondary-light-90);
    padding: 32px;
    display: flex;
    flex-direction: column;
    gap: 32px;
    min-height: 60vh;
}
.complaint-form--centered {
    align-items: center;
    justify-content: center;
}
.complaint-form__container {
    display: flex;
    flex-direction: column;
    gap: 40px;
    width: 100%;
}
.complaint-form__header {
    display: flex;
    flex-direction: column;
    gap: 16px;
}
.complaint-form__content {
    display: flex;
    flex-direction: column;
    gap: 24px;
}
.complaint-form__row {
    display: flex;
    gap: 24px;
    width: 100%;
    align-items: center;
}
.complaint-form__row--column {
    flex-direction: column;
}
.complaint-form__group {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 8px;
    flex: 1;
}
.complaint-form__group input[type="text"],
.complaint-form__group input[type="email"],
.complaint-form__group textarea {
    width: 100%;
    border: solid 1px var(--primary-light-90);
    border-radius: 16px;
    padding: 13px 16px;
    font-family: Outfit, sans-serif;
    font-size: var(--font-16px);
    color: var(--primary-original);
    letter-spacing: 0.0025rem;
    background-color: var(--neutral-white);
}
.complaint-form__group input[type="radio"] {
    width: auto;
    accent-color: var(--primary-original);
    margin-right: 8px;
}
.complaint-form__textarea {
    min-height: 150px;
    resize: vertical;
}
.complaint-form__text {
    color: var(--neutral-black);
    line-height: 1.6rem;
    letter-spacing: 0.0025rem;
}
.complaint-form__submit {
    width: 200px;
    align-self: flex-start;
}
.options-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 24px; /* riga e colonna */
    align-items: start;
}
.options-list .option {
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 8px;
    border-radius: 6px;
    cursor: pointer;
    background: transparent;
}

/* mantiene il radio a sinistra e il testo a destra */
.options-list .option input[type="radio"] {
    flex: 0 0 auto;
}

/* miglior accessibilità visiva */
.options-list .option:focus-within,
.options-list .option:hover {
    background: rgba(0,0,0,0.03);
}


/** FILE UPLOAD ******************************************************************/
.file-upload-dropzone {
    border: 2px dashed var(--primary-light-70);
    padding: 12px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 24px;
    border-radius: 6px;
    cursor: pointer;
}
.file-upload-dropzone.dragover {
    border-color: #007bff;
    background: rgba(0,123,255,0.03);
}
.file-upload-dropzone-instruction {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    font-size: var(--font-16px);
    letter-spacing: 0.0025rem;
    color: var(--primary-dark-40);
}
.file-upload-file-list {
    display: grid;
    grid-template-columns: 1fr 1fr;
    column-gap: 24px;
    margin-top: 8px;
}
.file-item {
    display: flex;
    gap: 8px;
    justify-content: space-between;
    align-items:center;
    padding: 8px 12px;
    border-radius: 8px;
    margin-bottom: 6px;
    background: var(--primary-original);
    color: var(--neutral-white);
}
.file-info {
    font-size: 0.9rem;
    color: var(--neutral-white);
    display: flex;
    align-items: center;
    gap: 8px;
}
.file-remove {
    background: transparent;
    border: none;
    color: var(--neutral-white);
    cursor: pointer;
}
.no-files {
    color:#666;
    font-size:0.9rem;
}
.file-upload-image {
    max-width:40px;
    max-height:40px;
    object-fit:cover;
}

/** CAROUSEL CONTROL ******************************************************************/
.carousel-controls {
    display: flex;
    gap: 20px;
    justify-content: flex-end;
}
.carousel-control {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    background-color: transparent;
    display: flex;
    align-items: center;
    justify-content: center;
    cursor: pointer;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    transition: background-color 0.3s ease;
}

.carousel-control--primary {
    border: solid 1px var(--primary-original);
    color: var(--primary-original);
}

.carousel-control--light {
    border: solid 1px var(--neutral-white);
    color: var(--neutral-white);
}

























@media (min-width: 1200px) {
    /* Su desktop, se hai già il form visibile nella colonna destra, puoi nasconderlo */
    .book__fixed-button {
        display: none;
    }
}


@media (max-width: 1380px) {
    .search {
        width: 100%;
        max-width: 600px;
    }
    .search__form.search__form--column {
        flex-direction: column;
        align-items: center;
        padding: 16px;
        gap: 16px;
        width: 100%;
        border-radius: 32px;
    }
    .search__form--column .search__field--large {
        min-width: unset;
    }
    .search__form--column .search__field {
        min-width: unset;
        width: 100%;
        padding: 8px 12px 8px 54px;
    }
    .search__form--column .search__control,
    .search__form--column .search__autocomplete,
    .search__form--column .search__select,
    .search__form--column .search__sort,
    .search__form--column .search__sort-dropdown {
        width: 100%;
    }
    /** SEARCH CONTROL (TOM SELECT) ***********/
    .search__form.search__form--column .search__control .ts-wrapper {
        width: 100%;
    }
    .search__form.search__form--column  .search__control .ts-wrapper .ts-control {
        width: 100% !important;
    }
    .search__form.search__form--column.search__control .ts-wrapper .ts-dropdown {
        width: 100% !important;
    }
    .search__form.search__form--column .btn--menu {
        width: 100%;
    }
    .search__form.search__form--column .custom-select-multi.ts-wrapper.multi .ts-control {
        width: 100%;
        max-width: 100%;
    }
    .search__destination {
        max-width: 100%;
    }
}


/** MEDIA QUERIES ******************************************************************/
@media (max-width: 1200px) {
    .only-desktop {
        display: none !important;
    }

    .only-mobile {
        display: block !important;
    }

    .blog__footer .carousel-controls {
        /*display: flex;*/
    }

    .blog__items .blog-card {
        width: 100%;
    }

    .container {
        flex-direction: column;
        width: 100%;
    }

    body {
        padding-top: 72px;
    }

    /** HEADER ***************************************************************************/
    header {
        padding: 28px 20px 24px;
        height: 72px;
    }

    .header.header--transparent.open {
        position: fixed;
        background-color: var(--neutral-white);
        object-fit: cover;
        z-index: 1001;
    }

    .header__logo {
        background-image: url("../images/logo-eeGlDF9.svg");
    }
    .header__left{
        display: none;
    }
    .header__right{
        display: none;
    }
    .header__menu {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 24px;
        cursor: pointer;
    }
    .header__avatar {
        width:  40px;
        height: 40px;
    }
    .header__mobile {
        display: none;
        flex-direction: column;
        position: fixed;
        top: 70px;
        right: 0;
        z-index: 1000;
        width: 100%;
        gap: 2px;
        align-items: unset;
        justify-content: unset;
        background-color: var(--secondary-light-90);
        padding: 16px;
    }
    .header__mobile.header--transparent {
        position: absolute;
    }
    .header__mobile.open {
        display: flex;
        height: 100vh;
        margin-bottom: 20px;
        gap: 40px;
    }
    .header__mobile-top {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        justify-content: space-between;
        /*padding: 10px 20px;*/
        width: 100%;
        /*margin: 0 auto;*/
        gap: 20px;
    }
    .header__mobile-top a {
        display: flex;
        align-items: center;
        justify-content: left;
        height: 40px;
        width: 100%;
        text-decoration: none;
        padding: 10px 15px;
        text-align: left;
        color: var(--primary-dark-40);
        /*border-bottom: 2px solid var(--neutral-light-90);*/
        letter-spacing: 0.005rem;
    }
    .header__mobile-bottom {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: center;
        padding: 10px 20px;
        width: 90%;
        margin: 0 auto;
        gap: 20px;
    }
    .header__link {
        flex-direction: row;
        font-size: var(--font-18px);
        color: var(--neutral-white);
        text-align: center;
        gap: 16px;
    }
    .header__mobile.open .header__link {
        color: var(--primary-dark-40);
    }
    .header--scroll {
        /*display: none;*/
    }
    .header__divider {
        /*margin: 0.5rem 0;*/
        border: none;
        height: 2px;
        background-color: var(--neutral-white);
        border-radius: 8px;
        width: 100%;
    }

    /** FOOTER ***************************************************************************/
    .footer__right {
        gap: 32px;
    }

    /** BUTTON ***************************************************************************/
    /*.btn {*/
    /*    font-size: var(--font-14px);*/
    /*    height: 36px;*/
    /*    border-radius: 32px;*/
    /*    padding: 8px 12px;*/
    /*    gap: 10px;*/
    /*    letter-spacing: 0.0125rem;*/
    /*    line-height: 1.6rem;*/
    /*}*/
    .btn--menu {
        width: 100%;
    }
    /** LOGIN ***************************************************************************/
    .signup__left,
    .login__left {
        width: 100%;
        padding: 40px 24px;
        gap: 16px;
    }
    .signup__right,
    .login__right {
        display: none;
    }
    .login__form {
        gap: 24px;
    }
    .login__form-group {
        gap: 16px;
    }
    .login__input {
        height: 36px;
        padding: 8px 12px;
        gap: 10px;
    }

    /** HOME ***************************************************************************/
    /** SEARCH *******************/
    .search__form {
        flex-direction: column;
        align-items: center;
        padding: 16px;
        gap: 16px;
        width: 100%;
        border-radius: 32px;
    }
    .search__form--small .search__destination,
    .search__form--small .search__select {
        /*min-width: unset;*/
        width: 100%;
        max-width: none;
    }
    .search__field--large {
        min-width: unset;
    }
    .search__field {
        min-width: unset;
        width: 100%;
        padding: 8px 12px 8px 54px;
    }
    .search__control,
    .search__autocomplete,
    .search__select,
    .search__sort,
    .search__sort-dropdown {
        width: 100%;
    }
    /** SEARCH CONTROL (TOM SELECT) ***********/
    .search__control .ts-wrapper {
        width: 100%;
    }
    .search__control .ts-wrapper .ts-control {
        width: 100% !important;
    }
    .search__control .ts-wrapper .ts-dropdown {
        width: 100% !important;
    }

    .rental-type-selector__options {
        flex-direction: column;
        flex-wrap: wrap;
    }

    .user-profile__container-row {
        gap: 32px;
        flex-direction: column;
    }
    .user-profile__left {
        flex: unset;
        width: 100%;
    }
    .user-profile__right {
        flex: unset;
        width: 100%;
    }
    .form-row,
    .user-profile__row,
    .user-profile__form-row {
        flex-direction: column;
        gap: 32px;
    }

    .book__details {
        flex-direction: column;
    }

    .blog__item > * {
        flex: 1;
    }

    .blog__item-content {
        width: 100%;
    }

    .blogs__grid {
        grid-template-columns: 1fr 1fr;
    }

    .blog__items {
        flex-direction: column;
    }

    .blog-card {
        padding-left: 16px;
        padding-right: 16px;
    }


    .custom-select-multi.ts-wrapper.multi .ts-control  {
        width: 100%;
        max-width: 100%;
    }

    /** RESULTS ***************************************************************************/
    .results__top-section {
        /* stile normale */
        padding: 16px 64px;
        margin-left: -64px;
        margin-right: -64px;
    }

    .results__top-section--sticky {
        /*position: unset;*/
        top: 72px;
        /*z-index: unset;*/
        /*background-color: unset;*/
    }

    .destinations__grid {
        grid-template-columns: 1fr 1fr;
    }

    .review__item {
        width: 50%;
    }

    .boat-card .flickity-button {
        visibility: visible;
    }

    .special-offers .flickity-page-dots .flickity-page-dot,
    .review .flickity-page-dots .flickity-page-dot {
        background: hsl(0 0% 100% / 40%);
    }

    .special-offers .flickity-page-dots .flickity-page-dot.is-selected,
    .review .flickity-page-dots .flickity-page-dot.is-selected {
        background: hsl(0 0% 100% / 100%);
    }

}




@media (max-width: 860px) {
    h1 {
        font-size: var(--font-68px);
    }

    h2 {
        font-size: var(--font-54px);
    }

    h3 {
        font-size: var(--font-38px);
    }

    h4 {
        font-size: var(--font-32px);
    }

    h5 {
        font-size: var(--font-27px);
    }

    h6 {
        font-size: var(--font-23px);
    }

    /** HEADER ***************************************************************************/
    .header {
        padding: 16px;
    }

    /** FOOTER ***************************************************************************/
    .footer {
        padding: 64px 16px;
    }

    .footer__row {
        flex-direction: column;
        align-items: center;
        gap: 32px;
    }

    .footer__left {
        align-items: center;
        text-align: center;
        gap: 24px;
    }

    .footer__right {
        flex-direction: column;
        align-items: center;
        gap: 24px;
    }

    .footer__column {
        align-items: center;
        text-align: center;
    }

    .footer__bottom {
        text-align: center;
        font-size: var(--font-14px);
    }

    .footer__glueglue {
        padding-top: 30px;
        justify-content: center;
    }
    .footer__glueglue-text {
        font-size: var(--font-14px);
    }

    .container {
        width: 100%;
    }

    .btn--small {
        width: 100%;
    }

    .chip {
        width: auto;
    }


    /** HOME ***************************************************************************/
    .hero {
        padding: 100px 16px 64px;
        gap: 32px;
        background-size: cover;
    }

    .hero__partners {
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 32px;
        margin-top: 32px;
    }
    .hero__logo-partners {
        gap: 24px;
        flex-wrap: wrap;
        justify-content: center;
    }

    .hero__footer {
        flex-direction: column;
        align-items: center;
        gap: 16px;
        margin-top: 32px;
    }

    .hero__footer-title-container {
        flex-direction: column;
        align-items: center;
        gap: 8px;
    }

    .hero__subtitle {
        max-width: 300px;
    }

    .hero__footer-subtitle {
        max-width: 300px;
        text-align: center;
    }

    .search__form {
        flex-direction: column;
        align-items: center;
        padding: 16px;
        gap: 16px;
        width: 100%;
        border-radius: 32px;
    }

    .destinations__container {
        gap: 24px;
    }

    .hero-destinations {
        padding: 100px 16px 64px;
    }

    .destinations {
        padding: 72px 16px;
    }

    .special-offers {
        min-height: unset;
        padding: 64px 16px;
    }
    .special-offers__carousel-item {
        width: 100%;
    }

    .reservation-card {
        flex-direction: column;
    }
    .reservation-card--horizontal .reservation-card__container {
        flex-direction: column;
        border-radius: 16px 16px 0 0;
    }
    .reservation-card--horizontal .reservation-card__image {
        border-radius: 16px 16px 0 0;
        width: 100%;
        height: auto;
        min-width: unset;
        min-height: 212px;
        background-position: center;
    }
    .reservation-card__info {
        flex-direction: column;
        gap: 16px;
        align-items: flex-start;
    }

    .reservation-detail__header {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
    }

    /** PRICE ***************************************************************************/
    .price {
        display: flex;
        flex-direction: column;
        gap: 32px;
        padding: 64px 16px;
    }

    .price__left {
        width: 100%;
        height: auto;
        gap: 16px;
        padding: 16px;
    }

    .price__right {

    }

    .price__img-wrapper {
        width: 100%;
        height: auto;
        min-height: unset;
        /*max-height: 300px;*/
        border-radius: 16px;
        overflow: hidden;
    }

    .price__content {
        gap: 24px;
    }

    .price__footer {
        gap: 4px;
        margin-top: 32px;
    }

    .price__img-background {
        width: 100%;
        height: auto;
        min-height: unset;
        /*max-height: 300px;*/
    }

    .how,
    .faq,
    .newsletter,
    .user-profile {
        padding: 64px 16px;
    }

    .how__container {
        gap: 40px;
    }

    .how__items {
        flex-direction: column;
        align-items: center;
    }

    .newsletter__row {
        flex-direction: column;
        gap: 16px;
    }

    .blog {
        padding: 64px 16px;
    }

    .blog__container {
        gap: 24px;
    }

    .blog__item {
        flex-direction: column;
        gap: 24px;
    }

    .blog__item-img {
        width: 100%;
        height: auto;
        min-height: unset;
        clip-path: unset !important;
        border-radius: 16px;
    }
    .blog__item--reverted .blog__item-image-wrapper img,
    .blog__item-image-wrapper img {
        border-radius: 16px;
    }
    .blog__item-content {
        width: 100%;
        padding: 0;
        gap: 16px;
    }

    .review {
        padding: 64px 16px;
    }

    .review__item {
        width: 100%;
        gap: 16px;
        padding: 16px;
    }

    .hero__title {
        font-size: var(--font-27px);
    }

    .signup__form-group {
        gap: 16px;
    }

    .signup__left, .login__left {
        width: 100%;
        gap: 16px;
        min-height: 100vh;
        height: auto;
    }

    .login__title,
    .signup__title,
    .hero__footer-title,
    .book-confirmation__title,
    .destinations__title,
    .destination-card__title,
    .special-offers__title,
    .price__title,
    .how__title,
    .blog__title,
    .review__title,
    .faq__title,
    .newsletter__title,
    .vision__title {
        font-size: var(--font-23px);
        font-family: Outfit-Bold, sans-serif;
    }

    .hero__subtitle {
        font-size: var(--font-18px);
        font-family: Outfit, sans-serif;
    }

    .hero__footer-subtitle,
    .review__item-title {
        font-size: var(--font-18px);
        font-family: Outfit, sans-serif;
        color: var(--neutral-white);
    }

    .faq__question,
    .newsletter__text {
        font-size: var(--font-16px);
    }

    .review__item-footer,
    .faq__answer,
    .newsletter__checkbox-label {
        font-size: var(--font-14px);
    }

    .faq__container {
        gap: 24px;
    }

    .hero-search-destination {
        padding: 100px 16px 64px;
    }

    .results {
        padding: 32px 16px;
    }
    .results .search__form {
        padding: 16px 0;
    }

    /** ADVANCED FILTERS ***************************************************************************/
    .advanced-filters {
        gap: 16px;
    }

    .advanced-filters__sections {
        gap: 16px;
    }

    .advanced-filters__row {
        flex-direction: column;
        gap: 16px;
    }

    .rental-type-selector__options {
        flex-direction: column;
    }

    .advanced-filters__filter {
        gap: 16px;
    }

    .filter-checkboxes__list {
        grid-template-columns: 1fr;
    }

    .advanced-filters__buttons {
        flex-direction: column;
        gap: 16px;
    }

    .destinations__grid {
        display: grid;
        grid-template-columns: 1fr;
        gap: 24px;
    }

    .destination-card {
        height: 380px;
    }

    .destination-card--full {
        grid-column: auto;
    }

    /** BOOK CONFIRMATION ***************************************************************************/
    .book-confirmation__details {
        flex-direction: column;
    }
    .book-confirmation__boat-card {
        flex-direction: column;
        gap: 16px;
    }
    .book-confirmation__actions {
        flex-direction: column;
    }

    /** BOAT GALLERY ***************************************************************************/
    .boat__gallery {
        display: flex;
        flex-direction: column;
    }
    .boat__thumbnails {
        display: none;
    }

    /** BOOK ***************************************************************************/
    .book__header {
        flex-direction: column;
        align-items: flex-start;
        gap: 16px;
    }
    .book__gallery {
        flex-direction: column;
    }
    .book__thumbnails {
        display: none;
    }
    .book__flex {
        flex-direction: column;
        width: fit-content;
    }
    .book__buttons {
        flex-direction: column;
    }

    .book-confirmation__summary-item,
    .book__info-item {
        display: flex;
        flex-direction: column;
        gap: 4px;
    }
    .book__card-columns {
        flex-direction: column-reverse;
    }
    .custom-checkbox + .book__info-value {
        margin-left: 30px;
    }

    .swal2-container {
        padding: 0 !important;
    }

    .reservation-card__actions {
        flex-direction: column;
        width: 100%;
        gap: 16px;
    }

    .tooltip__content {
        width: 200px;
        position: fixed;
        bottom: 12px;
        left: 50%;
        height: fit-content;
        z-index: 1000;
    }

    .book,
    .book-confirmation,
    .maybe,
    .reservation-detail,
    .reservations,
    .yacht-detail {
        padding: 32px 16px;
    }

    .yacht-detail .book__details {
        flex-direction: column-reverse;
    }

    .chat-bot {
        bottom: 24px;
        right: 24px;
    }

    .chat-bot__button {
        width: 48px;
        height: 48px;
    }

    .chat-bot__icon {
        width: 24px;
        height: 24px;
    }

    .blog-detail__container {
        flex-direction: column;
    }

    .blogs__grid {
        grid-template-columns: 1fr;
    }

    .book__fixed-button {
        bottom: 24px;
        width: calc(100% - 200px); /* più margine ai lati su schermi più grandi */
    }

    .destination-blog {
        padding: 32px 16px;
    }

    .pagination__pages {
        gap: 0;
        margin-top: 16px;
        margin-bottom: 16px;
        justify-content: space-between;
        width: 100%;
    }
    .pagination__page {
        width: 36px;
        height: 36px;
        font-size: var(--font-14px);
    }

    .pagination__prev,
    .pagination__next {
        width: unset;
        padding: 8px 4px;
        height: 36px;
        font-size: var(--font-14px);
    }

    .about-us {
        padding: 32px 16px;
    }
    .about-us__container {
        gap: 64px;
    }
    .about-us__section {
        flex-direction: column;
        gap: 32px;
    }
    .about-us__image-max-height {
        max-height: unset;
    }
    .about-us__image--top-right,
    .about-us__image--top-left {
        border-radius: 16px;
    }
    .about-us__section--reverse {
        flex-direction: column;
    }

    .vision {
        padding: 32px 16px;
        gap: 32px;
    }
    .vision__container {
        gap: 40px;
    }
    .vision__header {
        padding: 0 16px;
    }
    .vision__items {
        flex-direction: column;
        gap: 32px;
    }

    .options-list {
        grid-template-columns: 1fr;
    }

    .complaint-form {
        padding: 16px;
    }

    .complaint-form__row {
        flex-direction: column;
        align-items: flex-start;
    }
    .complaint-form__group {
        width: 100%;
    }
    .file-upload-file-list {
        grid-template-columns: 1fr;
        width: 100%;
    }
    .options-list {
        grid-template-columns: 1fr;
        gap: 12px;
    }
    .file-item {
        overflow: auto;
    }
    .file-name {
        /*max-width: 150px;*/
        word-break: break-all;
    }
    .file-size {
        display: none;
    }

    .book-confirmation__booking-details {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
    }

    .reservations__container {
        gap: 16px;
    }

    .reservations__previous {
        display: flex;
        flex-direction: column;
        gap: 24px;
    }

    .reservation-card__content {
        padding: 0 16px 16px;
        gap: 16px;
    }

     .reservation-card__info {
        flex-direction: column;
        gap: 8px;
    }

     .reservation-card__actions {
        flex-direction: column;
        width: 100%;
        gap: 16px;
    }

     .reservation-card__content-top {
         flex-direction: column;
         gap: 16px;
     }

     .reservation-card__content-top-body {
         flex-direction: column;
         gap: 16px;
     }

     /** TABLES ***************************************************************************/
    .table-wrapper {
        width: 100%;
        overflow-x: auto;                    /* abilita lo scrolling orizzontale */
        -webkit-overflow-scrolling: touch;   /* smooth scrolling su iOS */
        box-sizing: border-box;
    }

    .table {
        min-width: 600px;    /* larghezza minima per mantenere la leggibilità */
        width: 100%;          /* occupa il 100% del wrapper */
        max-width: none;      /* evita che max-width ereditato tagli la tabella */
        border-collapse: collapse;
        table-layout: auto;   /* o fixed se vuoi colonne di larghezza fissa */
    }

    .table--responsive {
        width: 100%;
    }


     .table-wrapper .table th,
        .table-wrapper .table td {
         white-space: nowrap;   /* evita che il testo vada a capo, forzando l'overflow */
         padding: 0.5rem;
     }

     /** CAROUSEL CONTROL ***************************************************************************/
     .carousel-controls {
         display: none;
     }
}