/*!
 * SOKO Header & Navigation – v1.0
 * Astra child: /wp-content/themes/astra-child-4all/assets/css/soko-header.css
 * Fokus: stabilan header, centriran meni, full‑width bijeli pod‑meni (100% širina), 
 * mobilni burger, veliki z-index i bez sečenja.
 */

/* ================= VARIJABLE ================= */
:root{
  --gold: #d4af37;
  --header-max: 1200px;             /* unutrašnji container širina */
  --nav-gap: 28px;                  /* razmak između linkova */
  --logo-max-h: 96px;               /* max visina logo-a desktop */
  --logo-max-h-m: 56px;             /* max visina logo-a mob */
}

/* =============== HARSH RESET ZA HEADER OKRUŽENJE =============== */
html, body{ margin:0; padding:0; }
.site-header{ top:0; }
.elementor-location-header + *,
header.site-header + *{
  margin-top:0 !important;
  padding-top:0 !important;
}

/* =============== HEADER KORE (desktop & mobile) =============== */
header.site-header{
  position: relative !important;
  width: 100% !important;
  background: #000 !important;
  z-index: 9999 !important;
  overflow: visible !important; /* da dropdown ne bude isečen */
  border: 0 !important;
  box-shadow: none !important;
}

/* Unutrašnji glavni wrap (ako postoji) */
header.site-header .site-header__main{
  width: 100%;
  margin: 0 auto;
  padding: 8px 16px 0; /* gornji mali “air” */
  box-sizing: border-box;
  overflow: visible !important;
}

/* Sekcija branding (logo red) */
header.site-header .site-header__section--branding{
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;    /* logo u centru */
  padding: 6px 0 4px !important;
  min-height: calc(var(--logo-max-h) + 16px) !important;
  background: #000 !important;
  border: 0 !important; box-shadow: none !important;
}

/* Link oko logo-a */
header.site-header .brand-link{ display:inline-block !important; line-height:0 !important; }
header.site-header img.custom-logo,
header.site-header .site-branding img,
header.site-header .custom-logo{
  display:block !important;
  height:auto !important;
  width:auto !important;
  max-height: var(--logo-max-h) !important;
  object-fit: contain !important;
  margin: 0 auto !important;
}

/* Sekcija navigacija (meni red) */
header.site-header .site-header__section--nav{
  position: relative !important;
  background: #000 !important;
  border-top: 1px solid rgba(255,255,255,.06) !important;
  border-bottom: 1px solid rgba(255,255,255,.06) !important;
  margin-top: 6px !important;
  padding: 0 !important;
  overflow: visible !important;
}

/* Glavni nav kontejner */
header.site-header .site-header__section--nav > nav.main-nav,
nav.main-nav.primary-menu,
#menu_wrapper,
.main-nav{
  position: static !important;
  top:auto !important; left:auto !important; right:auto !important;
  transform:none !important; margin:0 auto !important;
  width: min(var(--header-max), 96vw);
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;      /* meni centar */
  gap: var(--nav-gap);
  padding: 10px 0 !important;
}

/* UL / LI reset */
.main-nav > ul,
#menu_wrapper > ul,
.primary-menu{
  display:flex; gap: var(--nav-gap);
  list-style:none; padding:0; margin:0;
}
.main-nav > ul > li,
#menu_wrapper > ul > li,
.primary-menu > li{
  position: relative; /* za sub */
}

/* Linkovi 1. nivo */
.menu-ref__link,
.main-nav > ul > li > a,
#menu_wrapper > ul > li > a,
.primary-menu > li > a{
  display:inline-block; text-decoration:none;
  color:#fff !important;
  font-weight:700; text-transform:uppercase; letter-spacing:.04em;
  padding: 10px 12px;
}
.menu-ref__link:hover,
.main-nav > ul > li > a:hover,
#menu_wrapper > ul > li > a:hover,
.primary-menu > li > a:hover{ text-decoration: underline; }

