.footerContainer {
    margin-top: 30px;
    width: 100%;
    /* Теперь футер занимает всю ширину */
    height: 317px;
    color: #FFFFFF;
    background-color: #2B2B2B;
    display: flex;
    justify-content: space-between;
    padding: 70px 53px;
    /* Добавляем отступы только внутри футера */
    box-sizing: border-box;
    /*  Важно! Чтобы padding не увеличивал ширину */
}

.footerLogo {
    width: 184px;
    height: 78px;
    /*  margin-top: 70px; */
    font-family: 'PT Sans', sans-serif;
    font-weight: 700;
    font-size: 25px;
}

.footerLogo a {
    color: white;
    cursor: pointer;
    text-decoration: none;
}

/*Добавил для наглядности*/
.footerMenuContainer {
    /* border: 1px solid white; */
    width: 127px;
    height: 177px;
    display: flex;
}

.footerMenuList {
    list-style-type: none;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    gap: 11px;
    padding: 0;
    margin: 0;
}

.footerMenuItem {
    font-family: 'PT Sans', sans-serif;
    width: 127px;
    height: 36px;
    font-weight: 700;
    font-size: 22px;
    cursor: pointer;
    user-select: none;
}

.footerMenuItem a {
    color: white;
    text-decoration: none;
}

.footerContactPhone {
    width: 335px;
    height: 36px;
    font-family: 'PT Sans', sans-serif;
    font-weight: 700;
    font-size: 22px;
}

.footerContactPhone a,
.footerContactMail a {
    color: white;
    cursor: pointer;
    text-decoration: none;
}

.footerContactMail {
    width: 335px;
    height: 36px;
    font-family: 'PT Sans', sans-serif;
    font-weight: 700;
    font-size: 22px;
    color: #FFFFFF;
}

.footerButtonBookingDown {
    font-family: 'PT Sans', sans-serif;
    width: 262px;
    height: 60px;
    border-radius: 20px;
    background-color: #FFFFFF;
    color: #272F07;
    font-weight: 700;
    font-size: 18px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}

.blockStartRelaxForm {
    margin-top: 348px !important;
}

/* стили для формы внизу */
.blockStartRelaxForm {
    margin-top: 5%;
    width: 100%;
    height: 668px;
    border-radius: 40px;
    background-color: #272F07;
    display: flex;
    justify-content: center;
    align-items: center;
}

.blockStartRelaxForm .dateInputContainer {
    width: 542px;
    height: 72px !important;
}

.blockStartRelaxForm .dateLabel {
    font-family: 'PT Sans', sans-serif;
    font-size: 16px;
    font-weight: 700;
    color: #2B2B2B;
}

.blockStartRelaxForm .dateInput {
    font-family: 'PT Sans', sans-serif;
    font-size: 25px;
    font-weight: 400;
    color: #000000;
}

.blockStartRelaxForm .FooterButtonBooking {
    width: 542px;
    height: 72px;
}

.blockStartRelaxForm .selectContainer {
    width: 542px;
    height: 72px !important;
    cursor: pointer;
    user-select: none;
}

.relaxFormContainer {
    /* border: 1px solid #000; */
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 30px;
    width: 542px;
    height: 463px;
}

.relaxFormText {
    font-family: 'PT Sans', sans-serif;
    font-weight: 700;
    font-size: 30px;
    color: #FFFFFF;
}

.FooterButtonBooking {
    width: 282px;
    height: 70px;
    border: 1px solid;
    border-color: #FFFFFF;
    border-radius: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-family: 'PT Sans', sans-serif;
    font-weight: 700;
    font-size: 20px;
    color: #FFFFFF;
    cursor: pointer;
}

.open-popup-button {
    cursor: pointer;
    user-select: none;
}

.dateInputContainer,
.selectContainer {
    height: 43px;
    margin-bottom: 10px;
    border-radius: 20px;
    padding: 5px 15px !important;

}

.formBlock .dateInputContainer,
.formBlock .selectContainer {
    margin-bottom: 0px !important;
    /* width: 282px !important; */
    height: 70px !important;
    border-radius: 20px !important;
}

.inputFlex {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: row;
    gap: 12px;
}

.calendarIcon {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    width: 30px;
    /* Подстройте под ваш размер */
    height: 30px;
    /* Подстройте под ваш размер */
    object-fit: contain;
    /* Чтобы изображение не искажалось */
    cursor: pointer;
}

