/* =========================
   FK VINČA — BRAND OVERRIDES
   Primary:  #0c4da2
   Accent:   #1191d0
   Gold:     #d2ac67
   ========================= */

:root{
  --fkv-primary: #0c4da2;
  --fkv-accent:  #1191d0;
  --fkv-gold:    #d2ac67;
  --main-color: #0c4da2;
  --fkv-bg:      #ffffff;
  --fkv-text:    #0f172a;

  --fkv-hero-text: #ffffff;
}

/* =========================
   GLOBAL ACCENTS (NO RED)
   ========================= */

.sisf-e-colored,
.sisf-subtitle,
.section-title h5{
  color: var(--fkv-gold) !important;
}

a:hover{
  color: var(--fkv-gold) !important;
}

i.fa,
i.fas,
i.fa-solid,
i.fa-brands{
  color: var(--fkv-gold);
}

/* =========================
   BUTTONS
   ========================= */

.btn-default{
  background: var(--fkv-primary) !important;
  border-color: var(--fkv-primary) !important;
  color: #fff !important;
}

.btn-default:hover{
  background: var(--fkv-gold) !important;
  border-color: var(--fkv-gold) !important;
  color: var(--fkv-primary) !important;
}

/* Outline (ako postoji) */
.btn-default.btn-outline,
.btn-outline{
  background: transparent !important;
  border-color: var(--fkv-gold) !important;
  color: #fff !important;
}
.btn-default.btn-outline:hover,
.btn-outline:hover{
  background: var(--fkv-gold) !important;
  color: var(--fkv-primary) !important;
}

/* =========================
   HEADER OVER HERO
   - Meni ide preko naslovne fotografije
   ========================= */

.header-top{
  display: none !important;
}

#sisf-page-header{
  position: absolute !important;
  top: 0;
  left: 0;
  right: 0;
  z-index: 9999;
}

#sisf-page-header-inner{
  background: transparent !important;
  box-shadow: none !important;
}

#sisf-page-header-inner .container{
  padding-left: 12px;
  padding-right: 12px;
}

/* =========================
   NAV (TOP LEVEL)
   ========================= */

/* Top-level linkovi preko hero slike */
#sisf-page-header .navbar-nav .nav-link,
#sisf-page-header .navbar-nav .nav-link:visited,
#sisf-page-header .navbar-nav .nav-link:focus{
  color: #ffffff !important;
  opacity: 1 !important;
}

#sisf-page-header .navbar-nav .nav-link:hover{
  color: var(--fkv-gold) !important;
}

/* Dropdown ikonice/strelice */
#sisf-page-header .navbar-nav .nav-link i,
#sisf-page-header .navbar-nav .dropdown-toggle::after,
#sisf-page-header .custom-toggle-icon{
  color: #ffffff !important;
}
#sisf-page-header .navbar-nav .nav-link:hover i,
#sisf-page-header .navbar-nav .nav-link:hover.dropdown-toggle::after{
  color: var(--fkv-gold) !important;
}

/* Active/current (nema crvene) */
#sisf-page-header .navbar-nav .active > .nav-link,
#sisf-page-header .navbar-nav .nav-link.active,
#sisf-page-header .navbar-nav .current-menu-item > a,
#sisf-page-header .navbar-nav .current_page_item > a,
#sisf-page-header .navbar-nav .current > a{
  color: var(--fkv-gold) !important;
}

/* underline/marker ako postoji */
#sisf-page-header .navbar-nav .active > .nav-link::before,
#sisf-page-header .navbar-nav .nav-link.active::before,
#sisf-page-header .navbar-nav .current-menu-item > a::before,
#sisf-page-header .navbar-nav .current_page_item > a::before{
  background: var(--fkv-gold) !important;
}

/* =========================
   DROPDOWN MENU (SUB-MENU)
   Problem koji vidiš: dropdown je beo, a linkovi su ostali beli.
   Ovo ga popravlja.
   ========================= */

#sisf-page-header .navbar-nav .sub-menu,
#sisf-page-header .navbar-nav .dropdown-menu{
  background: #ffffff !important;
  border-top: 3px solid var(--fkv-gold) !important;
}

/* Linkovi unutar dropdown-a moraju biti tamni */
#sisf-page-header .navbar-nav .sub-menu a,
#sisf-page-header .navbar-nav .dropdown-menu a{
  color: var(--fkv-primary) !important;
}

#sisf-page-header .navbar-nav .sub-menu a:hover,
#sisf-page-header .navbar-nav .dropdown-menu a:hover{
  color: var(--fkv-gold) !important;
}

/* =========================
   HEADER CTA BUTTON (JOIN US)
   ========================= */

.header-btn .btn-default{
  background: var(--fkv-primary) !important;
  border-color: var(--fkv-primary) !important;
  color: #fff !important;
}
.header-btn .btn-default:hover{
  background: var(--fkv-gold) !important;
  border-color: var(--fkv-gold) !important;
  color: var(--fkv-primary) !important;
}

