/* ui_field — pair file for src/ui_system/field.jl
 *
 * Form-field cluster shapes: verdict checkbox grid, date range row,
 * builder confidence/date pairs, per-page selector. */

.verdict-filters {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.25rem 1rem;
}
.verdict-filters legend { grid-column: 1 / -1; }
.verdict-filters label {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    margin: 0;
}
@media (max-width: 767.98px) {
    .verdict-filters { gap: 0.4rem 0.75rem; }
    .verdict-filters label { font-size: var(--ds-font-lg); }
}
.verdict-filters label::after {
    content: "";
    display: inline-block;
    width: 0.55rem;
    height: 0.55rem;
    border-radius: 50%;
    margin-left: 0.1rem;
}
.verdict-filters label:nth-of-type(1)::after { background: var(--ds-color-positive-bg); }
.verdict-filters label:nth-of-type(2)::after { background: var(--ds-color-negative-bg); }
.verdict-filters label:nth-of-type(3)::after { background: var(--ds-color-inconclusive-bg); }
.verdict-filters label:nth-of-type(4)::after { background: var(--ds-color-invalid-bg); }

.date-row { align-items: end; }
.date-row label { margin: 0; }
.date-row input[type="date"] {
    margin: 0;
    padding: 0.4rem 0.6rem;
    font-size: var(--ds-font-lg);
}
@media (max-width: 480px) {
    .date-row { display: block; }
    .date-row label + label { margin-top: 0.5rem; }
}

.builder-conf-fields,
.builder-date-fields {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0.5rem;
}
.builder-conf-fields label,
.builder-date-fields label {
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}
.builder-conf-fields small,
.builder-date-fields small { font-size: var(--ds-font-xs); }

.per-page-label {
    display: inline-flex;
    align-items: center;
    gap: 0.4rem;
    margin: 0;
}
.per-page-selector {
    width: auto;
    margin: 0;
    padding: 0.2rem 1.5rem 0.2rem 0.5rem;
    font-size: 0.8rem;
    line-height: 1;
    height: 28px;
    background-size: 0.6em;
}