/* ===================== AGD NAV — CLEAN BASE ===================== */
:root{
  /* Paleta */
  --agd-bg-0:#18181c;   /* navbar/page */
  --agd-bg-1:#1f1f25;   /* dropdown & panels */
  --agd-bg-2:#23232b;   /* hover/active */
  --agd-bg-3:#2a2d36;   /* nested active */
  --agd-fg:#e9ecf2;
  --agd-accent:#ffb100;

  /* Shared navigation surfaces and states */
  --agd-nav-panel-bg:#191a1f;
  --agd-nav-panel-bg-alt:#202126;
  --agd-nav-row-bg:rgba(255,255,255,.018);
  --agd-nav-row-text:#d5d8df;
  --agd-nav-row-muted:#9da3ae;
  --agd-nav-heading:#f1eadb;
  --agd-nav-accent:var(--agd-accent);
  --agd-nav-panel-border:rgba(255,177,0,.14);
  --agd-nav-divider:rgba(255,177,0,.12);
  --agd-nav-row-hover:rgba(255,177,0,.06);
  --agd-nav-row-active:rgba(255,177,0,.09);
  --agd-nav-focus:rgba(255,177,0,.72);
  --agd-nav-panel-radius:10px;
  --agd-nav-row-radius:7px;
  --agd-nav-row-height:48px;
  --agd-nav-row-gap:6px;
  --agd-nav-panel-padding:10px;

  /* Layout / motion */
  --panel-w:320px;                                 /* UJEDNAÄŒENA ?irina svih panela */
  --panel-h:clamp(360px, 68vh, 520px);             /* UJEDNAÄŒENA visina svih panela */
  --panel-head-h:46px;
  --radius:12px;
  --dur:.18s;
  --shadow-lg:0 10px 32px rgba(0,0,0,.70);
  --shadow-nav:0 3px 18px rgba(0,0,0,.16);
  --z-nav:200;
  --z-menu:1000;
}

/* NAVBAR */
.navbar{
  background:var(--agd-bg-0);
  font-family:"Satoshi","Plus Jakarta Sans","Segoe UI Variable","Segoe UI","Helvetica Neue",Arial,sans-serif;
  box-shadow:var(--shadow-nav);
  z-index:var(--z-nav);
  font-size:1.12rem;
  border-bottom:1px solid rgba(255,255,255,.07);
  transition:background-color var(--dur), border-color var(--dur), box-shadow var(--dur);
}
.navbar.is-away-from-top{
  background-color:rgba(24,24,28,.98) !important;
  border-bottom-color:rgba(255,177,0,.1);
  box-shadow:0 8px 24px rgba(0,0,0,.2);
}
.navbar .container-fluid{ max-width:1480px; margin:0 auto; width:100%; padding:0 36px; box-sizing:border-box; }
@media (min-width:1400px){ .navbar .container-fluid{ max-width:1320px; padding:0 32px; } }

/* RESPONSIVE MODE AUTHORITY */
.nav-mobile,
.nav-compact,
.nav-wide,
.nav-below-wide{
  display:none !important;
}

@media (max-width:767.98px){
  .navbar .container-fluid{ padding-inline:8px !important; }
  .nav-mobile{
    display:grid !important;
    grid-template-columns:minmax(0, 1fr);
    gap:6px;
    padding-block:4px !important;
    transition:gap var(--dur), padding var(--dur);
  }
  .nav-mobile-top{
    display:grid;
    grid-template-columns:96px minmax(0, 1fr) 96px;
    align-items:center;
  }
  .nav-mobile-top > .navbar-toggler,
  .nav-mobile-actions > .nav-link{
    width:96px;
    min-width:96px;
    height:48px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:.45rem;
    white-space:nowrap;
  }
  .nav-mobile-top > .navbar-toggler .navbar-toggler-icon,
  .nav-mobile-top > .navbar-toggler:hover .navbar-toggler-icon,
  .nav-mobile-top > .navbar-toggler:focus-visible .navbar-toggler-icon,
  .nav-mobile-top > .navbar-toggler[aria-expanded="true"] .navbar-toggler-icon{
    width:1.2rem;
    height:1.2rem;
    flex:0 0 1.2rem;
    background-size:100% 100%;
    filter:brightness(0) saturate(100%) invert(77%) sepia(92%) saturate(1623%) hue-rotate(359deg) brightness(103%) contrast(105%);
  }
  .nav-mobile-menu-label,
  .nav-mobile-cart-label{
    color:var(--agd-accent);
    font-size:.94rem;
    font-weight:680;
    line-height:1;
  }
  .nav-mobile-actions i{
    color:var(--agd-accent);
    font-size:1.25rem;
  }
  .nav-mobile-top > .navbar-brand{
    margin:0;
    min-width:0;
    color:#3194ff !important;
    font-size:clamp(1.45rem, 1vw + 1.25rem, 1.6rem) !important;
    font-weight:760;
    line-height:1;
  }
  .nav-mobile-actions{ display:flex; justify-content:flex-end; }
  .nav-mobile-top > .navbar-toggler,
  .nav-mobile-actions > .nav-link{
    border-radius:8px;
    transition:background-color var(--dur), color var(--dur);
  }
  .nav-mobile-top > .navbar-toggler:hover,
  .nav-mobile-top > .navbar-toggler:focus-visible,
  .nav-mobile-actions > .nav-link:hover,
  .nav-mobile-actions > .nav-link:focus-visible{ background:rgba(255,255,255,.06); }
  .nav-mobile-search,
  .nav-mobile-search .search-form,
  .nav-mobile-search .input-group{ width:100%; min-width:0; }
  .nav-mobile-search .form-control,
  .nav-mobile-search .input-group-text{
    height:42px;
    transition:height var(--dur);
  }
  .nav-mobile-search .agd-search-icon{
    width:44px;
    flex:0 0 44px;
    border-right:0;
  }
  .nav-mobile-search .agd-search-group{
    height:52px;
    padding:4px 4px 4px 0;
    align-items:center;
    background:#202227;
    border:1px solid rgba(255,255,255,.12);
    border-radius:11px;
    overflow:visible;
    transition:height var(--dur), box-shadow var(--dur), border-color var(--dur);
  }
  .navbar .nav-mobile-search .agd-search .btn.btn-primary{
    align-self:center;
    height:42px;
    margin:0;
    padding-inline:14px;
    border:1px solid #276acb;
    border-radius:8px !important;
    background:#1556b8;
    color:#f4f7fb;
    font-size:.92rem;
    font-weight:700;
    line-height:1;
    transition:height var(--dur), background-color var(--dur), box-shadow var(--dur);
  }
  .navbar .nav-mobile-search .agd-search .btn.btn-primary:hover{
    background:#1c66d2;
    border-color:#347bdc;
  }
  .navbar .nav-mobile-search .agd-search .btn.btn-primary:active{
    background:#104a9e;
    border-color:#225fac;
  }
  .navbar .nav-mobile-search .agd-search .btn.btn-primary:focus-visible{
    background:#1c66d2;
    border-color:#347bdc;
    box-shadow:0 0 0 2px rgba(47,146,255,.28) !important;
  }
  @media (max-width:359.98px){
    .navbar .container-fluid{ padding-inline:6px !important; }
    .nav-mobile-top{ grid-template-columns:88px minmax(0, 1fr) 88px; }
    .nav-mobile-top > .navbar-toggler,
    .nav-mobile-actions > .nav-link{
      width:88px;
      min-width:88px;
      gap:.35rem;
    }
    .nav-mobile-menu-label,
    .nav-mobile-cart-label{ font-size:.9rem; }
    .navbar .nav-mobile-search .agd-search .btn.btn-primary{ padding-inline:12px; }
  }
  .navbar.is-scrolled .nav-mobile{
    gap:4px;
    padding-block:2px !important;
  }
  .navbar.is-scrolled .nav-mobile-search .agd-search-group{ height:50px; }
  .navbar.is-scrolled .nav-mobile-search .form-control,
  .navbar.is-scrolled .nav-mobile-search .input-group-text,
  .navbar.is-scrolled .nav-mobile-search .agd-search .btn.btn-primary{ height:40px; }
  .nav-below-wide{ display:flex !important; }
}

@media (min-width:768px) and (max-width:1279.98px){
  .navbar .container-fluid{
    padding:8px !important;
    transition:padding var(--dur);
  }
  .nav-compact{
    display:grid !important;
    grid-template-columns:64px 96px minmax(0, 1fr) 72px;
    grid-template-areas:"menu brand search actions";
    align-items:center;
    gap:clamp(8px, 1vw, 10px);
    width:min(100%, calc(100vw - 16px)) !important;
    margin-inline:auto;
  }
  .nav-compact-top{ display:contents; }
  .nav-compact-top > .navbar-toggler{
    grid-area:menu;
    width:48px;
    min-width:48px;
    height:48px;
    justify-self:center;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:.45rem;
  }
  .nav-compact-top > .navbar-brand{
    grid-area:brand;
    margin:0;
    padding:.25rem .5rem;
    justify-self:center;
    color:#3194ff !important;
    font-size:clamp(1.55rem, .5vw + 1.3rem, 1.7rem);
    font-weight:760;
    line-height:1;
  }
  .nav-compact-actions{
    grid-area:actions;
    display:flex;
    justify-content:flex-end;
    align-items:center;
    justify-self:center;
    flex:0 0 auto;
  }
  .nav-compact-actions > .nav-link{
    width:48px;
    min-width:48px;
    height:48px;
    flex:0 0 48px;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:.45rem;
    padding:0 !important;
  }
  .nav-compact-menu-label,
  .nav-compact-cart-label{ display:none; }
  .nav-compact-actions i{ color:var(--agd-accent); font-size:1.3rem; }
  .nav-compact-top > .navbar-toggler .navbar-toggler-icon{
    width:1.3rem;
    height:1.3rem;
    background-size:100% 100%;
    filter:invert(77%) sepia(92%) saturate(1623%) hue-rotate(359deg) brightness(103%) contrast(105%);
    transition:filter var(--dur);
  }
  .nav-compact-top > .navbar-toggler:hover .navbar-toggler-icon,
  .nav-compact-top > .navbar-toggler:focus-visible .navbar-toggler-icon,
  .nav-compact-top > .navbar-toggler[aria-expanded="true"] .navbar-toggler-icon{
    filter:invert(39%) sepia(63%) saturate(1515%) hue-rotate(338deg) brightness(91%) contrast(91%);
  }
  .nav-compact-top > .navbar-toggler,
  .nav-compact-actions > .nav-link{
    border-radius:8px;
    transition:background-color var(--dur), color var(--dur);
  }
  .nav-compact-top > .navbar-toggler:hover,
  .nav-compact-top > .navbar-toggler:focus-visible,
  .nav-compact-actions > .nav-link:hover,
  .nav-compact-actions > .nav-link:focus-visible{ background:rgba(255,255,255,.06); }
  .nav-compact-search,
  .nav-compact-search .search-form,
  .nav-compact-search .input-group{ width:100%; min-width:0; }
  .nav-compact-search{
    grid-area:search;
    width:min(100%, 560px);
    max-width:100%;
    justify-self:center;
    margin:0;
  }
  .nav-compact-search .form-control,
  .nav-compact-search .input-group-text{
    height:42px;
    transition:height var(--dur);
  }
  .nav-compact-search .agd-search-icon{ width:52px; flex:0 0 52px; }
  .nav-compact-search .agd-search-group{
    height:52px;
    padding:4px 4px 4px 0;
    align-items:center;
    background:#202227;
    border:1px solid rgba(255,255,255,.12);
    border-radius:11px;
    overflow:visible;
    transition:height var(--dur), box-shadow var(--dur), border-color var(--dur);
  }
  .nav-compact-search .agd-search-icon{ border-right:0; }
  .navbar .nav-compact-search .agd-search .btn.btn-primary{
    align-self:center;
    height:42px;
    margin:0;
    padding-inline:18px;
    border:1px solid #276acb;
    border-radius:8px !important;
    background:#1556b8;
    color:#f4f7fb;
    font-size:.97rem;
    font-weight:700;
    line-height:1;
    transition:height var(--dur), background-color var(--dur), box-shadow var(--dur);
  }
  .navbar .nav-compact-search .agd-search .btn.btn-primary:hover{
    background:#1c66d2;
    border-color:#347bdc;
    color:#f4f7fb;
  }
  .navbar .nav-compact-search .agd-search .btn.btn-primary:active{
    background:#104a9e;
    border-color:#225fac;
    color:#f4f7fb;
  }
  .navbar .nav-compact-search .agd-search .btn.btn-primary:focus-visible{
    background:#1c66d2;
    border-color:#347bdc;
    color:#f4f7fb;
    box-shadow:0 0 0 2px rgba(47,146,255,.28) !important;
  }
  .navbar.is-scrolled .container-fluid{ padding-block:5px !important; }
  .navbar.is-scrolled .nav-compact-search .agd-search-group{
    height:50px;
    padding-block:2px;
  }
  .navbar.is-scrolled .nav-compact-search .form-control,
  .navbar.is-scrolled .nav-compact-search .input-group-text,
  .navbar.is-scrolled .nav-compact-search .agd-search .btn.btn-primary{ height:44px; }
  .nav-below-wide{ display:flex !important; }
}