/* =========================
   STICKY HEADER (kad skroluješ)
   ========================= */

.header-sticky.is-sticky #sisf-page-header-inner,
.header-sticky .is-sticky #sisf-page-header-inner,
.sisf-main-header.sisf-header--sticky #sisf-page-header-inner{
  background: rgba(255,255,255,0.96) !important;
  box-shadow: 0 8px 24px rgba(0,0,0,0.08) !important;
}

.header-sticky.is-sticky #sisf-page-header .navbar-nav .nav-link,
.header-sticky .is-sticky #sisf-page-header .navbar-nav .nav-link,
.sisf-main-header.sisf-header--sticky #sisf-page-header .navbar-nav .nav-link{
  color: var(--fkv-primary) !important;
}

.header-sticky.is-sticky #sisf-page-header .navbar-nav .nav-link:hover,
.header-sticky .is-sticky #sisf-page-header .navbar-nav .nav-link:hover,
.sisf-main-header.sisf-header--sticky #sisf-page-header .navbar-nav .nav-link:hover{
  color: var(--fkv-gold) !important;
}

/* =========================
   HERO TEXT READABILITY
   ========================= */

.hero .section-title h1,
.hero .section-title h2,
.hero .section-title h3,
.hero .section-title p,
.hero .sisf-list-item-text span.text-white{
  color: var(--fkv-hero-text) !important;
}

.hero .sisf-list-item-text .sisf-e-colored i{
  color: var(--fkv-gold) !important;
}

/* Ako želiš “jedna slika” vibe: sakrij pagination */
.hero-pagination{
  display: none !important;
}

/* =========================
   HERO PLAYER: da "izađe" iz donjeg layer-a
   ========================= */

/* 1) dozvoli da element sme da pređe granice hero-a */
.hero,
.hero-slider,
.hero-slider-layout,
.hero .swiper,
.hero .swiper-wrapper,
.hero .swiper-slide,
.hero-slide,
.hero-content {
  overflow: visible !important;
}

/* 2) spusti igrača i da bude iznad svega */
.hero .sisf-player-image{
  position: relative;
  z-index: 20;
  transform: translateY(70px); /* povećaj/smanji po ukusu */
}

/* 3) da ne odseče na mobilnom, dodaj malo prostora dole u hero */
.hero{
  padding-bottom: 90px; /* prati translateY da ne “seče” */
}

/* 4) “ground shadow” ispod igrača (da ne lebdi) */
.hero .sisf-player-image::after{
  content: "";
  position: absolute;
  left: 50%;
  bottom: 25px; /* prati pomeraj */
  width: 320px;
  height: 60px;
  transform: translateX(-50%);
  background: radial-gradient(ellipse at center, rgba(0,0,0,0.35) 0%, rgba(0,0,0,0) 70%);
  filter: blur(2px);
  z-index: -1;
  pointer-events: none;
}
/* ===== NAV: fix dropdown positioning ===== */
#sisf-page-header .navbar-nav { 
  gap: 6px; 
  align-items: center;
}

#sisf-page-header .navbar-nav > .nav-item {
  position: relative;
}

/* dropdown container */
#sisf-page-header .navbar-nav > .nav-item.submenu > .sub-menu {
  position: absolute !important;
  top: calc(100% + 14px) !important;
  left: 0 !important;
  right: auto !important;
  width: max-content;
  min-width: 240px;

  display: none;
  padding: 10px 0;
  margin: 0;
  z-index: 9999;

  background: rgba(10, 16, 22, 0.92);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 14px;
  box-shadow: 0 18px 40px rgba(0,0,0,0.35);
  backdrop-filter: blur(10px);
}

/* show on hover */
#sisf-page-header .navbar-nav > .nav-item.submenu:hover > .sub-menu {
  display: block;
}

#sisf-page-header .navbar-nav > .nav-item.submenu > .sub-menu .nav-link {
  padding: 10px 16px;
  white-space: nowrap;
}

/* chevron spacing */
#sisf-page-header .custom-toggle-icon {
  font-size: 0.75rem;
  opacity: 0.8;
  margin-left: 6px;
  padding-left: 0 !important;
  padding-right: 0 !important;
}
/* ===== HERO: improve readability ===== */
.hero-slide {
  position: relative;
}

.hero-slide::before {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    90deg,
    rgba(0,0,0,0.68) 0%,
    rgba(0,0,0,0.40) 45%,
    rgba(0,0,0,0.15) 70%,
    rgba(0,0,0,0.00) 100%
  );
  z-index: 1;
}

.hero-slide .container {
  position: relative;
  z-index: 2;
}

/* title tuning */
.fkv-hero-title {
  line-height: 1.02;
  letter-spacing: -0.02em;
  text-shadow: 0 10px 28px rgba(0,0,0,0.55);
}

.fkv-comma { 
  display: inline-block; 
}
/* Header CTA */
#sisf-page-header .header-btn .btn-default {
  border-radius: 14px;
  padding: 14px 18px;
}
/* ===== NAV: stop lomljenje po slovima ===== */
#sisf-page-header .navbar-nav .nav-link{
  word-break: normal !important;
  overflow-wrap: normal !important;
  white-space: normal !important;
  line-height: 1.15;
}

