.ui-dialog__overlay {
    --ui-dialog-container-max-width: 464px;
    --ui-dialog-container-max-width-large: 664px;
    --ui-dialog-container-max-width-wide-desktop: 1100px;
    --ui-dialog-container-max-height-wide-desktop: 676px;
    --ui-dialog-header-height: 56px;
    --ui-dialog-swiper-container-height: 64px;
    --ui-dialog-swiper-width: 56px;
    --ui-dialog-swiper-height: 6px;

    position: fixed;
    inset: 0;
    z-index: var(--theme-z-index-overlay);
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    background-color: var(--theme-surface-overlay);
}

.ui-dialog__loader {
    position: absolute;
}

.ui-dialog__container {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}

.ui-dialog__overlay--sheet .ui-dialog__container {
    align-items: end;
}

@media (min-width: 700px) {
    .ui-dialog__overlay--sheet .ui-dialog__container {
        bottom: var(--space-x3);
    }

    .ui-dialog__overlay--halfsheet .ui-dialog__container {
        align-items: flex-start;
        border-radius: initial;
    }

    .ui-dialog__overlay--blade .ui-dialog__container {
        justify-content: flex-end;
        border-radius: initial;
    }
}

.ui-dialog__container-inner {
    position: relative;
    display: grid;
    grid-template-rows: auto 1fr auto;
    grid-template-columns: 100%;
    gap: var(--space-x2);
    width: 100%;
    max-width: 90%;
    max-height: calc(100% - var(--ui-dialog-swiper-container-height));
    padding: var(--space-x4);
    overflow: hidden;
    border-radius: var(--theme-border-radius-dialog);
    box-shadow: var(--theme-elevation-20);
}

@media (min-width: 700px) {
    .ui-dialog__container-inner {
        max-width: var(--ui-dialog-container-max-width);
    }
}

/* stylelint-disable-next-line no-descending-specificity */
.ui-dialog__container-inner,
.ui-dialog__container-inner .ui-menu {
    background-color: var(--theme-body-color);
}

.ui-dialog__overlay--large .ui-dialog__container-inner {
    max-width: 100%;
    height: 100%;
    max-height: 100%;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}

@media (min-width: 700px) {
    .ui-dialog__overlay--large .ui-dialog__container-inner {
        max-width: var(--ui-dialog-container-max-width-large);
        height: auto;
        max-height: 80vh;
        border-radius: var(--theme-border-radius-dialog);
    }
}

.ui-dialog__overlay--sheet .ui-dialog__container-inner {
    max-width: 100%;
    height: auto;
    max-height: calc(100% - var(--ui-dialog-swiper-container-height));
    padding-bottom: var(--space-x3);
    overflow: visible;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
}

@media (min-width: 700px) {
    .ui-dialog__overlay--sheet .ui-dialog__container-inner {
        max-width: var(--ui-dialog-container-max-width-large);
        border-radius: var(--theme-border-radius-dialog);
    }
}

@media (min-width: 992px) {
    .ui-dialog__overlay--wide-desktop .ui-dialog__container-inner {
        max-width: var(--ui-dialog-container-max-width-wide-desktop);
        max-height: var(--ui-dialog-container-max-height-wide-desktop);
        border-radius: var(--theme-border-radius-dialog)
    }
}

.ui-dialog__overlay--fullscreen .ui-dialog__container-inner {
    display: block;
    padding: 0;
}

.ui-dialog__overlay--fullscreen .ui-dialog__container-inner,
.ui-dialog__overlay--halfsheet .ui-dialog__container-inner,
.ui-dialog__overlay--blade .ui-dialog__container-inner {
    max-width: 100%;
    height: 100%;
    max-height: 100%;
    border: none;
    border-radius: initial;
    box-shadow: none;
}

.ui-dialog__overlay--halfsheet .ui-dialog__container-inner,
.ui-dialog__overlay--blade .ui-dialog__container-inner {
    grid-template-rows: 1fr;
}

.ui-dialog__overlay--blade .ui-dialog__container-inner {
    padding: var(--space-x2);
}

@media (min-width: 700px) {
    .ui-dialog__overlay--halfsheet .ui-dialog__container-inner {
        height: auto;
    }

    .ui-dialog__overlay--blade .ui-dialog__container-inner {
        width: 600px;
    }
}

.ui-dialog__overlay--scrollable .ui-dialog__container-inner {
    padding-right: var(--space-x2);
}

