/* Start:/bitrix/templates/belberrymed/components/bitrix/breadcrumb/.default/style.css?17622499502337*/
.breadcrumbs {
    position: relative;
	z-index: 10;
}
.breadcrumbs__back {
    border-radius: .5rem;
    padding: 0px;
    height: 2.5rem;
    width: 2.5rem;
    position: relative;
    margin-right: 1.5rem;
    transition: all ease .24s;
    background-color: #f525361c;
    display: flex;
    background-repeat: no-repeat;
    background-position: center;
    background-size: auto 1.125rem;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg width='12' height='18' viewBox='0 0 12 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M10 2L3 9L10 16' stroke='%23F52536' stroke-width='3'/%3E%3C/svg%3E");
    filter: grayscale(1);
    critical: this;
}

.breadcrumbs__back:active {
    background-color: rgba(245, 37, 54, 0.24);
}

.breadcrumbs__back img {
    height: .875rem;
    margin-left: -.1rem;
    position: relative;
}

.breadcrumbs .center-wrap > div {
    /* padding: 1.5rem 0px; */
}

.breadcrumbs__back:hover {filter: grayscale(0);}
.breadcrumbs__link {
    color: var(--color__dark);
    text-decoration: none;
    transition: all ease .24s;
    font-weight: 600;
    opacity: .64;
    font-size: .75rem !important;
}

li.breadcrumbs__devider {
    margin: 0px .75rem;
    width: .25rem;
    height: .25rem;
    background-color: var(--color__dark);
    border-radius: .5rem;
    top: .075rem;
    position: relative;
    opacity: .2;
}

.breadcrumbs__link:hover {
    color: var(--color__fill-1);
    opacity: 1;
}

.breadcrumbs__active {
    opacity: .40;
    font-size: .75rem !important;
}

img.breacrcrumb__back {
    margin-right: .5rem;
    position: relative;
    top: .10rem;
    height: 1rem;
}

.breadcrumbs__link.--back {
    color: var(--color__fill-1);
    filter: grayscale(0);
    opacity: 1;
}

.breadcrumbs__link.--back:hover {
    filter: grayscale(0);
    opacity: 1;
}

.footer-breadcrumb {}

.footer-breadcrumb .breadcrumbs {
    margin: 0 !important;
}

@media screen and (max-width: 1680px) {  

}

@media screen and (max-width: 1440px) {  

}

@media screen and (max-width: 1366px) {  

}

@media screen and (max-width: 1359px) {  

}

@media screen and (max-width: 1199px) {  

}

@media screen and (max-width: 1024px) {  


}

@media screen and (max-width: 991px) {  
    
}

@media screen and (max-width: 768px) {  

}

@media screen and (max-width: 640px) {  

}


/* End */


/* Start:/bitrix/templates/belberrymed/include/doctor-appointment/doctor-appointment.css?17854068319310*/
.doctor-appointment {
    background: transparent;
}

.doctor-appointment .doctor-appointment__wrap {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
}

.doctor-appointment .doctor-appointment__form-panel {
    flex: 1 1 58%;
    max-width: 58%;
    background: #4da5e5;
    border: 4px solid #4da5e5;
    border-radius: 1rem;
    padding: 2rem;
    color: #fff;
}

.doctor-appointment .doctor-appointment__contacts-panel {
    flex: 1 1 42%;
    max-width: 42%;
    border: 4px solid #4da5e5;
    border-radius: 1rem;
    overflow: hidden;
    background: #ffffff;
}

.doctor-appointment .doctor-appointment__contacts-panel .mini-contacts {
    width: 100% !important;
    max-width: 100% !important;
    height: auto;
    margin-bottom: 0;
    padding-top: 0;
    border-top-left-radius: 0;
    border-top-right-radius: 0;
}

.doctor-appointment .doctor-appointment__contacts-panel .mini-contacts .center-wrap.--disable {
    height: auto !important;
    max-width: 100%;
}

.doctor-appointment .doctor-appointment__contacts-panel .mini-contacts__wrap {
    display: block;
    height: auto;
    margin-bottom: 0;
}

.doctor-appointment .doctor-appointment__contacts-panel .mini-contacts__messegers {
    margin-top: 1rem !important;
}

/* Hide global branch address cards only inside doctor appointment contacts panel.
   Keep city title + phone + email + messengers. */
.doctor-appointment .doctor-appointment__contacts-panel .mini-contacts__adress .contact-address-list {
    display: none !important;
}

