:root { --hl-radius: 1rem; }
body { min-height: 100vh; }
.card { border-radius: var(--hl-radius); }
.metric { font-size: clamp(1.4rem, 2vw, 2.2rem); font-weight: 700; }
.table td, .table th { vertical-align: middle; }
.amount-positive { color: #146c43; }
.amount-negative { color: #b02a37; }
.form-narrow { max-width: 460px; }
.login-wrap { min-height: 80vh; display: grid; place-items: center; }
.badge-soft { background: var(--bs-tertiary-bg); color: var(--bs-body-color); border: 1px solid var(--bs-border-color); }

/* Highlight data grid rows on hover. Applies to Bootstrap tables across the app. */
.table tbody tr:hover > * {
    background-color: var(--bs-secondary-bg);
}
.table tbody tr:hover {
    cursor: default;
}