.calendar-service-v2-main-container
{
    padding: 20px;
}
.service-header-neo
{
    align-items: flex-start;
    display: flex;
    justify-content: space-between;
}
.service-header-neo-left
{
    color: #101828;
    font-size: 25px;
    font-style: normal;
    font-weight: 500;
    line-height: 38px;
    text-align: left;
    width: 40%;
}
.service-header-neo-right
{
    text-align: right;
    width: 50%;
}
.calendar-service-v2-main-container>hr
{
    border-top: .5px solid #eaecf0;
    margin-top: 10px;
}
.service-search-input-container
{
    align-items: center;
    background: #fff;
    border: 1px solid #d0d5dd;
    border-radius: 8px;
    box-shadow: 0 1px 2px #1018280d;
    cursor: pointer;
    display: flex;
    justify-content: space-between;
    margin: 20px 0;
    padding: 0 10px;
    width: 25%;
}
.service-search-input-container>div
{
    align-items: center;
    display: flex;
    flex-direction: row;
    gap: 10px;
}
.service-search-input-container>input[type=text]
{
    border: none;
    height: 38px;
    margin-left: 10px;
    outline: none;
    position: relative;
    width: 100%;
}
.service-search-input-container>input[type=text]::-moz-placeholder
{
    color: var(--gray-500);
    font-size: 14px;
    padding: 0;
}
.service-search-input-container>input[type=text]::placeholder
{
    color: var(--gray-500);
    font-size: 14px;
    padding: 0;
}
.service-list-container
{
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: space-between;
    margin-top: 30px;
}
@media(max-width: 714px)
{
    .service-search-input-container
    {
        width: 100%;
    }
    .service-header-neo
    {
        align-items: flex-start;
        flex-direction: column-reverse;
    }
    .service-header-neo-right
    {
        margin-top: 10px;
        text-align: left;
        width: 100%;
    }
    .service-header-neo-right .business-info
    {
        align-items: flex-start;
        display: flex;
        flex-direction: column;
        margin-bottom: 20px;
    }
    .service-header-neo-left, .service-header-neo-right .business-address
    {
        width: 100%;
    }
}
.calendar-service-staff-main-container[data-v-396cb685]
{
    padding: 20px;
}
.staff-header[data-v-396cb685]
{
    color: #101828;
    font-size: 20px;
    font-style: normal;
    font-weight: 500;
    line-height: 38px;
    text-align: left;
}
.calendar-service-staff-main-container>hr[data-v-396cb685]
{
    border-top: .5px solid #eaecf0;
    margin-top: 10px;
}
.any-staff-available-container[data-v-396cb685]
{
    align-items: center;
    align-items: flex-start;
    background: #fff;
    border: 1px solid #eaecf0;
    border-radius: 12px;
    margin: 20px 0;
}
.any-staff-available-container[data-v-396cb685], .selected-any-staff-available-container[data-v-396cb685]
{
    box-shadow: 0 1px 2px #1018280f,0 1px 3px #1018281a;
    cursor: pointer;
    display: flex;
    flex-direction: row;
    gap: 30px;
    padding: 20px;
    position: relative;
}
.selected-any-staff-available-container[data-v-396cb685]
{
    align-items: center;
    background: #eff4ff;
    border: 1px solid #004eeb;
    border-radius: 12px;
    margin-top: 30px;
}
.staff-blue-bkgrnd[data-v-396cb685]
{
    background: #004eeb;
    transform: rotate(15deg);
}
.staff-blue-bkgrnd[data-v-396cb685], .staff-overlay-container[data-v-396cb685]
{
    border-radius: 12px;
    flex-shrink: 0;
    height: 56px;
    width: 56px;
}
.staff-overlay-container[data-v-396cb685]
{
    align-items: center;
    -webkit-backdrop-filter: blur(8px);
    backdrop-filter: blur(8px);
    background: #fff9;
    border: 1px solid hsla(0,0%,100%,.6);
    display: flex;
    justify-content: center;
    left: 7px;
    padding: 14px;
    position: absolute;
    top: 27px;
}
.select-staff-text-container[data-v-396cb685]
{
    align-items: flex-start;
    display: flex;
    flex-direction: column;
}
.select-staff-title[data-v-396cb685]
{
    color: #101828;
    font-size: 16px;
    font-style: normal;
    font-weight: 500;
    line-height: 28px;
}
.select-staff-desc[data-v-396cb685]
{
    color: #475467;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px;
    text-align: left;
}
.staff-list-container[data-v-396cb685]
{
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    justify-content: space-between;
    margin-top: 30px;
}
.appointment_widgets--revamp--staff-selection-label[data-v-28302824]
{
    color: var(--appointment_widgets-primary-color);
    font-size: 16px;
    font-weight: 500;
    margin-left: 0!important;
}
.appointment_widget--staff-selection[data-v-28302824]
{
    background: transparent!important;
    border-radius: 8px;
    margin-bottom: 16px;
    padding: 0;
}
.avatar_img[data-v-28302824]
{
    align-items: center!important;
    border-radius: 50%;
    color: #fff;
    display: flex;
    font-size: 12px;
    height: 25px;
    justify-content: center!important;
    line-height: 20px;
    margin-right: 8px;
    min-width: 20px;
    overflow: hidden;
    text-align: center;
    width: 25px;
}
.custom-label[data-v-28302824]
{
    align-items: center;
    color: var(--appointment_widgets-text-color);
    display: flex!important;
    flex-direction: row!important;
    font-size: 13px;
    font-weight: 400;
    height: 30px;
}
.pay-now-mobile-view[data-v-28302824]
{
    margin-bottom: 5rem;
}
.pointer-events-none[data-v-28302824]
{
    pointer-events: none;
}
.location-picker-container[data-v-28302824]
{
    padding: 20px 20px 0;
}
.custom-form-title[data-v-28302824]
{
    margin-bottom: 0!important;
    padding-left: 20px;
}
#appointment-widgets-booking--revamp .ghl-payment-element .card-input-label
{
    color: var(--appointment_widgets-text-color)!important;
}
#appointment-widgets-booking--revamp .StripeElement
{
    background: color-mix(in srgb,var(--appointment_widgets-light-text-color) 15%,#fff)!important;
}
#appointment-widgets-booking--revamp.default-form #_builder-form label, #appointment-widgets-booking--revamp.default-form .terms-and-conditions span
{
    color: var(--appointment_widgets-text-color);
    font-family: Inter,sans-serif!important;
    font-size: 14px;
    font-weight: 500;
}
#appointment-widgets-booking--revamp.default-form .form-builder--wrap
{
    background-color: transparent;
    max-width: none;
    padding: 0!important;
}
#appointment-widgets-booking--revamp.default-form .expiry-cvv-section
{
    gap: 20px;
}
#appointment-widgets-booking--revamp.default-form .expiry-cvv-section>div
{
    width: 50%;
}
#appointment-widgets-booking--revamp.default-form .terms-and-conditions span
{
    font-weight: 500;
}
#appointment-widgets-booking--revamp.default-form .hl-app #_builder-form input[type=email], #appointment-widgets-booking--revamp.default-form .hl-app #_builder-form input[type=number], #appointment-widgets-booking--revamp.default-form .hl-app #_builder-form input[type=password], #appointment-widgets-booking--revamp.default-form .hl-app #_builder-form input[type=text], #appointment-widgets-booking--revamp.default-form .iti--allow-dropdown input, #appointment-widgets-booking--revamp.default-form .iti--allow-dropdown input[type=tel], #appointment-widgets-booking--revamp.default-form .iti--allow-dropdown input[type=text], #appointment-widgets-booking--revamp.default-form .iti--separate-dial-code input, #appointment-widgets-booking--revamp.default-form .iti--separate-dial-code input[type=tel], #appointment-widgets-booking--revamp.default-form .iti--separate-dial-code input[type=text], #appointment-widgets-booking--revamp.default-form textarea[name=calendar_notes]
{
    background: var(--appointment_widgets-background-color);
    border: 1px solid var(--appointment_widgets-light-text-color);
    border-radius: 8px;
    color: var(--appointment_widgets-text-color);
}
#appointment-widgets-booking--revamp.default-form .hl-app #_builder-form input[type=email]:active:focus, #appointment-widgets-booking--revamp.default-form .hl-app #_builder-form input[type=email]:focus, #appointment-widgets-booking--revamp.default-form .hl-app #_builder-form input[type=number]:active:focus, #appointment-widgets-booking--revamp.default-form .hl-app #_builder-form input[type=number]:focus, #appointment-widgets-booking--revamp.default-form .hl-app #_builder-form input[type=password]:active:focus, #appointment-widgets-booking--revamp.default-form .hl-app #_builder-form input[type=password]:focus, #appointment-widgets-booking--revamp.default-form .hl-app #_builder-form input[type=text]:active:focus, #appointment-widgets-booking--revamp.default-form .hl-app #_builder-form input[type=text]:focus, #appointment-widgets-booking--revamp.default-form .iti--allow-dropdown input:active:focus, #appointment-widgets-booking--revamp.default-form .iti--allow-dropdown input:focus, #appointment-widgets-booking--revamp.default-form .iti--allow-dropdown input[type=tel]:active:focus, #appointment-widgets-booking--revamp.default-form .iti--allow-dropdown input[type=tel]:focus, #appointment-widgets-booking--revamp.default-form .iti--allow-dropdown input[type=text]:active:focus, #appointment-widgets-booking--revamp.default-form .iti--allow-dropdown input[type=text]:focus, #appointment-widgets-booking--revamp.default-form .iti--separate-dial-code input:active:focus, #appointment-widgets-booking--revamp.default-form .iti--separate-dial-code input:focus, #appointment-widgets-booking--revamp.default-form .iti--separate-dial-code input[type=tel]:active:focus, #appointment-widgets-booking--revamp.default-form .iti--separate-dial-code input[type=tel]:focus, #appointment-widgets-booking--revamp.default-form .iti--separate-dial-code input[type=text]:active:focus, #appointment-widgets-booking--revamp.default-form .iti--separate-dial-code input[type=text]:focus, #appointment-widgets-booking--revamp.default-form textarea[name=calendar_notes]:active:focus, #appointment-widgets-booking--revamp.default-form textarea[name=calendar_notes]:focus
{
    background: none!important;
    border: 2px solid var(--appointment_widgets-primary-color);
    box-shadow: none!important;
    outline: none;
    transition: none;
}
#appointment-widgets-booking--revamp.default-form .hl-app input[type=checkbox], #appointment-widgets-booking--revamp.default-form .hl-app input[type=radio]
{
    border: 1px solid var(--appointment_widgets-border-color);
    border-radius: 8px;
    height: 16px;
    margin-top: 3px;
    width: 16px;
}
.service-header-classic
{
    align-items: flex-start;
    display: flex;
    justify-content: space-between;
    padding-left: 10%;
    padding-right: 10%;
}
.service-header-classic-left
{
    font-size: 25px;
    font-style: normal;
    font-weight: 500;
    line-height: 38px;
    text-align: left;
    width: 50%;
}
.service-header-classic-right
{
    text-align: right;
    width: 50%;
}
.service-widget-action-container
{
    align-items: flex-end;
    background: #fff;
    border-top: 1px solid var(--appointment_widgets-border-color);
    bottom: 0;
    display: flex;
    flex-direction: row;
    gap: 10px;
    justify-content: flex-end;
    margin: 0 auto;
    max-width: 1220px;
    padding-bottom: 20px;
    padding-right: 20px;
    padding-top: 1rem;
    position: sticky;
    width: 100%;
}
.service-widget-action-container>div
{
    align-items: center;
    display: flex;
    gap: 5px;
    margin-left: 20px;
    width: 100%;
}
.service-widget-action-container svg
{
    height: .8rem;
    margin-right: .3rem;
}
.service-back-link
{
    align-items: center;
    color: #004eeb!important;
    cursor: pointer;
    display: flex;
    font-weight: 700;
}
@media(max-width: 982px)
{
    .service-widget-action-container
    {
        max-width: 768px;
        width: 100%;
    }
}
@media(max-width: 726px)
{
    .service-widget-action-container
    {
        border-bottom: 1px solid var(--appointment_widgets-border-color);
        border-radius: 0;
        border-top: none;
        bottom: 0;
        justify-content: flex-start;
        max-width: 726px;
        padding-bottom: 1rem;
        padding-top: 1rem;
        position: relative;
        width: 100%;
    }
    .service-widget-action-container>div
    {
        align-items: center;
        display: flex;
        flex: 0 0 13.33333%;
        gap: 5px;
        justify-content: center;
        max-width: 33.33333%;
    }
    .service-header-classic
    {
        align-items: flex-start;
        flex-direction: column-reverse;
        margin-bottom: 20px;
        padding-left: 0;
        padding-right: 0;
    }
    .service-header-classic-left
    {
        width: 100%;
    }
    .service-header-classic-right
    {
        margin-top: 10px;
        text-align: left;
        width: 100%;
    }
    .service-header-classic-right .business-info
    {
        align-items: flex-start;
        display: flex;
        flex-direction: column;
        margin-bottom: 20px;
    }
    .service-header-classic-right .business-address
    {
        width: 100%;
    }
}