/* servis-branch-section */
.servis-branch-section {
    text-align: center;
    padding-bottom: 55px;
}

.servis-branch-section h1 {
    margin-block: 0px 52px;
}

.servis-branch-section-title {
    font-weight: 600;
    text-transform: uppercase;
    font-size: 20px;
    line-height: 23.46px;
}

.input-choices-cont {
    width: 100%;
    max-width: 460px;
    max-width: 460px;
    margin: 20px auto;
    position: relative;
}

.servis-branch-input-cont input {
    border: var(--input-border);
    font-size:16px;
}

.servis-branch-input-cont input:focus-visible {
    border-radius: 0;
    outline: none;
}

.input-choices-cont .input-choices {
    border: var(--input-border);
    width: 100%;
    box-sizing: border-box;
    border-top: none;
    position: absolute;
    background-color: white;
    z-index: 99;
    display: none;
    max-height: 50vh;
    overflow: auto;
}

.servis-branch-input-cont input,
.input-choices .input-one-choice {
    text-align: center;
    padding: 16px;
    letter-spacing: 0.6px;
    color: var(--kolofix-black-ish);
    width: 100%;
    box-sizing: border-box;
    display: inline-block;
    text-decoration: none;
}

.input-choices .input-one-choice {
    border-top: none;
}

@media (hover: hover) and (pointer: fine) {
    .input-choices .input-one-choice {
        cursor: pointer;
    }
}

.servis-branch-input-cont.active input {
    border-bottom: none;
}

.servis-branch-input-cont.active .input-choices {
    display: block;
}

@media (hover: hover) and (pointer: fine) {
    .input-choices .input-one-choice:hover,
    .input-choices .input-one-choice:active {
        background-color: var(--kolofix-color-3);
        font-weight: 700;
    }
}


/* choose-servis-package-section */
.choose-servis-package-section {
    padding-top: 60px;
    text-align: center;
    padding-bottom: 60px;
}

.servis-branch-section-icon {
    padding-block: 10px;
    display: inline-block;

}

.type-of-servis-btns {
    max-width: 707px;
    display: flex;
    justify-content: center;
    align-items: center;
    padding-block: 35px 24px;
    margin: auto;

}

.type-of-servis-one-btn {
    padding: 15px 20px;
    border-width: 1px 1px 1px 0px;
    border-style: solid;
    border-color: var(--kolofix-red);
    text-decoration: none;
    color: var(--kolofix-black-ish);
    font-weight: 600;
    text-transform: uppercase;
    font-style: italic;
}

.type-of-servis-one-btn:nth-of-type(1) {
    border-top-left-radius: 100px;
    border-bottom-left-radius: 100px;
    border-width: 1px 1px 1px 1px;
}

.type-of-servis-one-btn:nth-of-type(3) {
    border-top-right-radius: 100px;
    border-bottom-right-radius: 100px;
}

@media (hover: hover) and (pointer: fine) {
    .type-of-servis-one-btn:hover,
    .type-of-servis-one-btn:hover .contact-chat-text {
        color: var(--revert-text-color);
        background-color: var(--kolofix-red);
    }
}

.type-of-servis-one-btn.active,
.type-of-servis-one-btn.active .contact-chat-text {
    color: var(--revert-text-color);
    background-color: var(--kolofix-red);
}

.types-of-package-cubes {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 40px;
}

.choose-servis-package-section.display-right-container .types-of-package-cubes {
    display: none;
}

.choose-servis-package-section.display-right-container .types-of-package-cubes.active {
    display: flex;
}

.types-of-package-one-cube {
    background-color: var(--kolofix-color-3);
    padding: 24px 22px;
    padding-bottom: 29px;
    width: 33%;
    max-width: 405px;
    position: relative;
}

.types-of-package-cubes .types-of-package-one-cube {
    min-height: 355px;   
    display: flex;
    flex-direction: column;
    justify-content: center; 
}

.order-form-body .types-of-package-cubes .types-of-package-one-cube,
.price-list-body .types-of-package-cubes .types-of-package-one-cube {
    justify-content: space-between;
}

.price-list-body .types-of-package-cubes .types-of-package-one-cube {
    min-height: 280px;  
    padding-bottom: 24px;
}

.price-list-body .types-of-package-one-cube h3 {
    margin-bottom: 0px;
}