@media (min-width:900px) and (max-width:1279.98px){
  .navbar .container-fluid{ padding-inline:12px !important; }
  .nav-compact{
    grid-template-columns:minmax(88px, auto) 96px minmax(320px, 1fr) minmax(88px, auto);
    gap:clamp(16px, 2.2vw, 28px);
    width:min(1180px, calc(100vw - 24px)) !important;
  }
  .nav-compact-search{ width:clamp(380px, calc(58vw - 55px), 620px); }
  .nav-compact-top > .navbar-toggler,
  .nav-compact-actions > .nav-link{
    width:auto;
    min-width:88px;
    height:52px;
    flex:0 0 auto;
    padding-inline:.75rem !important;
  }
  .nav-compact-menu-label{
    display:inline;
    color:var(--agd-accent);
    font-size:clamp(.95rem, .2vw + .83rem, 1.02rem);
    font-weight:700;
    line-height:1;
  }
  .nav-compact-cart-label{
    display:inline;
    color:var(--agd-accent);
    font-size:clamp(1.02rem, .16vw + .92rem, 1.08rem);
    font-weight:700;
    line-height:1;
  }
  .nav-compact-actions i{ font-size:1.36rem; }
  .nav-compact-actions .badge-korpa--mobile{ top:-4px; right:-4px; }
  .nav-compact-top > .navbar-brand{ font-size:clamp(1.7rem, .35vw + 1.48rem, 1.8rem); }
}

@media (min-width:1280px){
  .navbar{ min-height:auto; padding-block:0; }
  .navbar .container-fluid{
    max-width:none;
    padding:7px 24px 8px !important;
    transition:padding var(--dur);
  }
  .nav-wide{
    display:grid !important;
    align-items:center;
    width:100%;
    margin-inline:auto;
  }
  .nav-brand{ display:flex; align-items:center; min-width:0; }
  .nav-brand .navbar-brand{
    margin:0;
    padding:.3rem .25rem;
    color:#3194ff !important;
    font-size:clamp(1.9rem, .45vw + 1.55rem, 2.05rem);
    font-weight:780;
    line-height:1;
  }
  .nav-left{
    min-width:0;
    width:100%;
    overflow:visible;
  }
  .nav-left .navbar-nav{
    width:100%;
    flex-wrap:nowrap;
    gap:clamp(.35rem, .55vw, .65rem) !important;
  }
  .nav-left .nav-link{ white-space:nowrap; }
  .nav-middle{
    width:100%;
    overflow:visible;
  }
  .nav-middle .search-form,
  .nav-middle .input-group{ width:100%; min-width:0; }
  .nav-wide .agd-search-group{
    height:56px;
    padding:4px 4px 4px 0;
    align-items:center;
    overflow:visible;
    border:1px solid rgba(255,255,255,.12);
    border-radius:11px;
    background:#202227;
    transition:height var(--dur), box-shadow var(--dur), border-color var(--dur);
  }
  .nav-middle .form-control,
  .nav-middle .input-group-text,
  .nav-middle .btn{
    height:46px;
    transition:height var(--dur);
  }
  .nav-middle .agd-search-icon{
    width:56px;
    flex:0 0 56px;
    border-right:0;
    background:#202227;
    color:var(--agd-accent);
  }
  .navbar .nav-wide .nav-middle .form-control{
    background:transparent !important;
    color:#f1f3f7;
    font-size:1.03rem;
  }
  .navbar .nav-wide .nav-middle .form-control::placeholder{ color:#9da3ae; }
  .navbar .nav-wide .nav-middle .agd-search .btn.btn-primary{
    align-self:center;
    height:46px;
    margin:0;
    padding-inline:20px;
    border:1px solid #276acb;
    border-radius:8px !important;
    background:#1556b8;
    color:#f4f7fb;
    font-size:1rem;
    font-weight:700;
    line-height:1;
    transition:height var(--dur), background-color var(--dur), border-color var(--dur), box-shadow var(--dur);
  }
  .navbar .nav-wide .nav-middle .agd-search .btn.btn-primary:hover{
    border-color:#347bdc;
    background:#1c66d2;
  }
  .navbar .nav-wide .nav-middle .agd-search .btn.btn-primary:active{
    border-color:#225fac;
    background:#104a9e;
  }
  .navbar .nav-wide .nav-middle .agd-search .btn.btn-primary:focus-visible{
    border-color:#347bdc;
    background:#1c66d2;
    box-shadow:0 0 0 2px rgba(47,146,255,.28) !important;
  }
  .nav-wide .agd-search-group:focus-within{ border-radius:11px; }
  .nav-wide .agd-search-group:focus-within .agd-search-icon{ color:var(--agd-accent); }
  .navbar .nav-wide .nav-middle .agd-search-icon i{ font-size:1.25rem; }
  .nav-right{
    display:flex;
    justify-content:flex-end;
    min-width:max-content;
    flex-shrink:0;
    overflow:visible;
  }
  .nav-right .nav-link{
    min-width:96px;
    min-height:56px;
    padding:.55rem .7rem !important;
    flex-shrink:0;
    justify-content:flex-end;
    position:relative;
    overflow:visible;
    color:var(--agd-accent) !important;
    font-size:clamp(1.04rem, .12vw + .95rem, 1.1rem) !important;
    font-weight:650;
    border-radius:8px;
    transition:min-height var(--dur), background-color var(--dur), color var(--dur);
  }
  .nav-right .nav-link:hover,
  .nav-right .nav-link:focus-visible{ background:rgba(255,177,0,.08); color:#ffd36b !important; }
  .nav-right .nav-link i{ font-size:clamp(1.42rem, .18vw + 1.28rem, 1.55rem); }

  .navbar .nav-wide .navbar-nav > .nav-item > .nav-link{
    min-height:48px;
    padding:.62rem clamp(.76rem, .62vw, 1rem) !important;
    color:#f1f3f7 !important;
    font-size:clamp(1.06rem, .16vw + .93rem, 1.12rem);
    font-weight:560;
    transition:min-height var(--dur), padding var(--dur), color .15s, background-color .18s, border-color .18s;
  }
  .navbar .nav-wide .navbar-nav > .nav-item > .nav-link i{
    color:var(--agd-accent);
    font-size:clamp(1.12rem, .16vw + .99rem, 1.22rem);
  }
  .navbar .nav-wide .navbar-nav > .nav-item:first-child > .nav-link{ font-weight:700; }
  .navbar .nav-wide .navbar-nav > .nav-item.show > .nav-link{
    color:#ffd36b !important;
    background:rgba(255,177,0,.1);
  }
  .navbar.is-scrolled .container-fluid{ padding-block:3px 4px !important; }
  .navbar.is-scrolled .nav-wide{ row-gap:3px; }
  .navbar.is-scrolled .nav-wide .agd-search-group{ height:52px; }
  .navbar.is-scrolled .nav-middle .form-control,
  .navbar.is-scrolled .nav-middle .input-group-text,
  .navbar.is-scrolled .nav-middle .agd-search .btn.btn-primary{ height:42px; }
  .navbar.is-scrolled .nav-right .nav-link{ min-height:52px; }
  .navbar.is-scrolled .nav-wide .navbar-nav > .nav-item > .nav-link{
    min-height:44px;
    padding-block:.45rem !important;
  }
}

@media (min-width:1280px) and (max-width:1679.98px){
  .nav-wide{
    --desktop-top-row-inset:clamp(12px, calc((100vw - 1320px) / 2), 60px);
    grid-template-columns:auto clamp(540px, 44vw, 740px) auto;
    grid-template-areas:"brand search actions" "links links links";
    justify-content:center;
    gap:6px 36px;
    width:min(1400px, calc(100vw - 40px));
    max-width:1400px;
    transition:row-gap var(--dur);
  }
  .nav-brand{
    grid-area:brand;
    position:relative;
    left:var(--desktop-top-row-inset);
  }
  .nav-middle{
    grid-area:search;
    min-width:540px;
    max-width:740px;
    justify-self:center;
  }
  .nav-right{
    grid-area:actions;
    justify-self:end;
    position:relative;
    right:var(--desktop-top-row-inset);
  }
  .nav-left{
    grid-area:links;
    width:min(1400px, calc(100vw - 40px));
    justify-self:center;
    border-top:1px solid rgba(255,255,255,.045);
    padding-top:4px;
    transition:padding var(--dur);
  }
  .nav-left .navbar-nav{ justify-content:space-between; }
  .navbar.is-scrolled .nav-left{ padding-top:2px; }
}

@media (min-width:1680px){
  .navbar .container-fluid{ padding-block:11px !important; }
  .nav-wide{
    grid-template-columns:auto auto clamp(430px, 26vw, 580px) auto;
    grid-template-areas:"brand links search actions";
    justify-content:center;
    gap:clamp(22px, 1.4vw, 28px);
    width:min(1800px, calc(100vw - 48px));
    max-width:1800px;
  }
  .nav-brand .navbar-brand{ font-size:clamp(2.05rem, .4vw + 1.63rem, 2.15rem); }
  .nav-brand{ grid-area:brand; }
  .nav-left{ grid-area:links; }
  .nav-left .navbar-nav{
    justify-content:flex-start;
    gap:clamp(20px, 1.35vw, 28px) !important;
  }
  .nav-middle{
    grid-area:search;
    min-width:430px;
    max-width:580px;
  }
  .nav-middle .form-control,
  .nav-middle .input-group-text,
  .nav-middle .btn{ height:46px; }
  .nav-middle .agd-search-icon{ width:56px; flex-basis:56px; }
  .navbar .nav-wide .nav-middle .form-control,
  .navbar .nav-wide .nav-middle .btn{ font-size:1.06rem; }
  .navbar .nav-wide .nav-middle .agd-search-icon i{ font-size:1.3rem; }
  .nav-right{ grid-area:actions; }
  .nav-right .nav-link{ min-height:58px; font-size:1.1rem !important; }
  .nav-right .nav-link i{ font-size:1.55rem; }
  .navbar .nav-wide .navbar-nav > .nav-item > .nav-link{
    min-height:52px;
    padding:.68rem clamp(.68rem, .44vw, .86rem) !important;
    font-size:clamp(1.08rem, .2vw + .88rem, 1.15rem);
  }
  .navbar .nav-wide .navbar-nav > .nav-item > .nav-link i{ font-size:clamp(1.18rem, .15vw + 1.03rem, 1.3rem); }
  .navbar.is-scrolled .container-fluid{ padding-block:8px !important; }
  .navbar.is-scrolled .nav-right .nav-link{ min-height:52px; }
  .navbar.is-scrolled .nav-wide .navbar-nav > .nav-item > .nav-link{ min-height:48px; }
}

/* LINKOVI 1. NIVOA */
.navbar .navbar-nav > .nav-item > .nav-link{
  color:var(--agd-fg) !important; font-weight:600; letter-spacing:0;
  border-radius:8px; padding:.55rem .85rem; font-size:1rem;
  transition:color .15s, background-color .18s, border-color .18s;
}
.navbar .navbar-nav > .nav-item > .nav-link:hover,
.navbar .navbar-nav > .nav-item > .nav-link:focus,
.navbar .navbar-nav > .nav-item > .nav-link.active,
.navbar .navbar-nav > .nav-item.show > .nav-link{
  color:#ffd36b !important;
  background:rgba(255,177,0,.08);
}
.navbar .dropdown-toggle::after{ display:none !important; } /* bez caret-a */

.nav-link-icon{
  display:inline-flex;
  align-items:center;
  gap:.55rem;
}
.nav-link-icon i{
  font-size:1.08rem;
  opacity:1;
}


/* Brand dropdown: keep menu out of layout flow */
.nav-left .nav-item.dropdown{ position:relative; }
.nav-left .nav-item.dropdown .nav-link{
  display:inline-flex; align-items:center; gap:.35rem;
}
.nav-left .nav-item.dropdown .dropdown-menu{
  position:absolute; top:calc(100% + 6px); left:0;
  min-width:180px; margin:0;
}
.nav-left .agd-brand-menu{
  background: var(--agd-bg-1) !important;
  border: 1px solid #2b2d34;
  padding: .35rem;
  border-radius: 12px;
  box-shadow: 0 8px 24px rgba(0,0,0,.55);
  min-width: 200px;
}
.nav-left .agd-brand-menu .dropdown-item{
  color: var(--agd-fg);
  border-radius: 10px;
  padding: .55rem .85rem;
}
.nav-left .agd-brand-menu .dropdown-item:hover,
.nav-left .agd-brand-menu .dropdown-item:focus{
  color: var(--agd-accent);
  background: var(--agd-bg-2);
}


/* ===================== MEGA MENI — LEVA KOLONA ===================== */
.navbar .navbar-nav .nav-item.dropdown{ position:relative; }

/* FIX: leve i desne “prozor?ad” iste su visine, ?ire se bez raspora */
#megaMenuDropdown{
  position:absolute !important;
  top:calc(100% + 6px); left:0;
  z-index:var(--z-menu);
  width:var(--panel-w); height:var(--panel-h);
  background:var(--agd-bg-1);
  border-radius:var(--radius) 0 0 var(--radius);
  padding:0;
  box-shadow:0 8px 24px rgba(0,0,0,.55);
  overflow:visible;                     /* ⬅️ promenjeno */
  border:1px solid #2b2d34;
}

/* Lista kategorija (leva kolona) skroluje unutar fiksne visine */
.lista-kategorija{ max-height:calc(var(--panel-h) - var(--panel-head-h) - 6px); overflow:auto; padding:6px; margin:0; }

/* Stavke kategorija */
.nav-kat-item{ margin-bottom:3px; position:static !important; }
#megaMenuDropdown .nav-kat-item > .dropdown-item{
  display:flex; align-items:center; justify-content:space-between; gap:.75rem;
  width:100%; color:var(--agd-fg) !important; background:transparent !important;
  padding:11px 12px; border-radius:8px; font-weight:500; transition:background var(--dur), color var(--dur);
}
#megaMenuDropdown .nav-kat-item > .dropdown-item:hover{ color:var(--agd-accent) !important; background:var(--agd-bg-2) !important; }
.nav-kat-item .kat-strelica{ display:none; margin-left:auto; color:var(--agd-accent); opacity:.65; transition:transform var(--dur), opacity var(--dur); }
.nav-kat-item.ima-decu .kat-strelica{ display:inline-block; }
.nav-kat-item.open > .dropdown-item .kat-strelica{ opacity:1; transform:translateX(2px); }
.nav-kat-item.open > .dropdown-item{ background:var(--agd-bg-2) !important; color:var(--agd-accent) !important; }

