.root {
    background-color: var(--uui-alert-bg);
    border-left: 6px solid var(--uui-alert-border);

    .icon-wrapper {
        :global(.uui-icon) {
            fill: var(--uui-alert-icon);
        }
    }
}

.alert-wrapper {
    padding: 12px 18px 12px 12px;
    display: flex;
    overflow: hidden;
    min-width: 170px;
    border-radius: var(--uui-alert-border-radius);
}

.icon-wrapper {
    height: 100%;
    margin-right: 12px;
}

.action-wrapper {
    display: flex;
}

.action-icon {
    min-height: 30px;
}

.action-link:not(:last-child) {
    margin-right: 12px;
}

.close-icon {
    margin-left: 17px;
    min-height: 30px;
    min-width: fit-content;
    align-self: flex-start;
}

.main-path {
    width: 100%;
    display: flex;
}

.content {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: 100%;
}
