/*
 * Filter bar for report pages.
 *
 * Reports are scoped by a filter, so this bar sits directly under the page
 * title, is left aligned, and is deliberately compact: the report below it
 * owns the full width. Labels sit above their controls and the submit button
 * is baseline aligned with the inputs, so the row reads as one control group.
 *
 * It replaces the misused Tabler `.page-header` class, which is a page-title
 * container and carries its own top margin and min-height.
 */

.report-filter {
    margin-bottom: 1.25rem;
}

.report-filter .report-filter-fields {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 0.75rem 1rem;
}

.report-filter .report-filter-field {
    flex: 0 0 auto;
}

/*
 * Fix the control width so the submit button does not shift sideways as a date
 * is typed or cleared.
 */
.report-filter .report-filter-field .form-control {
    min-width: 11.5rem;
}

.report-filter .report-filter-field .form-label {
    margin-bottom: 0.25rem;
    font-weight: 500;
    white-space: nowrap;
    color: var(--tblr-secondary-color, #667382);
}

/* The picker/clear affordances are chrome, not status: keep them muted. */
.report-filter .report-filter-field .input-group-text {
    color: var(--tblr-secondary-color, #667382);
    background-color: var(--tblr-bg-surface, #fff);
    border-color: var(--tblr-border-color, #e6e7e9);
}

.report-filter .report-filter-actions {
    display: flex;
    align-items: center;
    gap: 0.75rem;
}

.report-filter .report-filter-actions .btn {
    white-space: nowrap;
}

@media print {
    .report-filter {
        display: none;
    }
}