.mk-modal-container{
    height: auto;
    overflow-y: auto;
    -ms-overflow-style: none;  /* Internet Explorer 10+ */
    scrollbar-width: none;
    border-radius: 28px;
    background:transparent;
    padding-top: 25px;
    background: transparent;
}
.mk-modal-container::-webkit-scrollbar { 
    display: none;  /* Safari and Chrome */
}

.mk-modal-container .no-border-bottom {
    border-bottom: none;
}

.mk-modal-container .mk-default-modal-close-btn{
    top: -10px;
    right: 0;
}
.slds-modal__container .slds-modal__content {
    border-radius: 28px; 
}

.slds-modal__container>.slds-modal__content:last-child {
    border-radius: 0;
}

.slds-modal__header.no-border-radius {
    border-radius: 0;
}

.mk-modal-container .slds-modal__header {
    top: -12px;
    right: 0;
    position: relative;
    background: transparent;
}

.mk-modal-container .slds-modal__header button{
    background: var(--white);
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
    padding: 5px;
}

/* overriding lightning modal css starts here*/
lightning-modal-base .slds-modal__close button,
lightning-modal-base .slds-modal__close button:hover, 
lightning-dialog .slds-modal__close button,
lightning-dialog .slds-modal__close button:hover{
    background: var(--white);
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
    top: -5px;
    right: 19px;
}

lightning-modal-base .slds-modal__content,
lightning-dialog .slds-modal__content{
    border-radius: 0 !important;
    text-align: center;
}

lightning-modal-base .slds-modal__header,
lightning-dialog .slds-modal__header{
    border-radius: 24px 24px 0 0;
    border-bottom: none;
}

lightning-modal-base .slds-modal__footer,
lightning-dialog .slds-modal__footer{
    border-radius: 0 0 24px 24px;
    border-top: none;
    background: var(--white, #FFF);
}

lightning-modal-base .slds-modal__footer button,
lightning-dialog .slds-modal__footer button {
    background: var(--white, #FFF);
    border: none;
    color: var(--mk-primary);
}
/* overriding lightning modal css ends here*/

/*style to remove scroll on body when modal or panel is open on*/
body:has(.slds-fade-in-open) {
    overflow: hidden !important;
}
body:has(.panel-element.slds-is-open) {
    overflow: hidden !important;
    height: 100vh;
    width: 100vw;
}

body:has(.mirror_Me_popup) {
    overflow: hidden !important;
}

/*style to remove scroll on body when modal or panel is open on mobile*/

@media (min-width: 48em) {
    .slds-modal_small .slds-modal__container {
        width: 450px !important;
    }

    .slds-modal_small .slds-modal__content {
        padding: 0 24px;
    }
}