/* ════════════════════════════════════════════════════════════════════════════
 * birlik.css — Yetiştirici birliği panelinin renkleri ve bileşenleri (portal.css + admin.css ÜSTÜNE yüklenir)
 *
 * Yapı ve bileşenler yönetim paneliyle aynıdır (THM + portal.css + admin.css); bu dosya paleti ORMAN YEŞİLİNE çevirir
 * ve birliğe özgü bileşenleri ekler. Renk, soy kütüğü belgesiyle aynıdır (#1D4D33):
 *      vurgu #1D4D33 (beyaz yazıyla 9,9:1) · ikincil #4D6455 · yan menü #10261A
 * Bileşenler (brl-): erişim rozeti, özet kutuları, kütük bölümü rozeti, ekstre satırları, mini soy ağacı, karne çubukları.
 * ════════════════════════════════════════════════════════════════════════════ */

:root, [data-bs-theme=light] {
    --pt-accent: #1D4D33;
    --pt-accent-rgb: 29, 77, 51;
    --vz-primary: #1D4D33;
    --vz-primary-rgb: 29, 77, 51;
    --vz-primary-text-emphasis: #143624;
    --vz-primary-bg-subtle: #E6F0E9;
    --vz-primary-border-subtle: #B7CFBF;
    --vz-secondary: #4D6455;
    --vz-secondary-rgb: 77, 100, 85;
    --vz-secondary-text-emphasis: #33463A;
    --vz-secondary-bg-subtle: #EEF2EF;
    --vz-secondary-border-subtle: #CBD6CE;
    --vz-link-color: #1D4D33;
    --vz-link-color-rgb: 29, 77, 51;
    --vz-link-hover-color: #2E7350;
    --vz-link-hover-color-rgb: 46, 115, 80;
    --brl-male: #2F6DB5;
    --brl-female: #C2456B;
}

[data-bs-theme=dark] {
    --pt-accent: #8FD1A9;
    --pt-accent-rgb: 143, 209, 169;
    --vz-primary: #2E7350;
    --vz-primary-rgb: 46, 115, 80;
    --vz-primary-text-emphasis: #A9DDBD;
    --vz-primary-bg-subtle: rgba(143, 209, 169, .12);
    --vz-primary-border-subtle: rgba(143, 209, 169, .28);
    --vz-secondary: #7E9585;
    --vz-secondary-rgb: 126, 149, 133;
    --vz-secondary-text-emphasis: #C7D4CB;
    --vz-secondary-bg-subtle: rgba(199, 212, 203, .08);
    --vz-secondary-border-subtle: rgba(199, 212, 203, .2);
    --vz-link-color: #A9DDBD;
    --vz-link-color-rgb: 169, 221, 189;
    --vz-link-hover-color: #D2F0DD;
    --vz-link-hover-color-rgb: 210, 240, 221;
}