.doctor-appointment .doctor-appointment__contacts-panel .mini-contacts__adress {
    margin-bottom: 0.25rem;
}

.doctor-appointment .doctor-appointment__map {
    margin: 1rem 1rem 1.25rem;
}

.doctor-appointment .doctor-appointment__map-frame {
    width: 100%;
    border-radius: 1rem;
    overflow: hidden;
    background: #fff;
    min-height: 280px;
    box-shadow: 0 1rem 2.5rem rgb(0 0 0 / 6%);
}

.doctor-appointment .doctor-appointment__map-frame iframe {
    display: block;
    width: 100%;
    height: 320px;
    border: 0;
}

.doctor-appointment .doctor-appointment__branch-cards {
    display: grid;
    grid-template-columns: 1fr;
    gap: 0.5rem;
    margin-top: 0.75rem;
}

.doctor-appointment .doctor-appointment__branch-cards.is-multi {
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.doctor-appointment .doctor-appointment__branch-cards.is-single {
    grid-template-columns: 1fr;
    max-width: 22rem;
}

.doctor-appointment .doctor-appointment__branch-card {
    display: flex;
    flex-direction: column;
    height: 100%;
    min-width: 0;
    padding: 0.5rem 0.75rem;
    background: #f7fbff;
    border: 1px solid #d7eafc;
    border-radius: 14px;
    box-sizing: border-box;
}

.doctor-appointment .doctor-appointment__branch-card-main {
    display: flex;
    flex-direction: column;
    gap: 0.1875rem;
    flex: 1 1 auto;
    min-width: 0;
    text-decoration: none;
    color: inherit;
    transition: opacity 0.15s ease;
}

.doctor-appointment .doctor-appointment__branch-card-main:hover {
    opacity: 0.88;
}

.doctor-appointment .doctor-appointment__branch-card-main:focus-visible {
    outline: 2px solid #4da5e5;
    outline-offset: 2px;
}

.doctor-appointment .doctor-appointment__branch-card-title {
    display: block;
    font-size: 0.875rem;
    line-height: 1.25;
    font-weight: 700;
    color: #10275c;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.doctor-appointment .doctor-appointment__branch-card-meta {
    display: block;
    font-size: 0.8125rem;
    line-height: 1.2;
    color: #7a8ca5;
    overflow-wrap: anywhere;
    word-break: break-word;
}

.doctor-appointment .doctor-appointment__branch-card-map {
    display: inline-block;
    margin-top: 0.375rem;
    font-size: 0.8125rem;
    line-height: 1.2;
    color: #2f8de4;
    text-decoration: none;
    transition: color 0.15s ease, opacity 0.15s ease;
}

.doctor-appointment .doctor-appointment__branch-card-map:hover {
    color: #1f7ad0;
    opacity: 0.95;
}

.doctor-appointment .doctor-appointment__branch-card-map:focus-visible {
    outline: 2px solid #4da5e5;
    outline-offset: 2px;
}

.doctor-appointment .doctor-appointment__title {
    color: #fff;
    text-align: center;
}

.doctor-appointment .doctor-appointment__info {
    color: #0b1142;
    background: #ffffff;
    border-radius: 1rem;
    padding: 0.875rem 1rem;
    margin-top: 1rem !important;
}

.doctor-appointment .doctor-appointment__doctor-line {
    color: #0b1142;
}

.doctor-appointment .doctor-appointment__doctor-name {
    color: #0b1142;
    font-weight: 700;
}

.doctor-appointment .doctor-appointment__branches {
    display: flex;
    flex-direction: column;
    gap: 0.5rem;
    margin-top: 0.5rem;
}

.doctor-appointment .doctor-appointment__branch {
    color: #0b1142;
}

.doctor-appointment .doctor-appointment__form {
    margin-top: 1.5rem !important;
}

.doctor-appointment .doctor-appointment__field + .doctor-appointment__field,
.doctor-appointment .doctor-appointment__field + .doctor-appointment__grid,
.doctor-appointment .doctor-appointment__grid + .doctor-appointment__field {
    margin-top: 1rem !important;
}

.doctor-appointment .doctor-appointment__label {
    color: #fff;
    display: block;
    margin-bottom: 0.5rem;
}

.doctor-appointment .doctor-appointment__input {
    width: 100%;
    min-height: 4.25rem;
    height: 4.25rem;
    border-radius: 1rem;
    font-size: 1.125rem;
}

.doctor-appointment .doctor-appointment__grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
    align-items: stretch;
}

