/* @group Have-fun-filter
------------------------------------ */
.have-fun-filter {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: var(--z-index-highest);
    margin: 0 0 2rem;
}  
.have-fun-filter__wrapper {
    position: relative;
}
.have-fun-filter__list li a {
    color: var(--dark-green);
    text-transform: uppercase;
    font-size: 1.4em;
    letter-spacing: .08em;
    white-space: nowrap;
}
@media only screen
and (min-width : 961px) {
    .have-fun-filter__wrapper {
        background-color: var(--light-green);
        display: inline-flex;
        align-items: center;
        height: 6.8rem;
    }
    .have-fun-filter__list {
        display: inline-block;
        width: 100%;
        height: 100%;
    }
    .have-fun-filter__list li {
        cursor: pointer;
        position: relative;
        display: inline-flex;
        align-items: center;
        justify-content: center;
        height: 100%;
        padding: 0 2rem;
        width: 23.2rem;
        transition: all .7s;
    }
    .have-fun-filter__list li a {
        font-size: 1.2em;
        line-height: 1.8em;
        letter-spacing: 0.05em;
    }
    .have-fun-filter__list li:not(:last-child):before {
        content: "";
        position: absolute;
        background-color: var(--dark-green);
        display: inline-block;
        height: 5rem;
        width: 1px;
        top: 0.1rem;
        top: 50%;
        transform: translateY(-50%);
        right: 0;
    }
    .have-fun-filter__list li:hover{
        text-shadow: 0px 0px 1px var(--dark-green);
        font-weight: 700;
    }
    .have-fun-filter__icon-close,
    .have-fun-filter__select {
        display: none;
    }
}
@media only screen
and (min-width : 961px)
and (max-width : 1440px) {
    .have-fun-filter__list li {
        width: auto;
        padding: 0 3rem;
    }
}
@media only screen
and (min-width : 0)
and (max-width : 960px) {
    .have-fun-filter__list {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        flex-direction: column;
        background-color: var(--light-green);
        width: 27.4rem;
    }
    .have-fun-filter__list li {
        position: relative;
        height: 100%;
        padding: 2.7rem 0;
    }
    .have-fun-filter__list li:not(:last-child):before {
        content: "";
        width: 12.8rem;
        height: 1px;
        background-color: var(--dark-green);
        display: inline-block;
        position: absolute;
        bottom: 0;
        left: 50%;
        transform: translateX(-50%);
    }
    .have-fun-filter__list li a {
        font-weight: 700;
    }
    .have-fun-filter__icon-close {
        font-size: 1.2rem;
        font-weight: 700;
        font-style: normal;
        letter-spacing: .08em;
        text-transform: uppercase;
        width: 6rem;
        height: 6rem;
        background-color: var(--light-green);
        color: var(--dark-green);
        display: inline-flex;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        font-family: var(--work-font);
    }
    i.have-fun-filter__icon-close[class^='icon-'],
    i.have-fun-filter__icon-close[class*=' icon-'] {
        font-family: var(--work-font)!important;
    }
    .have-fun-filter__scan,
    .have-fun-filter__select {
        display: flex;
        align-items: center;
        justify-content: center;
        background-color: var(--light-green);
        height: 6rem;
        width: 27.4rem;
        margin: 0 auto;
    }
    .have-fun-filter__select button {
        color: var(--dark-blue);
        font-size: 1.4rem;
        letter-spacing: .08em;
        font-weight: 700;
        text-transform: uppercase;
    }
    .have-fun-filter__icon-close,
    .have-fun-filter__list,
    .have-fun-filter__select {
        position: absolute;
        bottom: 0;
        left: 50%;
        translate: -50% 0;
        z-index: var(--z-index-medium-high);
    }
    .have-fun-filter__list {
        bottom: 7rem;
    }

    /* Animation Mobile */
    .have-fun-filter__icon-close,
    .have-fun-filter__list,
    .have-fun-filter__select {
        transition: opacity .7s,transform .7s;
    }
    .have-fun-filter__list,
    .have-fun-filter__icon-close {
        opacity: 0;
        pointer-events: none;
        transform: translateY(2rem);
    }
    .have-fun-filter__list[data-state="show"],
    .have-fun-filter__select[data-state="show"],
    .have-fun-filter__icon-close[data-state="show"] {
        opacity: 1;
        transform: translateY(0);
        pointer-events: all;
    }
    .have-fun-filter__list[data-state="hide"],
    .have-fun-filter__select[data-state="hide"],
    .have-fun-filter__icon-close[data-state="hide"] {
        opacity: 0;
        transform: translateY(2rem);
    }
}
/* @end */


