/* =========================================================
   BRAND VARS
   ========================================================= */
:root{
  --brand-blue: #095777;
  --brand-blue-light: #4795b3;
  --brand-bordo: #8B1C2D;

  /* NAV dimenzije i underline kontrola */
  --nav-link-h: 100px;          /* visina linka/reda u meniju */
  --nav-pad-x: .45rem;          /* bočni razmak između stavki */
  --nav-underline-h: 3px;       /* debljina underline-a */
  --nav-underline-offset: 12px; /* koliko je linija podignuta od dna */
}

/* =========================================================
   MASTHEAD
   ========================================================= */
.ja-masthead .ja-masthead-detail{
  padding:1rem 0;
  max-width:1000px;
  margin:auto;
}
.ja-masthead.has-bg:before{ background:var(--brand-blue-light); opacity:1; }

/* ujednači – nema pozadinske slike nigde */
.ja-masthead,
.ja-masthead:before,
.t4-masthead,
.t4-masthead:before{
  background-image:none !important;
  background:var(--brand-blue-light) !important;
  opacity:1 !important;
}

/* opis u mastheadu */
.ja-masthead .ja-masthead-detail .ja-masthead-description{
  margin:1rem auto 0;
  color:#fff;
  font-size:1.125rem;
  opacity:.85;
  max-width:600px;
}

/* =========================================================
   TIPOGRAFIJA / LINKOVI
   ========================================================= */
/* h1,h2,h4{ text-transform:uppercase; }  // uključi ako želiš all caps */

a, .btn{
  transition: color .18s ease, background-color .18s ease, border-color .18s ease, box-shadow .18s ease;
}

/* Naslovi vesti – plava, bordo na hover */
.blog .item-title a,
.items-leading .item-title a,
.items-row .item-title a,
article .page-header h2 a{
  color:var(--brand-blue);
  text-decoration:none;
}
.blog .item-title a:hover,
.items-leading .item-title a:hover,
.items-row .item-title a:hover,
article .page-header h2 a:hover{
  color:var(--brand-bordo) !important;
}

/* Modul 'Poslednje vesti' – veličina naslova */
.latestnews .box-content .title a{
  font-size:0.8rem;
  color:var(--heading-color);
  padding:0 0 .6667rem;
}

/* =========================================================
   HEADER / TOPBAR / NAV
   ========================================================= */
.navbar-brand{ display:flex; align-items:center; }
.navbar-brand .logo-img,
.navbar-brand img{ max-height:80px; height:auto !important; width:auto; object-fit:contain; }

