.hemodialysis-card .card-price-list {
    padding-top: .6rem
}

    .hemodialysis-card .card-price-list p {
        font-size: .8125rem;
        font-style: normal;
        font-weight: 600;
        padding: .2rem 0px;
        color: #222
    }

        .hemodialysis-card .card-price-list p span {
            font-size: .75rem;
            font-style: normal;
            color: #239ea0
        }

            .hemodialysis-card .card-price-list p span b {
                padding: 0px .1rem;
                font-size: .85rem
            }

.hemodialysis-card .card-buttons {
    display: flex;
    justify-content: flex-end
}

    .hemodialysis-card .card-buttons > .row {
        width: 21rem
    }

@media screen and (max-width: 768px) {
    .hemodialysis-card .card-buttons > .row {
        width: 100% !important;
        padding-left: 0px !important;
        padding-right: 0px !important;
        margin: 0px !important;
        padding-top: 1rem
    }
}

.btn-primary-2 {
    background-color: #e9f5f6;
    color: #239ea0
}

    .btn-primary-2:hover {
        color: #239ea0;
        background-color: #dceff0
    }

    .btn-primary-2:focus {
        box-shadow: 0 0 0 .2rem rgba(35,162,164,.5) !important
    }

@media screen and (min-width: 768px) {
    .hemodialysis-Modal {
        max-width: 43.3125rem
    }
}

.hemodialysis-packages-content {
    background-color: #eceff4;
    padding: 1rem;
    border-radius: 1rem
}

.inquiries-btn {
    background-color: #fff;
    border-radius: 10rem;
    box-shadow: 0 .1rem .1rem 0 rgba(0,0,0,.2) !important;
    padding: .3rem .8rem .5rem .8rem;
    font-size: .85rem;
    display: flex;
    align-items: center;
    gap: .6rem
}

.packages-list {
    display: flex;
    flex-direction: column;
    gap: .8rem;
    padding-top: .8rem
}

.package-item {
    background-color: #fff;
    border-radius: .5rem;
    box-shadow: 0px 2px 4px 0px rgba(0,0,0,.1);
    padding: 1.25rem 1.25rem 1.5rem 1.25rem
}

    .package-item .item-head {
        display: flex;
        padding-bottom: .75rem;
        justify-content: space-between;
        align-items: center;
        border-bottom: 1px solid #ddd
    }

        .package-item .item-head h2 {
            color: #239ea0;
            font-size: 1rem;
            font-style: normal;
            font-weight: 700;
            line-height: normal
        }

@media screen and (max-width: 576px) {
    .package-item .item-head {
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
        border: none;
        padding: 0rem
    }

        .package-item .item-head h2 {
            line-height: 1.6rem;
            padding-bottom: .6rem
        }
}

.package-item .item-body {
    padding-top: .6rem
}

@media screen and (max-width: 576px) {
    .package-item .item-body {
        display: none
    }
}

.package-item .item-body p {
    color: #666;
    font-size: .8125rem;
    font-style: normal;
    font-weight: 600;
    line-height: normal
}

.price-badge-box {
    display: flex;
    flex-direction: column;
    gap: .2rem;
    align-items: center
}

    .price-badge-box p {
        color: #444;
        font-size: .85rem
    }

        .price-badge-box p i {
            color: #ababab
        }

.price-badge {
    display: flex;
    padding: .1rem .75rem .2rem .75rem;
    justify-content: center;
    align-items: center;
    gap: .25rem;
    border-radius: 6.25rem;
    border: 1px solid #ddd;
    background: #fff;
    color: #191919;
    font-size: .75rem;
    font-style: normal;
    font-weight: 600;
    line-height: normal
}

    .price-badge .home-cp-price {
        color: #ea7b5e
    }

        .price-badge span b {
            font-size: 1.125rem;
            font-style: normal;
            font-weight: 700;
            line-height: normal
        }

