.my-confirm {
    display: none;
    position: fixed;
    width: 100%;
    height: 100dvh;
    top: 0;
    left: 0;
    z-index: 99;

    .my-confirm__window {
        width: calc(100% - 40px);
        max-width: 600px;
        border-radius: 12px;
        background-color: #ffffff;
        box-shadow: 2px 4px 18.3px 0 rgba(0, 0, 0, 0.04);
        position: absolute;
        left: 0;
        right: 0;
        margin: 0 auto;
        top: 50%;
        padding: 16px 24px 32px;
        transform: translateY(-50%) scale(0);
        transition: all .3s ease;

        .my-confirm__close {
            width: 24px;
            height: 24px;
            fill: var(--Gray-5, #BDBDC2);
            cursor: pointer;
            margin-left: auto;
        }

        .my-confirm__title {
            color: #000;
            text-align: center;
            font-size: 26px;
            font-style: normal;
            font-weight: 600;
            line-height: 130%;
            letter-spacing: 0.52px;
            max-width: 410px;
            margin: 0 auto;
        }

        .my-confirm__message {
            color: var(--Gray-7, #7A7A85);
            text-align: center;
            font-size: 16px;
            font-style: normal;
            font-weight: 400;
            line-height: 140%;
            letter-spacing: 0.16px;
            max-width: 410px;
            margin: 16px auto 0;
        }

        .my-confirm__buttons {
            max-width: 410px;
            margin: 32px auto 0;
            display: flex;
            flex-wrap: wrap;
            column-gap: clamp(16px, 3vw, 32px);
            row-gap: 16px;

            button {
                flex: auto;
            }
        }

    }

    .my-confirm__overlay {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        background-color: rgba(0, 0, 0, 0.40);
    }

    &.visible {
        .my-confirm__window {
            transform: translateY(-50%) scale(1);
        }
    }
}