/* =============== SUB-MENI (desktop >=1025px) =============== */
/* Konvencija: .menu-ref je parent stavka, .menu-ref__content je panel, .menu--lvl-2 unutra */
@media (min-width:1025px){
  .menu-ref{ position: static !important; } /* nav će biti referenca za full width */

  /* FULL-WIDTH BIJELO PLATNO od ivice do ivice */
  .menu-ref__content{
    position: absolute !important;
    left: 50% !important;
    transform: translateX(-50%) translateY(6px) !important;
    top: calc(100% + 6px) !important; /* ispod trake menija */
    width: 100vw !important;          /* edge-to-edge */
    max-width: 100vw !important;
    background: #fff !important;
    border-top: 1px solid rgba(0,0,0,.06) !important;
    box-shadow: 0 18px 40px rgba(0,0,0,.16) !important;
    padding: 16px 0 !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transition: opacity .18s ease, transform .18s ease, visibility 0s linear .18s !important;
    z-index: 10000 !important;
  }

  /* Prikaz na hover/focus */
  .menu-ref.menu-ref--has-children:hover > .menu-ref__content,
  .menu-ref.menu-ref--has-children:focus-within > .menu-ref__content{
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translateX(-50%) translateY(0) !important;
  }

  /* Unutrašnji container – centriran sadržaj */
  .menu-ref__content .menu--lvl-2{
    width: min(var(--header-max), 96vw) !important;
    margin: 0 auto !important;
    display: grid !important;
    grid-template-columns: repeat(4, minmax(0,1fr)) !important;
    gap: 16px 20px !important;
    list-style: none !important;
    padding: 0 16px !important;
  }

  .menu--lvl-3{ list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:8px; }
  .menu__item--image img{ width:100%; height:auto; display:block; border-radius:8px; }
  .menu__item--link a{ display:block; color:#111; text-decoration:none; font-weight:700; }
  .menu__item--link a:hover{ color: var(--gold); text-decoration: underline; }
}

/* =============== SUB-MENI (mobile <=1024px) =============== */
@media (max-width:1024px){
  /* burger dugme (ako koristiš .gnav-util__icon) – gore desno */
  .gnav-util__icon{
    position:absolute !important; top:10px !important; right:12px !important;
    display:inline-flex !important; align-items:center; gap:6px; color:#fff;
    z-index: 10001;
  }

  /* Nav panel zatvoren/otvoren */
  nav.main-nav{
    display:none; opacity:0; visibility:hidden; max-height:0; overflow:hidden;
    transform: translateY(-8px);
    transition: transform .25s, opacity .2s, max-height .25s;
    width: 100%;
  }
  nav.main-nav.is-open{
    display:block; opacity:1; visibility:visible; max-height:80vh; overflow:auto; transform:none;
  }

  /* Submeni kao običan blok, bez full-width */
  .menu-ref__content{
    position: static !important;
    transform: none !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 10px 0 !important;
    background: #111 !important;   /* prijatna tamna unutra; promeni po želji */
    box-shadow: none !important; border: 0 !important;
    opacity: 1 !important; visibility: visible !important; pointer-events: auto !important;
    display: none !important;
  }
  .menu-ref.menu-ref--open > .menu-ref__content{ display:block !important; }
  .menu-ref__content .menu--lvl-2{ grid-template-columns: 1fr !important; gap: 10px !important; width:100% !important; padding:0 12px !important; }
  .menu__item--link a{ color:#fff !important; }
  .menu__item--link a:hover{ color:var(--gold) !important; }
}

/* =============== ASTRA SPECIFIČNO =============== */
.ast-primary-header-bar .ast-container,
.site-header .ast-container{ padding-right: 0 !important; padding-left: 0 !important; }

/* Zadrži logo mjeru i u sticky stanju */
.ast-sticky-active .site-branding img,
.ast-sticky-active .site-logo-img img,
.ast-sticky-active .custom-logo{
  max-height: var(--logo-max-h) !important;
  height:auto !important; width:auto !important;
}

/* =============== MOBILE TWEAKS =============== */
@media (max-width: 991.98px){
  header.site-header .site-header__main{ padding: 8px 12px 0; }
  header.site-header .site-header__section--branding{ min-height: calc(var(--logo-max-h-m) + 16px) !important; }
  header.site-header img.custom-logo,
  header.site-header .site-branding img,
  header.site-header .custom-logo{ max-height: var(--logo-max-h-m) !important; }

  /* poravnaj meni linkove kad se otvori panel */
  nav.main-nav > ul{ flex-direction:column; gap:8px; align-items:stretch; }
  nav.main-nav > ul > li > a{ padding:12px 10px; }
}

/* =============== BOJE LINKOVA U POD-MENIJU (desktop) =============== */
@media (min-width:1025px){
  .menu-ref__content .menu--lvl-3 .menu__item.menu__item--link > a,
  .menu-ref__content .menu--lvl-3 .menu__item.menu__item--link > a b{
    color:#111 !important;
  }
  .menu-ref__content .menu--lvl-3 .menu__item.menu__item--link > a:hover,
  .menu-ref__content .menu--lvl-3 .menu__item.menu__item--link > a:focus,
  .menu-ref__content .menu--lvl-3 .menu__item.menu__item--link > a:hover b,
  .menu-ref__content .menu--lvl-3 .menu__item.menu__item--link > a:focus b{
    color: var(--gold) !important;
  }
}

/* =============== FAILSAFE: skini svako sečenje i digni z-index oko nava =============== */
@media (min-width: 1025px){
  header.site-header,
  header.site-header .site-header__main,
  header.site-header .site-header__section--nav{
    overflow: visible !important;
    position: relative !important;
    z-index: 9999 !important;
  }
}
.p4a-dots{
display: none;
}