:root {
    --primary-color: #0498d8;
    --secondary-color: #1d1d1d;
    --book-font: 'Helvetica Neue LT W01_71488914', Arial, Helvetica, sans-serif;
    --border-radius: 200px;
    --border-color: #ececec;
    --form-border: 1px solid #ececec;
    --box-shadow: none;
    --font-spacing: 0.09em;
}


.widget-booking.home {
    background-color: var(--secondary-color);
    padding: 20px 20px 40px;
    border-radius: 15px;
    max-width: 600px;
    margin-inline: auto;

    #widget-title {
        font-family: var(--book-font);
        font-weight: bold;
        font-size: 1.75rem;
        line-height: 1;
        letter-spacing: var(--font-spacing);
        text-transform: uppercase;
        text-align: center;
        color: #ffffff;
    }

    .rootrez_widget_form_wrapper {
        border: none;
        border-radius: 0;
        background-color: var(--secondary-color);
    }

    #rootrez-widget-form {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 10px;
        justify-content: unset;
    }
    
    #rootrez-widget-form > * {
        background-color: #ffffff;
        border-radius: 9999px;
    }

    .rootrez_widget_form_wrapper #rootrez-widget-form .search_dates,
    .rootrez_widget_form_wrapper #rootrez-widget-form .search_occupancy,
    .rootrez_widget_form_wrapper.no-deals #rootrez-widget-form .search_dates,
    .rootrez_widget_form_wrapper.no-deals #rootrez-widget-form .search_occupancy,
    .rootrez_widget_form_wrapper.has-deals #rootrez-widget-form .search_promo_code {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 7px;
        width: 100%;
        max-width: none;
        height: 40px;
        padding: 9px 20px;
        font-family: var(--book-font);
        font-weight: 450;
        font-size: 0.9375rem;
        line-height: 1;
        color: var(--secondary-color);
        text-align: center;
        background: #ffffff;
        border: none;
        cursor: pointer;
    }

    #rootrez-widget-form .search_occupancy-event,
    #rootrez-widget-form .search_promo_code-event {
        justify-content: center;
    }

    #rootrez-widget-form .search_promo_code h3 {
        width: unset;
        span {
            white-space: break-spaces;
            line-height: 1;
        }
    }

    .rootrez_widget_form_wrapper #rootrez-widget-form .search_submit,
    .rootrez_widget_form_wrapper.no-deals #rootrez-widget-form .search_submit {
        max-width: none;
    }

    .rootrez_widget_form_wrapper #rootrez-widget-form .search_submit button,
    .rootrez_widget_form_wrapper.no-deals #rootrez-widget-form .search_submit button {
        display: block;
        height: 40px;
        padding: 9px 20px;
        border-radius: 9999px;
    }

    .rootrez_widget_form_wrapper #rootrez-widget-form .search_submit button:hover,
    .rootrez_widget_form_wrapper.nodeals #rootrez-widget-form .search_submit button:hover {
        background-color: var(--primary-color);
        color: var(--secondary-color);
    }
}

@media (min-width: 75em) {
    .widget-booking.home {
        max-width: unset;
        margin: 0;
        padding: 40px 20px;
        border-radius: 54px;

        .booking-form {
            display: grid;
            grid-template-columns: 300px minmax(0, 1fr);
            align-items: center;
            gap: 35px;
        }

        #widget-title-box,
        #widget-title {
            margin: 0;
            padding: 0;
        }

        .rootrez_widget_form_wrapper {
            max-width: unset;
        }
        .rootrez_widget_form_wrapper.no-deals #rootrez-widget-form {
            grid-template-columns: repeat(3, minmax(0, 1fr));
            gap: 20px;
        }

        .rootrez_widget_form_wrapper.has-deals #rootrez-widget-form {
            grid-template-columns: repeat(4, minmax(0, 1fr));
            gap: 20px;
        }

        #rootrez-widget-form .search_promo_code-event {
            height: 100%;
        }
    }

    
}

.widget-booking.interior .rootrez_widget_form_wrapper:not(.has-deals) {
    max-width: 600px;
}
.widget-booking.interior #rootrez-widget-form .search_submit button {
    height: 66px;
}

.widget-booking.interior .rootrez_widget_form_wrapper #rootrez-widget-form .search_dates,
.widget-booking.interior .rootrez_widget_form_wrapper.no-deals #rootrez-widget-form .search_dates {
    font-family: var(--book-font);
    font-weight: 450;
}

.widget-booking #rootrez-widget-form .search_submit button,
.widget-booking #rootrez-widget-form .search_promo_code h3 span,
.widget-booking #rootrez-widget-form .search_occupancy h3.guest-total,
.widget-booking .rootrez_widget_form_wrapper #rootrez-widget-form .search_dates,
.widget-booking .rootrez_widget_form_wrapper.no-deals #rootrez-widget-form .search_dates {
    letter-spacing: var(--font-spacing);
}

.widget-booking .search_occupancy-counter-item input.counter {
    background-color: #ffffff;
    box-shadow: none;
    margin: 0;
}