/* ===================== UJEDNAÄŒENI PANELI (desno) ===================== */
.mega-panel{
  position:absolute; top:0; left:100%;                  /* naleže odmah uz levi panel */
  width:var(--panel-w); height:var(--panel-h);
  background:var(--agd-bg-1);
  border-radius:0 var(--radius) var(--radius) 0;         /* samo spoljne ivice zaokružene */
  border-left:1px solid #2b2d34;                         /* “?av” bez razmaka */
  box-shadow:var(--shadow-lg);
  opacity:0; visibility:hidden; transform:translateX(6px);
  transition:opacity var(--dur) ease, transform var(--dur) ease;
  overflow:hidden; z-index:var(--z-menu);
}
.mega-panel.show{ opacity:1; visibility:visible; transform:none; }

/* 3. nivo ide odmah desno od 2. (oba ujednačena) */
.mega-panel.level-2{ left:calc(100% + var(--panel-w)); }

/* Glava panela + skrol */
.mega-panel .panel-head{
  height:var(--panel-head-h);
  display:flex; align-items:center; justify-content:space-between;
  padding:0 12px; background:var(--agd-bg-1);
  border-bottom:1px solid color-mix(in oklab, var(--agd-accent) 25%, transparent);
  position:sticky; top:0; z-index:1;
}
.mega-panel .panel-title{ color:var(--agd-fg); font-weight:800; }
.mega-panel .btn.btn-xs{ padding:.22rem .6rem; font-size:.78rem; border-radius:10px; }
.mega-panel .panel-scroll{ height:calc(var(--panel-h) - var(--panel-head-h)); overflow:auto; padding:8px; }
.mega-panel .dropdown-item{ display:flex; align-items:center; justify-content:space-between; gap:.75rem; color:var(--agd-fg) !important; background:transparent !important; padding:9px 12px; border-radius:8px; font-weight:500; }
.mega-panel .dropdown-item:hover{ color:var(--agd-accent) !important; background:var(--agd-bg-2) !important; }
.subcat-item.open > .dropdown-item{ background:var(--agd-bg-3) !important; color:var(--agd-accent) !important; }

/* Tastatura */
#megaMenuDropdown .dropdown-item:focus-visible{
  outline:2px solid color-mix(in oklab, var(--agd-accent) 70%, white 10%);
  outline-offset:2px; border-radius:8px;
}

/* Značka korpe */
.badge-korpa.is-hidden,
.badge-korpa--mobile.is-hidden,
.mobile-cart-badge.is-hidden{
  display:none !important;
}
.nav-right .badge-korpa{
  position:absolute; top:2px; right:1px; background:var(--agd-accent); color:var(--agd-bg-0);
  display:inline-flex; align-items:center; justify-content:center;
  min-width:20px; min-height:20px; padding:2px 6px;
  border-radius:999px; font-weight:700; font-size:.72rem; line-height:1; text-align:center;
  box-shadow:0 2px 10px rgba(0,0,0,.35);
}