.order-form-body .types-of-package-cubes .types-of-package-one-cube {
    min-height: 310px;
}

.types-of-package-one-cube.added-text h3::after {
    content: url("../images/most-popular.svg");
    position: absolute;
    right: 0;
    top: 0;
}
html[lang=en] .types-of-package-one-cube.added-text h3::after{
    content: url("../images/most-popular-en.svg");

}
.types-of-package-one-cube h3 {
    font-weight: 600;
    font-size: 30px;
    line-height: 35.19px;
    letter-spacing: 0.6px;
    margin: 0;
    margin-bottom: 16px;
}

.order-form-body .types-of-package-one-cube h3 {
    text-transform: uppercase;
}

.cube-upper-text {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 16px;
    margin-bottom: 34px;
    margin-top:20px;
}

.swiper-slide.types-of-package-one-cube.cube-upper-text {
    gap: 6px;
}

.cube-bottom-text {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 4px;
    margin-bottom: 16px;
}

.cube-bottom-text .basic-price {
    font-weight: 600;
    letter-spacing: 0.6px;
    font-size: 20px;
    line-height: 23.46px;
    color: var(--kolofix-red);
}

.cube-bottom-text .basic-price span {
    font-size: 30px;
    line-height: 35.19px;
}

.cube-choose-btn .choosen-package {
    display: none;
}

.cube-choose-btn .btn-color-border {
    min-width: 180px;
}

.types-of-package-one-cube.active {
    background-color: var(--kolofix-red);
    color: var(--revert-text-color);
}

.types-of-package-one-cube.active h3 {
    color: var(--revert-text-color);
}

.types-of-package-one-cube.added-text h3 {
    max-width: 70%;
    margin-inline: auto;
}

.types-of-package-one-cube.active .cube-choose-btn .choosen-package {
    display: inline-block;
}

.types-of-package-one-cube.active .cube-choose-btn .choose-this-package {
    display: none;
}

.types-of-package-one-cube.active .color-small-btn-with-arrow,
.types-of-package-one-cube.active .cube-bottom-text .basic-price,
.types-of-package-one-cube.active .btn-color-border {
    color: var(--revert-text-color);
}

.types-of-package-one-cube.active .btn-color-border {
    background-color: var(--kolofix-black-ish);
    border-color: var(--kolofix-black-ish);
    pointer-events: none;
}

.additional-service-section .types-of-package-one-cube.active .btn-color-border {
    pointer-events: auto;
}

.types-of-package-one-cube.active .color-small-btn-with-arrow::after {
    /* content: url(../images/long-arrow-right-white.svg); */
    background: url("../images/long-arrow-right-white.svg") no-repeat center;
    background-size: contain;
}

.types-of-package-one-cube.active .cube-choose-btn .choosen-package::before {
    content: url("../images/tick-white.svg");
    margin-right: 12px;
}


/* choose-date-of-servis-section */
.choose-date-of-servis-section {
    padding-top: 55px;
}

.choose-date-slider h4 {
    margin-block: 32px 24px;
    font-weight: 600;
    text-transform: uppercase;
    font-size: 20px;
    line-height: 23.46px;
}

/* .choose-date-slider-inner::before {
    content: "";
    margin-right: 30px;
    background: url("../images/slider-arrow-left.svg") center no-repeat;
    background-size: contain;
    width: 83px;
    height: 69px;
}

.choose-date-slider-inner::after {
    content: "";
    margin-left: 30px;
    background: url("../images/slider-arrow-left.svg") center no-repeat;
    background-size: contain;
    width: 83px;
    height: 69px;
    transform: rotateY(180deg);
} */

.choose-date-slider-inner {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 6px;
    max-width: calc(1194px + 123px + 123px);
}

.choose-date-slider-item {
    /* max-width: 207px; */
    padding: 16px;
    /* width: 20%; */
    color: var(--kolofix-black-ish);
    text-decoration: none;
    margin-bottom: 0;
    box-sizing: border-box;
    /* gap: 4px; */
}

@media (hover: hover) and (pointer: fine) {
    .order-form-body .swiper-slide:hover {
        filter: brightness(95%);
    }
}

.choose-date-slider-item.active {
    color: var(--revert-text-color);
    background-color: var(--kolofix-red);
    pointer-events: none;
}