.adm .btn-primary { --vz-btn-hover-bg: #143624; --vz-btn-hover-border-color: #143624; --vz-btn-active-bg: #143624; --vz-btn-active-border-color: #143624; }
[data-bs-theme=dark] .adm .btn-primary { --vz-btn-hover-bg: #3A8A61; --vz-btn-hover-border-color: #3A8A61; --vz-btn-active-bg: #3A8A61; }
.adm .form-control:focus, .adm .form-select:focus { border-color: #4D8A65; box-shadow: 0 0 0 .2rem rgba(29, 77, 51, .14); }

html[data-sidebar=dark], html[data-theme][data-sidebar=dark] {
    --adm-menu-accent: #8FD1A9;
    --vz-vertical-menu-bg: #10261A;
    --vz-vertical-menu-border: #10261A;
    --vz-vertical-menu-item-color: #D3E3D8;
    --vz-vertical-menu-item-bg: rgba(255, 255, 255, .07);
    --vz-vertical-menu-item-active-bg: rgba(143, 209, 169, .14);
    --vz-vertical-menu-sub-item-color: #B9CCBF;
    --vz-vertical-menu-title-color: #84A08D;
    --vz-twocolumn-menu-iconview-bg: #0C1E14;
}
html[data-bs-theme=dark][data-sidebar=dark], html[data-theme][data-bs-theme=dark][data-sidebar=dark] { --vz-vertical-menu-bg: #0B1A12; --vz-vertical-menu-border: #17301F; }
.adm .pt-auth-side { background: linear-gradient(160deg, #10261A 0%, #1D4D33 100%); }
.adm .pt-auth-side::before { background: radial-gradient(circle, rgba(143, 209, 169, .16) 0%, rgba(143, 209, 169, 0) 68%); }

/* ── Erişim rozeti (çiftliğin verisi birliğe açık mı) ── */
.brl-access { display: inline-flex; align-items: center; gap: 4px; font-size: 11.5px; font-weight: 600; padding: 2px 8px; border-radius: 10px; white-space: nowrap; }
.brl-access i { font-size: 13px; }
.brl-access.ok { background: #E3F4EA; color: #1E6B3F; }
.brl-access.paket { background: #FDECEC; color: #B4232F; }
.brl-access.borc { background: #FFF4DE; color: #946200; }
.brl-access.uyelik { background: #EEF0F2; color: #5B6670; }
[data-bs-theme=dark] .brl-access.ok { background: rgba(46, 160, 92, .18); color: #8FD9A8; }
[data-bs-theme=dark] .brl-access.paket { background: rgba(220, 53, 69, .18); color: #F2A1A8; }
[data-bs-theme=dark] .brl-access.borc { background: rgba(255, 193, 7, .16); color: #F5D27A; }
[data-bs-theme=dark] .brl-access.uyelik { background: rgba(255, 255, 255, .08); color: #B8C2CA; }

/* ── Kilitli satır / kutu ── */
.brl-locked { display: flex; gap: 12px; align-items: flex-start; padding: 14px 16px; border-radius: 10px; background: #FFF6F6; border: 1px dashed #EBB5BA; color: #8C2531; }
.brl-locked i { font-size: 22px; line-height: 1; }
[data-bs-theme=dark] .brl-locked { background: rgba(220, 53, 69, .08); border-color: rgba(220, 53, 69, .35); color: #F2A1A8; }

/* ── Kütük bölümü rozeti (belgeyle aynı renkler) ── */
.brl-sect { display: inline-block; padding: 2px 9px; border-radius: 10px; font-size: 11px; font-weight: 700; letter-spacing: .3px; border: 1px solid; white-space: nowrap; }
.brl-sect.s1 { background: #1D4D33; color: #FFF; border-color: #1D4D33; }
.brl-sect.s2 { background: #E6F0E9; color: #1D4D33; border-color: #1D4D33; }
.brl-sect.s3 { background: #FFF7E6; color: #8A5A00; border-color: #D9A441; }
.brl-sect.s4 { background: #F2F2F2; color: #555; border-color: #AAA; }

/* ── Özet kutuları ── */
.brl-kpi { border-radius: 12px; padding: 16px 18px; background: var(--vz-secondary-bg); border: 1px solid var(--vz-border-color); height: 100%; display: flex; gap: 14px; align-items: center; }
.brl-kpi .ico { flex: 0 0 46px; height: 46px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; font-size: 23px;
    background: var(--vz-primary-bg-subtle); color: var(--vz-primary-text-emphasis); }
.brl-kpi .ico.warn { background: #FFF4DE; color: #946200; }
.brl-kpi .ico.danger { background: #FDECEC; color: #B4232F; }
.brl-kpi .val { font-size: 22px; font-weight: 700; line-height: 1.1; }
.brl-kpi .lbl { font-size: 12.5px; color: var(--vz-secondary-color); }
.brl-kpi .sub { font-size: 11.5px; color: var(--vz-secondary-color); }
a.brl-kpi { color: inherit; text-decoration: none; transition: box-shadow .12s, transform .12s; }
a.brl-kpi:hover { box-shadow: 0 4px 14px rgba(0, 0, 0, .08); transform: translateY(-1px); color: inherit; }

/* ── Mini çubuk grafik (son 12 ay) ── */
.brl-bars { display: flex; align-items: flex-end; gap: 6px; height: 120px; padding-top: 8px; }
.brl-bars .b { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: 100%; }
.brl-bars .b span { width: 100%; max-width: 26px; border-radius: 5px 5px 2px 2px; background: var(--vz-primary); min-height: 2px; }
.brl-bars .b small { font-size: 10px; color: var(--vz-secondary-color); margin-top: 4px; }
.brl-bars .b[data-v]:hover span { background: #2E7350; }

/* ── Ekstre ── */
.brl-statement td.num, .brl-statement th.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.brl-statement tr.is-pay td { background: rgba(46, 160, 92, .05); }
.brl-statement tr.is-overdue td:first-child { box-shadow: inset 3px 0 0 #DC3545; }
.brl-statement tfoot td { font-weight: 700; border-top: 2px solid var(--vz-border-color); }
.brl-money { font-variant-numeric: tabular-nums; white-space: nowrap; }
.brl-money.neg { color: #1E6B3F; }
.brl-money.pos { color: #B4232F; }

/* ── Mini soy ağacı (kütük ayrıntısı) ── */
.brl-tree { display: grid; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(8, minmax(34px, auto)); gap: 4px 10px; }
.brl-tree.g4 { grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(16, minmax(24px, auto)); }
.brl-tree .n { border: 1px solid var(--vz-border-color); border-left: 3px solid; border-radius: 6px; padding: 3px 8px; font-size: 12px; display: flex; flex-direction: column; justify-content: center; min-width: 0; }
.brl-tree .n.m { border-left-color: var(--brl-male); }
.brl-tree .n.f { border-left-color: var(--brl-female); }
.brl-tree .n b { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.brl-tree .n small { color: var(--vz-secondary-color); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.brl-tree .n .rn { font-family: var(--vz-font-monospace, monospace); font-size: 11px; color: var(--vz-primary-text-emphasis); }
.brl-tree .n.empty { color: var(--vz-secondary-color); font-style: italic; }

/* ── Karne çubuğu (çiftlik ↔ birlik ortalaması) ── */
.brl-cmp { display: flex; align-items: center; gap: 8px; }
.brl-cmp .track { flex: 1; height: 7px; border-radius: 4px; background: var(--vz-secondary-bg-subtle); position: relative; overflow: hidden; }
.brl-cmp .track span { position: absolute; left: 0; top: 0; bottom: 0; border-radius: 4px; background: var(--vz-primary); }
.brl-cmp .track i { position: absolute; top: -3px; bottom: -3px; width: 2px; background: #946200; }
.brl-cmp b { min-width: 54px; text-align: right; font-variant-numeric: tabular-nums; font-size: 12.5px; }

/* ── Puan girişi (denetim) ── */
.brl-score { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.brl-score label { font-size: 12.5px; font-weight: 600; }
.brl-score .pt-seg-9 { display: grid; grid-template-columns: repeat(9, 1fr); gap: 2px; }
.brl-score input[type=radio] { display: none; }
.brl-score .pt-seg-9 span { display: block; text-align: center; font-size: 11.5px; padding: 4px 0; border-radius: 4px; background: var(--vz-secondary-bg-subtle); cursor: pointer; user-select: none; }
.brl-score input[type=radio]:checked + span { background: var(--vz-primary); color: #FFF; font-weight: 700; }

/* ── Davet kodu ── */
.brl-code { font-family: var(--vz-font-monospace, monospace); font-size: 26px; font-weight: 700; letter-spacing: 6px; color: var(--vz-primary-text-emphasis);
    background: var(--vz-primary-bg-subtle); border: 1px dashed var(--vz-primary-border-subtle); border-radius: 12px; padding: 10px 18px; display: inline-block; }

.brl-mono { font-family: var(--vz-font-monospace, monospace); }
.brl-empty { text-align: center; color: var(--vz-secondary-color); padding: 34px 12px; }
.brl-empty i { font-size: 34px; display: block; margin-bottom: 6px; opacity: .55; }
.table-hover tbody tr[data-href] { cursor: pointer; }

/* ═══════════ Birlik paneli (yeniden): üst çubuk kurum kimliği, özet kutuları, grafik kartları, rozetler ═══════════ */
.brl-org { align-items: center; gap: 10px; margin-left: 6px; }
.brl-org img { width: 36px; height: 36px; border-radius: 50%; object-fit: contain; background: #fff; border: 1px solid var(--vz-border-color); }
.brl-org-ico { width: 36px; height: 36px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: var(--vz-primary-bg-subtle); color: var(--vz-primary); font-size: 18px; }
.brl-org b { display: block; font-size: 14px; line-height: 1.15; color: var(--vz-heading-color); }
.brl-org small { font-size: 11.5px; color: var(--vz-secondary-color); letter-spacing: .02em; }
.brl-tile { display: flex; gap: 14px; align-items: center; padding: 16px 18px; border-radius: 10px; background: var(--vz-secondary-bg); border: 1px solid var(--vz-border-color); height: 100%; color: inherit; transition: box-shadow .15s, transform .15s; }
a.brl-tile:hover { box-shadow: 0 6px 18px rgba(16, 38, 26, .08); transform: translateY(-1px); color: inherit; }
.brl-tile .ico { width: 46px; height: 46px; flex: 0 0 46px; border-radius: 12px; display: inline-flex; align-items: center; justify-content: center; font-size: 22px; background: var(--vz-primary-bg-subtle); color: var(--vz-primary); }
.brl-tile .ico.warn { background: var(--vz-warning-bg-subtle); color: var(--vz-warning); }
.brl-tile .ico.danger { background: var(--vz-danger-bg-subtle); color: var(--vz-danger); }
.brl-tile .ico.info { background: var(--vz-info-bg-subtle); color: var(--vz-info); }
.brl-tile .ico.success { background: var(--vz-success-bg-subtle); color: var(--vz-success); }
.brl-tile .val { font-size: 22px; font-weight: 700; color: var(--vz-heading-color); line-height: 1.1; }
.brl-tile .lbl { font-size: 12.5px; color: var(--vz-secondary-color); margin-top: 2px; }
.brl-tile .sub { font-size: 12px; margin-top: 3px; color: var(--vz-secondary-color); }
.brl-delta { font-size: 11.5px; font-weight: 600; padding: 1px 6px; border-radius: 10px; margin-left: 6px; vertical-align: middle; }
.brl-delta.success { background: var(--vz-success-bg-subtle); color: var(--vz-success); }
.brl-delta.danger { background: var(--vz-danger-bg-subtle); color: var(--vz-danger); }
.brl-delta.muted { background: var(--vz-light); color: var(--vz-secondary-color); }
.brl-chart { min-height: 290px; }
.brl-chart-sm { min-height: 220px; }
.brl-empty { text-align: center; padding: 34px 16px; color: var(--vz-secondary-color); }
.brl-empty i { font-size: 34px; display: block; margin-bottom: 8px; opacity: .55; }
.brl-alert { display: flex; gap: 10px; align-items: flex-start; padding: 10px 14px; border-bottom: 1px solid var(--vz-border-color); color: inherit; }
.brl-alert:last-child { border-bottom: 0; }
.brl-alert:hover { background: var(--vz-light); color: inherit; }
.brl-alert i { font-size: 18px; line-height: 1.2; }
.brl-alert b { display: block; font-size: 13px; }
.brl-alert small { font-size: 12px; color: var(--vz-secondary-color); }
.brl-rank { width: 26px; height: 26px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 12px; font-weight: 700; background: var(--vz-light); color: var(--vz-heading-color); }
.brl-rank.r1 { background: #f6d77a; color: #5a4300; } .brl-rank.r2 { background: #d9dee3; color: #3c4650; } .brl-rank.r3 { background: #e9b98f; color: #5b3210; }
.brl-score { display: inline-flex; align-items: center; gap: 6px; min-width: 90px; }
.brl-score .bar { flex: 1; height: 6px; border-radius: 3px; background: var(--vz-light); overflow: hidden; }
.brl-score .bar span { display: block; height: 100%; background: linear-gradient(90deg, #8FD1A9, #1D4D33); }
.brl-code { font-family: ui-monospace, Menlo, Consolas, monospace; font-size: 22px; font-weight: 700; letter-spacing: .12em; padding: 8px 16px; border-radius: 10px; background: var(--vz-primary-bg-subtle); color: var(--vz-primary); display: inline-block; }
.brl-mono { font-family: ui-monospace, Menlo, Consolas, monospace; }
.brl-farm-head { display: flex; gap: 16px; align-items: center; }
.brl-farm-head img, .brl-farm-head .ph { width: 64px; height: 64px; border-radius: 14px; object-fit: contain; background: #fff; border: 1px solid var(--vz-border-color); }
.brl-farm-head .ph { display: inline-flex; align-items: center; justify-content: center; font-size: 28px; color: var(--vz-primary); background: var(--vz-primary-bg-subtle); }
.brl-timeline { list-style: none; margin: 0; padding: 0; position: relative; }
.brl-timeline::before { content: ''; position: absolute; left: 15px; top: 4px; bottom: 4px; width: 2px; background: var(--vz-border-color); }
.brl-timeline li { position: relative; padding: 0 0 12px 42px; }
.brl-timeline li .dot { position: absolute; left: 4px; top: 0; width: 24px; height: 24px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-size: 14px; background: var(--vz-secondary-bg); border: 2px solid currentColor; }
.brl-timeline li b { font-size: 13px; }
.brl-timeline li small { display: block; color: var(--vz-secondary-color); font-size: 12px; }
.brl-tree { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; font-size: 12.5px; }
.brl-tree div { border: 1px solid var(--vz-border-color); border-radius: 8px; padding: 6px 8px; background: var(--vz-secondary-bg); }
.brl-tree small { display: block; color: var(--vz-secondary-color); font-size: 11px; }
.brl-steps { display: flex; gap: 0; margin: 4px 0 2px; }
.brl-steps span { flex: 1; text-align: center; font-size: 11.5px; padding: 6px 4px; border-top: 3px solid var(--vz-border-color); color: var(--vz-secondary-color); }
.brl-steps span.on { border-color: var(--vz-success); color: var(--vz-success); font-weight: 600; }
.brl-apply-kind .btn { min-width: 120px; }
.brl-yearpick .btn { min-width: 64px; }
.brl-table-tools { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.table tr[data-href] { cursor: pointer; }
.brl-locked { display: flex; gap: 14px; align-items: flex-start; }
.brl-locked > i { font-size: 30px; color: var(--vz-warning); }
.brl-auth-wide { max-width: 640px; width: 100%; }
/* ── Giriş sayfaları (giriş, başvuru, şifremi unuttum): çiftlik kayıt sihirbazıyla aynı düzen (bv-auth-web.css + bv-signup.css),
      renkler birliğin orman yeşili. Sayfa kapsayıcısı ve <html> data-bvs-pf="union" taşır (pencereler <body>'ye eklenir). ── */
html[data-bvs-pf="union"], [data-bvs-pf="union"] { --bvs-acc: #1D4D33; --bvs-acc-ink: #143624; --bvs-acc-rgb: 29, 77, 51;
    --bvs-side: #1D4D33; --bvs-side-2: #10261A; }
body.bva-body[data-bva-pf="union"] { background-color: #DDE8E1;
    background-image:
        radial-gradient(900px 620px at 0% 0%, rgba(250, 253, 251, .85), rgba(250, 253, 251, 0) 62%),
        radial-gradient(820px 600px at 100% 100%, rgba(29, 77, 51, .34), rgba(29, 77, 51, 0) 60%),
        radial-gradient(700px 480px at 70% 85%, rgba(192, 138, 87, .22), rgba(192, 138, 87, 0) 70%),
        linear-gradient(145deg, #F1F6F3 0%, #D8E6DD 50%, #A7C3B1 100%); }
/* Logo (SheepAl + UNION): iki satırlı olduğu için biraz daha yüksek */
.bva-body[data-bva-pf="union"] .bva-logo img { height: 54px; }
.bva-body[data-bva-pf="union"] .bva-logo-sm img { height: 34px; }
/* İlçe: ilin ilçe listesi yoksa liste gizlenir, yazı alanı açılır */
.brl-district-text[hidden], .brl-district-list[hidden] { display: none !important; }
/* Kuruluş türü kartları (Birlik / Dernek / Kooperatif): simge solda */
.brl-kind .bvs-choice > i { font-size: 22px; width: 26px; text-align: center; }
.brl-kind .bvs-choice:has(input:checked) > i { color: var(--bvs-acc); }
/* Yan menü logosu (SheepAl + UNION, iki satır): biraz daha yüksek */
.navbar-menu .navbar-brand-box .logo-lg img { height: 40px; max-height: 40px; }
/* Başvuru alındı: sonraki adımlar */
.brl-next-steps { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 12px; }
.brl-next-steps li { display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 10px; align-items: center; font-size: 13.5px; line-height: 1.45; color: var(--bvs-ink); }
.brl-next-steps .n { width: 28px; height: 28px; border-radius: 50%; background: rgba(var(--bvs-acc-rgb), .1); color: var(--bvs-acc); display: grid; place-items: center; font-weight: 600; font-size: 13px; }
/* Pedigri üretme adımları */
.brl-wizard { display: flex; gap: 10px; list-style: none; padding: 0; counter-reset: none; }
.brl-wizard li { flex: 1; display: flex; align-items: center; gap: 8px; padding: 10px 12px; border-radius: 8px; background: var(--vz-secondary-bg); border: 1px solid var(--vz-border-color); color: var(--vz-secondary-color); font-weight: 500; font-size: 13px; }
.brl-wizard li span { width: 26px; height: 26px; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; background: var(--vz-light); font-weight: 600; flex-shrink: 0; }
.brl-wizard li small { margin-left: auto; font-weight: 400; color: var(--vz-body-color); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.brl-wizard li.on { border-color: var(--vz-success); color: var(--vz-success); }
.brl-wizard li.on span { background: var(--vz-success); color: #fff; }
.brl-wizard li.done span { background: var(--vz-success-bg-subtle); color: var(--vz-success); }
@media (max-width: 767.98px) { .brl-wizard { flex-direction: column; } }
/* Pedigri belgesi */
.brl-pc-print { background: #fff; margin: 0; }
.brl-pc-print .pc-pages { padding: 0; }
.brl-analysis-card { transition: transform .12s ease, box-shadow .12s ease; }
.brl-analysis-card:hover { transform: translateY(-2px); box-shadow: 0 6px 18px rgba(0,0,0,.08); }
.brl-img-slot { width: 64px; height: 64px; border-radius: 8px; border: 1px dashed var(--vz-border-color); display: flex; align-items: center; justify-content: center; background: repeating-conic-gradient(var(--vz-light) 0 25%, transparent 0 50%) 0 0 / 12px 12px; flex-shrink: 0; overflow: hidden; }
.brl-img-slot img { max-width: 100%; max-height: 100%; object-fit: contain; }
.brl-img-slot i { font-size: 26px; color: var(--vz-secondary-color); }

/* Birlik bilgileri: soldaki sekmeler (geniş ekranda sabit kalır) */
.brl-side-tabs .nav-link { display: flex; align-items: center; padding: .6rem .85rem; border-radius: 8px; color: var(--vz-body-color); font-weight: 500; }
.brl-side-tabs .nav-link i { font-size: 18px; opacity: .75; }
.brl-side-tabs .nav-link.active { color: #fff; }
.brl-side-tabs .nav-link.active i { opacity: 1; }
@media (min-width: 992px) { .brl-side-tabs { position: sticky; top: calc(var(--vz-header-height, 70px) + 16px); } }
@media (max-width: 991.98px) { .brl-side-tabs .nav { flex-direction: row !important; flex-wrap: nowrap; overflow-x: auto; } .brl-side-tabs .nav-link { white-space: nowrap; } }

/* Analiz süzgeçleri: etiket üstte, seçim altta; dar ekranda alt alta */
.brl-filters { display: flex; flex-wrap: wrap; align-items: flex-end; gap: .5rem 1rem; }
.brl-filter { display: flex; flex-direction: column; gap: 2px; margin: 0; min-width: 150px; }
.brl-filter > span { font-size: 12px; color: var(--vz-secondary-color); }
.brl-filter .form-select { min-width: 150px; max-width: 280px; }
@media (max-width: 575.98px) { .brl-filter, .brl-filter .form-select { width: 100%; max-width: none; } }