/* ===== CUSTOM PRODUCT TABS (setup-tabs) ===== */

/* Wrapper */
.setup-tabs{ margin-top:48px; }

/* NAV (desktop: 3 u redu) */
.setup-tabs__nav{
  position:relative;
  display:grid;
  grid-template-columns:repeat(3, minmax(0,1fr));
  margin:0 0 16px;
  padding:0;
}

/* Veći vertikalni padding za tabove na desktopu */
@media (min-width: 1000px){
  .setup-tabs__nav {
    margin-top: 100px;
  }
  .setup-tabs {
    margin-bottom: 100px;
  }
}


/* Tanke sive linije preko cijelog reda (DESKTOP) */
.setup-tabs__nav::before,
.setup-tabs__nav::after{
  content:"";
  position:absolute;
  left:0; right:0; height:1px;
  background:#e5e7eb;
  z-index:0;
}
.setup-tabs__nav::before{ top:0; }
.setup-tabs__nav::after { bottom:0; }

/* Tab gumbi — bazni stil */
.setup-tabs .setup-tabs__tab{
  display:block;
  width:100%;
  appearance:none;
  background:transparent;
  border:0;                    /* na desktopu ne crtamo borderom */
  color:#6b7280;
  font-weight:500;
  letter-spacing:.1em;
  text-transform:uppercase;
  padding:14px 0;
  cursor:pointer;
  position:relative;           /* za layering / focus */
  z-index:1;                   /* iznad sivih linija wrappera */
  transition: color .2s ease;
  outline:none; box-shadow:none;   /* ubij fokus frame teme (bez diranja border-color) */
}
.setup-tabs .setup-tabs__tab:hover{ color:#111; }

/* AKTIVNI TAB (DESKTOP): narančaste crte gore + dolje */
.setup-tabs .setup-tabs__tab.is-active{
  color:#111;
  box-shadow:
    inset 0  2px 0 #c35d1b,
    inset 0 -2px 0 #c35d1b;
}

/* --- MOBILE OVERRIDES ---------------------------------------------------- */
@media (max-width:999px){

  /* Tabovi jedan ispod drugog; makni wrapper linije da ne smetaju */
  .setup-tabs__nav{
    grid-template-columns:1fr;
    gap:10px;
  }
  .setup-tabs__nav::before,
  .setup-tabs__nav::after{
    content:none !important;   /* nema globalne sive crte ispod narančaste */
  }

  /* ZATVOREN tab: siva crta GORE i DOLJE */
  .setup-tabs .setup-tabs__tab{
    text-align:left;
    font-size:15px;
    font-weight:500;
    letter-spacing:.05em;
    border-top:1px solid #e5e7eb;
    border-bottom:1px solid #e5e7eb;
    box-shadow:none !important;      /* osiguraj da desktop shadow ne “procuri” */
  }

  /* OTVOREN tab: samo GORNJA narančasta; DOLJE ništa */
  .setup-tabs .setup-tabs__tab.is-active{
    color:#111;
    border-top-color:#c35d1b;        /* narančasta gore */
    border-bottom-color:transparent;  /* ništa dolje */
    box-shadow:none !important;       /* na mobu ne koristimo shadow za crte */
  }
  
  /* Smanji razmak ispod aktivnog taba */
  .setup-tabs .setup-tabs__panel{
    padding-top: 0px !important;
    padding-bottom: 16px !important;
  }
}

/* Paneli (JS im toggla .is-active i/ili hidden) */
.setup-tabs__panels{}
.setup-tabs__panel{ padding:20px 0; }
.setup-tabs__panel[hidden]{ display:none !important; }

.setup-tabs {
    margin-bottom: 50px;
  }