.ui-dialog__overlay--flush .ui-dialog__container-inner {
    padding: 0;
}

.ui-dialog__container--full-height,
.ui-dialog__overlay--sheet .ui-dialog__container--full-height {
    height: 100vh;
}

.ui-dialog__container-inner:not(.ui-dialog__container--header-visible, .ui-dialog__container--footer-visible) {
    grid-template-rows: 100%;
}

.ui-dialog__content-wrapper {
    transition: all 0.3s;
}

.ui-dialog__swiper {
    position: absolute;
    top: calc((var(--ui-dialog-swiper-height) + var(--space)) * -1);
    left: 0;
    display: block;
    width: 100%;
    height: calc(var(--ui-dialog-swiper-height) + var(--space));
}

.ui-dialog__swiper::before {
    position: relative;
    left: calc(50% - var(--ui-dialog-swiper-width) / 2);
    display: block;
    width: var(--ui-dialog-swiper-width);
    height: var(--ui-dialog-swiper-height);
    content: '';
    background-color: var(--theme-fill-inverse);
    border-radius: 6px;
    opacity: 0.4;
}

.ui-dialog__header {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.ui-dialog__footer {
    display: flex;
    gap: var(--space-x4);
}

.ui-dialog__overlay--scrollable .ui-dialog__header,
.ui-dialog__overlay--scrollable .ui-dialog__footer {
    margin-right: var(--space-x2);
}

.ui-dialog__overlay--flush .ui-dialog__header {
    margin: var(--space-x4) var(--space-x4) 0 var(--space-x4);
}

.ui-dialog__overlay--flush .ui-dialog__footer {
    margin: 0 var(--space-x4) var(--space-x4) var(--space-x4);
}

.ui-dialog__container--header-visible .ui-dialog__header {
    grid-row: span 1;
}

.ui-dialog__header-back .ui-button__icon {
    --material-icon-width: calc(var(--theme-icon-base-size) * 0.7);
    --material-icon-height: calc(var(--theme-icon-base-size) * 0.7);
}

.ui-dialog__header-buttons {
    display: inline-flex;
    gap: var(--space-x2);
}

.ui-dialog__title {
    flex: 1;
    text-align: center;
}

.ui-dialog__header--close-visible .ui-dialog__title {
    position: absolute;
    width: calc(100% - var(--space-x6) * 2);
    margin: 0 var(--space-x6);
}

.ui-dialog__content-wrapper--scrollbar {
    margin-right: calc(var(--browser-scrollbar-width) * -1);
    overflow: hidden;
}

.ui-dialog__content-wrapper,
.ui-dialog__content--inner {
    display: flex;
    flex-direction: column;
    grid-row: span 1;
    gap: var(--space-x2);
    max-height: 100vh;
}

.ui-dialog__content {
    height: 100%;
}

.ui-dialog__overlay--multi-pane .ui-dialog__content-wrapper {
    position: relative;
}

.ui-dialog__container--header-visible .ui-dialog__content-wrapper {
    grid-row: span 2;
}

.ui-dialog__overlay--blade .ui-dialog__container--header-visible .ui-dialog__content-wrapper {
    height: calc(100vh - var(--ui-dialog-header-height));
}

.ui-dialog__overlay--scrollable .ui-dialog__content,
.ui-dialog__overlay--multi-pane .ui-dialog__content {
    padding-right: var(--space-x2);
}

.ui-dialog__multi-pane {
    background-color: var(--theme-body-color);
}

.ui-dialog__multi-pane[hidden] {
    position: absolute;
    top: 0;
}

.ui-dialog__icon {
    padding: var(--space);
    margin-right: auto;
    background-color: var(--theme-fill-40);
    border-radius: var(--theme-border-radius-dialog);
}

.ui-dialog__section {
    display: flex;
    flex-direction: column;
    gap: var(--space);
}

.ui-dialog__container--footer-visible .ui-dialog__footer {
    grid-row: span 2;
}

.ui-dialog__footer > span {
    width: 100%;
}

.ui-dialog__actionbar {
    position: relative;
    width: calc(100% + var(--space-x6) + var(--browser-scrollbar-width));
    margin: 0 calc((var(--space-x2) + var(--browser-scrollbar-width)) * -1) calc(var(--space-x4) * -1) calc(var(--space-x4) * -1);
}

.ui-dialog__actionbar > div {
    width: 100%;
}