/* stylelint-disable no-descending-specificity */
.adf-upload-dialog {
    background: var(--mat-sys-surface-container-high);
    position: fixed;
    bottom: 20px;
    width: 40%;
    box-shadow: 1px 5px 15px #888;
    z-index: 999;

    &--padding {
        padding: 1em;
    }

    &--hide.adf-upload-dialog__confirmation,
    &--hide.adf-file-uploading-list {
        display: none;
    }

    &--minimized {
        width: 20%;

        .adf-upload-dialog__content {
            display: none;
        }
    }

    .adf-upload-dialog__header {
        padding: 1em;
        display: flex;
        align-items: center;

        .adf-upload-dialog__header-button:is(button) {
            min-width: 0;
            height: 24px;
            width: 24px;
            padding: 0;
        }
    }

    &__title {
        margin-left: 0.5em;
        flex: 1 1 auto;
    }

    &__info {
        padding: 0 1em 1em;
    }

    &__content {
        overflow: auto;
        max-height: 194px;
        border-top: 1px solid var(--mat-sys-outline-variant);
        border-bottom: 1px solid var(--mat-sys-outline-variant);
    }

    &__confirmation {
        padding: 0 0.5em;
    }

    &__confirmation--title {
        font: var(--mat-sys-title-small-size);
    }

    &__confirmation--text {
        margin-bottom: 0;
    }

    &__actions {
        display: flex;
        justify-content: flex-end;
        padding: 1em;

        & > button {
            width: auto;
            min-width: 40px;
            text-transform: uppercase;
            padding: 0 16px;
        }
    }
}

[adfUploadDialogLeft] .adf-upload-dialog {
    left: 25px;
}

[adfUploadDialogRight] .adf-upload-dialog {
    right: 25px;
}

@media screen and (width >=380px) and (width <=768px) {
    .adf-upload-dialog {
        width: 60%;
    }

    .adf-file-uploading-row .adf-file-uploading-row__group {
        min-width: 0;
    }
}

@media screen and (width <=380px) {
    .adf-upload-dialog {
        width: 85%;
    }

    .adf-file-uploading-row .adf-file-uploading-row__group {
        min-width: 0;
    }
}