/* ===== NAV: da stavke ne budu preuske ===== */
#sisf-page-header .nav-menu-wrapper{
  min-width: 0;
}

#sisf-page-header .navbar-nav{
  display: flex;
  align-items: center;
  gap: 6px;
}

/* ===== NAV: kontrola širine samo za duže stavke (submenu) ===== */
#sisf-page-header .navbar-nav > .nav-item.submenu > .nav-link{
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;              /* dozvoli prelazak u novi red */
  max-width: 150px;             /* ovde dobijaš 2 reda umesto 5 */
}

/* ikonica da ostane uz tekst (ne da beži u novi red) */
#sisf-page-header .navbar-nav > .nav-item.submenu > .nav-link i{
  flex: 0 0 auto;
  margin-left: 6px;
}
/* ===== HERO: da tekst ne uleće ispod headera ===== */
.hero-slide .container{
  padding-top: 130px;  /* povećaj/smanji (110–150) po ukusu */
}
.hero .hero-content{
  max-width: 720px;
}

.fkv-hero-title{
  margin-top: 8px;
  line-height: 1.02;
}
/* ===== NAV: uniforman izgled (1 red, chevron inline) ===== */
#sisf-page-header .navbar-nav{
  align-items: center;
  gap: 18px; /* malo više vazduha */
}

#sisf-page-header .navbar-nav .nav-link{
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px;
  white-space: nowrap !important;     /* nema lomljenja */
  line-height: 1 !important;
  padding: 10px 0 !important;         /* manje “debljine” */
}

/* Sredi chevron da ne pada ispod */
#sisf-page-header .custom-toggle-icon,
#sisf-page-header .navbar-nav .nav-link i.fas,
#sisf-page-header .navbar-nav .nav-link i.fa-chevron-down{
  display: inline-block !important;
  position: static !important;
  transform: translateY(1px);
  margin: 0 !important;
  padding: 0 !important;
  opacity: .85;
}

/* Ako ti je “Омладинска школа” predugačka, malo je “spusti” u širinu */
#sisf-page-header .navbar-nav > .nav-item.submenu > .nav-link{
  font-size: 14px;      /* po potrebi 13px */
  letter-spacing: .02em;
}
/* samo za taj menu item */
#sisf-page-header .navbar-nav .nav-omladinska > .nav-link{
  display: flex;
  align-items: center;
  gap: 8px;
  white-space: nowrap; /* da ikonica ne ode u novi red */
}

/* 2 reda fiksno (ne zavisi od širine ekrana) */
#sisf-page-header .navbar-nav .nav-omladinska .nav-2line{
  display: flex;
  flex-direction: column;
  line-height: 1.05;
  text-align: center;
}

/* da oba reda budu iste “težine” i da ne šeta visina */
#sisf-page-header .navbar-nav .nav-omladinska .nav-2line span{
  display: block;
}

/* malo zategni ikonicu da stoji optički dobro */
#sisf-page-header .navbar-nav .nav-omladinska .custom-toggle-icon{
  margin-left: 2px;
  transform: translateY(1px);
}
/* =========================
   FK VINČA BADGE (zamena za 200+ COACHES)
   Dodaj ovo na kraj fkvinca-overrides.css
   ========================= */

.fkv-club-badge{
  width:180px;
  height:180px;
  display:grid;
  place-items:center;
}

.fkv-badge{
  width:180px;
  height:180px;
}

/* rotira se samo tekst */
.fkv-badge-ring{
  transform-origin: 110px 110px;
  animation: badgeRotate 14s linear infinite;
}

@keyframes badgeRotate{
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}

/* veći, čitljiviji tekst */
.fkv-badge-text{
  fill: var(--fkv-primary);
  font-size: 14px;         /* veće */
  font-weight: 800;
  letter-spacing: 0.6px;   /* manje = lepše na krugu */
  font-family: 'Montserrat', sans-serif;
}

/* grb bez diska, ali sa blagom senkom da se “odvoji” */
.fkv-center-logo{
  filter: drop-shadow(0 10px 14px rgba(0,0,0,.18));
}

/* VINČA DANAS - sitni UI detalji */
.fkv-vinca-today .fkv-kicker{
  display: inline-block;
  font-size: 12px;
  font-weight: 800;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: rgba(255,255,255,.82);
  margin-bottom: 10px;
}

/* mini points (3 kratke oznake) */
.fkv-vinca-today .fkv-mini-points{
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
}

.fkv-vinca-today .fkv-mini-points span{
  font-size: 12px;
  font-weight: 700;
  color: rgba(255,255,255,.9);
  background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.16);
  padding: 6px 10px;
  border-radius: 999px;
}

/* malo bolji title wrapping na 3. kartici */
.fkv-vinca-today .sisf-e-title span{
  display: inline-block;
  line-height: 1.2;
}