/* Üst menü açılır panelleri (V2). #header kapsamı, header.php içindeki eski <style> ve dark-mode.css kurallarının önüne geçer. */

#header .dropdown{
    top:calc(100% + 12px);
    padding:10px;
    border-radius:18px;
    background:#fff;
    border:1px solid #e2e8f0;
    box-shadow:0 24px 60px -18px rgba(15,23,42,.28),0 2px 6px rgba(15,23,42,.05);
    backdrop-filter:none;
    transform:translateX(-50%) translateY(8px) scale(.985);
    transform-origin:top center;
    transition:opacity .22s ease,transform .28s cubic-bezier(.16,1,.3,1),visibility .22s;
}
#header .dropdown::before{top:-14px;height:14px}
#header .dropdown::after{
    content:'';position:absolute;left:18px;right:18px;top:0;height:2px;border-radius:0 0 2px 2px;
    background:linear-gradient(90deg,#2563eb,#06b6d4,#7c3aed);opacity:.85;
}
#header .nav-dropdown:hover .dropdown,
#header .nav-dropdown:focus-within .dropdown,
#header .dropdown:hover{
    opacity:1;visibility:visible;pointer-events:all;
    transform:translateX(-50%) translateY(0) scale(1);
}
#header .dropdown-grid{gap:4px;min-width:600px;padding:10px}
#header .dropdown-grid.grid-3{min-width:840px}

/* Öğeler */
#header .dropdown li a{
    --mc:#2563eb;
    align-items:center;
    gap:14px;
    padding:12px 14px;
    border-radius:12px;
    border:1px solid transparent;
    transform:none;
    box-shadow:none;
    transition:background .2s ease,border-color .2s ease;
}
#header .dropdown li a::before{display:none}
#header .dropdown li:nth-child(6n+1) a{--mc:#2563eb}
#header .dropdown li:nth-child(6n+2) a{--mc:#7c3aed}
#header .dropdown li:nth-child(6n+3) a{--mc:#0891b2}
#header .dropdown li:nth-child(6n+4) a{--mc:#16a34a}
#header .dropdown li:nth-child(6n+5) a{--mc:#ea580c}
#header .dropdown li:nth-child(6n+6) a{--mc:#db2777}

#header .dropdown li a > i{
    width:42px;height:42px;flex-shrink:0;margin:0;
    display:flex;align-items:center;justify-content:center;
    border-radius:12px;font-size:21px;
    color:var(--mc);
    background:color-mix(in srgb,var(--mc) 11%,transparent);
    transform:none;
    transition:background .2s ease,color .2s ease,transform .25s cubic-bezier(.34,1.56,.64,1),box-shadow .2s ease;
}
#header .dropdown li a strong{font-size:14.5px;font-weight:600;color:#0f172a;margin-bottom:2px;letter-spacing:-.1px;display:flex;align-items:center;gap:6px}
#header .dropdown li a small{font-size:12.5px;color:#64748b;line-height:1.45}
#header .dropdown li a div{min-width:0;padding-right:18px}

/* Sağda beliren ok */
#header .dropdown li a::after{
    content:'';position:absolute;right:14px;top:50%;width:7px;height:7px;
    border-top:2px solid var(--mc);border-right:2px solid var(--mc);
    transform:translate(-6px,-50%) rotate(45deg);opacity:0;
    transition:opacity .2s ease,transform .25s ease;
}
#header .dropdown li a:hover,
#header .dropdown li a:focus-visible{
    background:color-mix(in srgb,var(--mc) 6%,#fff);
    border-color:color-mix(in srgb,var(--mc) 18%,transparent);
    transform:none;box-shadow:none;outline:none;
}
#header .dropdown li a:hover::after,
#header .dropdown li a:focus-visible::after{opacity:1;transform:translate(0,-50%) rotate(45deg)}
#header .dropdown li a:hover > i,
#header .dropdown li a:focus-visible > i{
    color:#fff;
    background:linear-gradient(135deg,var(--mc),color-mix(in srgb,var(--mc) 65%,#06b6d4));
    box-shadow:0 8px 18px -8px var(--mc);
    transform:scale(1.06) rotate(-4deg);
}
#header .dropdown li a:hover strong{color:#0f172a}

/* Rozetler: başlığın yanında sakin etiket */
#header .menu-item-badge,
#header .nav-new-tag{
    position:static;display:inline-flex;align-items:center;
    margin:0;padding:2px 7px;border-radius:6px;
    font-size:9.5px;font-weight:800;letter-spacing:.05em;line-height:1.5;text-transform:uppercase;
    color:#fff;box-shadow:none;animation:none;vertical-align:middle;
}
#header .menu-item-badge{background:linear-gradient(90deg,#f97316,#ef4444)}
#header .menu-item-badge.is-new,
#header .nav-new-tag{background:linear-gradient(90deg,#16a34a,#14b8a6)}

