/* ═════════════════════════════════════════════════════════════════════
   ipower2 GLOBAL TABLO YATAY KAYDIRMA — 2026-08-21
   Kullanıcı isteği: Liste tabloların genişlikleri viewport'u aşınca
   sağa/sola kaydırma barı görünür olsun. Her sayfaya include etmeye
   gerek yok — _Layout.cshtml'e link edildi, tüm sayfalar otomatik alır.

   Kapsam:
     1. AG Grid (`.ag-theme-alpine`, `.ag-theme-balham` vs.) — horizontal
        scrollbar minimum yükseklik + macOS WebKit overlay scrollbar override
        (varsayılan çok ince ve fade-out olur → görünmez sanılır).
     2. DataTables (`.dataTables_wrapper` + `.dataTables_scrollBody`) — overflow-x auto.
     3. Native `<table>` — `.ipower2-tbl-wrap` (opt-in) veya `.table-responsive`
        (Bootstrap) veya `[data-tbl-scroll]` attribute'lu wrapper'lar.
     4. Genel container: `.ipower2-scroll-x` utility class.
   ═════════════════════════════════════════════════════════════════════ */

/* ─── AG Grid horizontal scrollbar — DAİMA görünür (overlay/fade davranışı devre dışı) ─── */
/* 2026-08-24 rev: `overflow-x: scroll` (auto değil) + `visibility: visible` + explicit display:block
   → macOS/Windows overlay scrollbar fade davranışı override edilir; sipariş listesi gibi geniş grid'de
   sağa-sola scroll her zaman görünür.
   2026-08-27 rev2: Yükseklik 14px → 16px (Windows'ta mouse ile tutarak sürüklemek için daha rahat;
   14px thumb küçük düğüm oluyordu).
   2026-08-28 rev3: AG Grid v31 alpine tema `.ag-body-horizontal-scroll` height'ını runtime'da
   `--ag-scrollbar-min-width` variable üzerinden JS ile hesaplar (native scrollbar height ölçümü).
   macOS'ta 0 dönerse `height: 0` inline stili basar → CSS `!important` height'ı zorlar ama variable
   0 kaldığından bazı sub-container'lar sıfır kalır. Variable'ı da 16px'e çıkardık — hem OS-independent
   hem de CSS override ile birlikte kesin görünürlük.
   Ek: `pointer-events: auto` — bazı parent wrapper'lar (kart/panel) `pointer-events: none` ile scrollbar
   click'ini yiyebiliyor; explicit auto ile mouse-drag garantili. */
.ag-theme-alpine,
.ag-theme-alpine-dark,
.ag-theme-balham,
.ag-theme-material {
    --ag-scrollbar-min-width: 16px;
}
.ag-theme-alpine .ag-body-horizontal-scroll,
.ag-theme-alpine-dark .ag-body-horizontal-scroll,
.ag-theme-balham .ag-body-horizontal-scroll,
.ag-theme-material .ag-body-horizontal-scroll {
    min-height: 16px !important;
    height: 16px !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    pointer-events: auto !important;
}

.ag-theme-alpine .ag-body-horizontal-scroll-viewport,
.ag-theme-alpine-dark .ag-body-horizontal-scroll-viewport,
.ag-theme-balham .ag-body-horizontal-scroll-viewport,
.ag-theme-material .ag-body-horizontal-scroll-viewport {
    height: 16px !important;
    min-height: 16px !important;
    overflow-x: scroll !important;   /* AUTO değil SCROLL — alan hep rezerve, scrollbar hep görünür */
    overflow-y: hidden !important;
    pointer-events: auto !important;
}
.ag-theme-alpine .ag-body-horizontal-scroll-container,
.ag-theme-alpine-dark .ag-body-horizontal-scroll-container,
.ag-theme-balham .ag-body-horizontal-scroll-container,
.ag-theme-material .ag-body-horizontal-scroll-container {
    height: 16px !important;
    min-height: 16px !important;
}

/* AG Grid body: her zaman auto horizontal (Firefox/Safari overlay override) */
.ag-theme-alpine .ag-body-viewport,
.ag-theme-alpine-dark .ag-body-viewport,
.ag-theme-balham .ag-body-viewport,
.ag-theme-material .ag-body-viewport {
    overflow-x: auto !important;
}