.btn-icon {
    display: flex;
    align-items: center;
    gap: .6rem;
    justify-content: center
}

    .btn-icon .arrow {
        background: url(../images/arrow-small-left.svg) no-repeat center center;
        width: 1.1rem;
        height: 1.2rem
    }

    .btn-icon .right-arrow {
        background: url(../images/arrow-small-right.svg) no-repeat center center;
        width: 1.1rem;
        height: 1.2rem
    }

    .btn-icon .cart-ico {
        background: url(../images/small-cart.svg) no-repeat center center;
        width: 1.1rem;
        height: 1.2rem
    }

.btn-white {
    background-color: #fff;
    border: 1px solid #ddd
}

    .btn-white:hover {
        background-color: #fafafa
    }

.wizard-step {
    display: none
}

    .wizard-step.active {
        display: block
    }

.progress-wizard-container {
    padding: 0rem .4rem
}

    .progress-wizard-container .step-item .item-head {
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 1rem
    }

        .progress-wizard-container .step-item .item-head h2 {
            color: #191919;
            font-size: 1.125rem;
            font-style: normal;
            font-weight: 700;
            line-height: normal
        }

@media screen and (max-width: 768px) {
    .progress-wizard-container .step-item .item-head {
        flex-direction: column
    }

        .progress-wizard-container .step-item .item-head h2 {
            padding-bottom: 1rem
        }
}

.progress-wizard-container .step-item .item-head .wizard-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: .4rem
}

    .progress-wizard-container .step-item .item-head .wizard-bar span {
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        font-size: .75rem;
        font-style: normal;
        font-weight: 500
    }

        .progress-wizard-container .step-item .item-head .wizard-bar span i {
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            width: 1.75rem;
            height: 1.75rem;
            border-radius: 6.25rem;
            border: 2px solid #eff5f5;
            background: #eff5f5;
            font-size: .8125rem;
            font-weight: 700;
            margin-bottom: .4rem;
            color: #000
        }

    .progress-wizard-container .step-item .item-head .wizard-bar .active {
        color: #239ea0
    }

        .progress-wizard-container .step-item .item-head .wizard-bar .active i {
            background-color: #fff;
            color: #239ea0;
            border-color: #239ea0
        }

    .progress-wizard-container .step-item .item-head .wizard-bar .done {
        color: #239ea0
    }

        .progress-wizard-container .step-item .item-head .wizard-bar .done i {
            background-color: #239ea0;
            position: relative;
            border-color: #239ea0;
            color: #239ea0
        }

            .progress-wizard-container .step-item .item-head .wizard-bar .done i::after {
                content: "";
                position: absolute;
                width: 12px;
                height: 10px;
                background: url(../images/check.svg) no-repeat
            }

.progress-wizard-container .step-item .item-head .line {
    height: 1px;
    width: 2.75rem;
    background-color: #ddd;
    margin-top: -1.2rem
}

.progress-wizard-container .step-item .item-body {
    border-radius: .75rem;
    background: #eceff4;
    padding: 1.5rem 1.25rem;
    min-height: 31rem
}

    .progress-wizard-container .step-item .item-body .b-title span {
        color: #333;
        font-size: .875rem;
        padding: .4rem 0rem;
        display: block
    }

    .progress-wizard-container .step-item .item-body .b-title h3 {
        padding: .6rem 1.6rem .7rem 1.6rem;
        border-radius: 4.9375rem;
        border-top-right-radius: 0px;
        background: #239ea0;
        text-align: right;
        color: #fff;
        font-size: 1rem;
        font-weight: 600;
        font-style: normal
    }

.progress-wizard-container .step-item .item-footer {
    display: flex;
    align-items: center;
    padding: 1.5rem 0px .6rem 0rem;
    justify-content: space-between
}

    .progress-wizard-container .step-item .item-footer > div {
        display: flex;
        gap: .6rem
    }

.pb-1rem {
    padding-bottom: 1.2rem
}

.instructions-content {
    display: flex;
    flex-direction: column;
    gap: .6rem
}

.instructions-figure {
    margin: 0px;
    display: flex;
    background-color: #fff;
    border-radius: .5rem;
    box-shadow: 0px 2px 4px 0px rgba(0,0,0,.1);
    padding: 1.25rem 1.25rem 1.5rem 1.25rem;
    gap: 1.4rem
}