/* ===================== MOBILE / COMPACT (OFFCANVAS + “PROZORI”) ===================== */
@media (max-width:1279.98px){
  .mobile-cart-fab{
    position:fixed;
    right:16px;
    bottom:calc(64px + env(safe-area-inset-bottom));
    width:56px;
    height:56px;
    border-radius:16px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:var(--agd-accent);
    border:0;
    color:var(--agd-bg-0);
    text-decoration:none;
    box-shadow:0 12px 30px rgba(0,0,0,.45), 0 0 22px rgba(255,177,0,.35);
    z-index:calc(var(--z-menu) + 5);
    isolation:isolate;
  }
  .mobile-cart-fab::after{
    content:"";
    position:absolute;
    inset:-6px;
    border-radius:20px;
    background:radial-gradient(60% 60% at 50% 45%, rgba(255,177,0,.35), rgba(255,177,0,0));
    opacity:.55;
    z-index:-1;
  }
  .mobile-cart-fab.has-items{
    box-shadow:0 16px 36px rgba(0,0,0,.5), 0 0 28px rgba(255,177,0,.45);
    animation:cartBounce 5.5s ease-in-out infinite;
  }
  .mobile-cart-fab:active{ transform:translateY(1px); }
  .mobile-cart-fab i{ font-size:1.25rem; }
  .mobile-cart-fab .mobile-cart-badge{
    position:absolute;
    top:-6px;
    right:-6px;
    min-width:20px;
    height:20px;
    padding:0 6px;
    border-radius:999px;
    background:var(--agd-accent);
    color:var(--agd-bg-0);
    font-weight:800;
    font-size:.72rem;
    line-height:20px;
    text-align:center;
    border:1px solid rgba(0,0,0,.55);
    box-shadow:0 8px 18px rgba(0,0,0,.45);
  }
  .badge-korpa--mobile{
    position:absolute;
    top:-6px;
    right:-6px;
    width:20px;
    height:20px;
    padding:0;
    border-radius:999px;
    font-size:.68rem;
    line-height:20px;
    display:inline-flex;
    align-items:center;
    justify-content:center;
    background:var(--agd-accent);
    color:var(--agd-bg-0);
    border:1px solid rgba(0,0,0,.55);
    box-shadow:0 6px 14px rgba(0,0,0,.45);
  }
  @keyframes cartBounce{
    0%, 74%, 100%{ transform:translateY(0) scale(1); }
    80%{ transform:translateY(-10px) scale(1.03); }
    85%{ transform:translateY(0) scale(1); }
    90%{ transform:translateY(-5px) scale(1.02); }
    95%{ transform:translateY(0) scale(1); }
  }
  @media (prefers-reduced-motion:reduce){
    .mobile-cart-fab.has-items{ animation:none; }
  }
  #mobileNav{
    background:var(--agd-nav-panel-bg) !important;
    color:var(--agd-nav-row-text);
  }
  #mobileNav .offcanvas-header{
    min-height:48px;
    background:var(--agd-nav-panel-bg-alt);
    border-bottom:1px solid var(--agd-nav-divider);
  }
  #mobileNav .offcanvas-title{
    color:var(--agd-nav-heading);
    font-size:1.03rem;
    font-weight:720;
  }
  #mobileNav .offcanvas-body{ background:var(--agd-nav-panel-bg); }
  #mobileNav.custom-offcanvas-anim{
    transition:transform .44s cubic-bezier(.41,.55,.43,1.19), opacity .36s cubic-bezier(.65,0,.26,1);
    box-shadow:12px 0 34px rgba(0,0,0,.52);
    z-index:1125;
  }
  /* Primarni linkovi */
  .offcanvas .navbar-nav .nav-link{
    color:var(--agd-accent) !important; font-weight:600; letter-spacing:.01em;
    background:none !important; transition:color .16s, background .16s;
    padding:.6rem .8rem; border-radius:8px;
  }
  .offcanvas .navbar-nav .nav-link:hover,
  .offcanvas .navbar-nav .nav-link:focus{
    color:#fff200 !important; text-shadow:0 2px 10px #fff20077; background:transparent !important;
  }
  /* Zaglavlja sekcija */
  .offcanvas .navbar-nav .nav-item.fw-semibold{
    color:#ffc24a !important; font-size:.98em; font-weight:700 !important;
    text-transform:uppercase; letter-spacing:.03em; margin:.9em .4em .25em .4em; list-style:none; pointer-events:none;
  }

  .mobile-menu{ display:flex; flex-direction:column; gap:12px; }
  .mobile-section-label{
    color:var(--agd-nav-row-muted);
    font-size:.8rem;
    font-weight:700;
    line-height:1;
    letter-spacing:0;
    text-transform:uppercase;
  }
  .mobile-section-label--nested{
    margin:12px 2px 0;
    padding-bottom:8px;
    border-bottom:1px solid var(--agd-nav-divider);
  }
  .mobile-section-label--root{
    margin-top:2px;
    padding-top:8px;
    border-top:1px solid var(--agd-nav-divider);
  }
  .mobile-root-list{
    display:flex;
    flex-direction:column;
    gap:var(--agd-nav-row-gap);
    margin:0;
    padding:0;
    list-style:none;
  }
  .mobile-root-item{ display:flex; flex-direction:column; gap:var(--agd-nav-row-gap); }
  .mobile-root-link,
  .mobile-root-toggle{
    width:100%; display:flex; align-items:center; justify-content:space-between;
    min-height:var(--agd-nav-row-height);
    padding:10px 12px;
    border:1px solid transparent;
    border-radius:var(--agd-nav-row-radius);
    background:var(--agd-nav-row-bg);
    color:var(--agd-nav-row-text);
    font-weight:620;
    text-decoration:none;
    transition:background-color var(--dur), color var(--dur), border-color var(--dur);
  }
  .mobile-root-link:hover,
  .mobile-root-link:focus-visible,
  .mobile-root-toggle:hover,
  .mobile-root-toggle:focus-visible{
    color:#eceff4;
    background:var(--agd-nav-row-hover);
    border-color:rgba(255,177,0,.22);
  }
  .mobile-root-link:focus-visible,
  .mobile-root-toggle:focus-visible,
  .mobile-cat-link:focus-visible,
  .mobile-sub-link:focus-visible,
  .mobile-link:focus-visible,
  .mobile-split-btn:focus-visible,
  .dugme-nazad:focus-visible,
  .mobile-view-all:focus-visible{
    outline:2px solid var(--agd-nav-focus);
    outline-offset:1px;
  }
  .mobile-root-link i,
  .mobile-root-toggle i{ color:var(--agd-nav-accent); }
  .mobile-root-toggle > i:last-child{ opacity:.72; transition:transform var(--dur), opacity var(--dur); }
  .mobile-root-toggle[aria-expanded="true"]{
    color:var(--agd-nav-accent);
    background:var(--agd-nav-row-active);
    border-color:rgba(255,177,0,.34);
    box-shadow:inset 3px 0 0 var(--agd-nav-accent);
  }
  .mobile-root-toggle[aria-expanded="true"] > i:last-child{ transform:rotate(180deg); opacity:1; }
  .mobile-store-link{ font-weight:680; }
  .mobile-link-label{
    display:inline-flex;
    align-items:center;
    gap:.7rem;
  }
  .mobile-link-label i{
    width:1.1rem;
    text-align:center;
    flex:0 0 1.1rem;
    color:var(--agd-nav-accent);
  }
  .mobile-link{
    display:flex;
    min-height:var(--agd-nav-row-height);
    align-items:center;
    padding:9px 12px;
    border:1px solid transparent;
    border-radius:var(--agd-nav-row-radius);
    background:var(--agd-nav-row-bg);
    color:var(--agd-nav-row-text) !important;
    text-decoration:none;
    transition:background-color var(--dur), color var(--dur), border-color var(--dur);
  }
  .mobile-link:hover,
  .mobile-link:focus-visible{
    color:#eceff4 !important;
    background:var(--agd-nav-row-hover) !important;
    border-color:rgba(255,177,0,.22);
  }
  .mobile-link.small{ font-size:.92rem; }
  .mobile-link-standalone{ margin:0; }

  .mobile-split-row{
    display:grid; grid-template-columns:1fr 44px; gap:var(--agd-nav-row-gap);
    align-items:center; width:100%;
  }
  .mobile-cat-list{
    list-style:none; padding:0; margin:8px 0 0;
    display:flex; flex-direction:column; gap:var(--agd-nav-row-gap); align-items:stretch;
  }
  .mobile-cat-list > li,
  .mobile-sublist > li{
    width:100%;
  }
  .mobile-cat-item{ display:flex; flex-direction:column; gap:6px; align-items:stretch; }
  .mobile-cat-link,
  .mobile-sub-link,
  .mobile-split-btn{
    display:flex; align-items:center; justify-content:space-between;
    min-height:var(--agd-nav-row-height);
    padding:9px 12px;
    border:1px solid transparent;
    border-radius:var(--agd-nav-row-radius);
    background:var(--agd-nav-row-bg);
    color:var(--agd-nav-row-text);
    font-weight:600;
    transition:background-color var(--dur), color var(--dur), border-color var(--dur);
    text-decoration:none;
  }
  .mobile-cat-link,
  .mobile-sub-link{
    width:100%; justify-content:flex-start; text-align:left;
  }
  .mobile-split-btn{ width:44px; min-width:44px; padding:0; justify-content:center; }
  .mobile-cat-link:hover,
  .mobile-cat-link:focus-visible,
  .mobile-sub-link:hover,
  .mobile-sub-link:focus-visible,
  .mobile-split-btn:hover,
  .mobile-split-btn:focus-visible{
    color:#eceff4;
    background:var(--agd-nav-row-hover);
    border-color:rgba(255,177,0,.22);
  }
  .mobile-split-btn i{ color:var(--agd-nav-accent); font-size:1rem; opacity:.72; }
  .mobile-split-btn:hover i,
  .mobile-split-btn:focus-visible i{ opacity:1; }
  .mobile-collapse-btn[aria-expanded="true"]{
    background:var(--agd-nav-row-active);
    border-color:rgba(255,177,0,.34);
    color:var(--agd-nav-accent);
  }
  .mobile-subsection:has(.mobile-collapse-btn[aria-expanded="true"]) > .mobile-split-row .mobile-sub-link{
    background:var(--agd-nav-row-active);
    border-color:rgba(255,177,0,.34);
    color:var(--agd-nav-accent);
    box-shadow:inset 3px 0 0 var(--agd-nav-accent);
  }
  .mobile-collapse-btn[aria-expanded="true"] i{ opacity:1; }

  .mobile-panel-body{
    padding:var(--agd-nav-panel-padding) 0 0;
    border:0;
    border-radius:0;
    background:transparent;
  }

  .mobile-panel-titlebar{
    justify-content:space-between;
  }
  .mobile-panel-titlebar .mobile-view-all{
    margin-left:auto;
  }
  .mobile-view-all{
    display:inline-flex; align-items:center; justify-content:center;
    min-height:34px;
    padding:5px 8px;
    border:1px solid rgba(255,177,0,.32);
    border-radius:var(--agd-nav-row-radius);
    background:transparent;
    color:var(--agd-nav-accent);
    font-size:.86rem;
    font-weight:680;
    line-height:1;
    text-decoration:none;
    transition:color var(--dur), background-color var(--dur), border-color var(--dur);
  }
  .mobile-view-all::after{ content:"\2192"; margin-left:.32rem; }
  .mobile-view-all:hover,
  .mobile-view-all:focus-visible{
    color:#ffd36b;
    background:var(--agd-nav-row-hover);
    border-color:rgba(255,177,0,.6);
  }

  .mobile-subsections{ display:flex; flex-direction:column; gap:var(--agd-nav-row-gap); }
  .mobile-collapse-btn i{ transition:transform var(--dur); }
  .mobile-collapse-btn[aria-expanded="true"] i{ transform:rotate(180deg); }
  .mobile-sublist{
    list-style:none; padding:0; margin:0; display:flex; flex-direction:column; gap:var(--agd-nav-row-gap);
  }
  .mobile-sublist.nested{ padding-left:12px; margin-top:6px; border-left:1px solid var(--agd-nav-divider); }

  /* === MOBILNI “PROZORI” (stack) === */
  .mobilni-omotac{
    position:relative;
    min-height:65vh;
    overflow:hidden;
    border-radius:var(--agd-nav-panel-radius);
    background:var(--agd-nav-panel-bg);
    isolation:isolate;
  }
  .mobilni-prozor{
    position:absolute; inset:0; padding:var(--agd-nav-panel-padding); overflow:auto; background:var(--agd-nav-panel-bg);
    transform:translateX(100%); opacity:0; pointer-events:none; visibility:hidden; z-index:0;
    transition:transform .32s ease, opacity .28s ease;
    -webkit-overflow-scrolling:touch;
    overscroll-behavior:contain;
  }
  .mobilni-prozor.aktivan{ transform:none; opacity:1; pointer-events:auto; visibility:visible; z-index:2; }
  .mobilni-zaglavlje{
    position:sticky; top:0; z-index:5; display:flex; align-items:center; gap:8px;
    min-height:48px;
    padding:0 8px;
    background:var(--agd-nav-panel-bg-alt);
    border-bottom:1px solid var(--agd-nav-divider);
    color:var(--agd-nav-heading);
  }
  .mobilni-zaglavlje .naslov-prozora{
    min-width:0;
    overflow:hidden;
    font-size:1.03rem;
    font-weight:720;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .dugme-nazad{
    display:flex; align-items:center; gap:6px; cursor:pointer;
    min-height:44px;
    padding:6px 8px;
    border:1px solid transparent;
    border-radius:var(--agd-nav-row-radius);
    background:transparent;
    color:var(--agd-nav-row-text);
  }
  .dugme-nazad i{ color:var(--agd-nav-accent); }
  .dugme-nazad:hover,
  .dugme-nazad:focus-visible{ background:var(--agd-nav-row-hover); border-color:rgba(255,177,0,.22); }
  .dugme-nazad:active{ transform:translateY(1px); }
  /* Mobilna pretraga (modal) */
  #mobileSearchModal .search-icon{ position:absolute; left:15px; top:50%; transform:translateY(-50%); color:#b5b7bb; font-size:1.15em; z-index:2; pointer-events:none; }
  #mobileSearchModal .search-input{
    padding-left:2.5em; border-radius:9px; border:1.5px solid #31323a;
    background:#202227; color:#fff; font-size:1.09em; min-height:46px;
    transition:border-color .18s, background .17s, box-shadow .19s, transform .16s; box-shadow:0 0 0 0 #3488fa38;
  }
  #mobileSearchModal .search-input:focus{ border-color:#3488fa !important; background:#23232b; color:#fff; box-shadow:0 0 0 2px #3488fa38; transform:scale(1.012); }
  #mobileSearchModal .search-input::placeholder{ color:#b5b7bb; opacity:1; }
  #mobileSearchModal .search-clear{ position:absolute; right:18px; top:50%; transform:translateY(-50%); color:#b5b7bb; font-size:1.25em; cursor:pointer; z-index:2; display:none; }
  #mobileSearchModal .results-dropdown{
    position:absolute; left:0; right:0; top:100%; background:#23232b; border-radius:0 0 12px 12px;
    box-shadow:0 8px 24px #0008; max-height:320px; overflow-y:auto; margin-top:2px; z-index:5; display:none;
  }
  #mobileSearchModal .search-input::-webkit-search-clear-button, #mobileSearchModal .search-input::-ms-clear, #mobileSearchModal .search-input::-moz-clear, #mobileSearchModal .search-input::-o-clear{ display:none; }
}

/* Manje animacije po želji */
@media (prefers-reduced-motion:reduce){
  .mega-panel, #megaMenuDropdown .nav-kat-item > .dropdown-item, .offcanvas.custom-offcanvas-anim,
  .mobilni-prozor{ transition:none !important; }
  .navbar,
  .navbar .container-fluid,
  .navbar .nav-mobile,
  .navbar .agd-search-group,
  .navbar .agd-search .form-control,
  .navbar .agd-search .input-group-text,
  .navbar .agd-search .btn,
  .navbar .nav-wide,
  .navbar .nav-left,
  .navbar .nav-right .nav-link,
  .navbar .nav-wide .navbar-nav > .nav-item > .nav-link{ transition:none !important; }
}

.lista-kategorija{
  max-height: calc(var(--panel-h) - var(--panel-head-h));
  overflow-y: auto; overflow-x: hidden;
  padding: 6px 8px;
}

/* 2) Panels (Level-1, Level-2, Level-3, …) – all align flush to the right of their parent */
.mega-panel{
  position:absolute; top:0; left:100%;
  width:var(--panel-w); height:var(--panel-h);
  background:var(--agd-bg-1);
  border-left:1px solid #2b2d34;
  border-radius:0 var(--radius) var(--radius) 0;
  box-shadow:var(--shadow-lg);
  overflow:hidden;
  opacity:0; visibility:hidden; transform:translateX(6px);
  transition:opacity var(--dur) ease, transform var(--dur) ease;
  z-index: calc(var(--z-menu) + 1);
}
.mega-panel.show{ opacity:1; visibility:visible; transform:none; }

/* Head + inner scroll inside panels */
.mega-panel .panel-head{
  height:var(--panel-head-h);
  display:flex; align-items:center; justify-content:space-between;
  padding:0 12px; background:var(--agd-bg-1);
  border-bottom:1px solid color-mix(in oklab, var(--agd-accent) 25%, transparent);
  position:sticky; top:0; z-index:1;
}
.mega-panel .panel-title{ color:var(--agd-fg); font-weight:800; }
.mega-panel .panel-scroll{
  height: calc(var(--panel-h) - var(--panel-head-h));
  overflow-y: auto; overflow-x: hidden;
  padding: 8px;
}
.mega-panel .dropdown-item{
  display:flex; align-items:center; justify-content:space-between; gap:.75rem;
  color:var(--agd-fg) !important; background:transparent !important;
  padding:9px 12px; border-radius:8px; font-weight:500;
}
.mega-panel .dropdown-item:hover{
  color:var(--agd-accent) !important; background:var(--agd-bg-2) !important;
}

/* 3) If you had offsets for level-2/3, neutralize them (every child uses left:100%) */
.mega-panel.level-2{ left:100%; }
.mega-panel.level-3{ left:100%; }