.doctor-appointment .doctor-appointment__grid .doctor-appointment__field {
    display: flex;
    flex-direction: column;
}

.doctor-appointment .doctor-appointment__grid .doctor-appointment__label {
    min-height: 2.5rem;
    display: flex;
    align-items: flex-end;
    margin-bottom: 0;
}

.doctor-appointment .doctor-appointment__grid .doctor-appointment__input {
    margin-top: 0.5rem;
}

.doctor-appointment .doctor-appointment__submit {
    width: 100%;
    min-height: 4rem;
    height: 4rem;
    border-radius: 1rem;
    background-color: var(--color__fill-2);
    color: #fff;
}

.doctor-appointment .doctor-appointment__submit:hover {
    background-color: var(--color__fill-2-h);
}

.doctor-appointment .doctor-appointment__submit:focus-visible {
    box-shadow: 0 0 0 0.2rem rgba(255, 255, 255, 0.55);
}

.doctor-appointment .doctor-appointment__submit:disabled,
.doctor-appointment .doctor-appointment__submit.is-disable {
    filter: grayscale(1);
    opacity: 0.45;
}

.doctor-appointment .doctor-appointment__error {
    color: #ffebee;
}

.doctor-appointment .doctor-appointment__success {
    color: #e8fff2;
}

.doctor-appointment .doctor-appointment__policy .checkbox__label {
    color: #fff;
    opacity: 0.95;
    line-height: 1.2rem;
}

.doctor-appointment .doctor-appointment__policy .checkbox:hover .checkbox__label {
    opacity: 1;
}

.doctor-appointment .doctor-appointment__policy .checkbox input:checked + * > .checkbox__label {
    color: #fff;
}

.doctor-appointment .doctor-appointment__policy .checkbox__trigger {
    border-color: #fff;
    box-shadow: inset 0 0 0 0.1875rem #fff;
}

.doctor-appointment .doctor-appointment__policy .checkbox input:checked + * > .checkbox__trigger {
    background-color: rgba(255, 255, 255, 0.24);
    box-shadow: inset 0 0 0 0.1875rem #fff;
}

.doctor-appointment .doctor-appointment__policy .link.--color-white {
    text-decoration: underline;
}

@media (max-width: 1024px) {
    .doctor-appointment .doctor-appointment__wrap {
        flex-direction: column;
    }

    .doctor-appointment .doctor-appointment__form-panel,
    .doctor-appointment .doctor-appointment__contacts-panel {
        flex: 1 1 100%;
        max-width: 100%;
    }

    .doctor-appointment .doctor-appointment__form-panel {
        padding: 1.5rem;
    }

    .doctor-appointment .doctor-appointment__map {
        margin: 1rem 0.75rem 1rem;
    }

    .doctor-appointment .doctor-appointment__branch-cards.is-multi {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .doctor-appointment .doctor-appointment__branch-cards.is-single {
        max-width: none;
    }
}

@media (max-width: 768px) {
    .doctor-appointment .doctor-appointment__grid {
        grid-template-columns: 1fr;
    }

    .doctor-appointment .doctor-appointment__grid .doctor-appointment__label {
        min-height: 0;
    }

    .doctor-appointment .doctor-appointment__map {
        margin: 1rem 0.75rem 1.25rem;
    }

    .doctor-appointment .doctor-appointment__map-frame iframe {
        height: 260px;
    }

    .doctor-appointment .doctor-appointment__branch-cards.is-multi {
        grid-template-columns: 1fr;
    }

    .doctor-appointment .doctor-appointment__branch-cards.is-single {
        max-width: none;
    }
}

@media (max-width: 375px) {
    .doctor-appointment .doctor-appointment__form-panel {
        padding: 1rem;
    }

    .doctor-appointment .doctor-appointment__map {
        margin: 0.875rem 0.5rem 1.5rem;
    }

    .doctor-appointment .doctor-appointment__map-frame iframe {
        height: 230px;
    }

    .doctor-appointment .doctor-appointment__branch-card {
        padding: 0.5rem 0.625rem;
    }
}

/* End */
/* /bitrix/templates/belberrymed/components/bitrix/breadcrumb/.default/style.css?17622499502337 */
/* /bitrix/templates/belberrymed/include/doctor-appointment/doctor-appointment.css?17854068319310 */