@use '@angular/material' as mat;

.adf-share-link-dialog {
    .adf-share-link {
        &__dialog-content {
            display: flex;
            flex-direction: column;
        }

        &__dialog-container {
            background-color: var(--mat-sys-surface);
            border-radius: 16px;
        }

        &__label,
        &__title,
        &__info {
            font: var(--mat-sys-body-medium);
            color: var(--mat-sys-on-surface);
        }

        &__label {
            flex: 1 1 auto;
        }

        &__form {
            padding-top: 8px;
        }

        &__public-content {
            color: var(--mat-sys-on-secondary-container);
            font: var(--mat-sys-body-small);
        }

        &__warn {
            color: var(--mat-sys-error);
            font-size: var(--mat-sys-body-small-size);
        }

        &__border-color {
            @include mat.form-field-overrides(
                (
                    outlined-outline-color: var(--mat-sys-warn)
                )
            );
        }

        &--row {
            display: flex;
            flex-direction: row;
            /* stylelint-disable-next-line declaration-block-no-redundant-longhand-properties */
            flex-wrap: wrap;
            align-items: center;
            margin: 8px 0;

            &-sharable {
                margin-bottom: 10px;
            }
        }

        &--sharable-container {
            margin-bottom: 0;
        }

        &--header {
            padding: 16px 24px 0;
        }

        &--dialog-content {
            padding-top: 0;
            padding-bottom: 0;
        }

        &__separation-line {
            border: 1px solid var(--mat-sys-outline-variant);
            margin: 8px -24px;
        }

        &__close {
            cursor: pointer;
            margin-left: 12px;
        }

        &__para {
            margin-top: 8px;
            margin-bottom: 8px;
        }

        &__heading {
            font-weight: 700;
            font-size: var(--mat-sys-title-small-size);
        }
    }

    .adf-input-action {
        cursor: pointer;
    }

    .adf-full-width {
        width: 100%;
    }

    .adf-sharable-link {
        margin-top: 2px;
        margin-left: 8px;
    }

    .adf-share-link__actions {
        justify-content: flex-end;
        padding: 8px 24px 32px 0;
        margin: 8px 0 0;

        & > button {
            margin-right: 12px;
        }
    }
}