/* /tema/assets/css/header.css — EURO AGENCY / WP PREMIUM FEEL
   - Topbar ince & temiz
   - Main nav: modern tipografi + underline animasyon
   - Dropdown: premium kart
   - Sağda CTA + search
   - Mobil drawer: temiz
*/

:root{
  --ra-primary: var(--renk1, #0b4bff);
  --ra-primary2: var(--renk2, #074e8e);

  --ra-bg: #ffffff;
  --ra-text: #0f172a;
  --ra-muted: rgba(15,23,42,.62);

  --ra-line: rgba(15,23,42,.10);
  --ra-line2: rgba(15,23,42,.14);

  --ra-shadow: 0 26px 70px rgba(2,6,23,.14);
  --ra-radius: 18px;
}

.site-header .container{
  width:100%;
  max-width:1240px;
  margin:0 auto;
  padding-left:18px;
  padding-right:18px;
  box-sizing:border-box;
}

.site-header{ position:relative; z-index:9999; background:#fff; }
.site-header a{ text-decoration:none; }
.site-header i{ line-height:1; }
body.ra-lock{ overflow:hidden; height:100%; touch-action:none; }

/* helper */
.d-none{display:none!important}
.d-flex{display:flex!important}
.d-lg-none{display:block!important}
.d-lg-flex{display:none!important}
@media (min-width: 992px){
  .d-lg-none{display:none!important}
  .d-lg-flex{display:flex!important}
}

/* =========================================================
   TOPBAR
========================================================= */
.ra-topbar2{
  background:#fff;
  border-bottom:1px solid var(--ra-line);
  font-size:13px;
}
.ra-topbar2 .container{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  min-height:44px;
}

.ra-topbar2 .ra-tb-left,
.ra-topbar2 .ra-tb-right{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:nowrap;
  white-space:nowrap;
}

.ra-topbar2 .ra-tb-right{
  margin-left:auto;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;
}
.ra-topbar2 .ra-tb-right::-webkit-scrollbar{ height:0 }

.ra-topbar2 a{
  color:var(--ra-text);
  display:inline-flex;
  align-items:center;
  gap:8px;
  padding:6px 10px;
  border-radius:999px;
  border:1px solid transparent;
  transition:background .15s ease, border-color .15s ease, transform .15s ease, opacity .15s ease;
}
.ra-topbar2 a:hover{
  background:rgba(15,23,42,.04);
  border-color:rgba(15,23,42,.10);
  transform:translateY(-1px);
}
.ra-topbar2 i{ font-size:14px; opacity:.95; }

/* cart badge */
.ra-topbar2 .ra-cart{ position:relative; padding-right:24px; }
.ra-topbar2 .ra-badge{
  position:absolute; right:6px; top:4px;
  min-width:18px; height:18px; line-height:18px;
  border-radius:10px;
  background: linear-gradient(90deg, var(--ra-primary), var(--ra-primary2));
  color:#fff;
  font-size:11px;
  text-align:center;
  padding:0 5px;
}

/* user dropdown (topbar) */
.ra-user-dd{ position:relative; display:inline-flex; align-items:center; }
.ra-user-btn{
  appearance:none;
  border:1px solid rgba(15,23,42,.12);
  background:#fff;
  color:var(--ra-text);
  border-radius:999px;
  padding:6px 10px;
  display:inline-flex;
  align-items:center;
  gap:10px;
  cursor:pointer;
  font-weight:800;
  transition:background .15s ease, transform .15s ease, border-color .15s ease;
}
.ra-user-btn:hover{ background:rgba(15,23,42,.04); transform:translateY(-1px); border-color:rgba(15,23,42,.16); }
.ra-user-name{ font-weight:500; }
.ra-user-money{ font-weight:900; opacity:.92; }
.ra-user-caret{ font-size:12px; opacity:.7; }

.ra-user-menu{
  position:absolute;
  right:0;
  top:calc(100% + 10px);
  min-width:280px;
  max-width:calc(100vw - 20px);
  background:#fff;
  border:1px solid rgba(15,23,42,.12);
  border-radius:16px;
  box-shadow: var(--ra-shadow);
  padding:10px;
  z-index:200000;
}
.ra-user-menu a{
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  border-radius:12px;
  color:var(--ra-text);
  border:1px solid transparent;
  transition:background .15s ease, border-color .15s ease, transform .15s ease;
}
.ra-user-menu a:hover{
  background:rgba(15,23,42,.04);
  border-color:rgba(15,23,42,.10);
  transform:translateY(-1px);
}
.ra-user-menu .ra-dd-sep{ height:1px; background:rgba(15,23,42,.10); margin:8px 0; }

@media (max-width: 991px){
  .ra-topbar2 .ra-tb-left{ display:none !important; }
}

/* =========================================================
   MAIN NAV BAR
========================================================= */
.ra-head2{
  background:#fff;
  border-bottom:1px solid var(--ra-line);
  position:relative;
}
.ra-head2 .container{
  display:flex;
  align-items:center;
  justify-content:space-between;
  min-height:82px;
  gap:18px;
}

/* brand */
.ra-brand2{
  display:flex;
  align-items:center;
  text-decoration:none;
  flex:0 0 auto;
}
.ra-brand2 img{
  max-height:68px;
  width:auto;
  display:block;
  object-fit:contain;
}

/* desktop nav center */
.ra-desk-nav{
  display:flex;
  align-items:center;
  justify-content:center;
  flex:1 1 auto;
  min-width:0;
}

/* tools right */
.ra-desk-tools2{
  display:flex;
  align-items:center;
  gap:10px;
  flex:0 0 auto;
}

/* =========================================================
   DESKTOP MENU — EURO AGENCY / WP PREMIUM
========================================================= */
.ra-head2 .ra-nav,
.ra-head2 .ra-drop{ list-style:none; margin:0; padding:0; }

.ra-head2 .ra-nav{
  display:flex;
  align-items:center;
  gap:22px;
  flex-wrap:nowrap;
  white-space:nowrap;
}

.ra-head2 .ra-nav-item{ position:relative; }

/* link */
.ra-head2 .ra-nav-link{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:8px;

  padding:10px 4px;
  background:transparent;
  border:0;

  color:rgba(15,23,42,.82);
  font-weight:700;
  font-size:15px;
  letter-spacing:.2px;

  transition:color .15s ease, transform .15s ease, opacity .15s ease;
}
.ra-head2 .ra-nav-link:hover{
  color:rgba(15,23,42,.96);
  transform:translateY(-1px);
}

/* underline animation */
.ra-head2 .ra-nav-link::after{
  content:"";
  position:absolute;
  left:0; right:0;
  bottom:2px;
  height:2px;
  border-radius:2px;
  background:linear-gradient(90deg, var(--ra-primary), var(--ra-primary2));
  transform:scaleX(0);
  transform-origin:left;
  transition:transform .18s ease;
  opacity:.95;
}
.ra-head2 .ra-nav-link:hover::after{ transform:scaleX(1); }
.ra-head2 .ra-nav-link.is-active{ color:rgba(15,23,42,1); }
.ra-head2 .ra-nav-link.is-active::after{ transform:scaleX(1); }

.ra-head2 .ra-caret{
  font-size:11px;
  opacity:.55;
  transform:translateY(1px);
}

/* hover gap fixer */
.ra-head2 .ra-nav-item.has-drop::after{
  content:"";
  position:absolute;
  left:-10px; right:-10px;
  top:100%;
  height:16px;
}

/* dropdown panel */
.ra-head2 .ra-nav-item.has-drop > .ra-drop{
  position:absolute;
  left:0;
  top:100%;
  margin-top:14px;

  min-width:320px;
  padding:12px;

  background:#fff;
  border:1px solid rgba(15,23,42,.12);
  border-radius:16px;
  box-shadow: var(--ra-shadow);

  display:none;
  z-index:10000;
}
.ra-head2 .ra-nav-item.has-drop:hover > .ra-drop,
.ra-head2 .ra-nav-item.has-drop:focus-within > .ra-drop{
  display:block;
}

.ra-head2 .ra-drop li + li{ margin-top:10px; }

.ra-head2 .ra-drop-link{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;

  padding:12px 14px;
  border-radius:14px;

  color:rgba(15,23,42,.92);
  font-weight:800;

  border:1px solid rgba(15,23,42,.10);
  background:#fff;

  transition:transform .15s ease, background .15s ease, border-color .15s ease;
}
.ra-head2 .ra-drop-link:hover{
  background:rgba(15,23,42,.04);
  border-color:rgba(15,23,42,.14);
  transform:translateY(-1px);
}

/* 2nd level */
.ra-head2 .ra-drop-item{ position:relative; }
.ra-head2 .ra-drop-item.has-sub::after{
  content:"";
  position:absolute;
  left:100%;
  top:0;
  width:14px;
  height:100%;
}
.ra-head2 .ra-drop-item > .ra-drop{
  left:100%;
  top:0;
  margin-left:12px;
  min-width:300px;
}

/* responsive spacing */
@media (max-width: 1199px) and (min-width: 992px){
  .ra-head2 .ra-nav{ gap:16px; }
  .ra-head2 .ra-nav-link{ font-size:14px; }
}

/* =========================================================
   CTA (desktop)
========================================================= */
.ra-cta2{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  height:44px;
  padding:0 18px;
  border-radius:12px;
  border:1px solid rgba(15,23,42,.10);
  background:linear-gradient(90deg, var(--ra-primary), var(--ra-primary2));
  color:#fff;
  font-weight:900;
  letter-spacing:.2px;
  white-space:nowrap;
  transition:transform .15s ease, filter .15s ease;
}
.ra-cta2:hover{ transform:translateY(-1px); filter:brightness(.98); }

/* =========================================================
   DESKTOP SEARCH
========================================================= */
.ra-desk-search-wrap{ position:relative; }

.ra-desk-search-btn{
  width:44px; height:44px;
  border-radius:12px;
  border:1px solid rgba(15,23,42,.12);
  background:#fff;
  color:var(--ra-text);
  display:inline-flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  transition:background .15s ease, transform .15s ease, border-color .15s ease;
}
.ra-desk-search-btn:hover{
  background:rgba(15,23,42,.04);
  transform:translateY(-1px);
  border-color:rgba(15,23,42,.16);
}

.ra-desk-search-pop{
  position:absolute;
  right:0;
  top:calc(100% + 12px);
  width:360px;
  max-width:72vw;
  background:#fff;
  border:1px solid rgba(15,23,42,.12);
  border-radius:16px;
  box-shadow: var(--ra-shadow);
  padding:12px;
  z-index:12000;
}

.ra-desk-search-form{ display:flex; gap:10px; align-items:center; }
.ra-desk-search-form input{
  flex:1 1 auto;
  height:44px;
  border-radius:999px;
  border:1px solid rgba(15,23,42,.14);
  padding:0 14px;
  outline:none;
}
.ra-desk-search-form input:focus{
  border-color:rgba(15,23,42,.22);
}
.ra-desk-search-form button{
  width:48px; height:44px;
  border-radius:999px;
  border:0;
  background:linear-gradient(90deg, var(--ra-primary), var(--ra-primary2));
  color:#fff;
  cursor:pointer;
}

/* =========================================================
   HAMBURGER + DRAWER
========================================================= */
.site-header .mobile-toggle{
  display:none;
  width:54px; height:54px;
  border:1px solid rgba(15,23,42,.14);
  background:#fff;
  border-radius:16px;
  padding:0;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:7px;
  cursor:pointer;
}
.site-header .mobile-toggle span{
  display:block;
  width:26px; height:2px;
  background:var(--ra-text);
  border-radius:2px;
}

/* drawer */
#mobileMenu{
  position:fixed;
  top:0; right:0;
  height:100vh;
  width:min(86vw, 360px);
  background:#fff;
  z-index:100500;
  box-shadow: var(--ra-shadow);
  transform:translateX(100%);
  transition:transform .25s ease;
  display:block;
}
body.ra-mopen #mobileMenu{ transform:translateX(0); }

/* backdrop */
#mobileBackdrop{
  position:fixed;
  inset:0;
  background:rgba(2,6,23,.35);
  z-index:100400;
  opacity:0;
  visibility:hidden;
  pointer-events:none;
  transition:opacity .2s ease, visibility .2s ease;
}
body.ra-mopen #mobileBackdrop{
  opacity:1;
  visibility:visible;
  pointer-events:auto;
}

