/*
 * Entry point of the application styles (referenced by the host page, after the Syncfusion
 * theme). Order: design tokens, then structure, then forms. A component's own styles stay in
 * its .razor.css.
 */
@import url("tokens.css");
@import url("components.css");
@import url("forms.css");

/* Aligns the Syncfusion theme (Fluent 2) with the tokens. */
.e-btn.e-primary,
.e-btn.e-primary:focus {
    background-color: var(--erp-color-accent);
    border-color: var(--erp-color-accent);
    color: var(--erp-color-accent-contrast);
}

.e-btn.e-primary:hover {
    background-color: var(--erp-color-accent-hover);
    border-color: var(--erp-color-accent-hover);
}

.e-btn.e-danger {
    background-color: var(--erp-color-danger);
    border-color: var(--erp-color-danger);
    color: var(--erp-color-accent-contrast);
}

.e-grid {
    font-family: var(--erp-font-family);
}

.e-grid .e-row {
    cursor: pointer;
}