/* Have fun back */
.have-fun-filter-back {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    z-index: var(--z-index-highest);
    margin: 0 0 2rem;
}
.have-fun-filter-back__select {
    isolation: isolate;
    position: relative;
    background-color: var(--light-green);
    display: inline-flex;
    align-items: stretch;
    height: 6.8rem;
    width: 100%;
    max-width: 37.2rem;
}
.have-fun-filter-back__select a {
    flex: 0 1 4rem;
    max-width: 4rem;
}
.have-fun-filter-back__select a,
.have-fun-filter-back__select .category {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    text-transform: uppercase;
    font-size: 1.2rem;
    letter-spacing: .06em;
    font-weight: 700;
    color: var(--dark-green);
}
.have-fun-filter-back__select a i {
    transition: transform .7s;
    font-size: 1.6rem;
}
.have-fun-filter-back__select a em {
    font-style: normal;
    display: none;
}
.have-fun-filter-back__select .category {
    flex: 1;
    max-width: 100%;
    text-shadow: 0px 0px 1px var(--dark-green);
}
@media only screen
and (min-width : 961px) {
    .have-fun-filter-back__select {
        width: 52.1rem;
        max-width: none;
    }
    .have-fun-filter-back__select a {
        flex: 0 1 10.2rem;
        max-width: 10.2rem;
    }
    .have-fun-filter-back__select a:before {
        content: "";
        width: .1rem;
        height: 5rem;
        position: absolute;
        top: 50%;
        right: 0;
        transform: translateY(-50%);
        background-color: var(--dark-green);
    }
    .have-fun-filter-back__select a em {
        display: inline-block;
    }
    .have-fun-filter-back__select a i {
        margin-right: .8rem;
    }
    .have-fun-filter-back__select a:hover i {
        transform: translateX(-.5rem);
    }
}
@media only screen
and (min-width : 961px)
and (max-width : 1440px) {
}
@media only screen
and (min-width : 0)
and (max-width : 960px) {
    .have-fun-filter-back__select .category {
        position: absolute;
        left: 0;
        top: 0;
        width: 100%;
        height: 100%;
        z-index: var(--z-index-under);
        pointer-events: none;
    }

}

/* Have fun check */
.have-fun-check {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    margin: 0 0 2rem;
    z-index: var(--z-index-highest);
}
.have-fun-check__box {
    max-width: 120rem;
    margin: 0 auto;
}
.have-fun-check__box h3,
.have-fun-check__box legend,
.have-fun-check__box input,
.have-fun-check__box .choose-your-dates a,
.have-fun-check__box .back a {
    color: var(--dark-green);
}
.have-fun-check__box .submit a,
.have-fun-check__box .help a {
    color: var(--light-yellow);
}
.have-fun-check__box .back a {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    text-transform: uppercase;
    font-weight: 700;
}
.have-fun-check__box .back em {
    font-style: normal;
}
.have-fun-check__box .back i {
    font-size: 1.8rem;
    margin-right: .4rem;
}
.have-fun-check__box legend,
.have-fun-check__box input,
.have-fun-check__box h4 {
    font-family: var(--work-font);
    text-transform: uppercase;
    color: var(--dark-green);
    margin: 0;
}
.have-fun-check__box input {
    text-align: center;
}
.have-fun-check__box legend {
    font-weight: 400;
}
.have-fun-check__box .form__label--when input {
    font-weight: 700;
    background-color: rgba(97, 120, 57, .3);
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--dark-green);
    cursor: pointer;
    outline: none;
}
.have-fun-check__box .form__label--when input:focus {
    outline: none;
    border: 0;
}
.have-fun-check__box .form__label--when input::placeholder {
    color: var(--dark-green);
}
.have-fun-check__box .form__label--when input:-moz-placeholder,
.have-fun-check__box .form__label--when input:-moz-placeholder,
.have-fun-check__box .form__label--when input:-moz-placeholder {
    color: var(--dark-green);
}
.have-fun-check__box .form__label--when input::-webkit-input-placeholder,
.have-fun-check__box .form__label--when input::-webkit-input-placeholder {
    color: var(--dark-green);
}
.have-fun-check__box .form__label--who input {
    background-color: rgba(150, 175, 107, .3);
}
.have-fun-check__box .submit,
.have-fun-check__box .help {
    justify-content: center;
}
.have-fun-check__box .choose-your-dates a,
.have-fun-check__box .submit a {
    text-transform: uppercase;
    font-weight: 700;
    font-size: 1.2rem;
    line-height: 1.16em;
    letter-spacing: .08em;
}
.have-fun-check__box .help a {
    font-weight: 400;
}
.have-fun-check__box .choose-your-dates a {
    text-decoration: underline;
}
.have-fun-check__box .selected-values {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    height: 100%;
}
.have-fun-check__box .selected-values i {
    color: var(--dark-green);
    font-size: 1.4rem;
    margin: 0 1.25rem;
}
.have-fun-check__box .selected-values__box {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    column-gap: .36rem;
    flex: 1;
    margin-right: .5rem;
}
.have-fun-check__box .selected-values__box span {
    display: inline-flex;
    height: 4.7rem;
    align-items: center;
    justify-content: center;
    background-color: rgba(97, 120, 57, .3);
    color: var(--light-yellow);
    font-weight: 700;
    text-transform: uppercase;
    font-size: 1.8rem;
    line-height: 2;
    letter-spacing: .04em;
    word-wrap: normal;
    white-space: pre;
}
.have-fun-check__box .selected-values__box span[data-value="date"] {
    flex: 1;
}
.have-fun-check__box .selected-values__box span[data-value="amount"] {
    flex: 0 1 5rem;
    max-width: 5rem;
}