.choose-date-slider-item.unavailable {
    pointer-events: none;
}

.choose-date-slider-item.unavailable > div {
    opacity: 0.3;
}

.choose-date-slider-item > div:nth-of-type(2),
.time-for-bringing {
    font-weight: 600;
    font-size: 30px;
    line-height: 35.19px;
    letter-spacing: 0.6px;
}



/* choose-time-of-servis-section */
.choose-time-of-servis-section .type-of-servis-one-btn:nth-of-type(2) {
    border-top-right-radius: 100px;
    border-bottom-right-radius: 100px;
}


/* swipers settings */
.swiper-external-container-for-arrows {
    position: relative;
    width: 100%;
}

.swiper-external-container-for-arrows .swiper {
    width: calc(100% - 2 * 69px - 2 * 62px);
}

.swiper-button-next, 
.swiper-button-prev {
    width: 83px;
    height: 69px;
    display: block;
    position: absolute;
    left: 0px;
    top: calc(50% - 34.5px);
    margin-top: 0;
}

.swiper-button-next {
    right: 0;
    left: unset;
}

@media (hover: hover) and (pointer: fine) {
    .swiper-button-next:hover::after, 
    .swiper-button-prev:hover::after, 
    .swiper-button-next:active::after, 
    .swiper-button-prev:active::after {
        content: "";
        background: url(../images/arrow-in-circle-black.svg);
        background-size: contain;
        transform: rotateY(0deg);
    }

    .swiper-button-prev:hover::after, 
    .swiper-button-prev:active::after {
        transform: rotateY(180deg);
    }
}

.swiper-button-prev:after, 
.swiper-rtl .swiper-button-next:after {
    content: "";
    background: url(../images/slider-arrow-left.svg) center no-repeat;
    background-size: contain;
    display: block;
    width: 100%;
    height: 100%;
}

.swiper-button-next:after, 
.swiper-rtl .swiper-button-prev:after {
    content: "";
    background: url("../images/slider-arrow-left.svg") center no-repeat;
    background-size: contain;
    display: block;
    width: 100%;
    height: 100%;
    transform: rotateY(180deg);
}

.swiper-order-page .swiper-button-next, 
.swiper-order-page .swiper-button-prev {
    top: calc(50% - 35.5px);
    margin-top: 0;
}

.swiper-wrapper.morning-times-cont,
.swiper-wrapper.afternoon-times-cont {
    display: none;
}

.swiper-wrapper.afternoon-times-cont.active,
.swiper-wrapper.morning-times-cont.active {
    display: flex;
}


/*  */
.additional-service-section .servis-branch-section-title {
    margin-bottom: 24px;
}

.additional-service-section .types-of-package-cubes {
    justify-content: center;
    gap: 40px;
}

.additional-service-section  .types-of-package-one-cube h3 {
    margin-bottom: 13px;
}

.additional-service-section .cube-upper-text {
    margin-bottom: 40px;
}


/*  */
.kolofix-form {

}

.kolofix-form-inner {
    margin: auto;
    margin-top: 23px;
    width: 100%;
    max-width: 510px;
}

.kolofix-form label {
    text-transform: uppercase;
    text-align: left;
    margin: 8px 5px;
    display: block;
    font-weight: 600;
    letter-spacing: 0.6px;
}

.kolofix-form label.label-for-checkbox {
    margin-left: 0;
}

.kolofix-form input {
    /* text-transform: uppercase; */
    height: 51px;
}

.kolofix-form .contact-info-form-input,
.kolofix-form .contact-info-form-textarea {
    border: 2px solid var(--kolofix-black-ish);
    padding: 16px;
    width: 100%;
    box-sizing: border-box;
}

.kolofix-form div:has(.contact-info-form-input),
.kolofix-form div:has(.contact-info-form-textarea) {
    margin-bottom: 23px;
}

.kolofix-form-inner > div:nth-of-type(4) {
    margin-bottom: 8px;
}

.kolofix-form-error-message {
    color: var(--kolofix-red);
    letter-spacing: 0.8px; 
    margin-top: 8px;
    text-align: left;
    display: none;
}

.kolofix-label-input-cont.unfilled .contact-info-form-input,
.kolofix-label-input-cont.unfilled .contact-info-form-textarea {
    border-color: var(--kolofix-red);
}

