/* ============================================================================
   Module: Facet panel (_FacetPanel.cshtml)
   ----------------------------------------------------------------------------
   Faceted navigation (levo) — aktivni čipovi + grupe sa relativnom „magnitudom"
   trakom; klik = nova pretraga (toggle filter). Flat grupe + TreeView (Deskriptori).
   Dinamička širina trake (width:@Pct%) ostaje inline u partialu (server vrednost).
   JS toggle (Prikaži još / razgranavanje stabla) je u wwwroot/js/facet-panel.js.
   Učitava se na search stranicama koje uključuju _FacetPanel.
   ============================================================================ */

.fct { font-size: .82rem; }

.fct__active {
    margin-bottom: 1rem;
    padding-bottom: .85rem;
    border-bottom: 1px solid var(--c-border);
}
.fct__active-head {
    font-size: .72rem;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: var(--c-text-muted);
    font-weight: 700;
    margin-bottom: .45rem;
}
.fct__active-chips { display: flex; flex-wrap: wrap; gap: .35rem; }

.fct__chip {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
    padding: 3px 8px;
    border-radius: 999px;
    font-size: .76rem;
    color: var(--c-brand-strong);
    background: var(--c-pill-brand-bg); /* rgba(37,99,235,.08) — brend pill tinta */
    border: 1px solid var(--c-brand-200);
    text-decoration: none;
}
.fct__chip:hover { background: rgba(37, 99, 235, .16); text-decoration: none; }
.fct__chip-x { font-size: .95rem; line-height: 1; opacity: .7; }

.fct__group { margin-bottom: 1.15rem; }
.fct__group-title {
    font-size: .72rem;
    text-transform: uppercase;
    letter-spacing: .05em;
    color: var(--c-text-muted);
    font-weight: 700;
    margin-bottom: .4rem;
}
.fct__values { list-style: none; margin: 0; padding: 0; }
.fct__value--hidden { display: none; }
.fct__group.is-expanded .fct__value--hidden { display: block; }

.fct__link {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    padding: 3px 6px;
    border-radius: 7px;
    color: var(--c-text);
    text-decoration: none;
    line-height: 1.4;
}
.fct__link:hover { background: rgba(15, 23, 42, .05); text-decoration: none; }
.fct__link.is-active {
    background: var(--c-brand-tint); /* rgba(37,99,235,.10) */
    color: var(--c-brand-strong);
    font-weight: 600;
}
.fct__val {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    flex: 1 1 auto;
    min-width: 0;
}

/* Relativna traka „malo/puno" umesto sirovog broja */
.fct__bar {
    flex: 0 0 auto;
    width: 38px;
    height: 5px;
    border-radius: 3px;
    background: var(--c-border);
    overflow: hidden;
    align-self: center;
}
.fct__bar-fill { display: block; height: 100%; background: var(--c-brand); opacity: .5; border-radius: 3px; }
.fct__link:hover .fct__bar-fill { opacity: .7; }
.fct__link.is-active .fct__bar-fill { opacity: .95; }

.fct__more {
    margin-top: .2rem;
    padding: 2px 6px;
    font-size: .76rem;
    font-weight: 500;
    color: var(--c-brand);
    background: none;
    border: 0;
    cursor: pointer;
}
.fct__more:hover { text-decoration: underline; }
.fct__empty { color: var(--c-text-muted); font-size: .8rem; }

/* TreeView (Deskriptori) */
.fct__tree,
.fct__tchildren { list-style: none; margin: 0; padding: 0; }
.fct__tchildren {
    margin-left: .5rem;
    padding-left: .4rem;
    border-left: 1px solid var(--c-border);
    display: none;
}
.fct__tnode.is-open > .fct__tchildren { display: block; }
.fct__trow { display: flex; align-items: center; gap: .1rem; }
.fct__trow .fct__link { flex: 1 1 auto; min-width: 0; }
.fct__tcaret {
    flex: 0 0 auto;
    width: 16px;
    height: 20px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    background: none;
    border: 0;
    padding: 0;
    cursor: pointer;
    color: var(--c-text-muted);
}
.fct__tcaret svg { width: 11px; height: 11px; transition: transform .12s ease; }
.fct__tnode.is-open > .fct__trow > .fct__tcaret svg { transform: rotate(90deg); }
.fct__tcaret--leaf { cursor: default; }