/* ============================================================================
   oa_tablo_kaydirma.css — MASAÜSTÜ TABLO KAYDIRMA ÇUBUĞU  (2026-08-09)

   SORUN (kullanıcı şikayeti: "kaydırma çubuğu yok, sağdaki MS skorları görünmüyor")
     · .bres-scroll (Toplu Analiz sonuç tablosu) ve .tblbox (Günün Analizleri):
       hiç ::-webkit-scrollbar kuralı YOKTU → Windows Chrome/Edge overlay
       (kendiliğinden gizlenen) çubuğu kullanıyor, koyu zeminde görünmüyor.
     · .tbl-scroll: kural vardı ama 8px + thumb rengi var(--bd)=#2a3349,
       zemin var(--raised)=#1a2138 → kontrast neredeyse sıfır, fark edilmiyor.
     · Tablolar gerçekten taşıyor: .bulk-tbl min-width:1400px,
       .bres-root table min-width:max-content. .wrap max-width:1480px olduğundan
       Windows ölçekleme (%125/%150) altında 1920px monitörde bile taşar.

   ÇÖZÜM
     · ≥1024px: çubuk KALIN (14px) ve amber. Herhangi bir ::-webkit-scrollbar
       ölçüsü tanımlamak Blink'te overlay çubuğu kapatır → klasik, hep görünür.
     · Firefox: scrollbar-width:auto + scrollbar-color.
     · <1024px: hiç dokunulmadı — mobilde parmakla kaydırılıyor.

   NOT: seçiciler `body` ile önekli. Sebebi: bulk-analysis.html içindeki satır-içi
   `.tbl-scroll::-webkit-scrollbar{height:8px}` kuralı bu dosyadan SONRA gelirse
   eşit özgüllükte kazanırdı. `body` öneki özgüllüğü yükseltip garantiye alır.
   ========================================================================== */