#mobileMenu .mobile-inner{
  height:100%;
  overflow:auto;
  -webkit-overflow-scrolling:touch;
  padding:16px;
}
#mobileMenu .mobile-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding-bottom:12px;
  border-bottom:1px solid rgba(15,23,42,.10);
  margin-bottom:12px;
}
#mobileMenu .mobile-title{
  font-weight:900;
  color:var(--ra-text);
}
#mobileMenu .mobile-close{
  width:40px; height:40px;
  border:1px solid rgba(15,23,42,.14);
  background:#fff;
  border-radius:14px;
  font-size:22px;
  cursor:pointer;
}

/* mobile links */
.site-header .ra-m-link,
.site-header .ra-m-parent{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding:12px 12px;
  border-radius:16px;
  border:1px solid rgba(15,23,42,.14);
  background:#fff;
  color:var(--ra-text);
  font-weight:900;
  margin-bottom:10px;
}
.site-header .ra-m-link.is-active,
.site-header .ra-m-parent.is-active{
  border-color:rgba(15,23,42,.18);
  background:rgba(15,23,42,.04);
}
.site-header .ra-m-sub{
  padding-left:10px;
  display:flex;
  flex-direction:column;
}
.site-header .ra-m-sub[hidden]{ display:none !important; }

/* CTA mobile */
.site-header .ra-cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:12px 16px;
  border-radius:999px;
  border:0;
  color:#fff;
  background:linear-gradient(90deg, var(--ra-primary), var(--ra-primary2));
  font-weight:900;
}

/* desktop'ta drawer kapalı */
@media (min-width: 992px){
  #mobileMenu, #mobileBackdrop{ display:none !important; }
}

/* mobil */
@media (max-width: 991px){
  .ra-head2 .container{ min-height:78px; gap:10px; }
  .ra-brand2 img{ height:54px; max-height:54px; }
  .site-header .mobile-toggle{ display:inline-flex !important; }
  .ra-desk-nav, .ra-desk-tools2{ display:none !important; }
}

/* küçük ekran */
@media (max-width: 375px){
  .ra-brand2 img{ height:48px; max-height:48px; }
}

/* topbar overflow fix */
@media (min-width: 992px){
  .ra-topbar2 .ra-tb-right{ overflow:visible !important; }
}
/* ✅ Ultra zarif dikey ayırıcı */
@media (min-width: 992px){

  .ra-head2 .ra-nav-item{
    position: relative;
  }

  /* sadece kendinden önce item varsa çizgi */
  .ra-head2 .ra-nav-item + .ra-nav-item::before{
    content:"";
    position:absolute;
    left:-14px;
    top:50%;
    transform:translateY(-50%);
    width:1px;
    height:16px;
    background:rgba(15,23,42,.14);
    pointer-events:none;
  }

}