.kolofix-label-input-cont.unfilled .kolofix-form-error-message {
    display: block;
}


.kolofix-label-input-cont.unfilled label {
    color: var(--kolofix-red);
}

.kolofix-form .contact-info-form-textarea {
    height: 100px;
}

.kolofix-form input[type="checkbox"] {
    width: 30px;
    height: 30px;
    padding: 5px;
    /* -moz-appearance:none;
    -webkit-appearance:none;
    -o-appearance:none; */
    width: 1px;
    height: 1px;
    opacity: 0.1;
}

.kolofix-form input[type="checkbox"] + label {
    display: flex;
    align-items: center;
}

.kolofix-form input[type="checkbox"] + label:before {
    content: "";
    width: 30px;
    height: 30px;
    padding: 5px;
    display: inline-block;
    border: 2px solid var(--kolofix-black-ish);
    margin-right: 5.5px;
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
}

@media (hover: hover) and (pointer: fine) {
    .kolofix-form input[type="checkbox"] + label:hover:before {
        cursor: pointer;
    }
}

.kolofix-form input[type="checkbox"]:checked + label:before {
    content: url("../images/tick-black.svg");
}

.confirm-order-section {
    text-align: center;
    padding-block: 47px 10px;
    padding-inline: 0;
}

.order-form-body .confirm-order-section {
    padding-top: 27px;
}

.confirm-order-section > div {
    padding: 24px;
}

.confirm-order-section .servis-branch-section-title {
    margin-bottom: 24px;
}

.confirm-order-section .confirm-order-btn-cont {
    margin-block: 24px;
}

.confirm-order-section .confirm-order-btn-cont .main-btn {
    text-transform: uppercase;
    width: 300px;
}

.confirm-order-section .agreement-sentence.color-small-btn-with-arrow::after {
    content: none;
}

.confirm-order-section .confirm-order-text-cont {
    margin-bottom: 8px;
    font-size: 20px;
    line-height: 23.46px;
}

.confirm-order-text-cont-dates .confirm-order-first-line {
    margin-right: 16px;
}

/* .confirm-order-text-cont-dates .confirm-order-first-line::after {
    content: url(../images/long-arrow-right.svg);
    margin-left: 16px;
} */

.confirm-order-text-cont-dates .confirm-order-first-line::after {
    content: "";
    display: inline-block;
    width: 50px;
    height: 12px;
    margin-left: 16px;
    background: url(../images/long-arrow-right.svg) no-repeat center;
    background-size: contain;
}

.checkbox-label-cont {
    display: flex;
}

.checkbox-label-cont label {
    margin-left: 8px;
    text-transform: none;
    font-weight: 400;
    letter-spacing: normal;
}

.additional-service-section .types-of-package-one-cube {
    width: 45%;
}

.choose-date-slider-item .day-of-the-week-short {
    display: none;
}

.choose-date-slider-item .day-of-the-week-short,
.choose-date-slider-item .day-of-the-week-long {
    text-transform: capitalize !important;
}

.step-2,
.step-3,
.step-4,
.step-5,
.step-6 {
    display: none;
}

.step-2.section-displayed,
.step-3.section-displayed,
.step-4.section-displayed,
.step-5.section-displayed,
.step-6.section-displayed {
    display: block;
}

#time-of-servis-afternoon.inactive,
#time-of-servis-morning.inactive {
    opacity: .2;
    pointer-events: none;
}