/* Alt şerit */
#header .dropdown .dd-foot{grid-column:1 / -1;margin-top:6px}
#header .dropdown .dd-foot a{
    --mc:#2563eb;
    display:flex;align-items:center;justify-content:space-between;gap:12px;
    padding:12px 14px;border-radius:12px;
    background:#f8fafc;border:1px solid #e2e8f0;
}
#header .dropdown .dd-foot a::after{display:none}
#header .dropdown .dd-foot a > span{display:flex;align-items:center;gap:10px;font-size:13px;color:#475569}
#header .dropdown .dd-foot a > span i{font-size:18px;color:var(--mc)}
#header .dropdown .dd-foot a > em{font-style:normal;font-size:13px;font-weight:700;color:var(--mc);white-space:nowrap;display:flex;align-items:center;gap:4px}
#header .dropdown .dd-foot a:hover{background:#eff6ff;border-color:#bfdbfe}

/* Üst menü bağlantısı */
#header .nav-dropdown > a i{transition:transform .25s ease}
#header .nav-dropdown:hover > a,
#header .nav-dropdown:focus-within > a{color:#2563eb;background:rgba(37,99,235,.06)}

/* Koyu tema */
html[data-theme="dark"] #header .dropdown{background:#0f1929;border-color:#1e2d45;box-shadow:0 28px 70px -20px rgba(0,0,0,.7)}
html[data-theme="dark"] #header .dropdown li a strong{color:#e2e8f0}
html[data-theme="dark"] #header .dropdown li a small{color:#94a3b8}
html[data-theme="dark"] #header .dropdown li a > i{color:color-mix(in srgb,var(--mc) 60%,#fff);background:color-mix(in srgb,var(--mc) 18%,transparent)}
html[data-theme="dark"] #header .dropdown li a:hover,
html[data-theme="dark"] #header .dropdown li a:focus-visible{background:color-mix(in srgb,var(--mc) 12%,#0f1929);border-color:color-mix(in srgb,var(--mc) 35%,transparent)}
html[data-theme="dark"] #header .dropdown li a:hover > i{color:#fff}
html[data-theme="dark"] #header .dropdown li a:hover strong{color:#fff}
html[data-theme="dark"] #header .dropdown li a::after{border-color:color-mix(in srgb,var(--mc) 60%,#fff)}
html[data-theme="dark"] #header .dropdown .dd-foot a{background:#0b1120;border-color:#1e2d45}
html[data-theme="dark"] #header .dropdown .dd-foot a > span{color:#94a3b8}
html[data-theme="dark"] #header .dropdown .dd-foot a > span i,
html[data-theme="dark"] #header .dropdown .dd-foot a > em{color:#60a5fa}
html[data-theme="dark"] #header .dropdown .dd-foot a:hover{background:#111c33;border-color:#1e3a8a}
html[data-theme="dark"] #header .nav-dropdown:hover > a{color:#60a5fa;background:rgba(96,165,250,.08)}

/* Mobil menü: aynı ikon karoları */
#mobileNav .mobile-dropdown a{gap:12px}
#mobileNav .mobile-dropdown a i{
    width:34px;height:34px;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center;
    border-radius:10px;font-size:17px;color:#2563eb;background:rgba(37,99,235,.1);
}
html[data-theme="dark"] #mobileNav .mobile-dropdown a i{color:#93c5fd;background:rgba(96,165,250,.14)}

@media (max-width:1200px){
    #header .dropdown-grid{min-width:540px}
    #header .dropdown-grid.grid-3{grid-template-columns:repeat(2,1fr);min-width:600px}
}
@media (prefers-reduced-motion: reduce){
    #header .dropdown,#header .dropdown li a,#header .dropdown li a > i{transition:none}
}
/* Başlık sığmıyordu: logo(241px)+menü+butonlar ≥1280px'te alanı tam dolduruyor, "Ana Sayfa" logoya yapışıktı;
   1024-1279px'te ise butonlar ekran dışına taşıyordu (overflow-x:hidden ile kesiliyordu). */
#header .logo{flex-shrink:0;margin-right:clamp(.75rem,1.6vw,1.5rem)}
@media (min-width:1024px){#header .logo-img{height:46px;width:auto}}
@media (min-width:1024px) and (max-width:1279px){
  #header .nav-menu,#header .nav-buttons{display:none!important}
  #header .mobile-menu-btn{display:flex!important}
}
@media (min-width:1280px) and (max-width:1400px){#header .nav-menu > li > a{padding:.625rem .75rem;font-size:.875rem}}
/* TR üst çubuk dar laptoplarda (1025-1279) iki satıra kırılıyordu; EN başlıktaki düzeltmenin aynısı */
.top-bar .top-bar-link,.top-bar .status-indicator,.top-bar .status-text{white-space:nowrap}
@media (min-width:1025px) and (max-width:1279px){html[lang="tr"] .top-bar-right a[href="https://nerspeak.com/"],html[lang="tr"] .top-bar-right a[href="https://tiga.nerzen.com/tanitim"],html[lang="tr"] .top-bar-right .top-bar-divider:has(+ a[href="https://nerspeak.com/"]),html[lang="tr"] .top-bar-right .top-bar-divider:has(+ a[href="https://tiga.nerzen.com/tanitim"]){display:none}}
