@import url('./components.css');

/* -------- alert css -------- */

.alert {
    width: 30rem;
    margin: 5px auto;
    padding: 1rem;
    font-weight: 600;
    background-color: var(--bg-color);
    border-radius: 2px;
    border: solid 1px transparent;
}

/* simple alert */
.primary {
    background-color: var(--color-info-bg);
}

.error {
    background-color: var(--color-error-bg);
}

.success {
    background-color: var(--color-success-bg);
}

.warning {
    background-color: var(--color-warning-bg);
}

/* outline alert */
.outline-primary {
    border-color: var(--color-info);
    color: var(--color-info);
}

.outline-error {
    border-color: var(--color-error);
    color: var(--color-error);
}

.outline-success {
    border-color: var(--color-success);
    color: var(--color-success);
}

.outline-warning {
    border-color: var(--color-warning);
    color: var(--color-warning);
}

.alert-simple,
.alert-outline {
    min-height: 25rem;
}