@media (max-width: 991px) {
    .servis-intro-title-container:not(.for-companies-intro-section .servis-intro-title-container) {
        padding-bottom: 30px;
    }

    .servis-branch-section {
        padding-bottom: 40px;
    }

    .order-form-body .servis-branch-section {
        padding-bottom: 0;
    }

    .order-form-body .choose-servis-package-section {
        padding-top: 40px;
    }

    .order-form-body .choose-servis-package-section.contact-info-section {
        padding-inline: 0;
    }

    .order-form-body .kolofix-form-inner {
        padding-inline: 20px;
        box-sizing: border-box;
    }

    .types-of-package-cubes {
        flex-wrap: wrap;
    }

    .choose-servis-package-section {
        padding-bottom: 30px;
    }

    .choose-date-of-servis-section {
        padding-top: 40px;
    }

    .choose-date-slider-inner::before,
    .choose-date-slider-inner::after {
        width: 48px;
        height: 40px;
        display: block;
    }

    .choose-date-slider-inner {
        flex-wrap: wrap;
    }

    .types-of-package-one-cube.choose-date-slider-item {
        width: 58px;
    }

    .choose-date-slider-item {
        font-size: 14px;
        line-height: 16.42px;
    }

    .choose-date-slider-item > div:nth-of-type(2),
    .time-for-bringing {
        font-size: 20px;
        line-height: 23.46px;
    }
    
    .additional-service-section .types-of-package-one-cube {
        width: calc(100% - 40px);
    }

    .types-of-package-one-cube.responsive-cube {
        width: 100%;
        margin: auto;
    }

    .types-of-package-one-cube h3 {
        font-size: 20px;
        line-height: 23.46px;
    }
    
    .cube-bottom-text .basic-price {
        font-size: 16px;
        line-height: 18.77px;
    }

    .cube-bottom-text .basic-price span {
        font-size: 20px;
        line-height: 23.46px;
    }

    .swiper-button-next:after, 
    .swiper-rtl .swiper-button-prev:after,
    .swiper-button-prev:after, 
    .swiper-rtl .swiper-button-next:after {
        width: 49px;
        height: 40px;
    }

    .swiper-button-next:after,
    .swiper-rtl .swiper-button-next:after {
        margin-left: auto;
    }

    .swiper-button-next, 
    .swiper-button-prev {
        top: calc(50% - 20px);
    }

    .swiper-external-container-for-arrows .swiper {
        width: calc(100% - 2 * 49px - 2 * 20px);
    }


}




@media (max-width: 576px) {
    .type-of-servis-btns.responsive {
        flex-direction: column;
    }

    .responsive .type-of-servis-one-btn {
        width: 180px;
        border-left: 1px solid var(--kolofix-red);
    }

    .responsive .type-of-servis-one-btn:nth-of-type(1) {
        border-bottom-left-radius: 0;
        border-top-left-radius: 20px;
        border-top-right-radius: 20px;
        border-bottom: none;
    }

    .types-of-package-one-cube.added-text {
        padding-top: calc(24px + 72px);
    }

    .responsive .type-of-servis-one-btn:nth-of-type(3) {
        border-top-right-radius: 0;
        border-bottom-left-radius: 20px;
        border-bottom-right-radius: 20px;
        border-top: none;
    }

    .types-of-package-one-cube:nth-child(2) h3::after {
        right: 50%;
        transform: translateX(50%);
    }


    .order-form-body .btn-color-border {
        padding: 19px 24px;
    }

    .confirm-order-section .confirm-order-text-cont {
        font-size: 16px;
        line-height: 18.77px;
    }

    .confirm-order-text-cont-dates .confirm-order-first-line {
        margin-bottom: 40px;
        display: block;
    }

    .confirm-order-text-cont-dates .confirm-order-first-line::after {
        content: "";
        display: block;
        transform: rotate(90deg);
        width: 100%;
        height: 7px;
        position: relative;
        top: 19px;
    }

    .choose-date-slider-item .day-of-the-week-long {
        display: none;
    }

    .choose-date-slider-item .day-of-the-week-short {
        display: inline;
    }

    .types-of-package-cubes {
        gap: 17px;
    }

    .types-of-package-one-cube {
        padding-bottom: 18px;
    }

    .types-of-package-one-cube.added-text .cube-upper-text {
        gap: 31px;
    }

    .choose-date-slider h4 {
        margin-block: 19px 24px;
    }

    .choose-date-slider-item {
        padding: 6px;
    }

    .additional-service-section .types-of-package-cubes {
        gap: 20px;
    }

    .confirm-order-section {
        padding-block: 32px 10px;
    }

    .confirm-order-section .confirm-order-text-cont {
        margin-bottom: 15px;
    }


}



@media (max-width: 450px) {
    .swiper-slide .date-display-block {
        display: block;
    }

    .time-for-bringing {
        font-size: 15px;
        line-height: 16.42px;
    }

}

button[type=submit][disabled]{
    filter:grayscale(1);
    opacity:0.7;
    pointer-events: none;
}

.no-checkout-date .confirm-order-first-line:after,
.no-checkout-date .confirm-order-first-line + span
{
    display: none;
}