/* 4) Bootstrap/Popper fix: keep dropdown anchored so absolute children align correctly */
#megaMenuDropdown[data-bs-popper]{ left:0 !important; transform:none !important; }

/* 5) Safety z-index */
.navbar .dropdown-menu, #megaMenuDropdown, .mega-panel{ z-index: var(--z-menu); }


.mega-panel{
  overflow: visible !important; /* L2 može da pokaže L3 van svoje širine */
}

/* Unutrašnje liste i dalje skroluju normalno */
.mega-panel .panel-scroll{
  overflow-y: auto;
  overflow-x: hidden;
}

/* 2) Svi nivoi deca stoje tačno desno od roditelja */
.mega-panel.level-2,
.mega-panel.level-3{
  left: 100% !important;  /* neutralize: left:calc(100% + var(--panel-w)) */
}

/* 3) Siguran stacking redosled (ako nešto prelazi preko) */
.mega-panel.level-2{ z-index: calc(var(--z-menu) + 2) !important; }
.mega-panel.level-3{ z-index: calc(var(--z-menu) + 3) !important; }

/* 4) Popper fix – već ima?, ali dupliramo za svaki slu?aj */
#megaMenuDropdown{
  overflow: visible !important;
}
#megaMenuDropdown[data-bs-popper]{
  left:0 !important;
  transform:none !important;
}

:root{
  --agd-row: color-mix(in oklab, var(--agd-fg) 14%, transparent);
}

/* 1) Leva kolona (kategorije): dodaj liniju iznad svake naredne stavke */
.lista-kategorija .nav-kat-item + .nav-kat-item > .dropdown-item{
  border-top: 1px solid var(--agd-row);
}

/* 2) Unutra?nji paneli (L2/L3): linije između stavki */
.mega-panel .panel-scroll .list-unstyled > li + li > .dropdown-item,
.mega-panel .panel-scroll .subcat-item + .subcat-item > .dropdown-item{
  border-top: 1px solid var(--agd-row);
}

/* 3) Aktivna/otvorena stavka – tanka akcentna “?ina” sa leve strane */
.nav-kat-item.open > .dropdown-item,
.subcat-item.open > .dropdown-item,
.podvrsta-grupa.open > .dropdown-item{
  box-shadow: inset 3px 0 0 var(--agd-accent);
}

/* 4) Hover/focus: linija ne nestaje, blago jača na hoveru */
#megaMenuDropdown .dropdown-item:hover,
#megaMenuDropdown .dropdown-item:focus{
  border-color: color-mix(in oklab, var(--agd-accent) 35%, var(--agd-row));
}

/* 5) (Opcionalno) Lagan “zebra” efekat – uklju?uje se dodavanjem .agd-rows-zebra na container */
.agd-rows-zebra .list-unstyled > li:nth-child(even) > .dropdown-item{
  background: color-mix(in oklab, var(--agd-bg-2) 18%, transparent);
}
.agd-rows-zebra .list-unstyled > li > .dropdown-item:hover{
  background: var(--agd-bg-2); /* hover i dalje pobedjuje zebra */
}

:root{
  --agd-row: color-mix(in oklab, var(--agd-fg) 14%, transparent);
}

.nav-middle .search-form { position: relative; }

/* share styles for both containers */
.as-results,
#mobileSearchModal .results-dropdown{
  position:absolute; left:0; right:0; top:100%;
  background:#1f1f25; border:1px solid #2b2d34; border-radius:10px;
  box-shadow:0 10px 28px rgba(0,0,0,.45);
  margin-top:6px; z-index:2000; display:none; max-height:60vh; overflow:auto;
}

/* mobile modal has static layout by default; force absolute relative to form */
#mobileSearchModal .results-dropdown { position:absolute; }

.as-results.open,
#mobileSearchModal .results-dropdown.open{ display:block; }

.as-inner{ padding:8px; }
.as-group{ margin-bottom:8px; }
.as-group-title{ color:#ffb100; font-weight:800; font-size:.9rem; padding:6px 8px; }
.as-group-body{ display:flex; flex-direction:column; gap:4px; }

.as-item{
  display:flex; gap:10px; align-items:center;
  padding:8px; border-radius:8px; color:#e9ecf2; text-decoration:none;
}
.as-item:hover, .as-item.is-active{
  background:#23232b; color:#ffb100; text-decoration:none;
}
.as-thumb{ width:36px; height:36px; object-fit:cover; border-radius:6px; background:#2b2d34; }
.as-text{ min-width:0; }
.as-label{ font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.as-sub{ font-size:.85rem; color:#9aa3b2; }
.as-meta{ font-size:.78rem; color:#8390a9; margin-top:2px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.as-badge{ margin-left:.35rem; background:#343642; color:#e9ecf2; padding:.1rem .4rem; border-radius:999px; font-size:.7rem; }
.as-badge--success{ background:#1b5b3d; color:#d8ffe9; }
.as-badge--warning{ background:#5d4a1d; color:#ffe9b3; }
.as-badge--danger{ background:#5c2a33; color:#ffd5dd; }

.as-view-all{
  display:block; margin-top:6px; padding:8px; text-align:center;
  background:#252633; border-radius:8px; color:#ffb100; text-decoration:none; font-weight:700;
}
.as-view-all:hover{ filter:brightness(1.06); }
.as-loading, .as-empty, .as-error{ color:#cfd2d9; padding:12px; text-align:center; }


/* Anchor the results to the input+button wrapper (desktop) */
.nav-middle .search-form .input-group {
  position: relative;
  overflow: visible; /* allow the dropdown to hang outside */
}

.nav-middle .search-form .as-results {
  left: 0;
  right: 0;
  top: calc(100% + 6px); /* below the group */
}

/* Avoid double blue outline: move focus ring to the whole group */
.nav-middle .form-control:focus {
  box-shadow: none !important; /* kill inner ring */
}
.nav-middle .input-group:focus-within {
  box-shadow: 0 0 0 2px #3488fa38;  /* one clean ring */
  border-radius: 10px;              /* optional: match your inputs */
}


/* Container look */
.agd-search-group{
  background:#202227;
  border:1px solid rgba(255,255,255,.12);
  border-radius:9px;
  overflow:hidden;
  transition:box-shadow .18s, border-color .18s, background-color .18s;
}

/* Icon chip */
.agd-search-icon{
  background:#202227;
  color:var(--agd-accent);
  border:0;
  border-right:1px solid #2b2d34;         /* gives separation from input */
  width:44px;                             /* square icon area */
  display:flex; align-items:center; justify-content:center;
}
.agd-search-icon i{ font-size:1.15rem; line-height:1; }

/* Input + button harmonize with our container */
.agd-search .form-control{
  background:transparent !important;
  border:0 !important;
  color:#fff;
}
.agd-search .form-control::placeholder{ color:#9da3ae; opacity:1; }
.agd-search .btn.btn-primary{
  min-width:72px;
  padding-inline:1rem;
  border:0;
  border-left:1px solid rgba(255,255,255,.08);
  border-radius:0;
  font-size:.92rem;
  font-weight:700;
}

/* Hover/focus feedback */
.agd-search-group:hover .agd-search-icon{ color:#ffb100; }
.agd-search-group:focus-within{
  border-color:#3488fa;
  box-shadow:0 0 0 2px #3488fa38;
}
.agd-search-group:focus-within .agd-search-icon{ color:#fff; }

/* Remove inner control rings so we only see the group ring */
.agd-search .form-control:focus,
.agd-search .btn:focus,
.agd-search .input-group-text:focus{
  box-shadow:none !important;
  outline:0 !important;
}

#megaMenuDropdown > .panel-head.level-0 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: .75rem;
  padding: .625rem .9rem;
  background: #17171d;               /* same as panels */
  border-bottom: 1px solid #2a2a34;
  border-radius: 8px 8px 0 0;
  color: #ddd;
  /* IMPORTANT: do NOT make this sticky (children may be sticky in scroll panes) */
  position: relative;
  z-index: 1;
  margin-bottom: .25rem;              /* breathing room above the list */
}

#megaMenuDropdown > .panel-head.level-0 .panel-title {
  font-weight: 800;
  font-size: 1rem;                    /* same as child titles */
  line-height: 1.2;
}

#megaMenuDropdown > .panel-head.level-0 .btn.btn-xs.btn-warning {
  padding: .25rem .6rem;
  font-weight: 700;
  border-radius: 12px;
  box-shadow: 0 2px 8px #ffb10044;
}

/* Ensure the category list doesn’t collide with the header */
#megaMenuDropdown > .lista-kategorija {
  margin-top: 0;
  padding-top: .25rem;
}

/* ===================== DESKTOP MEGA MENU SKIN (visual only) ===================== */
@media (min-width: 1280px){
  :root{
    --panel-w:clamp(340px, 23vw, 380px);
    --child-panel-w:clamp(292px, 20.5vw, 380px);
    --panel-h:auto;
    --panel-head-h:48px;
  }

  body::before{
    content:"";
    position:fixed;
    inset:0;
    z-index:calc(var(--z-nav) - 1);
    background:rgba(0,0,0,.34);
    opacity:0;
    visibility:hidden;
    pointer-events:none;
    transition:opacity var(--dur), visibility 0s linear var(--dur);
  }
  body:has(#megaMenuDropdown.show)::before{
    opacity:1;
    visibility:visible;
    transition-delay:0s;
  }

  #megaMenuDropdown{
    width:var(--panel-w);
    height:auto !important;
    max-height:calc(100vh - 150px);
    border:1px solid var(--agd-nav-panel-border) !important;
    border-radius:var(--agd-nav-panel-radius) 0 0 var(--agd-nav-panel-radius) !important;
    background:var(--agd-nav-panel-bg) !important;
    box-shadow:0 18px 38px rgba(0,0,0,.54) !important;
  }

  #megaMenuDropdown > .panel-head.level-0{
    height:var(--panel-head-h);
    min-height:var(--panel-head-h);
    margin:0;
    padding:0 12px !important;
    background:var(--agd-nav-panel-bg-alt) !important;
    border-bottom:1px solid var(--agd-nav-divider) !important;
  }
  #megaMenuDropdown > .panel-head.level-0 .panel-title{
    color:var(--agd-nav-heading) !important;
    font-size:1.04rem !important;
    font-weight:740 !important;
    letter-spacing:0 !important;
    line-height:1.2;
  }

  .lista-kategorija{
    max-height:calc(100vh - 198px);
    padding:var(--agd-nav-panel-padding) !important;
  }
  #megaMenuDropdown .nav-kat-item > .dropdown-item{
    min-height:calc(var(--agd-nav-row-height) + 2px) !important;
    padding:10px 13px !important;
    border:1px solid transparent !important;
    border-radius:var(--agd-nav-row-radius) !important;
    background:var(--agd-nav-row-bg) !important;
    color:var(--agd-nav-row-text) !important;
    font-size:1.03rem !important;
    font-weight:620 !important;
    transition:background-color var(--dur), border-color var(--dur), color var(--dur) !important;
  }
  #megaMenuDropdown .kat-label{
    font-size:1.03rem !important;
    font-weight:620 !important;
    letter-spacing:0 !important;
  }
  #megaMenuDropdown .nav-kat-item > .dropdown-item:hover,
  #megaMenuDropdown .nav-kat-item > .dropdown-item:focus-visible{
    border-color:color-mix(in srgb, var(--agd-nav-accent) 24%, transparent) !important;
    background:var(--agd-nav-row-hover) !important;
    color:#eef0f4 !important;
  }
  #megaMenuDropdown .kat-strelica{
    color:var(--agd-nav-accent) !important;
    opacity:.72 !important;
    font-size:1rem !important;
  }
  #megaMenuDropdown .nav-kat-item.open > .dropdown-item .kat-strelica{
    opacity:1 !important;
  }
  #megaMenuDropdown .lista-kategorija .nav-kat-item + .nav-kat-item > .dropdown-item{
    margin-top:var(--agd-nav-row-gap) !important;
  }

  .mega-panel{
    width:var(--child-panel-w);
    height:auto !important;
    max-height:calc(100vh - 150px);
    border:1px solid var(--agd-nav-panel-border) !important;
    border-radius:0 var(--agd-nav-panel-radius) var(--agd-nav-panel-radius) 0;
    background:var(--agd-nav-panel-bg) !important;
    box-shadow:10px 18px 34px rgba(0,0,0,.5) !important;
  }
  .mega-panel.level-1,
  .mega-panel.level-2,
  .mega-panel.level-3{
    left:calc(100% + 5px) !important;
  }
  .mega-panel .panel-head{
    height:var(--panel-head-h);
    min-height:var(--panel-head-h) !important;
    padding:0 12px !important;
    border-bottom:1px solid var(--agd-nav-divider) !important;
    background:var(--agd-nav-panel-bg-alt) !important;
  }
  .mega-panel .panel-title{
    overflow:hidden;
    color:var(--agd-nav-heading) !important;
    font-size:1.03rem !important;
    font-weight:720 !important;
    letter-spacing:0 !important;
    line-height:1.2;
    text-overflow:ellipsis;
    white-space:nowrap;
  }
  .mega-panel .panel-scroll{
    height:auto !important;
    max-height:calc(100vh - 198px);
    padding:var(--agd-nav-panel-padding) !important;
  }
  .mega-panel .dropdown-item{
    min-height:var(--agd-nav-row-height) !important;
    padding:9px 13px !important;
    border:1px solid transparent !important;
    border-radius:var(--agd-nav-row-radius) !important;
    background:var(--agd-nav-row-bg) !important;
    color:var(--agd-nav-row-text) !important;
    font-size:1rem !important;
    font-weight:560 !important;
    transition:background-color var(--dur), border-color var(--dur), color var(--dur) !important;
  }
  .mega-panel .dropdown-item strong,
  .mega-panel .dropdown-item span{
    font-size:1rem !important;
  }
  .mega-panel .dropdown-item:hover,
  .mega-panel .dropdown-item:focus-visible{
    border-color:color-mix(in srgb, var(--agd-nav-accent) 22%, transparent) !important;
    background:var(--agd-nav-row-hover) !important;
    color:#eceff4 !important;
  }
  .mega-panel .panel-scroll .list-unstyled > li + li > .dropdown-item,
  .mega-panel .panel-scroll .subcat-item + .subcat-item > .dropdown-item{
    margin-top:var(--agd-nav-row-gap);
  }
  .mega-panel .fa-chevron-right{
    color:var(--agd-nav-accent) !important;
    opacity:.72 !important;
    font-size:1rem !important;
  }

  .nav-kat-item.open > .dropdown-item,
  .subcat-item.open > .dropdown-item,
  .podvrsta-grupa.open > .dropdown-item{
    border-color:rgba(255,177,0,.34) !important;
    background:var(--agd-nav-row-active) !important;
    color:var(--agd-nav-accent) !important;
    box-shadow:inset 3px 0 0 var(--agd-nav-accent) !important;
  }
  .subcat-item.open > .dropdown-item .fa-chevron-right,
  .podvrsta-grupa.open > .dropdown-item .fa-chevron-right{
    opacity: 1 !important;
  }

  #megaMenuDropdown .dropdown-item:focus-visible,
  .mega-panel .dropdown-item:focus-visible{
    outline:2px solid var(--agd-nav-focus) !important;
    outline-offset:1px !important;
  }

  #megaMenuDropdown .lista-kategorija,
  .mega-panel .panel-scroll{
    scrollbar-width: thin;
    scrollbar-color:rgba(255,177,0,.38) rgba(255,255,255,.05);
  }
  #megaMenuDropdown .lista-kategorija::-webkit-scrollbar,
  .mega-panel .panel-scroll::-webkit-scrollbar{
    width:8px;
  }
  #megaMenuDropdown .lista-kategorija::-webkit-scrollbar-track,
  .mega-panel .panel-scroll::-webkit-scrollbar-track{
    background:rgba(255,255,255,.05);
    border-radius:8px;
  }
  #megaMenuDropdown .lista-kategorija::-webkit-scrollbar-thumb,
  .mega-panel .panel-scroll::-webkit-scrollbar-thumb{
    background:rgba(255,177,0,.38);
    border-radius:8px;
  }

  #megaMenuDropdown .btn.btn-xs.btn-warning,
  .mega-panel .btn.btn-xs.btn-warning{
    display:inline-flex;
    min-height:34px;
    align-items:center;
    padding:.3rem .58rem !important;
    border:1px solid rgba(255,177,0,.32) !important;
    border-radius:var(--agd-nav-row-radius) !important;
    background:transparent !important;
    box-shadow:none !important;
    color:var(--agd-nav-accent) !important;
    font-size:.86rem !important;
    font-weight:680 !important;
    line-height:1;
  }
  #megaMenuDropdown .btn.btn-xs.btn-warning::after,
  .mega-panel .btn.btn-xs.btn-warning::after{
    content:"\2192";
    margin-left:.32rem;
  }
  #megaMenuDropdown .btn.btn-xs.btn-warning:hover,
  #megaMenuDropdown .btn.btn-xs.btn-warning:focus-visible,
  .mega-panel .btn.btn-xs.btn-warning:hover,
  .mega-panel .btn.btn-xs.btn-warning:focus-visible{
    border-color:rgba(255,177,0,.6) !important;
    background:rgba(255,177,0,.08) !important;
    box-shadow:none !important;
    color:#ffd36b !important;
  }
}

