/* Scoped presentation only: each screen retains its own filters and totals. */
.ui-density .ui-filter-bar {
    display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px 12px;
    padding: 12px 16px; margin: 0 0 12px; min-height: 0;
    background: white; border: 1px solid var(--ui-line); border-radius: 10px; box-shadow: none;
}
.ui-density .ui-filter-bar:has(> .ui-filter-fields) { display: block; }
.ui-density .ui-filter-bar > .ui-filter-fields {
    display: flex; flex-wrap: wrap; align-items: flex-end; gap: 10px 12px;
    width: 100%; padding: 0; margin: 0; border: 0; background: transparent; box-shadow: none;
}
.ui-density .ui-filter-bar > .control-group,
.ui-density .ui-filter-fields > .filter-group {
    display: flex; flex-direction: column; align-items: stretch; gap: 4px;
    flex: 1 1 160px; min-width: 0; max-width: 340px; margin: 0;
}
.ui-density .ui-filter-bar :is(.control-group, .filter-group, .form-group) > label {
    margin: 0; font-size: 12px; font-weight: 600; line-height: 1.4; color: var(--ui-muted);
}
.ui-density .ui-filter-bar :is(.control-group, .filter-group, .form-group) > :is(input, select),
.ui-density .ui-filter-bar.filters > :is(input, select) {
    width: 100%; min-width: 0; max-width: 100%; min-height: 38px;
    height: 38px; margin: 0; padding: 7px 10px; font-size: 13px;
    border: 1px solid #cfdad3; border-radius: 7px; background: white;
}
.ui-density .ui-filter-bar .btn,
.ui-density .ui-filter-bar > .btn {
    flex: 0 0 auto; width: auto; min-width: 0; min-height: 38px;
    padding: 8px 12px; margin: 0; font-size: 13px; line-height: 1.4;
    border-radius: 7px; letter-spacing: 0; text-transform: none;
}
.ui-density .ui-filter-fields > .btn-group { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin: 0; }
.ui-density .ui-filter-bar > .filter-group-grid {
    width: 100%; display: grid; grid-template-columns: minmax(180px, 1fr) repeat(3, minmax(140px, 1fr)); gap: 12px; align-items: end;
}
.ui-density .ui-filter-bar > .filter-group-grid > .form-group { margin: 0; min-width: 0; }
.ui-density .ui-filter-bar > .filter-group-grid .btn { width: 100%; }
.ui-density .ui-filter-bar.filters { border: 0; padding: 0; }
.ui-density .ui-filter-bar.filters > :is(input, select) { flex: 1 1 170px; max-width: 300px; }
.ui-density .ui-metrics-wrap { margin: 0; padding: 0; background: transparent; border: 0; box-shadow: none; }
.ui-density .ui-metrics {
    display: grid; grid-template-columns: repeat(auto-fit, minmax(155px, 1fr)); gap: 0;
    margin: 0 0 16px; padding: 10px 0; min-height: 0;
    background: white; border: 1px solid var(--ui-line); border-radius: 10px; box-shadow: none;
}
.ui-density .ui-metrics > :is(.stat-card, .summary-item, .summary-card) {
    display: flex; flex-direction: column; align-items: flex-start; justify-content: center;
    gap: 3px; min-width: 0; min-height: 44px; padding: 0 16px; margin: 0;
    background: transparent; border: 0; border-right: 1px solid var(--ui-line);
    border-radius: 0; box-shadow: none; transform: none; text-align: left;
}
.ui-density .ui-metrics > :is(.stat-card, .summary-item, .summary-card):last-child { border-right: 0; }
.ui-density .ui-metrics > :is(.stat-card, .summary-item, .summary-card)::before,
.ui-density .ui-metrics > :is(.stat-card, .summary-item, .summary-card)::after { content: none; }
.ui-density .ui-metrics h3 { margin: 0; font-size: 21px; line-height: 1.2; font-weight: 650; color: var(--ui-accent); font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.ui-density .ui-metrics p { margin: 0; font-size: 12px; line-height: 1.4; color: var(--ui-muted); text-transform: none; letter-spacing: 0; }
.ui-density .ui-inline-metrics { display: flex; flex-wrap: wrap; gap: 8px 20px; padding: 10px 0; margin-bottom: 12px; background: transparent; font-size: 13px; }
/* Existing CRUD markup is generated by LoadForm, so style it without changing that module. */
.ui-home.ui-density .dashboard-content .control-panel { padding: 12px 14px; gap: 10px 12px; margin-bottom: 12px; }
.ui-home.ui-density .dashboard-content .stats:not(.stats-overview) { margin-bottom: 12px; }
.ui-home.ui-density .dashboard-content .stats:not(.stats-overview) .stat-card { min-width: 0; padding: 10px 16px; grid-template-columns: 32px auto; gap: 2px 10px; }
.ui-home.ui-density .dashboard-content .stats:not(.stats-overview) .stat-icon { width: 32px; height: 32px; font-size: 18px; }
.ui-home.ui-density .dashboard-content .stats:not(.stats-overview) .stat-number { font-size: 22px; }
.ui-home.ui-density .dashboard-content .stats:not(.stats-overview) .stat-label { font-size: 12px; margin-top: 0; }
.ui-home.ui-density .dashboard-content .control-panel :is(.search-input, .filter-select, select.dropdown) { min-height: 38px; padding-top: 7px; padding-bottom: 7px; }
.ui-home.ui-density .dashboard-content .control-panel .btn { min-height: 38px; padding: 8px 12px; }
@media (max-width: 1099px) {
    .ui-density .ui-filter-bar > .filter-group-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 767px) {
    .ui-density .ui-filter-bar { padding: 12px; }
    .ui-density .ui-filter-bar > .control-group,
    .ui-density .ui-filter-fields > .filter-group { flex-basis: 180px; max-width: none; }
    .ui-density .ui-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); padding: 0; }
    .ui-density .ui-metrics > :is(.stat-card, .summary-item, .summary-card) { padding: 12px; border-bottom: 1px solid var(--ui-line); }
    .ui-density .ui-metrics > :is(.stat-card, .summary-item, .summary-card):nth-child(even) { border-right: 0; }
    .ui-density .ui-metrics > :is(.stat-card, .summary-item, .summary-card):last-child { border-bottom: 0; }
    .ui-density .ui-metrics > :is(.stat-card, .summary-item, .summary-card):nth-last-child(2):nth-child(odd) { border-bottom: 0; }
    .ui-density .ui-filter-bar :is(.control-group, .filter-group, .form-group) > :is(input, select),
    .ui-density .ui-filter-bar.filters > :is(input, select),
    .ui-density .ui-filter-bar .btn,
    .ui-home.ui-density .dashboard-content .control-panel :is(.search-input, .filter-select, select.dropdown, .btn) { min-height: 44px; height: auto; }
    .ui-density .ui-filter-fields > .btn-group { flex-basis: 100%; }
}
@media (max-width: 420px) {
    .ui-density .ui-filter-bar > .control-group,
    .ui-density .ui-filter-fields > .filter-group { flex-basis: 100%; }
    .ui-density .ui-filter-bar > .filter-group-grid { grid-template-columns: 1fr; }
}