.t4-topbar{ background:var(--brand-blue); color:#fff; }
.t4-topbar a{ color:#fff; }

@media (max-width:767.98px){
  .t4-topbar,
  .t4-topbar .section-inner,
  .t4-topbar .t4-row{
    background:var(--brand-blue) !important;
    color:#fff !important;
  }
  .t4-topbar a{ color:#fff !important; }
}

.t4-header{ border-bottom:none; box-shadow:0 2px 8px rgba(0,0,0,.08); }
.mod-finder .auto-suggest,
.finder .auto-suggest{ position:absolute; z-index:1055; }
.t4-header, .t4-navbar, .t4-offcanvas{ overflow:visible; }

/* NAV linkovi (kompaktno + malo veći razmak) */
.t4-megamenu .navbar-nav>li>a,
.t4-megamenu .navbar-nav>li>.nav-link{
  color:var(--mainnav-link-color);
  font-size:.937rem;
  padding:0 var(--nav-pad-x);
  height:var(--nav-link-h);
  line-height:var(--nav-link-h);
  transition:color .15s,background-color .15s,border-color .15s;
  white-space:nowrap;
}

/* hover/active boje teksta */
.t4-megamenu .navbar-nav>li>a:hover,
.t4-megamenu .navbar-nav>li>.nav-link:hover,
.t4-megamenu .navbar-nav>li.active>a,
.t4-megamenu .navbar-nav>li.current>a,
.t4-megamenu .navbar-nav>li.show>.nav-link,
.t4-megamenu .navbar-nav>li>.nav-link:focus{
  color:var(--brand-bordo) !important;
}

/* ==== NAV underline (deblje + bliže tekstu, sa varijablama) ==== */
.t4-megamenu .navbar-nav>li>a,
.t4-megamenu .navbar-nav>li>.nav-link{ position: relative; }

.t4-megamenu .navbar-nav>li>a:before,
.t4-megamenu .navbar-nav>li>.nav-link:before{
  content:"";
  position:absolute;
  left:0; right:0;
  bottom:var(--nav-underline-offset) !important;
  height:var(--nav-underline-h) !important;
  background:var(--brand-bordo) !important;
  border-radius:2px;
  transform:scaleX(0);
  transform-origin:center;
  transition:transform .22s ease;
  opacity:1;
}
.t4-megamenu .navbar-nav>li>a:hover:before,
.t4-megamenu .navbar-nav>li>.nav-link:hover:before,
.t4-megamenu .navbar-nav>li.active>a:before,
.t4-megamenu .navbar-nav>li.current>a:before,
.t4-megamenu .navbar-nav>li.show>.nav-link:before{
  transform:scaleX(1);
}

/* Ikonice uz tekst (poravnanje) */
.t4-megamenu .navbar-nav > li > a i.fa,
.t4-megamenu .navbar-nav > li > a i.fas,
.t4-megamenu .navbar-nav > li > a i.far,
.t4-megamenu .navbar-nav > li > a i.fab{
  margin-right:.4rem;
  font-size:16px;
  line-height:1;
  vertical-align:middle;
}

/* ===== HOME kao SAMO IKONA (desktop) =====
   Dodaj klasu "only-icon" na HOME stavku u T4 Megamenu. */
@media (min-width: 992px){
  .t4-megamenu .navbar-nav > li.only-icon > a .menu-title,
  .t4-megamenu .navbar-nav > li.only-icon > a .item-title,
  .t4-megamenu .navbar-nav > li.only-icon > a .title{
    display:none !important;       /* sakrij tekst */
  }

  .t4-megamenu .navbar-nav > li.only-icon > a,
  .t4-megamenu .navbar-nav > li.only-icon > .nav-link{
    font-size:0 !important;        /* fallback kad tema izbaci plain text čvor */
    padding:0 var(--nav-pad-x) !important;
    height:var(--nav-link-h) !important;
    line-height:var(--nav-link-h) !important;
    display:flex !important; align-items:center !important; justify-content:center !important;
  }
  .t4-megamenu .navbar-nav > li.only-icon > a i{
    font-size:20px !important;
    line-height:1 !important;
    margin:0 !important;
    vertical-align:middle;
  }
  .t4-megamenu .navbar-nav > li.only-icon > a.dropdown-toggle::after{
    display:none !important;       /* nema caret strelice */
  }
}

/* =========================================================
   BLOK „Зашто уписати…“  (Module Class Suffix: whyblock)
   ========================================================= */
.whyblock ul{ margin-left:1.2em; }
.whyblock ul li{
  position:relative;
  padding-left:1.1em;
  line-height:1.8;
  margin:.18em 0;
}
.whyblock ul li::before{
  content:"✓";
  position:absolute;
  left:0; top:0;
  color:var(--brand-blue);
  font-weight:700;
}

/* =========================================================
   SMART SEARCH (rezultati)
   ========================================================= */
.finder h1.page-title,
.com_finder h1.page-title{ display:none; }

/* =========================================================
   MOBILE bottom bar + back-to-top
   ========================================================= */
@media (max-width:767.98px){
  body{ padding-bottom:64px; }

  .mbbar{
    position:fixed !important;
    left:0; right:0; bottom:0;
    z-index:99999;
    display:flex; justify-content:space-around; align-items:center;
    background:rgba(9,87,119,.88);
    color:#fff;
    padding:6px 0;
    box-shadow:0 -2px 12px rgba(0,0,0,.15);
    font-size:12px; text-align:center;
    transform:none !important;
  }
  .mbbar .item{ flex:1; color:#fff; text-decoration:none; }
  .mbbar .item i{ display:block; font-size:18px; margin-bottom:2px; }

  .back-to-top, #back-to-top, .t4-backtotop, .ja-backtotop{
    position:fixed; right:12px; bottom:72px; z-index:100010;
  }
}

/* =========================================================
   FOOTER
   ========================================================= */
footer a{ color:var(--brand-blue); text-decoration:none; transition:color .18s; }
footer a:hover{ color:var(--brand-bordo); }
footer .fa, footer .fab, footer .fas{ vertical-align:middle; }

.t4-footer {
  background-color:#073f52;
  border-top:2px solid #073f52;
  border-bottom:12px solid #073f52;
  color: var(--footer-text-color);
}

/* =========================================================
   Responsive heading fine-tune / sitnice
   ========================================================= */
@media (max-width:575.98px){
  h1{ font-size:1.75rem; }   /* ~28px */
  h2{ font-size:1.375rem; }  /* ~22px */
}
#mb-search-overlay{ pointer-events:none; }
body.mb-search-open #mb-search-overlay{ pointer-events:auto; }

/* smanji unutrašnji padding kontejnera */
.t4-main-body { padding-top:2rem; padding-bottom: 4rem }
.row {
  --t4-gutter-x: 2rem;
  --t4-gutter-y: 2rem;
  display: flex; flex-wrap: wrap;
  margin-top: calc(-1 * var(--t4-gutter-y));
  margin-right: calc(-0.5 * var(--t4-gutter-x));
  margin-left: calc(-0.5 * var(--t4-gutter-x));
}

/* pristupačnost */
:focus-visible{ outline:2px solid var(--brand-bordo); outline-offset:2px; }

/* =========================================================
   Article pagination separator – opcioni logo
   ========================================================= */
.com_content .pagenav::before{
  content:"";
  position:absolute; top:50%; left:50%; width:40px; height:40px;
  transform:translate(-50%,-50%);
  background-image:url("/images/logo-content.png") !important;
  background-repeat:no-repeat; background-position:center; background-size:contain;
}
.com_content .pagenav::after{ content:none !important; display:none !important; background-image:none !important; }

/* =========================================================
   Sidebar LINK CARDS (sb-linkcard)
   ========================================================= */
.sb-card.sb-linkcard a{
  color:var(--brand-blue) !important;
  font-weight:600; text-decoration:none;
  transition: color .15s ease, text-decoration-color .15s ease;
}
.sb-card.sb-linkcard a:hover{ color:var(--brand-bordo) !important; text-decoration:underline; }

.sb-card.sb-linkcard{ border-left:4px solid var(--brand-blue) !important; }
.sb-card.sb-linkcard::before{ background:var(--brand-blue) !important; }
.t4-module .sb-card.sb-linkcard::before{ background:var(--brand-blue) !important; }

/* =========================================================
   DJ IMAGE SLIDER – overlay, caption, bulleti, strelice
   ========================================================= */
.djslider, .dj-image-slider, .dj-slideshow{ position:relative; }
.djslider::before, .dj-image-slider::before, .dj-slideshow::before{
  content:""; position:absolute; inset:0; background:rgba(9,87,119,.28);
  pointer-events:none; z-index:1;
}
.djslider .slide-desc, .dj-image-slider .slide-desc, .dj-slideshow .slide-desc{
  position:relative; z-index:2;
  background:rgba(255,255,255,.92); color:#063746;
  border-left:4px solid var(--brand-blue);
  border-radius:10px; padding:10px 12px;
}
.djslider .navigation-container .navigation-numbers span,
.dj-image-slider .navigation-container .navigation-numbers span{
  background:#d2dde1; width:10px; height:10px; border-radius:50%; margin:0 3px;
}
.djslider .navigation-container .navigation-numbers span.active,
.dj-image-slider .navigation-container .navigation-numbers span.active{ background:var(--brand-bordo); }
.djslider .prev, .djslider .next,
.dj-image-slider .prev, .dj-image-slider .next{
  background:rgba(255,255,255,.9); color:var(--brand-blue);
  border-radius:8px; border:1px solid #e5ecef;
  transition:transform .18s ease, box-shadow .18s ease;
}
.djslider .prev:hover, .djslider .next:hover,
.dj-image-slider .prev:hover, .dj-image-slider .next:hover{
  transform:translateY(-1px); box-shadow:0 4px 12px rgba(0,0,0,.12);
}
/* === Mobile Search Overlay (restore) === */
#mb-search-overlay{
  position: fixed;       /* ključ: fiksiraj uz prozor, ne u footeru */
  left: 0; right: 0;
  top: 0;                /* JS će ga pomeriti naniže za visinu headera */
  z-index: 100050;       /* iznad menija, ispod eventualnih modala */
  display: block;        /* kontrolu vidljivosti radimo klasom na body */
  background: #fff;
  box-shadow: 0 8px 24px rgba(0,0,0,.16);
  padding: 12px;
  border-bottom: 1px solid #e5ecef;
  transform: translateY(-150%);      /* skriven po defaultu */
  transition: transform .22s ease;
}

/* kada je otvoren (JS dodaje klasu na body) */
body.mb-search-open #mb-search-overlay{
  transform: translateY(0);
}

/* forma i dugme unutra – malo ulepšavanje */
#mb-search-overlay form{
  display: flex; gap: 8px; align-items: center;
  max-width: 1000px; margin: 0 auto;
}
#mb-search-overlay input[name="q"]{
  flex: 1 1 auto; height: 44px; border:1px solid #d7e2e6; border-radius: 10px;
  padding: 0 12px; font-size: 16px;
}
#mb-search-overlay .go{
  height: 44px; padding: 0 14px; border-radius: 10px; border:1px solid #d7e2e6;
  background: var(--brand-blue,#095777); color:#fff; font-weight:600;
}
#mb-search-overlay .close{
  position:absolute; right:12px; top:12px; width:38px; height:38px;
  border-radius:10px; border:1px solid #d7e2e6; background:#fff;
}
/* 1) Rezerviši prostor desno za X */
#mb-search-overlay{
  padding-right: 64px;   /* bilo je 12px */
}

/* 2) Poravnaj X vertikalno sa formom i skloni ga sa dugmeta */
#mb-search-overlay .close{
  right: 12px;
  top: 50%;
  transform: translateY(-50%);  /* centriraj u odnosu na visinu overlaya */
  z-index: 100051;              /* ostani iznad svega u overlayu */
}

/* 3) (Opciono) sitno udalji submit dugme od desne ivice */
#mb-search-overlay .go{
  margin-right: 8px;
}
