/* ════════════════════════════════════════════════════════════════════
   BUILD 151/152 — Premium Sol Sidebar (Faz 2)
   Mevcut .vdn-topnav (yatay üst menü) -> dikey premium SOL SIDEBAR.
   - SADECE dashboard (index — ticker'lı sayfa) ve SADECE desktop (>=769px).
   - Mobil (<=768px) ve diğer sayfalar AYNEN kalır (drawer + alt nav).
   - Nav mantığı/linkleri/gating'i DEĞİŞMEZ; sadece görünüm + yerleşim.
   - Tamamen geri-alınabilir: bu dosyanın <link>'ini index.html'den silmek yeter.
   - Sitenin kendi --v4-* token'larını kullanır (bütünlük garantili).
   ════════════════════════════════════════════════════════════════════ */

/* İkon ve rozet, varsayılan olarak gizli — alt sayfaların yatay menüsü değişmesin */
.vdn-topnav .vdn-ic,
.vdn-topnav .vdn-badge { display: none; }

@media (min-width: 769px) {

  /* ── .vdn-topnav -> SOL SIDEBAR (sadece dashboard) ───────────────── */
  body.vdn-host:has(.ticker-wrap) .vdn-topnav {
    top: 86px !important;            /* topbar(52) + ticker(34) altı */
    left: 0 !important;
    right: auto !important;
    bottom: 0 !important;
    width: 238px !important;
    z-index: 40 !important;          /* overlay/modal'ların ALTINDA kalsın */
    flex-direction: column !important;
    align-items: stretch !important;
    flex-wrap: nowrap !important;
    gap: 3px !important;
    padding: 16px 12px 18px !important;
    overflow-y: auto;
    overflow-x: hidden;
    border-bottom: none !important;
    border-right: 1px solid rgba(0,209,255,0.22) !important;
    background: linear-gradient(180deg, rgba(10,22,40,0.80), rgba(2,5,13,0.66)) !important;
    box-shadow: 0 0 34px -10px rgba(0,209,255,0.32) !important;
  }
  /* BUILD 154 — sidebar dış çerçeve: renkli accent çizgi + glow (panellerle aynı dil) */
  body.vdn-host:has(.ticker-wrap) .vdn-topnav::before {
    content: "";
    position: absolute;
    top: 0; left: 14px; right: 14px;
    height: 2px;
    border-radius: 2px;
    background: linear-gradient(90deg, transparent, var(--v4-cyan, #00D1FF), transparent);
    box-shadow: 0 0 10px rgba(0,209,255,0.55);
    pointer-events: none;
    z-index: 2;
  }
  body.vdn-host:has(.ticker-wrap) .vdn-topnav::-webkit-scrollbar { width: 6px; }
  body.vdn-host:has(.ticker-wrap) .vdn-topnav::-webkit-scrollbar-thumb {
    background: rgba(0,209,255,0.18); border-radius: 6px;
  }

  /* ── Link satırları (dikey, ikon + etiket) ───────────────────────── */
  body.vdn-host:has(.ticker-wrap) .vdn-topnav a {
    display: flex !important;
    align-items: center !important;
    gap: 12px;
    width: 100%;
    padding: 11px 13px !important;
    border-radius: 11px !important;
    font-size: 13.5px;
    white-space: nowrap;
  }
  body.vdn-host:has(.ticker-wrap) .vdn-topnav a:hover {
    background: rgba(0,209,255,0.07) !important;
    color: var(--v4-text, #EAF6FF) !important;
  }
  body.vdn-host:has(.ticker-wrap) .vdn-topnav a.active {
    background: linear-gradient(90deg, rgba(0,209,255,0.16), rgba(0,209,255,0.03)) !important;
    color: var(--v4-cyan, #00D1FF) !important;
    font-weight: 600;
  }
  /* aktif gösterge: alt çizgi yerine SOL kenar şeridi */
  body.vdn-host:has(.ticker-wrap) .vdn-topnav a.active::after {
    content: "" !important;
    left: 0 !important; right: auto !important;
    top: 8px !important; bottom: 8px !important;
    width: 3px !important; height: auto !important;
    border-radius: 3px;
    background: var(--v4-cyan, #00D1FF) !important;
  }

  /* ── İkon tile (sidebar'da görünür) ──────────────────────────────── */
  body.vdn-host:has(.ticker-wrap) .vdn-topnav .vdn-ic {
    display: inline-flex; align-items: center; justify-content: center;
    width: 30px; height: 30px; flex-shrink: 0;
    border-radius: 9px; font-size: 15px; line-height: 1;
    background: rgba(0,209,255,0.08);
  }
  body.vdn-host:has(.ticker-wrap) .vdn-topnav a.active .vdn-ic {
    background: rgba(0,209,255,0.16);
  }
  body.vdn-host:has(.ticker-wrap) .vdn-topnav .vdn-lbl { flex: 1; }

  /* ── Elite rozeti ────────────────────────────────────────────────── */
  body.vdn-host:has(.ticker-wrap) .vdn-topnav .vdn-badge {
    display: inline-block; margin-left: auto;
    font-size: 9px; font-weight: 700; letter-spacing: 0.04em;
    color: #1c1402;
    background: linear-gradient(135deg, var(--v4-warn, #FFC247), #ffd86b);
    padding: 2px 7px; border-radius: 6px;
  }

  /* ── Premium item'i sidebar'ın en altına ─────────────────────────── */
  body.vdn-host:has(.ticker-wrap) .vdn-topnav a.vdn-premium {
    margin-left: 0 !important;
    margin-top: auto !important;
    justify-content: center;
  }

  /* ── İçeriği sidebar kadar sağa kaydır ───────────────────────────── */
  body.vdn-host:has(.ticker-wrap) .main,
  body.vdn-host:has(.ticker-wrap) .founder-section-v2 {
    margin-left: 238px !important;
    margin-right: auto !important;
    max-width: none !important;
  }

  /* ── Futures Lab odak modu: sidebar gizle, içerik tam genişlik ───── */
  body.cc-fx .vdn-topnav { display: none !important; }
  body.cc-fx .main,
  body.cc-fx .founder-section-v2 { margin-left: auto !important; }
}
