:host {
    width: 100%;
    height: 100%;
    box-sizing: border-box;
}

form {
    display: flex;
    flex: 1;
    justify-content: flex-end;
    align-items: center;
    height: 100%;

    .iqser-input-group {
        margin-top: 0;
    }
}

.editor-container {
    height: calc(100% - 92px);
    display: flex;

    > *:not(:first-child:last-child) {
        width: 50%;
    }

    > *:not(:last-child) {
        border-radius: 8px 0 0 8px;
    }

    > *:not(:first-child) {
        border-radius: 0 8px 8px 0;
        border-left: none;
    }
}

.content-container {
    height: 100%;

    .actions-bar {
        display: flex;
        align-items: center;
        margin-bottom: 16px;
        justify-content: space-between;

        > .compare {
            display: flex;
            align-items: center;
        }

        .w-450 {
            width: 100%;
            max-width: 450px;
        }

        .iqser-input-group {
            input {
                padding-right: 32px;

                &.with-matches {
                    padding-right: 108px;
                }
            }

            .input-icons {
                position: absolute;
                right: 12px;
                top: 8px;
                color: var(--iqser-accent);

                .with-input {
                    display: flex;
                    justify-content: center;
                    align-items: center;
                }

                mat-icon {
                    max-width: 14px;
                    margin-left: 8px;
                }
            }
        }
    }
}

.no-dictionary-selected {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    padding: 0 100px;
    box-sizing: border-box;
    text-align: center;
    border: 1px solid var(--iqser-grey-5);

    > mat-icon {
        height: 60px;
        width: 60px;
        opacity: 0.1;
        margin-bottom: 24px;
    }

    .heading-l {
        color: var(--iqser-grey-7);
    }
}