@media (min-width: 1024px) {

  /* ── Kaydırıcılar: kalın + tema renkli ─────────────────────────────── */
  body .tbl-scroll,
  body .bres-scroll,
  body .tblbox {
    scrollbar-width: auto;                 /* Firefox: "thin" DEĞİL */
    scrollbar-color: #ffc02e #14141b;      /* Firefox: thumb / track */
  }

  body .tbl-scroll::-webkit-scrollbar,
  body .bres-scroll::-webkit-scrollbar,
  body .tblbox::-webkit-scrollbar {
    height: 14px;
    width: 14px;
  }

  body .tbl-scroll::-webkit-scrollbar-track,
  body .bres-scroll::-webkit-scrollbar-track,
  body .tblbox::-webkit-scrollbar-track {
    background: #14141b;
    border-top: 1px solid rgba(255, 192, 46, .18);
  }

  body .tbl-scroll::-webkit-scrollbar-thumb,
  body .bres-scroll::-webkit-scrollbar-thumb,
  body .tblbox::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, #ffd062 0%, #ffc02e 45%, #c8911a 100%);
    border: 2px solid #14141b;             /* track ile arasına nefes payı */
    border-radius: 8px;
    min-width: 48px;                       /* tutulabilir olsun */
    box-shadow: inset 0 0 0 1px rgba(0, 0, 0, .35);
  }

  body .tbl-scroll::-webkit-scrollbar-thumb:hover,
  body .bres-scroll::-webkit-scrollbar-thumb:hover,
  body .tblbox::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, #ffdd8a 0%, #ffc02e 50%, #e0a520 100%);
  }

  body .tbl-scroll::-webkit-scrollbar-corner,
  body .bres-scroll::-webkit-scrollbar-corner,
  body .tblbox::-webkit-scrollbar-corner {
    background: #14141b;
  }

  /* ── TARİH ŞERİDİ (.datebar — Günün Analizleri) ─────────────────────
     Kaynakta çubuk BİLEREK gizlenmişti (gunun-analizleri.html:21-22:
     scrollbar-width:none + ::-webkit-scrollbar{display:none}). Mobilde doğru
     ama masaüstünde kusur: 1280px'de şerit taşıyor ve son gün düğmesi kesiliyor,
     fareyle kaydırmanın da hiçbir görsel tutamağı kalmıyor (sadece shift+tekerlek).
     Masaüstünde geri açıldı. Yükseklik 10px: şerit ~48px, 14px oransız kaçıyordu. */
  body .datebar {
    scrollbar-width: auto;
    scrollbar-color: #ffc02e #14141b;
  }
  body .datebar::-webkit-scrollbar {
    display: block;          /* satır-içi display:none'ı geri al */
    height: 10px;
    width: 10px;
  }
  body .datebar::-webkit-scrollbar-track {
    background: #14141b;
    border-top: 1px solid rgba(255, 192, 46, .18);
    border-radius: 0 0 10px 10px;
  }
  body .datebar::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, #ffd062 0%, #ffc02e 45%, #c8911a 100%);
    border: 2px solid #14141b;
    border-radius: 6px;
    min-width: 44px;
  }
  body .datebar::-webkit-scrollbar-thumb:hover {
    background: linear-gradient(180deg, #ffdd8a 0%, #ffc02e 50%, #e0a520 100%);
  }

  /* ── Sayfa (dikey) çubuğu — sadece viewport; iç paneller etkilenmez ── */
  html::-webkit-scrollbar { width: 12px; }
  html::-webkit-scrollbar-track { background: #14141b; }
  html::-webkit-scrollbar-thumb {
    background: linear-gradient(180deg, #ffc02e, #c8911a);
    border: 2px solid #14141b;
    border-radius: 7px;
  }
  html::-webkit-scrollbar-thumb:hover { background: linear-gradient(180deg, #ffdd8a, #e0a520); }
  html { scrollbar-width: auto; scrollbar-color: #ffc02e #14141b; }

  /* ── İPUCU 1: kenar gradyanı (daha içerik var) ──────────────────────── */
  .oa-kaydir-golge {
    position: absolute;
    pointer-events: none;
    opacity: 0;
    transition: opacity .18s ease;
    z-index: 3;
    width: 40px;
  }
  /* Hafif tutuldu: son kolonun rakamları okunur kalmalı, sadece "devamı var" hissi versin. */
  .oa-kaydir-golge.sag {
    background: linear-gradient(270deg, rgba(255, 192, 46, .16) 0%, rgba(10, 14, 26, .34) 50%, rgba(10, 14, 26, 0) 100%);
  }
  .oa-kaydir-golge.sol {
    background: linear-gradient(90deg, rgba(255, 192, 46, .16) 0%, rgba(10, 14, 26, .34) 50%, rgba(10, 14, 26, 0) 100%);
  }

  /* ── İPUCU 2: "← kaydırın →" rozeti (ilk halde, kaydırınca kaybolur) ─ */
  .oa-kaydir-ipucu {
    position: absolute;
    z-index: 4;
    pointer-events: none;
    opacity: 0;
    transition: opacity .18s ease;
    background: rgba(20, 20, 27, .94);
    border: 1px solid #ffc02e;
    color: #ffc02e;
    border-radius: 999px;
    padding: 3px 12px;
    font-size: 11px;
    font-weight: 800;
    letter-spacing: .4px;
    white-space: nowrap;
    box-shadow: 0 4px 14px rgba(0, 0, 0, .55);
    animation: oa-kaydir-nabiz 1.9s ease-in-out infinite;
  }
  @keyframes oa-kaydir-nabiz {
    0%, 100% { transform: translateX(0); }
    50%      { transform: translateX(4px); }
  }
  @media (prefers-reduced-motion: reduce) {
    .oa-kaydir-ipucu { animation: none; }
  }
}

/* ── Mobil: ipuçları gizli, çubuk davranışı DEĞİŞMEDİ ─────────────────── */
@media (max-width: 1023px) {
  .oa-kaydir-golge,
  .oa-kaydir-ipucu { display: none !important; }
}