/* ===================== Mobile Search v2 (authoritative) ===================== */
@media (max-width: 1279.98px){
  #mobileSearchModal .modal-dialog.modal-dialog-top{
    margin: 0 !important;
    width: 100vw !important;
    max-width: 100vw !important;
    min-height: 100dvh;
    display: flex;
    align-items: flex-start;
  }

  #mobileSearchModal .modal-content{
    width: 100%;
    border-radius: 0 0 16px 16px;
    background:
      radial-gradient(120% 90% at 50% 0%, rgba(255,177,0,.08), transparent 55%),
      #171a24 !important;
    border: 0;
    border-bottom: 1px solid #32374b;
    box-shadow: 0 22px 46px rgba(0,0,0,.55);
  }

  #mobileSearchModal .modal-body{
    padding: max(.8rem, env(safe-area-inset-top)) .8rem .8rem;
  }

  #mobileSearchModal form{
    display: grid;
    gap: .6rem;
  }

  #mobileSearchModal .mobile-search-input-wrap{
    position: relative;
  }

  #mobileSearchModal .search-icon{
    left: 14px;
    top: 50%;
    transform: translateY(-50%);
    color: #b8c0d2;
    font-size: 1.05rem;
  }

  #mobileSearchModal .search-input{
    min-height: 46px;
    border-radius: 12px;
    border: 1px solid #3a4158;
    background: #202534 !important;
    color: #f2f5fb !important;
    font-size: 1rem;
    padding-left: 2.4rem;
    padding-right: 2.4rem;
    transition: border-color .18s ease, box-shadow .18s ease, background-color .18s ease;
  }

  #mobileSearchModal .search-input:focus{
    border-color: #4a90ff !important;
    background: #23293a !important;
    box-shadow: 0 0 0 2px rgba(74,144,255,.22) !important;
    transform: none !important; /* prevent jump on tiny screens */
  }

  #mobileSearchModal .search-input::placeholder{
    color: #96a0b6;
  }

  #mobileSearchModal .search-clear{
    right: 12px;
    top: 50%;
    transform: translateY(-50%);
    color: #aeb8cd;
    font-size: 1.08rem;
    width: 28px;
    height: 28px;
    border-radius: 999px;
    display: none;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,.04);
  }

  #mobileSearchModal .search-clear:hover{
    background: rgba(255,255,255,.08);
    color: #fff;
  }

  #mobileSearchModal .mobile-search-empty{
    display: grid;
    gap: .55rem;
  }

  #mobileSearchModal .mobile-search-block{
    background: #1b2030;
    border: 1px solid #2f364b;
    border-radius: 10px;
    padding: .5rem .52rem .5rem;
  }

  #mobileSearchModal .mobile-search-head{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .5rem;
    margin-bottom: .45rem;
  }

  #mobileSearchModal .mobile-search-title{
    margin: 0;
    font-size: .74rem;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: #ffd47a;
    font-weight: 800;
  }

  #mobileSearchModal .mobile-search-clear-recent{
    background: transparent;
    border: 0;
    color: #aab6ce;
    font-size: .74rem;
    font-weight: 700;
    padding: .2rem .35rem;
    border-radius: 8px;
  }

  #mobileSearchModal .mobile-search-clear-recent:hover{
    background: rgba(255,255,255,.06);
    color: #fff;
  }

  #mobileSearchModal .mobile-search-recent-list{
    display: flex;
    flex-wrap: wrap;
    gap: .42rem;
  }

  #mobileSearchModal .mobile-search-recent-item,
  #mobileSearchModal .mobile-search-chip{
    border: 1px solid #3a425a;
    background: #23293a;
    color: #dde4f2;
    border-radius: 999px;
    font-size: .82rem;
    line-height: 1;
    padding: .4rem .56rem;
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    justify-content: center;
  }

  #mobileSearchModal .mobile-search-recent-item:hover,
  #mobileSearchModal .mobile-search-chip:hover{
    border-color: #ffb100;
    color: #ffdd91;
    background: #2a3042;
  }

  #mobileSearchModal .mobile-search-chip-list{
    display: flex;
    flex-wrap: wrap;
    gap: .42rem;
  }

  #mobileSearchModal .mobile-search-hint{
    margin: 0;
    color: #8f9bb3;
    font-size: .74rem;
    text-align: left;
    padding: 0 .15rem;
  }

  /* Keep mobile dropdown tied to the input and always above modal content */
  #mobileSearchModal .results-dropdown{
    position: absolute !important;
    left: 0;
    right: 0;
    top: calc(100% + 6px);
    margin-top: 0;
    z-index: 2055;
    max-height: min(62dvh, 460px);
    overflow: auto;
    background: #1f2433;
    border: 1px solid #343c54;
    border-radius: 12px;
    box-shadow: 0 16px 32px rgba(0,0,0,.48);
  }

  #mobileSearchModal .results-dropdown.open{
    display: block;
  }

  #mobileSearchModal .as-inner{
    padding: .45rem;
  }

  #mobileSearchModal .as-group-title{
    font-size: .78rem;
    letter-spacing: .05em;
    text-transform: uppercase;
    color: #ffcf66;
    padding: .35rem .5rem;
  }

  #mobileSearchModal .as-item{
    gap: .6rem;
    padding: .56rem;
    border-radius: 10px;
  }

  #mobileSearchModal .as-thumb{
    width: 42px;
    height: 42px;
    border-radius: 8px;
  }

  #mobileSearchModal .as-label{
    font-size: .94rem;
  }

  #mobileSearchModal .as-sub{
    font-size: .8rem;
    color: #a7b2c8;
  }

  #mobileSearchModal .as-meta{
    font-size: .72rem;
    color: #8793ad;
  }

  #mobileSearchModal .as-sub{
    font-size: .78rem;
  }

  #mobileSearchModal .as-view-all{
    margin-top: .3rem;
    border-radius: 10px;
    padding: .65rem .6rem;
  }
}


/* =========================================================
   AGD TAXONOMY MEGA MENU V1
   ========================================================= */