@media screen and (max-width: 414px) {
    .instructions-figure {
        gap: .6rem
    }
}

.instructions-figure > span {
    width: 1.75rem;
    height: 1.75rem;
    border-radius: 100%;
    display: flex;
    flex-shrink: 0;
    background: #eceff4;
    align-items: center;
    justify-content: center;
    color: #000;
    text-align: center;
    font-size: .8125rem;
    font-style: normal;
    font-weight: 700
}

.instructions-figure figcaption h3 {
    color: #239ea0;
    font-size: 1rem;
    font-style: normal;
    font-weight: 700;
    line-height: normal
}

.instructions-figure figcaption p {
    color: #666;
    font-size: .875rem;
    font-style: normal;
    font-weight: 600;
    line-height: 1.625rem;
    padding-top: .4rem
}

@media screen and (max-width: 414px) {
    .instructions-figure figcaption p {
        display: none
    }
}

.attachments-box {
    background-color: #fff;
    border-radius: .5rem;
    box-shadow: 0px 2px 4px 0px rgba(0,0,0,.1);
    padding: 1.25rem 1.25rem 1.5rem 1.25rem
}

.file-list {
    margin-top: 1rem;
    display: flex;
    flex-direction: column;
    gap: .5rem
}

    .file-list .file-item {
        border: 1px solid #ddd;
        border-radius: .4rem;
        padding: .3rem .6rem;
        display: flex;
        justify-content: space-between
    }

.remove-btn {
    cursor: pointer;
    color: red;
    font-size: .86rem
}

.attachments-label {
    background: #f8f9fb;
    border-radius: .6rem;
    display: flex;
    cursor: pointer;
    flex-direction: column;
    gap: .4rem;
    padding: 1.4rem 1rem;
    align-items: center;
    justify-content: center;
    border: 2px dashed #ddd;
    transition: all ease .2s
}

    .attachments-label input {
        display: none
    }

    .attachments-label i {
        font-size: 1.8rem;
        color: #239ea0
    }

    .attachments-label p {
        font-size: 1rem;
        color: #222
    }

    .attachments-label span {
        font-size: .8rem
    }

    .attachments-label:hover {
        background-color: #e1f7f1
    }

.modal-doctor-card {
    background-color: #fff;
    border-radius: .5rem;
    box-shadow: 0px 2px 4px 0px rgba(0,0,0,.1);
    padding: 1.25rem 1.25rem 1.5rem 1.25rem;
    display: flex;
    align-items: flex-start;
    justify-content: space-between
}

@media screen and (max-width: 768px) {
    .modal-doctor-card {
        flex-direction: column;
        gap: 1rem
    }
}

.modal-doctor-card .card-info {
    display: flex;
    align-items: flex-start;
    gap: 1rem
}

    .modal-doctor-card .card-info img {
        width: 3.75rem;
        height: 3.75rem;
        flex-shrink: 0;
        border-radius: .5rem;
        object-fit: contain
    }

    .modal-doctor-card .card-info .card-info_content h2 {
        color: #239ea0;
        font-size: 1rem;
        font-style: normal;
        font-weight: 700;
        line-height: normal;
        margin-top: -0.6rem
    }

    .modal-doctor-card .card-info .card-info_content p {
        font-size: .8125rem
    }

        .modal-doctor-card .card-info .card-info_content p a {
            color: #191919
        }

    .modal-doctor-card .card-info .card-info_content span {
        font-size: .75rem;
        color: #666
    }

.modal-date-bar {
    display: flex;
    gap: .6rem;
    padding: 1.5rem 0rem .8rem 0rem
}

@media screen and (max-width: 767px) {
    .modal-date-bar {
        flex-direction: column-reverse
    }
}

.modal-date-bar .date-btns {
    display: flex;
    gap: .6rem
}