/* AG Grid scrollbar track & thumb — WebKit + Firefox (16px + koyu slate thumb, hep görünür, Windows'ta tıklanabilir) */
.ag-theme-alpine .ag-body-horizontal-scroll-viewport::-webkit-scrollbar,
.ag-theme-alpine-dark .ag-body-horizontal-scroll-viewport::-webkit-scrollbar,
.ag-theme-balham .ag-body-horizontal-scroll-viewport::-webkit-scrollbar,
.ag-theme-material .ag-body-horizontal-scroll-viewport::-webkit-scrollbar {
    height: 16px !important;
    width: 16px !important;
    background-color: #e2e8f0;
}
.ag-theme-alpine .ag-body-horizontal-scroll-viewport::-webkit-scrollbar-track,
.ag-theme-alpine-dark .ag-body-horizontal-scroll-viewport::-webkit-scrollbar-track,
.ag-theme-balham .ag-body-horizontal-scroll-viewport::-webkit-scrollbar-track,
.ag-theme-material .ag-body-horizontal-scroll-viewport::-webkit-scrollbar-track {
    background-color: #e2e8f0;
    border-radius: 4px;
}
.ag-theme-alpine .ag-body-horizontal-scroll-viewport::-webkit-scrollbar-thumb,
.ag-theme-alpine-dark .ag-body-horizontal-scroll-viewport::-webkit-scrollbar-thumb,
.ag-theme-balham .ag-body-horizontal-scroll-viewport::-webkit-scrollbar-thumb,
.ag-theme-material .ag-body-horizontal-scroll-viewport::-webkit-scrollbar-thumb {
    background-color: #64748b;
    border-radius: 7px;
    border: 2px solid #e2e8f0;
    min-width: 40px;
}
.ag-theme-alpine .ag-body-horizontal-scroll-viewport::-webkit-scrollbar-thumb:hover,
.ag-theme-alpine-dark .ag-body-horizontal-scroll-viewport::-webkit-scrollbar-thumb:hover,
.ag-theme-balham .ag-body-horizontal-scroll-viewport::-webkit-scrollbar-thumb:hover,
.ag-theme-material .ag-body-horizontal-scroll-viewport::-webkit-scrollbar-thumb:hover {
    background-color: #334155;
}
/* 2026-09-11: `scrollbar-width: auto` + `scrollbar-color` kaldırıldı — Chromium yeni sürümlerde
   `scrollbar-width` custom `::-webkit-scrollbar` pseudo-elements'i bypass edip overlay fade davranışı
   yapıyordu (Mac'te thumb görünmüyordu). Firefox için scrollbar-color kalabilir ama Chrome'u öldürmesi
   kritikti; Firefox default'ta da custom görünür. */

/* ─── DataTables wrapper — horizontal scroll ─── */
.dataTables_wrapper {
    overflow-x: auto;
}
.dataTables_wrapper .dataTables_scroll,
.dataTables_wrapper .dataTables_scrollBody {
    overflow-x: auto !important;
}
.dataTables_wrapper .dataTables_scrollBody::-webkit-scrollbar {
    height: 12px;
    -webkit-appearance: none;
}
.dataTables_wrapper .dataTables_scrollBody::-webkit-scrollbar-thumb {
    background-color: #94a3b8;
    border-radius: 6px;
    border: 2px solid #f1f5f9;
}

/* ─── Native <table> — .ipower2-tbl-wrap / [data-tbl-scroll] / .table-responsive utility ─── */
.ipower2-tbl-wrap,
[data-tbl-scroll],
.ipower2-scroll-x {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
}
.ipower2-tbl-wrap::-webkit-scrollbar,
[data-tbl-scroll]::-webkit-scrollbar,
.ipower2-scroll-x::-webkit-scrollbar,
.table-responsive::-webkit-scrollbar {
    height: 12px;
    -webkit-appearance: none;
}
.ipower2-tbl-wrap::-webkit-scrollbar-thumb,
[data-tbl-scroll]::-webkit-scrollbar-thumb,
.ipower2-scroll-x::-webkit-scrollbar-thumb,
.table-responsive::-webkit-scrollbar-thumb {
    background-color: #94a3b8;
    border-radius: 6px;
    border: 2px solid #f1f5f9;
}
.ipower2-tbl-wrap::-webkit-scrollbar-thumb:hover,
[data-tbl-scroll]::-webkit-scrollbar-thumb:hover,
.ipower2-scroll-x::-webkit-scrollbar-thumb:hover,
.table-responsive::-webkit-scrollbar-thumb:hover {
    background-color: #64748b;
}

/* 2026-08-27: Bootstrap default `.table` wrap yoksa da yatay scroll — sayfa sayfa .table-responsive
   eklemek yerine global fallback. `.card-body > .table` gibi mainstream container'lar için otomatik.
   `.table-responsive` içindeki tabloları etkilemez (o sarma zaten scroll sağlar). */
.card-body > .table,
.container > .table,
.container-fluid > .table,
.card > .table,
main > .table {
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
}
/* Aynı zamanda body genelinde herhangi bir .table.table-scroll utility class'ıyla opt-in olarak
   ekstra scroll wrap alınabilir — sayfa-özel kullanımlar için. */
.table.table-scroll {
    display: block;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    max-width: 100%;
}