@media (min-width:1280px){

  #megaMenuDropdown.agd-taxonomy-mega{
    width:min(1040px, calc(100vw - 96px)) !important;
    min-width:min(900px, calc(100vw - 96px)) !important;
    max-width:calc(100vw - 96px) !important;
    height:auto !important;
    max-height:calc(100vh - 150px) !important;
    padding:0 !important;
    overflow:hidden !important;
    border:1px solid var(--agd-nav-panel-border) !important;
    border-radius:var(--agd-nav-panel-radius) !important;
    background:var(--agd-nav-panel-bg) !important;
    box-shadow:0 20px 46px rgba(0,0,0,.58) !important;
  }

  #megaMenuDropdown.agd-taxonomy-mega > .panel-head.level-0{
    border-radius:var(--agd-nav-panel-radius)
                  var(--agd-nav-panel-radius)
                  0 0 !important;
  }

  .agd-mega-grid{
    display:grid;
    grid-template-columns:
      minmax(155px,.72fr)
      minmax(210px,1.08fr)
      minmax(215px,1.05fr)
      minmax(220px,1.15fr);
    max-height:calc(100vh - 198px);
    overflow:auto;
    padding:14px;
    background:var(--agd-nav-panel-bg);
    scrollbar-width:thin;
    scrollbar-color:rgba(255,177,0,.38) rgba(255,255,255,.05);
  }

  .agd-mega-column{
    min-width:0;
    padding:2px 15px 8px;
    border-right:1px solid var(--agd-nav-divider);
  }

  .agd-mega-column:first-child{ padding-left:4px; }

  .agd-mega-column:last-child{
    padding-right:4px;
    border-right:0;
  }

  .agd-mega-title{
    margin:0 0 9px;
    padding:0 9px 9px;
    border-bottom:1px solid rgba(255,177,0,.22);
    color:var(--agd-nav-heading);
    font-size:.9rem;
    font-weight:760;
    letter-spacing:.035em;
    line-height:1.2;
    text-transform:uppercase;
  }

  .agd-mega-list{
    display:flex;
    flex-direction:column;
    gap:3px;
    margin:0;
    padding:0;
    list-style:none;
  }

  .agd-mega-link{
    display:flex;
    align-items:center;
    min-height:36px;
    padding:7px 9px;
    border:1px solid transparent;
    border-radius:var(--agd-nav-row-radius);
    background:transparent;
    color:var(--agd-nav-row-text);
    font-size:.94rem;
    font-weight:560;
    line-height:1.2;
    text-decoration:none;
    transition:
      color var(--dur),
      background-color var(--dur),
      border-color var(--dur);
  }

  .agd-mega-link:hover,
  .agd-mega-link:focus-visible{
    border-color:rgba(255,177,0,.24);
    background:var(--agd-nav-row-hover);
    color:#f1f2f5;
  }

  .agd-mega-link:focus-visible{
    outline:2px solid var(--agd-nav-focus);
    outline-offset:1px;
  }

  .agd-mega-link--accent{
    color:var(--agd-nav-accent);
    font-weight:660;
  }

  .agd-mega-separator{
    height:1px;
    margin:4px 9px;
    background:var(--agd-nav-divider);
  }

  .agd-mega-grid::-webkit-scrollbar{ width:8px; }

  .agd-mega-grid::-webkit-scrollbar-track{
    background:rgba(255,255,255,.05);
  }

  .agd-mega-grid::-webkit-scrollbar-thumb{
    border-radius:8px;
    background:rgba(255,177,0,.38);
  }
}


@media (max-width:1279.98px){

  .agd-mobile-taxonomy{
    display:flex;
    flex-direction:column;
    gap:7px;
    padding:8px 0 3px;
  }

  .agd-mobile-taxonomy-all{
    display:flex;
    align-items:center;
    justify-content:space-between;
    min-height:44px;
    padding:9px 12px;
    border:1px solid rgba(255,177,0,.28);
    border-radius:var(--agd-nav-row-radius);
    background:rgba(255,177,0,.06);
    color:var(--agd-nav-accent);
    font-weight:700;
    text-decoration:none;
  }

  .agd-mobile-taxonomy-all:hover,
  .agd-mobile-taxonomy-all:focus-visible{
    border-color:rgba(255,177,0,.55);
    background:rgba(255,177,0,.1);
    color:#ffd36b;
  }

  .agd-mobile-taxonomy-group{
    overflow:hidden;
    border:1px solid var(--agd-nav-divider);
    border-radius:var(--agd-nav-row-radius);
    background:rgba(255,255,255,.018);
  }

  .agd-mobile-taxonomy-toggle{
    display:flex;
    align-items:center;
    justify-content:space-between;
    width:100%;
    min-height:44px;
    padding:9px 12px;
    border:0;
    background:transparent;
    color:var(--agd-nav-row-text);
    font-weight:650;
    text-align:left;
  }

  .agd-mobile-taxonomy-toggle:hover,
  .agd-mobile-taxonomy-toggle:focus-visible,
  .agd-mobile-taxonomy-toggle[aria-expanded="true"]{
    background:var(--agd-nav-row-hover);
    color:var(--agd-nav-accent);
  }

  .agd-mobile-taxonomy-toggle i{
    color:var(--agd-nav-accent);
    opacity:.75;
    transition:transform var(--dur), opacity var(--dur);
  }

  .agd-mobile-taxonomy-toggle[aria-expanded="true"] i{
    transform:rotate(180deg);
    opacity:1;
  }

  .agd-mobile-taxonomy-list{
    display:flex;
    flex-direction:column;
    gap:2px;
    margin:0;
    padding:5px 7px 8px;
    border-top:1px solid var(--agd-nav-divider);
    list-style:none;
  }

  .agd-mobile-taxonomy-list a{
    display:flex;
    align-items:center;
    min-height:40px;
    padding:8px 10px;
    border:1px solid transparent;
    border-radius:var(--agd-nav-row-radius);
    color:var(--agd-nav-row-text);
    text-decoration:none;
  }

  .agd-mobile-taxonomy-list a:hover,
  .agd-mobile-taxonomy-list a:focus-visible{
    border-color:rgba(255,177,0,.2);
    background:var(--agd-nav-row-hover);
    color:#f0f1f4;
  }
}


/* =========================================================
   AGD TAXONOMY MEGA MENU V2 — VISUAL POLISH
   Structure/URLs unchanged. Presentation only.
   ========================================================= */

@media (min-width:1280px){

  #megaMenuDropdown.agd-taxonomy-mega{
    width:min(1060px, calc(100vw - 96px)) !important;
    min-width:min(900px, calc(100vw - 96px)) !important;

    border-color:rgba(255,255,255,.09) !important;
    border-radius:16px !important;

    background:
      linear-gradient(
        180deg,
        rgba(31,32,39,.99) 0%,
        rgba(24,25,31,.99) 100%
      ) !important;

    box-shadow:
      0 24px 60px rgba(0,0,0,.58),
      0 1px 0 rgba(255,255,255,.035) inset !important;
  }

  #megaMenuDropdown.agd-taxonomy-mega > .panel-head.level-0{
    min-height:56px !important;
    height:56px !important;

    padding:0 17px !important;

    border-bottom:1px solid rgba(255,255,255,.075) !important;
    border-radius:16px 16px 0 0 !important;

    background:
      linear-gradient(
        180deg,
        rgba(36,37,45,.96),
        rgba(29,30,37,.96)
      ) !important;
  }

  #megaMenuDropdown.agd-taxonomy-mega
  > .panel-head.level-0
  .panel-title{
    color:#f3f4f7 !important;

    font-size:.82rem !important;
    font-weight:800 !important;
    letter-spacing:.09em !important;
    text-transform:uppercase;
  }

  #megaMenuDropdown.agd-taxonomy-mega
  > .panel-head.level-0
  .btn.btn-xs.btn-warning{
    min-height:32px !important;
    padding:.32rem .68rem !important;

    border-color:rgba(255,177,0,.38) !important;
    border-radius:999px !important;

    background:rgba(255,177,0,.055) !important;
    color:#ffc84a !important;

    font-size:.8rem !important;
    font-weight:700 !important;
  }

  #megaMenuDropdown.agd-taxonomy-mega
  > .panel-head.level-0
  .btn.btn-xs.btn-warning:hover,
  #megaMenuDropdown.agd-taxonomy-mega
  > .panel-head.level-0
  .btn.btn-xs.btn-warning:focus-visible{
    border-color:rgba(255,177,0,.72) !important;
    background:rgba(255,177,0,.11) !important;
    color:#ffd36b !important;
  }


  /* Four clear visual groups rather than four loose text columns */
  .agd-mega-grid{
    grid-template-columns:
      minmax(170px,.78fr)
      minmax(220px,1.08fr)
      minmax(225px,1.08fr)
      minmax(230px,1.16fr);

    gap:10px;

    padding:13px;

    background:transparent;
  }

  .agd-mega-column{
    min-width:0;

    padding:12px 10px 11px;

    border:1px solid rgba(255,255,255,.055);
    border-radius:12px;

    background:rgba(255,255,255,.018);

    transition:
      background-color .16s ease,
      border-color .16s ease;
  }

  .agd-mega-column:first-child,
  .agd-mega-column:last-child{
    padding-left:10px;
    padding-right:10px;
    border-right:1px solid rgba(255,255,255,.055);
  }

  .agd-mega-column:hover{
    border-color:rgba(255,255,255,.075);
    background:rgba(255,255,255,.026);
  }


  /* Group title */
  .agd-mega-title{
    display:flex;
    align-items:center;

    margin:0 3px 8px;
    padding:0 5px 10px;

    border-bottom:1px solid rgba(255,255,255,.07);

    color:#d9dde5;

    font-size:.78rem;
    font-weight:800;
    letter-spacing:.075em;
    line-height:1.2;
    text-transform:uppercase;
  }

  .agd-mega-title::before{
    content:"";

    width:3px;
    height:15px;
    margin-right:8px;

    border-radius:99px;

    background:var(--agd-nav-accent);

    box-shadow:0 0 10px rgba(255,177,0,.24);
  }


  /* Rows */
  .agd-mega-list{
    gap:2px;
  }

  .agd-mega-link{
    position:relative;

    min-height:35px;
    padding:7px 28px 7px 9px;

    border-radius:8px;

    color:#cbd0da;

    font-size:.91rem;
    font-weight:540;
    line-height:1.22;
  }

  .agd-mega-link::after{
    content:"›";

    position:absolute;
    right:10px;
    top:50%;

    opacity:0;

    color:var(--agd-nav-accent);

    font-size:1.1rem;
    line-height:1;

    transform:translate(-4px,-50%);

    transition:
      opacity .14s ease,
      transform .14s ease;
  }

  .agd-mega-link:hover,
  .agd-mega-link:focus-visible{
    border-color:rgba(255,177,0,.19);

    background:
      linear-gradient(
        90deg,
        rgba(255,177,0,.085),
        rgba(255,177,0,.025)
      );

    color:#f2f3f6;
  }

  .agd-mega-link:hover::after,
  .agd-mega-link:focus-visible::after{
    opacity:.82;
    transform:translate(0,-50%);
  }


  /*
   * Enterijer uses ?mesto= rather than ?povrsina=,
   * but visually it belongs naturally in this customer group.
   * Keep it consistent rather than making it look like an ad/CTA.
   */
  .agd-mega-link--accent{
    color:#cbd0da;
    font-weight:560;
  }

  .agd-mega-separator{
    height:1px;
    margin:6px 8px;

    background:rgba(255,255,255,.07);
  }
}


/* =========================================================
   MOBILE TAXONOMY POLISH
   ========================================================= */

@media (max-width:1279.98px){

  #mob-proizvodi{
    padding-top:4px;
  }

  .agd-mobile-taxonomy{
    gap:8px;
    padding:8px 1px 5px;
  }


  /* Main shop CTA */
  .agd-mobile-taxonomy-all{
    min-height:48px;
    padding:10px 13px;

    border-color:rgba(255,177,0,.34);
    border-radius:12px;

    background:
      linear-gradient(
        90deg,
        rgba(255,177,0,.105),
        rgba(255,177,0,.035)
      );

    color:#ffd05d;

    font-size:.95rem;
    font-weight:720;

    box-shadow:
      0 1px 0 rgba(255,255,255,.025) inset;
  }

  .agd-mobile-taxonomy-all i{
    font-size:.86rem;
    opacity:.85;
  }


  /* Accordion cards */
  .agd-mobile-taxonomy-group{
    border-color:rgba(255,255,255,.07);
    border-radius:12px;

    background:
      linear-gradient(
        180deg,
        rgba(255,255,255,.027),
        rgba(255,255,255,.014)
      );

    box-shadow:
      0 1px 0 rgba(255,255,255,.018) inset;
  }

  .agd-mobile-taxonomy-toggle{
    min-height:48px;
    padding:10px 13px;

    color:#d8dce5;

    font-size:.95rem;
    font-weight:680;
  }

  .agd-mobile-taxonomy-toggle > i{
    display:flex;
    align-items:center;
    justify-content:center;

    width:26px;
    height:26px;

    border-radius:8px;

    background:rgba(255,177,0,.06);

    font-size:.79rem;
  }

  .agd-mobile-taxonomy-toggle:hover,
  .agd-mobile-taxonomy-toggle:focus-visible{
    background:rgba(255,255,255,.025);
  }

  .agd-mobile-taxonomy-toggle[aria-expanded="true"]{
    color:#ffd05d;

    background:
      linear-gradient(
        90deg,
        rgba(255,177,0,.075),
        rgba(255,177,0,.015)
      );

    box-shadow:
      inset 3px 0 0 var(--agd-nav-accent);
  }


  /* Expanded items */
  .agd-mobile-taxonomy-list{
    gap:1px;

    padding:6px 7px 8px;

    border-top-color:rgba(255,255,255,.065);

    background:rgba(0,0,0,.075);
  }

  .agd-mobile-taxonomy-list a{
    position:relative;

    min-height:40px;
    padding:8px 28px 8px 14px;

    border-radius:9px;

    color:#c8cdd7;

    font-size:.92rem;
    font-weight:540;
  }

  .agd-mobile-taxonomy-list a::before{
    content:"";

    width:4px;
    height:4px;
    margin-right:10px;

    flex:0 0 4px;

    border-radius:50%;

    background:rgba(255,177,0,.58);
  }

  .agd-mobile-taxonomy-list a::after{
    content:"›";

    position:absolute;
    right:11px;
    top:50%;

    opacity:.44;

    color:var(--agd-nav-accent);

    transform:translateY(-50%);
  }

  .agd-mobile-taxonomy-list a:hover,
  .agd-mobile-taxonomy-list a:focus-visible{
    border-color:rgba(255,177,0,.16);
    background:rgba(255,177,0,.055);
    color:#f0f2f6;
  }
}