@media screen and (max-width: 576px) {
    .modal-date-bar .date-btns {
        padding-top: .5rem
    }
    .modal-date-bar .calendar__dropmenu .qs-datepicker-container {
        width: 100% !important;
    }
}
@media screen and (max-width: 414px) {

    .qs-day {
        font-size: 0.65rem;
    }
    .progress-wizard-container .step-item .item-head .wizard-bar span {
        font-size: .6rem;
    }
    .hemodialysis-Modal .item-footer .btn {
        padding: .21rem .32rem .23rem .32rem;
    }
}

.modal-date-bar .date-btn-item {
    cursor: pointer;
    min-width: 5rem;
    padding: .4rem .625rem;
    background-color: #fff;
    border-radius: .3rem;
    box-shadow: 0px 2px 4px 0px rgba(0,0,0,.1);
    text-align: center;
    font-size: .812rem;
    font-style: normal;
    font-weight: 700;
    border: 1px solid #fff;
    transition: all .2s ease
}

    .modal-date-bar .date-btn-item:hover {
        color: #239ea0
    }

.modal-date-bar .date-btns .active {
    background-color: #e6f8eb;
    color: #239ea0;
    border-color: #239ea0
}

.modal-date-bar .calendar__dropmenu > div {
    position: relative;
    border-radius: .3rem;
    background-color: #fff;
    box-shadow: 0px 0px 8px rgba(0,0,0,.11);
    width: 100%;
    text-align: center
}

    .modal-date-bar .calendar__dropmenu > div input {
        text-align: center;
        border: none;
        cursor: pointer;
        font-size: .9rem;
        font-weight: 700;
        height: 2.2rem;
        background-color: rgba(0,0,0,0) !important;
        z-index: 2;
        position: relative
    }

    .modal-date-bar .calendar__dropmenu > div i {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        margin: 4px 30px;
        z-index: 1
    }

    .modal-date-bar .calendar__dropmenu > div .fi-rr-calendar-minus {
        right: 0px;
        font-size: 1rem
    }

    .modal-date-bar .calendar__dropmenu > div .fi-rr-caret-down {
        left: 0px;
        font-size: 1.2rem
    }

.modal-date-bar .calendar__dropmenu .qs-datepicker-container {
    width: 24rem;
    right: 0
}

.modal-slots-box {
    background-color: #fff;
    border-radius: .5rem;
    box-shadow: 0px 2px 4px 0px rgba(0,0,0,.1);
    padding: 1.25rem 1.25rem 1.5rem 1.25rem;
    min-height:170px;
}

    .modal-slots-box > p {
        font-size: .9rem;
        padding: 0rem 0rem .8rem 0rem
    }

    .modal-slots-box .modal-slots-list {
        display: flex;
        gap: .5rem;
        flex-wrap: wrap;
        
    }

        .modal-slots-box .modal-slots-list .slots-item {
            background-color: #fff;
            color: #239ea0;
            border: 1px solid #239ea0;
            padding: .4rem .625rem;
            font-size: .812rem;
            font-style: normal;
            font-weight: 700;
            border-radius: .3rem;
            cursor: pointer
        }

            .modal-slots-box .modal-slots-list .slots-item:hover {
                background-color: #e6f8eb;
                color: #239ea0;
                border-color: #239ea0
            }

        .modal-slots-box .modal-slots-list .active {
            background-color: #239ea0;
            color: #fff;
            border-color: #239ea0
        }

            .modal-slots-box .modal-slots-list .active:hover {
                background-color: #239ea0;
                color: #fff;
                border-color: #239ea0
            }

.modal-cart-box {
    display: flex;
    align-items: center;
    justify-content: center
}

    .modal-cart-box .center-box {
        width: 17rem;
        max-width: 100%
    }

        .modal-cart-box .center-box article {
            display: flex;
            flex-direction: column;
            gap: .4rem;
            align-items: center;
            text-align: center;
            margin-bottom: 1.6rem
        }

            .modal-cart-box .center-box article img {
                width: 3rem;
                height: 3rem;
                display: inline-block;
                margin-bottom: 1.2rem
            }

            .modal-cart-box .center-box article h4 {
                font-size: 1rem;
                font-weight: 700
            }

            .modal-cart-box .center-box article p {
                font-size: .9rem
            }
/*# sourceMappingURL=hemodialysis_style.css.map */
