/* ═══════════════════════════════════════════════════════════════════════════
   InvestConnect — Finder utility layer (reduced, 2026-09-23)
   ───────────────────────────────────────────────────────────────────────────
   Stranice su pisane u Finderovom markapu (Bootstrap 5 + `hover-effect-*`,
   `fs-*`, `fi-*`). Od 23. 9. 2026. izgled komponenti daje dizajn-sistem:

       assets/theme/tokens.css   ← svi tokeni (boje, tipografija, razmaci…)
       assets/theme/ic.css       ← komponente na tokenima (učitava se POSLIJE ovog)

   Ovdje su ostale samo Finderove pomoćne klase koje ic.css ne definiše:
   veličine teksta, z-index, hover/animate efekti i shim za ikone. Ništa u
   ovom fajlu ne boji komponente — nema hex vrijednosti, nema komponenti.

   Redoslijed učitavanja: bootstrap.min.css → tokens.css → finder.css → ic.css
   ═══════════════════════════════════════════════════════════════════════════ */

/* ── Finderove veličine teksta i z-index (Bootstrap ih nema) ──────────── */
.fs-xs{font-size:var(--ic-fs-micro)!important}
.fs-sm{font-size:var(--ic-fs-small)!important}
.fs-base{font-size:var(--ic-fs-body)!important}
.fs-lg{font-size:var(--ic-fs-lead)!important}
.fs-xl{font-size:1.25rem!important}
.z-sticky{z-index:var(--ic-z-sticky)!important}
.z-fixed{z-index:var(--ic-z-header)!important}
.tabular-nums{font-variant-numeric:tabular-nums}

/* ── Finderovi efekti ─────────────────────────────────────────────────── */
.hover-effect-underline:hover{text-decoration:underline!important;text-decoration-thickness:1px!important;text-underline-offset:.2em}
.hover-effect-scale{--fn-transition-duration:var(--ic-dur-4);--fn-transform-scale:1.04}
.hover-effect-scale .hover-effect-target{transition:transform var(--fn-transition-duration) var(--ic-ease-out)}
.hover-effect-scale:hover .hover-effect-target,
.hover-effect-scale:focus-visible .hover-effect-target,
.hover-effect-scale:focus-within .hover-effect-target{transform:scale(var(--fn-transform-scale))}
.hover-effect-opacity{--fn-transition-duration:var(--ic-dur-3)}
.hover-effect-opacity .hover-effect-target{transition:opacity var(--fn-transition-duration) var(--ic-ease-out),visibility var(--fn-transition-duration) var(--ic-ease-out)}
.hover-effect-opacity:hover .hover-effect-target.opacity-0,
.hover-effect-opacity:focus-visible .hover-effect-target.opacity-0,
.hover-effect-opacity:focus-within .hover-effect-target.opacity-0{opacity:1!important;visibility:visible!important}

.animate-slide-end,.animate-slide-start,.animate-slide-up,.animate-slide-down{overflow:hidden}
.animate-slide-end:hover .animate-target{animation:fn-slide-end var(--ic-dur-3) forwards}
.animate-slide-start:hover .animate-target{animation:fn-slide-start var(--ic-dur-3) forwards}
.animate-slide-up:hover .animate-target{animation:fn-slide-up var(--ic-dur-3) forwards}
.animate-scale:hover .animate-target{animation:fn-scale var(--ic-dur-4) var(--ic-ease-out)}
.animate-rotate:hover .animate-target{animation:fn-rotate var(--ic-dur-4) var(--ic-ease-out)}
.animate-pulse:hover .animate-target{animation:fn-pulse .9s}
@keyframes fn-slide-end{0%{transform:translateX(0)}50%{transform:translateX(120%)}51%{transform:translateX(-120%)}100%{transform:translateX(0)}}
@keyframes fn-slide-start{0%{transform:translateX(0)}50%{transform:translateX(-120%)}51%{transform:translateX(120%)}100%{transform:translateX(0)}}
@keyframes fn-slide-up{0%{transform:translateY(0)}50%{transform:translateY(-120%)}51%{transform:translateY(120%)}100%{transform:translateY(0)}}
@keyframes fn-scale{0%,100%{transform:scale(1)}50%{transform:scale(1.18)}}
@keyframes fn-rotate{0%{transform:rotate(0)}100%{transform:rotate(360deg)}}
@keyframes fn-pulse{0%,100%{transform:scale(1)}30%{transform:scale(1.12)}60%{transform:scale(.96)}}

/* ── ikone: `<i class="fi-*">` popunjava icons.js (Icon.shim) ─────────── */
i[class*="fi-"]{display:inline-flex;align-items:center;justify-content:center;line-height:1;font-style:normal}
i[class*="fi-"] .ic-icon{width:1em;height:1em;display:block}
.ic-icon{display:inline-block;vertical-align:-.16em;flex:none}