h1:focus { outline: none; }

.valid.modified:not([type=checkbox]) {
    outline: 1px solid var(--bz-color-ok);
}

.invalid {
    outline: 1px solid var(--bz-color-danger);
}

.validation-message {
    color: var(--bz-color-danger);
}

.blazor-error-boundary {
    background: var(--bz-color-danger);
    color: var(--bz-color-accent-fg);
    padding: var(--bz-space-4);
}

/* ── Grid popup edit form ────────────────────────────────────────────
   Applied via PopupEditFormCssClass="bz-dxgrid-popup-form" on every
   DevExpress grid that uses GridEditMode.PopupEditForm. Width follows
   the system-wide 90% popup standard (see shell.css), plus consistent
   internal spacing and footer-button alignment.
   Scoped to the popup root so unrelated dialogs are unaffected. */
.bz-dxgrid-popup-form {
    width: 90vw !important;
    max-width: 90vw !important;
}

/* Let single-column items breathe; keep two-column rows balanced */
.bz-dxgrid-popup-form .dxbl-form-layout {
    width: 100%;
}

/* Inputs, selects, date pickers and memos fill their column */
.bz-dxgrid-popup-form .dxbl-form-layout .dxbl-text-edit,
.bz-dxgrid-popup-form .dxbl-form-layout .dxbl-edit,
.bz-dxgrid-popup-form .dxbl-form-layout .dxbl-memo,
.bz-dxgrid-popup-form .dxbl-form-layout .dxbl-combobox,
.bz-dxgrid-popup-form .dxbl-form-layout .dxbl-dropdown,
.bz-dxgrid-popup-form .dxbl-form-layout .dxbl-date-edit,
.bz-dxgrid-popup-form .dxbl-form-layout .dxbl-spin-edit {
    width: 100%;
}

/* Footer actions: right-aligned with consistent rhythm */
.bz-dxgrid-popup-form .dxbl-popup-footer {
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: var(--bz-space-2);
    padding: var(--bz-space-3) var(--bz-space-5);
    border-top: 1px solid var(--bz-color-border);
}

/* Tighter padding on small screens */
@media (max-width: 640px) {
    .bz-dxgrid-popup-form .dxbl-popup-body {
        padding: var(--bz-space-3);
    }

    .bz-dxgrid-popup-form .dxbl-popup-footer {
        padding: var(--bz-space-3);
    }
}