/* A szűrőgombra írt aktuális érték (filter-value-labels.js). A címke marad a téma
   nagybetűs, halvány stílusában, az érték viszont úgy olvasható, ahogy az admin beírta —
   így egy pillantásra elválik a kettő. */
.navbar-filters .js-filter-value {
    text-transform: none;
    font-weight: 600;
    letter-spacing: 0;
    color: #0e9bc4;
}

/* The country list is two hundred entries; the menu should scroll, not the page. */
.filter-inline__menu {
    max-height: 16rem;
    overflow-y: auto;
}

/* The criteria that stand open in the bar (admin/filters/inline/field.blade.php). Each is
   an <li> of the bar's own <ul>, which Bootstrap lays out in a single non-wrapping row —
   a list with several of them needs it to wrap, and the bar to grow with them. */
.navbar-filters:has(.filter-inline),
.navbar-filters:has(.filter-inline) .navbar-collapse {
    /* The bar is a card with a 3.5rem min-height whose rows are stretched to it. A
       stretched row does not grow with a taller field: it would hang out through the top
       of the card. */
    align-items: center;
}

.navbar-filters .nav.navbar-nav:has(.filter-inline) {
    flex-wrap: wrap;
    align-items: center;
    row-gap: .25rem;
}

/* Every item in the bar is one line tall: the dropdowns say their name on the toggle, the
   input fields say theirs in the placeholder. A name above the field would make these two
   lines tall, and nothing in the bar would line up.

   The basis is deliberately small, and the growing does the rest. A wrapping flex row does
   not shrink to avoid a break: it fills the line with the items' basis widths and breaks
   as soon as the sum passes the width, shrinking only afterwards, within the line. A
   generous basis therefore sends the last dropdown to a second row on a bar that would
   have fitted — while a small one packs the row and then grows the boxes into whatever
   space the dropdowns leave. */
.navbar-filters .filter-inline {
    display: flex;
    flex: 1 1 7rem;
    align-items: center;
    min-width: 5rem;
    padding: 0 .25rem;
}

/* Without this the input refuses to shrink below its default width and pushes the row. */
.navbar-filters .filter-inline .form-control {
    min-width: 0;
}

.navbar-filters .filter-inline--wide {
    flex: 2 1 10rem;
    min-width: 8rem;
}

.navbar-filters .filter-inline--medium {
    flex: 1 1 7rem;
    min-width: 6rem;
}

/* A box that holds two or three digits. It does not grow: the room the row has left is
   worth more to the fields that hold a name or an address. */
.navbar-filters .filter-inline--narrow {
    flex: 0 1 6rem;
    min-width: 4.5rem;
}

/* The partner picker's dropdown in the bar: a name plus an address needs more room than a
   filter dropdown usually gets, and select2 must not draw itself outside it. */
.navbar-filters .filter-inline__picker {
    min-width: 24rem;
    max-width: 90vw;
}

.navbar-filters .filter-inline__picker .select2-container {
    width: 100% !important;
}

.navbar-filters .filter-inline__picker .select2-container--bootstrap {
    position: relative !important;
    top: 0 !important;
}
