/* ─────────────────────────────────────────────────────────────
   ANI-AUTH Header — paylaşılan stiller
   ───────────────────────────────────────────────────────────── */

/* FOUC önleme — sync (showGuest/showAuthed) çağrılana kadar her ikisini de
   gizle. ar-header-auth.js init sonunda <body>'ye .ar-header-ready class
   ekler; o anda doğru paneli göster (boş daire flicker'ını önler). */
body:not(.ar-header-ready) .header-user,
body:not(.ar-header-ready) .header-guest {
  visibility: hidden !important;
}

.header-user {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 10px;
  padding: 4px 6px;
  border-radius: 999px;
  cursor: pointer;
  transition: background 0.2s ease;
}
.header-user:hover { background: rgba(255, 255, 255, 0.06); }

.header-avatar {
  width: 34px;
  height: 34px;
  border-radius: 50%;
  overflow: hidden;
  flex-shrink: 0;
  display: grid;
  place-items: center;
  background: linear-gradient(135deg, #ff4466, #8b0000);
  border: 1px solid rgba(255, 255, 255, 0.12);
  font-family: 'Inter', system-ui, sans-serif;
}
.header-avatar img {
  width: 100%; height: 100%;
  object-fit: cover;
  display: block;
}
.header-avatar .avatar-initial {
  font-weight: 800;
  color: white;
  font-size: 15px;
  letter-spacing: -0.02em;
}

.header-username {
  font-size: 13px;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.85);
  max-width: 140px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.header-tier-badge {
  font-family: 'JetBrains Mono', monospace;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.1em;
  padding: 3px 8px;
  border-radius: 4px;
  background: rgba(232, 0, 61, 0.15);
  color: #ff4466;
  border: 1px solid rgba(232, 0, 61, 0.25);
}
.header-tier-badge[data-tier="elite"]    { background: rgba(232, 0, 61, 0.15); color: #ff4466; border-color: rgba(232, 0, 61, 0.3); }
.header-tier-badge[data-tier="ultra"]    { background: rgba(197, 0, 47, 0.15); color: #ff5577; border-color: rgba(197, 0, 47, 0.3); }
.header-tier-badge[data-tier="legendary"] {
  /* Premium butonla aynı dil: siyah zemin + altın yazı, hafif dış parıltı */
  background: linear-gradient(180deg, #16120a, #0b0906);
  color: #f6c453;
  border-color: rgba(246, 196, 83, 0.5);
  box-shadow: inset 0 1px 0 rgba(255, 215, 0, 0.1), 0 0 10px rgba(246, 196, 83, 0.14);
  text-shadow: 0 0 8px rgba(246, 196, 83, 0.35);
}

/* ─── Dropdown ─────────────────────────────────────────── */
/* ── Anizium tarzı profil dropdown — TÜM sayfalarda tutarlı (anasayfa kendi
   .ar-navbar__user özgül kurallarıyla aynı görünür; bu generic sürüm diğer
   sayfalarda — detay vb. — devreye girer). ── */
.header-dropdown {
  position: absolute;
  top: calc(100% + 12px);
  right: 0;
  min-width: 252px;
  display: block;
  margin: 0;
  background: var(--bg-elevated, #1a1a1a);
  border: 1px solid var(--border-strong, #2a2a2a);
  border-radius: var(--radius-lg, 12px);
  padding: 6px;
  box-shadow: var(--shadow-xl, 0 25px 50px -12px rgba(0, 0, 0, 0.6));
  opacity: 0;
  visibility: hidden;
  transform: translateY(-6px);
  transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s;
  z-index: 200;
}
.header-dropdown:not([hidden]) {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
.ar-pf__head {
  display: flex;
  flex-direction: column;
  gap: 3px;
  padding: 9px 11px 12px;
  margin-bottom: 6px;
  border-bottom: 1px solid var(--border, #1f1f1f);
}
.ar-pf__name {
  font-size: 14px;
  font-weight: 700;
  color: var(--text-primary, #f5f5f5);
}
.ar-pf__name:empty::before { content: "Hesabım"; }
.ar-pf__sub {
  font-size: 12px;
  color: var(--text-muted, #aaa);
}
.header-dropdown__link {
  position: relative;
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 11px;
  width: 100%;
  padding: 9px 12px;
  border-radius: var(--radius-sm, 6px);
  font-size: 13.5px;
  font-weight: 500;
  color: var(--text-secondary, #a3a3a3);
  text-decoration: none;
  cursor: pointer;
  background: transparent;
  border: 0;
  text-align: left;
  font-family: inherit;
  margin: 0;
  transition: background-color 0.16s ease, color 0.16s ease;
}
.header-dropdown__link::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  width: 2px;
  height: 0;
  transform: translateY(-50%);
  background: var(--primary, #dc2626);
  border-radius: 0 2px 2px 0;
  transition: height 0.16s ease;
}
.header-dropdown__link svg {
  width: 16px;
  height: 16px;
  color: var(--text-muted, #aaa);
  flex: 0 0 auto;
  transition: color 0.16s ease;
}
.header-dropdown__link:hover,
.header-dropdown__link:focus-visible {
  background: rgba(220, 38, 38, 0.12);
  color: #fff;
  outline: none;
}
.header-dropdown__link:hover::before,
.header-dropdown__link:focus-visible::before { height: 58%; }
.header-dropdown__link:hover svg,
.header-dropdown__link:focus-visible svg { color: var(--primary, #dc2626); }
.header-dropdown__link--premium .header-tier-badge { margin-left: auto; }
.ar-pf__sep { height: 1px; background: var(--border, #1f1f1f); margin: 6px 4px; }
.header-dropdown__link--logout { color: rgba(255, 100, 130, 0.92); }
.header-dropdown__link--logout svg { color: rgba(255, 100, 130, 0.7); }
.header-dropdown__link--logout:hover { background: rgba(232, 0, 61, 0.1); color: #ff4466; }
.header-dropdown__link--logout:hover svg { color: #ff4466; }
@media (prefers-reduced-motion: reduce) { .header-dropdown { transition: none; } }

/* HAFIF-MOD (2026-10-01, sahip: "bende yok ama bazi kisilerde cok fazla sikayet var, ana sayfada kasma").
   Olculdu (mobil, CPU 4x, girisli): ana sayfa ilk 10 sn'de ~6 sn donuyor; yarisi cizim (stil/layout/boyama).
   Ana sayfada ~50 backdrop-filter (hero rozetleri 24, slayt dugmeleri 16...), 30 kart parlamasi blur(25px)
   ve GORUNMEZ (opacity:0) 7 hero slaytinda 5'er blur(12px) katman vardi — guclu GPU'da fark edilmez, orta/dusuk
   telefonda kaydirma ve gecis kasar. Dokunmatik cihazda (CSS, JS beklemez) ve zayif masaustunde (ar-header-auth.js
   html.ar-hafif: <=4 cekirdek ya da <=4 GB bellek) bu efektler kapanir; bulaniklik yerine ayni tonda duz arka plan.
   Katman disi (unlayered) yazildi: @layer icindeki kurallari yener. */
@media (hover: none) and (pointer: coarse), (prefers-reduced-motion: reduce) {
  .hero-slide__meta-item, .btn-slide, .hero-slider__nav, .ar-rail__nav, .vip-curator__btn, .toast,
  .ar-bottomnav, .ar-mnav__overlay, .ar-search-overlay, .ar-search-box { -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }
  .hero-slider__nav { background-color: rgba(0, 0, 0, 0.55) !important; }
  .ar-search-overlay { background-color: rgba(0, 0, 0, 0.88) !important; }
  .anime-card__glow { display: none !important; }
  .hero-slide:not(.is-active), .hero-slide:not(.is-active) * { filter: none !important; }
  .hero-slide__poster-wrap, .hero-slide__logo-cap, .hero-slide__title, .hero-slide__desc, .hero-slide__meta, .hero-slide__actions { filter: none !important; }
  lord-icon { filter: none !important; }
}
html.ar-hafif .hero-slide__meta-item, html.ar-hafif .btn-slide, html.ar-hafif .hero-slider__nav, html.ar-hafif .ar-rail__nav,
html.ar-hafif .vip-curator__btn, html.ar-hafif .toast, html.ar-hafif .ar-bottomnav, html.ar-hafif .ar-mnav__overlay,
html.ar-hafif .ar-search-overlay, html.ar-hafif .ar-search-box { -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }
html.ar-hafif .hero-slider__nav { background-color: rgba(0, 0, 0, 0.55) !important; }
html.ar-hafif .ar-search-overlay { background-color: rgba(0, 0, 0, 0.88) !important; }
html.ar-hafif .anime-card__glow { display: none !important; }
html.ar-hafif .hero-slide:not(.is-active), html.ar-hafif .hero-slide:not(.is-active) * { filter: none !important; }
html.ar-hafif .hero-slide__poster-wrap, html.ar-hafif .hero-slide__logo-cap, html.ar-hafif .hero-slide__title,
html.ar-hafif .hero-slide__desc, html.ar-hafif .hero-slide__meta, html.ar-hafif .hero-slide__actions { filter: none !important; }
html.ar-hafif lord-icon { filter: none !important; }

/* YAZILIM-CIZIM (2026-10-01): tarayicinin donanim hizlandirmasi kapali (WebGL cizici yazilim) — ar-header-auth.js
   html.ar-yazilim ekler. Olculdu (ekran kartsiz Chrome, 1920x1080, girisli ana sayfa): 7 fps; filtreler kalkinca 38 fps,
   animasyonlar kalkinca 55 fps. Burada butun filter/backdrop-filter ve surekli donen suslemeler kapanir. */
html.ar-yazilim *, html.ar-yazilim *::before, html.ar-yazilim *::after {
  filter: none !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important;
}
html.ar-yazilim .ar-marquee__track, html.ar-yazilim .marquee-track, html.ar-yazilim .ar-navbar__logo,
html.ar-yazilim .ar-navbar__logo *, html.ar-yazilim .ar-star-border__inner, html.ar-yazilim .ar-li-flame,
html.ar-yazilim .badge-row, html.ar-yazilim .badge-row * { animation: none !important; }

/* Bilgilendirme notu — admin tasarim dili (siyah panel, mono etiket, #e8003d vurgu) */
#ar-gpu-not {
  position: fixed; left: 16px; bottom: 16px; z-index: 2147483000; width: min(360px, calc(100vw - 32px));
  background: #000; color: #ebebeb; border: 1px solid #1e1e1e; border-left: 3px solid #e8003d; border-radius: 10px;
  padding: 12px 14px 13px; box-shadow: 0 12px 32px rgba(0, 0, 0, 0.55); font-size: 13px; line-height: 1.5;
}
#ar-gpu-not .ar-gpu-not__ust { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; }
#ar-gpu-not .ar-gpu-not__etiket { font-family: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 10px; letter-spacing: 0.14em; color: #e8003d; }
#ar-gpu-not .ar-gpu-not__kapat { width: 26px; height: 26px; border: 1px solid #1e1e1e; border-radius: 6px; background: #0b0b0b; color: #9a9a9a; font-size: 16px; line-height: 1; cursor: pointer; }
#ar-gpu-not .ar-gpu-not__kapat:hover { background: #141414; color: #ebebeb; }
#ar-gpu-not .ar-gpu-not__baslik { margin: 0 0 4px; font-weight: 600; font-size: 14px; color: #fff; }
#ar-gpu-not .ar-gpu-not__metin { margin: 0; color: #a8a8a8; }
#ar-gpu-not .ar-gpu-not__metin b { color: #ebebeb; font-weight: 600; }
@media (max-width: 768px) { #ar-gpu-not { bottom: calc(76px + env(safe-area-inset-bottom, 0px)); } }