/* Unsetting some SweetAlert2 styling */
.swal2-container.component-sweetalert {
    padding-top: 0;
    padding-bottom: 0;
}
.swal2-container.component-sweetalert .swal2-popup.chgroup-swal-popup {
    width: 100%;
    border-radius: 0;
    padding-bottom: 0;
}
.swal2-container.component-sweetalert .swal2-popup.chgroup-swal-popup .swal2-html-container.chgroup-swal-content {
    margin: 0;
}



/* Component's CSS */
.component-sweetalert {
    background-color: rgba(0,0,0,.4); /* Corresponds to previous swal's implementation */
}
.component-sweetalert .chgroup-swal-popup.swal__default {
    max-width: 54rem; /* To have similar available width to sweetalert 1's layout. (when removing the horizontal spacings) */
}
.component-sweetalert .chgroup-swal-popup.swal__wide {
    max-width: 70rem;
}
.component-sweetalert .chgroup-swal-popup.swal__small {
    max-width: 48rem;
}

.component-sweetalert .chgroup-swal-close {
    position: absolute;
}
.component-sweetalert .cta-actionable[action="swal-cta-close"] .cta-text {
    width: 3rem;
    height: 3rem;
}
.component-sweetalert .cta-actionable[action="swal-cta-close"] .cta-text img {
    width: 100%;
    height: 100%;
}


/*** RESPONSIVE LAYOUT SPECIFICS ***/
.component-sweetalert .chgroup-swal-close {
    top: 1.5rem;
    right: 1.5rem;
}
.component-sweetalert .chgroup-swal-content > * {
    margin: calc(6rem / 2) auto;
    max-width: calc(100% - calc(3rem * 2));
}
.component-sweetalert .chgroup-swal-content > *:first-child {
    margin-top: 6rem;
}
.component-sweetalert .chgroup-swal-content > *:last-child {
    margin-bottom: 6rem;
}
@media (min-width:  576px) {
    .component-sweetalert .chgroup-swal-close {
        top: 3rem;
        right: 3rem;
    }
    .component-sweetalert .chgroup-swal-content > * {
        margin: calc(9rem / 2) auto;
        max-width: calc(100% - calc(6rem * 2));
    }
    .component-sweetalert .chgroup-swal-content > *:first-child {
        margin-top: 9rem;
    }
    .component-sweetalert .chgroup-swal-content > *:last-child {
        margin-bottom: 9rem;
    }
}