/* Shared filter bar (portal/js/filters.js). Phone first: selects stack in one column, two from 520px. */
.fx-bar { margin: 0 0 12px; padding: 10px 12px; }
.fx-det > summary { cursor: pointer; font-weight: 600; padding: 6px 0; list-style: none; display: flex; align-items: center; gap: 8px; }
.fx-det > summary::-webkit-details-marker { display: none; }
.fx-det > summary::before { content: "\25B8"; color: #F16A32; }
.fx-det[open] > summary::before { content: "\25BE"; }
.fx-on { background: #F16A32; color: #fff; border-radius: 10px; padding: 1px 8px; font-size: .72rem; font-weight: 700; text-transform: uppercase; }
.fx-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 6px 0 4px; }
.fx-f { display: flex; flex-direction: column; gap: 3px; font-size: .78rem; color: #5b6573; min-width: 0; }
.fx-f select { width: 100%; padding: 10px; min-height: 44px; border: 1px solid #d5dae1; border-radius: 10px; background: #fff; font: inherit; font-size: .95rem; text-overflow: ellipsis; color: inherit; }
.fx-sum { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-top: 6px; font-size: .9rem; flex-wrap: wrap; }
.fx-desc { color: #5b6573; }
.fx-note, .fx-warn { margin: 6px 0 0; font-size: .85rem; }
.fx-note .link { background: none; border: 0; padding: 0; color: #F16A32; font: inherit; text-decoration: underline; cursor: pointer; }
.prop.fx-hide { display: none !important; }
#fx-reset { flex: 0 0 auto; }
@media (max-width: 339px) { .fx-grid { grid-template-columns: 1fr; } }
@media (min-width: 900px) { .fx-grid { grid-template-columns: repeat(3, 1fr); } }