/* Bgs */
.have-fun-check__box .choose-your-dates {
    background-color: var(--light-green);
}
.have-fun-check__box .submit {
    background-color: rgba(97, 120, 57);
}
.have-fun-check__box .help {
    background-color: rgba(150, 175, 107);
}
.have-fun-check__box .selected-values {
    background-color: var(--light-green);
}
.have-fun-check__box .form__label,
.have-fun-check__box .form__label label {
    position: relative;
}

@media only screen
and (min-width : 961px) {
    .have-fun-check__box {
        display: flex;
        align-items: stretch;
        justify-content: flex-start;
        height: 6.8rem;
        background-color: var(--light-green);
    }
    .have-fun-check__box > div,
    .have-fun-check__box > form {
        display: flex;
        align-items: center;
        justify-content: flex-start;
    }
    .have-fun-check__box .back {
        justify-content: center;
    }
    .have-fun-check__box .name {
        flex: 0 1 36rem;
        max-width: 36rem;
        padding-left: 3.6rem;
    }
    .have-fun-check__box h3 {
        font-size: 3em;
    }
    .have-fun-check__box legend,
    .have-fun-check__box input {
        font-size: 1.2rem;
        line-height: 1em;
        letter-spacing: .06em;
    }
    .have-fun-check__box .back {
        flex: 0 1 10.2rem;
        max-width: 10.2rem;
    }
    .have-fun-check__box .back a {
        font-size: 1.2rem;
        line-height: 1em;
        letter-spacing: .08em;
    }
    .have-fun-check__box .back a i {
        transition: transform .7s;
    }
    .have-fun-check__box .form {
        flex: 1;
        max-width: 100%;
    }
    .have-fun-check__box h4 {
        font-size: 1.2rem;
        line-height: 1em;
        letter-spacing: .06em;
    }
    .have-fun-check__box .form__label--when {
        padding: 0 1.3rem 0 2rem;
    }
    .have-fun-check__box .form__label--when h4 {
        margin-right: .9rem;
    }
    .have-fun-check__box .form__label--who {
        padding: 0 4rem 0 2rem;
    }
    .have-fun-check__box .form__label--who input {
        margin-left: 2rem;
        margin-right: .8rem;
        width: 3.5rem;
    }
    .have-fun-check__box .form__label,
    .have-fun-check__box .form__label label {
        display: flex;
        align-items: center;
        justify-content: flex-start;
    }
    .have-fun-check__box .submit {
        flex: 0 1 13.2rem;
        max-width: 13.2rem;
    }
    .have-fun-check__box .help {
        flex: 0 1 10.4rem;
        max-width: 10.4rem;
    }
    .have-fun-check__box .submit a,
    .have-fun-check__box .help a {
        font-size: 1rem;
        line-height: 1.4em;
        letter-spacing: .06em;
    }
    /* Hovers */
    .have-fun-check__box .back a:hover i {
        transform: translateX(-.5rem);
    }
    /* Bgs */
    .have-fun-check__box .submit {
        background-color: rgba(97, 120, 57);
    }
    .have-fun-check__box .help {
        background-color: rgba(150, 175, 107);
    }
    /* Border */
    .have-fun-check__box .back,
    .have-fun-check__box .name,
    .have-fun-check__box .form__label--when {
        position: relative;
    }
    .have-fun-check__box .form__label--when label {
        cursor: pointer;
    }
    .lenis-scrolling .have-fun-check__box .form__label--when label {
        pointer-events: none;
        opacity: .7;
    }
    .have-fun-check__box .back:before,
    .have-fun-check__box .name:before {
        content: "";
        display: inline-block;
        width: 1px;
        height: 5rem;
        background-color: var(--dark-green);
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        right: 0;
    }

}
@media only screen
and (min-width : 961px)
and (max-width : 1440px) {
}
@media only screen
and (min-width : 0)
and (max-width : 960px) {
    .have-fun-check__box {
        max-width: 37.2rem;
        display: flex;
        align-items: stretch;
        justify-content: flex-start;
        height: 6rem;
    }
    .have-fun-check__box .form {
        position: absolute;
        bottom: 8.2rem;
        left: 50%;
        translate: -50% 0;
        display: none;
        flex-direction: column;
        z-index: var(--z-index-medium-low);
        width: 100%;
        max-width: 27.4rem;
        background-color: var(--light-green);
        padding: 3.6rem 2rem 2.8rem;
    }
    .have-fun-check__box .form h4 {
        font-size: 1.4rem;
        line-height: 1.7em;
        letter-spacing: .04em;
        margin: 0 0 1rem;
    }
    .have-fun-check__box .form__label {
        padding: 0 4rem;
    }
    .have-fun-check__box .form__name,
    .have-fun-check__box .form__label {
        flex: 0 1 100%;
        max-width: 100%;
    }
    .have-fun-check__box .form__label--when {
        margin: 0 0 1.5rem;
    }
    .have-fun-check__box .form__label--who label {
        display: flex;
        flex-direction: column;
    }
    .have-fun-check__box .form__label--who legend {
        order: -1;
        margin: 0 0 .5rem;
    }
    .have-fun-check__box .form__label--who input {
        margin: 0 0 1rem;
    }
    .have-fun-check__box .selected-values__box span {
        font-size: 1.2rem;
    }
    .have-fun-check__box .form input {
        height: 5.9rem;
        padding: 0 1rem;
        font-size: 1.4rem;
        line-height: 2em;
        letter-spacing: .04em;
        font-weight: 700;
    }
    .have-fun-check__box .form__name {
        margin: 0 0 2.4rem;
    }
    .have-fun-check__box .form__name h3 {
        font-size: 3.6rem;
        line-height: 1.2em;
        color: var(--dark-green);
    }
    .have-fun-check__box .choose-your-dates,
    .have-fun-check__box .submit {
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .have-fun-check__box .selected-values,
    .have-fun-check__box .choose-your-dates {
        flex: 1;
    }
    .have-fun-check__box .submit {
        flex: 0 1 18.2rem;
        max-width: 18.2rem;
    }
    .have-fun-check__box .confirm {
        display: flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        margin: 0 auto;
        max-width: 27.4rem;
        background-color: var(--light-green);
    }
    .have-fun-check__box .confirm a {
        text-transform: uppercase;
        color: var(--dark-green);
        font-size: 1.4rem;
        letter-spacing: .08em;
        font-weight: 700;
    }


    /* Animations */
    .have-fun-check__box .choose-your-dates,
    .have-fun-check__box .selected-values,
    .have-fun-check__box .submit {
        display: none;
    }
    [data-state-mobile="closed"] .have-fun-check__box .submit,
    [data-state-mobile="closed"] .have-fun-check__box .choose-your-dates {
        display: flex;
    }
    [data-state-mobile="closed"] .have-fun-check__box .confirm,
    [data-state-mobile="closed"] .have-fun-check__box .selected-values {
        display: none;
    }
    [data-state-mobile="open"] .have-fun-check__box .form,
    [data-state-mobile="open"] .have-fun-check__box .confirm {
        display: flex;
    }
    [data-state-mobile="open"] .choose-your-dates,
    [data-state-mobile="open"] .selected-values,
    [data-state-mobile="open"] .submit {
        display: none;
    }
    [data-state-mobile="check"] .have-fun-check__box .submit,
    [data-state-mobile="check"] .have-fun-check__box .selected-values {
        display: flex;
    }
    [data-state-mobile="check"] .have-fun-check__box .confirm,
    [data-state-mobile="check"] .have-fun-check__box .choose-your-dates {
        display: none;
    }
}


.have-fun-check {
    display: none;
}
.have-fun-filter {
    display: none;
}
.have-fun-filter-back {
    display: none;
}
.single-villas .have-fun-check {
    display: block;
}
.page-template-get-pampered .have-fun-filter,
.page-template-have-fun .have-fun-filter,
.page-template-stay .have-fun-filter {
    display: block;
}
.single-excursion .have-fun-filter-back,
.single-wellness .have-fun-filter-back,
.archive .have-fun-filter-back {
    display: block;
}

.have-fun-check,
.have-fun-filter,
.have-fun-filter-back {
    opacity: 1;
    transition: opacity .7s;
    pointer-events: all;
}
.on-footer .have-fun-check,
.on-footer .have-fun-filter,
.on-footer .have-fun-filter-back {
    opacity: 0;
    pointer-events: none;
}






.have-fun-check__box .form__label--when input[type="date"] {
    text-indent: -.75rem;
}
.have-fun-check__box .form__label--when input[type="date"]::-webkit-calendar-picker-indicator {
    background-position: calc(100% - 1rem) center;
    background-size: 1.5rem auto;
    width: 100%;
    color: transparent;
    cursor: pointer;
    height: auto;
    position: absolute;
    right: 0;
    top: 0;
    bottom: 0;
    left: 0;
}