/* Футер */
@media (max-width: 767px) {
    .relaxFormContainer form {
        width: 100%;
    }

    /* Стили для кастомных инпутов даты */
    .dateInputContainer {
        position: relative;
        width: 282px !important;
        height: 70px !important;
        background-color: #FFFFFF;
        border-radius: 20px !important;
        display: flex;
        flex-direction: column;
        /*  Текст сверху, дата снизу */
        justify-content: center;
        padding: 0 20px;
        box-sizing: border-box;
    }

    /* Специальные стили для второй формы */
    .relaxFormContainer .dateInputContainer {
        z-index: 10;
        height: 43px !important;
        /* Больше чем у соседних элементов */
    }
    .blockStartRelaxForm .selectContainer {
        height: 43px !important;
    }

    .footerContainer {
        width: 100% !important;
        height: 324px !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: start !important;
        align-items: start !important;
        /* Изменено с baseline на flex-start */
        /* padding-left: 15px !important; */
        /* Добавлен отступ слева для красоты */
        margin-top: 20% !important;
        padding: 0 !important;
    }

    .footerLogo {
        margin-top: 31px !important;
        margin-left: 41px !important;
        width: 184px !important;
        height: 18px !important;
        font-size: 14px !important;
        display: flex;
        align-items: center;
    }

    .footerMenuItem {
        font-size: 12px !important;
    }

    .footerMenuContainer,
    .footerContactContainer {
        margin-top: 31px !important;
        margin-left: 41px !important;
        /* margin: 15px 0; */
    }

    .footerMenuContainer {
        height: 67px !important;
    }

    .footerContactContainer {
        display: none;
    }

    .footerContactContainerMobile {
        margin-top: 31px !important;
        margin-left: 41px !important;
        display: block;
        width: 127px !important;
        height: 33px !important;
    }

    .footerButtonBookingDown {
        /* width: 100% !important; */
        height: 43px !important;
        border-radius: 10px !important;
        margin-top: 31px;
        margin-left: 40px !important;
        font-size: 14px !important;
        font-weight: 700 !important;
        margin-bottom: 60px;
    }

    .footerMenuList {
        list-style-type: none !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: space-around !important;
        gap: 2px !important;
        padding: 0 !important;
        margin: 0 !important;
        height: 40px !important;
    }

    .footerContactPhone {
        font-size: 12px !important;
        width: 135px !important;
        height: 16px !important;
    }

    .footerContactMail {
        margin-top: 1px !important;
        font-size: 12px !important;
        width: 135px !important;
        height: 16px !important;
    }

    /* Нижняя форма */
    .blockStartRelaxForm {
        margin-top: 55px !important;
        width: 100% !important;
        height: 290px !important;
        border-radius: 20px !important;
    }

    .blockStartRelaxForm .dateInputContainer,
    .blockStartRelaxForm .selectContainer,
    .blockStartRelaxForm .FooterButtonBooking {
        width: 100% !important;
        height: 43px !important;
        margin-top: 0px !important;
        position: relative;
        /* Гарантируем, что инпут и иконка правильно взаимодействуют */
        z-index: 0;
    }

    .relaxFormContainer {
        width: 100% !important;
        padding: 15px;
        height: 238px !important;
        gap: 0px !important;
    }

    .relaxFormContainer .flatpickr-calendar {
        top: calc(100% + 5px) !important;
        left: 0 !important;
        width: 100% !important;
    }

    .relaxFormText {
        font-size: 14px !important;
        text-align: center;
    }

    .FooterButtonBooking {
        width: 100% !important;
        height: 43px !important;
        margin-top: 10px !important;
        border-radius: 10px !important;
        font-size: 14px !important;
        /* margin-bottom: 10px !important; */
    }

    .footerButtonBookingDown {
        width: 239px !important;
        height: 43px !important;
        border-radius: 10px !important;
        margin-top: 15px !important;
        margin-left: 40px !important;
    }

    .dateInputContainer {
        position: relative;
        z-index: 1;
    }

    .dateInputContainer.active {
        z-index: 1001;
    }

    /* Дополнительные гарантированные стили для второго календаря */
    .dateInputContainer:nth-child(2) .flatpickr-calendar,
    .dateInputContainer:nth-child(2) .flatpickr-month,
    .dateInputContainer:nth-child(2) .flatpickr-innerContainer,
    .dateInputContainer:nth-child(2) .flatpickr-rContainer {
        background: #fff !important;
    }

    .inputFlex {
        margin-bottom: 130px !important;
        flex-direction: column;
        width: 100% !important;
        height: 43px !important;
    }

    .inputFlex {
        position: relative;
        z-index: 1;
    }

    .calendarIcon {
        /* width: 20px !important;
       height: 20px !important; */
        cursor: pointer;
        width: 16.67px !important;
        height: 16.25px !important;
        filter: drop-shadow(0 0 0.5px #272F07);
        margin-right: 9px;
        top: 50%;
    }

    /* Иконка календаря */
    .calendarIcon {
        position: relative;
        z-index: 2;
        cursor: pointer;
    }

    .calendarIcon {
        position: relative;
        z-index: 3;
        cursor: pointer;
    }

    .dateInputContainer, .selectContainer {
        border-radius: 10px !important;
    }

    /* Футер */
    .footerContainer {
        height: auto !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: flex-start !important;
        align-items: baseline !important;
        width: 100% !important;
    }

    .footerLogo {
        font-size: 14px !important;
        display: flex;
        align-items: center;
    }

    .footerMenuItem {
        font-size: 16px !important;
    }

    .footerMenuContainer,
    .footerContactContainer {
        margin: 15px 0;
    }

    .footerMenuContainer {
        height: 107px !important;
    }

    .footerContactContainer {
        display: none;
    }

    .footerContactContainerMobile {
        display: block;
    }

    .footerMenuList {
        list-style-type: none !important;
        display: flex !important;
        flex-direction: column !important;
        justify-content: space-around !important;
        gap: 2px !important;
        padding: 0 !important;
        margin: 0 !important;
        height: 40px !important;
    }

    .footerContactPhone {
        font-size: 12px !important;
        width: 135px !important;
        height: 16px !important;
    }

    .footerContactMail {
        font-size: 12px !important;
        width: 135px !important;
        height: 16px !important;
    }
}

@media(max-width:361px) {
    .FooterButtonBooking {
        width: 100% !important;
        height: 43px !important;
        margin-top: 10px !important;
        border-radius: 10px !important;
        font-size: 14px !important;
        /* margin-bottom: 10px !important; */
    }

    .inputFlex {
        margin-bottom: 130px !important;
        flex-direction: column;
        width: 100% !important;
        height: 43px !important;

    }
}