/* =========================================================
   AGD TAXONOMY MEGA MENU V3 — CURATED COLLECTIONS
   ========================================================= */

@media (min-width:1280px){

  .agd-mega-column--collections{
    grid-column:1 / -1;
    padding:10px;
    border-right:0;
  }

  .agd-mega-list--collections{
    display:grid;
    grid-template-columns:
      repeat(auto-fit, minmax(175px, 1fr));
    gap:5px 7px;
  }

}


/* ==========================================================
   AGD WIDE DESKTOP NAV — shop redesign alignment
   ========================================================== */

@media (min-width:1960px){

  .nav-wide{
    width:
      min(
        2080px,
        calc(100vw - 56px)
      ) !important;

    max-width:2080px !important;
  }

}

@media (min-width:2300px){

  .nav-wide{
    width:2080px !important;
    max-width:2080px !important;
  }

}


/* ==========================================================
   AGD MOBILE CART FAB CLEANUP
   The mobile header already exposes Korpa.
   Avoid covering product cards with a fixed floating button.
   A structured mobile bottom navigation will replace this later.
   ========================================================== */

@media (max-width: 767.98px){

  .mobile-cart-fab{
    display:none !important;
  }

}


/* ==========================================================
   AGD SEARCH UX — PHASE 1D.1
   Premium autocomplete / taxonomy search panel
   ========================================================== */


/* ---------- MAIN PANEL ---------- */

.as-results,
#mobileSearchModal .results-dropdown{
  background:
    linear-gradient(
      180deg,
      #151b25 0%,
      #111721 100%
    );

  border:
    1px solid
    rgba(255,255,255,.10);

  border-radius:16px;

  box-shadow:
    0 24px 58px
    rgba(0,0,0,.54),
    inset 0 1px 0
    rgba(255,255,255,.025);

  overflow-x:hidden;

  scrollbar-width:thin;

  scrollbar-color:
    #394254
    transparent;
}


.as-inner{
  padding:14px;
}


.as-group{
  margin:0;
}


.as-group-title,
.as-section-title{
  color:#a7b2c5;

  font-size:.68rem;
  font-weight:850;

  letter-spacing:.085em;

  text-transform:uppercase;
}


.as-group-title{
  padding:
    3px
    3px
    8px;
}



/* ---------- PRODUCTS ---------- */

.as-group--products{
  margin-bottom:12px;
}


.as-group--products .as-group-title{
  color:#f1f4f8;

  font-size:.74rem;
}


.as-group--products .as-group-body{
  display:grid;

  grid-template-columns:
    repeat(
      2,
      minmax(0,1fr)
    );

  gap:8px;
}


.as-group--products .as-item{
  min-width:0;
  min-height:82px;

  display:grid;

  grid-template-columns:
    62px
    minmax(0,1fr);

  gap:11px;

  align-items:center;

  padding:9px;

  color:#eef2f8;

  background:
    rgba(255,255,255,.025);

  border:
    1px solid
    rgba(255,255,255,.065);

  border-radius:12px;

  transition:
    background .15s ease,
    border-color .15s ease,
    transform .15s ease;
}


.as-group--products .as-item:hover,
.as-group--products .as-item.is-active{
  color:#fff;

  background:
    rgba(255,255,255,.06);

  border-color:
    rgba(255,177,0,.27);

  transform:
    translateY(-1px);
}


.as-group--products .as-thumb{
  width:62px;
  height:62px;

  object-fit:contain;

  border-radius:9px;

  padding:4px;

  background:
    linear-gradient(
      180deg,
      #303747,
      #252b39
    );

  border:
    1px solid
    rgba(255,255,255,.055);
}


.as-group--products .as-text{
  min-width:0;
}


.as-group--products .as-label{
  color:#f6f7fa;

  font-size:.86rem;
  font-weight:800;

  line-height:1.18;

  white-space:normal;

  overflow:visible;

  text-overflow:clip;
}


.as-group--products .as-sub{
  margin-top:4px;

  color:#c1cada;

  font-size:.73rem;
  font-weight:650;

  line-height:1.25;
}


.as-group--products .as-meta{
  margin-top:3px;

  color:#7f8da4;

  font-size:.65rem;
  font-weight:650;

  line-height:1.25;

  white-space:nowrap;

  overflow:hidden;

  text-overflow:ellipsis;

  text-transform:uppercase;

  letter-spacing:.025em;
}


.as-group--products .as-badge{
  display:inline-flex;

  margin-left:5px;

  padding:
    3px
    6px;

  vertical-align:middle;

  border-radius:999px;

  font-size:.55rem;
  font-weight:850;

  line-height:1;

  letter-spacing:.025em;

  text-transform:uppercase;
}


.as-badge--success{
  color:#dff5e6;

  background:
    rgba(45,121,76,.30);

  border:
    1px solid
    rgba(94,179,121,.22);
}


.as-badge--warning{
  color:#ffe29a;

  background:
    rgba(161,111,13,.28);

  border:
    1px solid
    rgba(255,177,0,.26);
}


.as-badge--danger{
  color:#e1e5ec;

  background:
    rgba(107,115,132,.25);

  border:
    1px solid
    rgba(150,158,174,.18);
}



/* ---------- TAXONOMY ---------- */

.as-taxonomy-section{
  margin-top:4px;

  padding-top:12px;

  border-top:
    1px solid
    rgba(255,255,255,.075);
}


.as-section-title{
  padding:
    0
    3px
    9px;

  color:#ffbd22;
}


.as-taxonomy-grid{
  display:grid;

  grid-template-columns:
    repeat(
      3,
      minmax(0,1fr)
    );

  gap:8px;
}


.as-taxonomy-grid .as-group{
  min-width:0;

  padding:8px;

  background:
    rgba(255,255,255,.018);

  border:
    1px solid
    rgba(255,255,255,.055);

  border-radius:11px;
}


.as-taxonomy-grid .as-group-title{
  padding:
    1px
    2px
    6px;

  color:#8492a8;

  font-size:.61rem;
}


.as-taxonomy-grid .as-group-body{
  display:flex;

  flex-direction:column;

  gap:2px;
}


.as-taxonomy-grid .as-item{
  min-width:0;

  display:block;

  padding:
    6px
    7px;

  color:#d9dfea;

  border-radius:7px;

  font-size:.76rem;
  font-weight:720;

  line-height:1.18;
}


.as-taxonomy-grid .as-item:hover,
.as-taxonomy-grid .as-item.is-active{
  color:#ffbd22;

  background:
    rgba(255,177,0,.075);
}


.as-taxonomy-grid .as-label{
  font-weight:720;

  white-space:normal;

  overflow:hidden;

  display:-webkit-box;

  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
}



/* ---------- VIEW ALL ---------- */

.as-view-all{
  min-height:42px;

  display:flex;

  align-items:center;
  justify-content:center;

  margin-top:12px;

  padding:
    9px
    14px;

  color:#111;

  background:
    linear-gradient(
      180deg,
      #ffc62b,
      #ffb000
    );

  border-radius:10px;

  font-size:.76rem;
  font-weight:850;

  text-align:center;

  text-decoration:none;

  box-shadow:
    0 8px 22px
    rgba(255,177,0,.15);

  transition:
    transform .15s ease,
    filter .15s ease;
}


.as-view-all:hover,
.as-view-all:focus{
  color:#111;

  filter:brightness(1.04);

  transform:
    translateY(-1px);
}



/* ---------- STATUS ---------- */

.as-loading,
.as-empty,
.as-error{
  padding:
    25px
    16px;

  color:#aeb8c8;

  font-size:.82rem;

  text-align:center;
}



/* ==========================================================
   DESKTOP SEARCH
   ========================================================== */

@media (min-width:1280px){

  .nav-wide
  .nav-middle
  .search-form
  .as-results{

    left:50%;

    right:auto;

    width:
      min(
        780px,
        calc(100vw - 64px)
      );

    max-height:
      min(
        72vh,
        760px
      );

    transform:
      translateX(-50%);
  }

}



/* ==========================================================
   TABLET / MOBILE SEARCH
   ========================================================== */

@media (max-width:1279.98px){

  .nav-mobile-search .as-results,
  .nav-compact-search .as-results{

    left:50%;

    right:auto;

    width:
      min(
        620px,
        calc(100vw - 24px)
      );

    max-height:
      calc(
        100vh
        - 190px
      );

    transform:
      translateX(-50%);
  }


  .as-group--products .as-group-body{
    grid-template-columns:
      1fr;
  }


  .as-taxonomy-grid{
    grid-template-columns:
      repeat(
        2,
        minmax(0,1fr)
      );
  }

}



/* ==========================================================
   PHONE
   ========================================================== */

@media (max-width:575.98px){

  .as-results,
  #mobileSearchModal .results-dropdown{
    border-radius:14px;
  }


  .as-inner{
    padding:10px;
  }


  .nav-mobile-search .as-results,
  .nav-compact-search .as-results{

    width:
      calc(100vw - 20px);

    margin-top:5px;

    max-height:
      calc(
        100vh
        - 175px
      );
  }


  .as-group--products{
    margin-bottom:9px;
  }


  .as-group--products .as-item{
    min-height:74px;

    grid-template-columns:
      54px
      minmax(0,1fr);

    gap:9px;

    padding:8px;

    border-radius:10px;
  }


  .as-group--products .as-thumb{
    width:54px;
    height:54px;

    border-radius:8px;
  }


  .as-group--products .as-label{
    font-size:.83rem;
  }


  .as-group--products .as-sub{
    font-size:.70rem;
  }


  .as-group--products .as-meta{
    font-size:.61rem;
  }


  .as-taxonomy-section{
    padding-top:10px;
  }


  .as-taxonomy-grid{
    gap:6px;
  }


  .as-taxonomy-grid .as-group{
    padding:7px;

    border-radius:9px;
  }


  .as-taxonomy-grid .as-item{
    padding:
      6px
      5px;

    font-size:.72rem;
  }


  .as-view-all{
    min-height:43px;

    margin-top:10px;

    font-size:.73rem;
  }


  #mobileSearchModal .results-dropdown{
    left:50%;

    right:auto;

    width:
      calc(100vw - 26px);

    transform:
      translateX(-50%);

    max-height:
      calc(
        100vh
        - 120px
      );
  }

}



/* ---------- REDUCED MOTION ---------- */

@media (prefers-reduced-motion:reduce){

  .as-item,
  .as-view-all{
    transition:none !important;
  }

}


/* ==========================================================
   AGD SEARCH UX — PHASE 1D.2
   Mobile autocomplete alignment fix
   ========================================================== */

@media (max-width: 1279.98px){

  .nav-mobile-search .as-results,
  .nav-compact-search .as-results{
    left:0 !important;
    right:0 !important;

    width:100% !important;

    transform:none !important;

    top:calc(100% + 6px) !important;

    margin-top:0 !important;
  }

}


@media (max-width: 575.98px){

  .nav-mobile-search .as-results,
  .nav-compact-search .as-results{
    left:0 !important;
    right:0 !important;

    width:100% !important;

    max-height:
      min(
        68vh,
        620px
      );

    transform:none !important;
  }

}