/* Wrapper harus bisa scroll */
.fi-ta-content {
    max-height: calc(100vh - 250px);
    overflow-y: auto;
}

/* Sticky header */
.fi-ta-table thead tr {
    position: sticky;
    top: 0;
    z-index: 10; 
    background: #f8fafc;
}
.fi-dropdown-panel {
    z-index: 20 !important;
}
/* Sticky kolom kiri (No SPDD) */
.sticky-col {
    position: sticky;
    width: 60px;
    left: 0;
    z-index: 5; 
    /* background dipindah ke th saja, biar body cell ikut warna row seperti sticky-col-2 */
}

/* Background khusus header kolom No. */
.fi-ta-table thead tr th.sticky-col {
    background: #f8fafc;
}
.fi-ta-table thead tr th.sticky-col-2 {
    background: #f8fafc;
}

.table-repeater-wrapper {
    width: 100% !important;
    overflow-x: auto !important;
    display: block !important;
}
html {
    scroll-behavior: smooth;
}

/* Supaya saat discroll, baris target tidak ketutup header sticky */
.scroll-target {
    scroll-margin-top: 150px; /* sesuaikan dengan tinggi header/topbar kamu */
    display: inline-block;
}
/* Paksa elemen table di dalamnya memiliki lebar minimal 1200px dan layout auto */
.table-repeater-wrapper table {
    min-width: 1200px !important;
    table-layout: auto !important; /* Mengganti default 'fixed' bawaan filament */
    width: 100% !important;
}
.table-repeater-wrapper .fi-fo-group svg,
.table-repeater-wrapper [data-component-type="time-picker"] svg,
.table-repeater-wrapper .fi-input-wrapper-prefix-icon,
.table-repeater-wrapper .fi-input-wrapper-suffix {
    display: none !important;
}

/* Menghilangkan padding sisa tempat ikon agar inputan teks tetap rapi di tengah */
.table-repeater-wrapper .fi-input-wrapper input {
    padding-left: 0.5rem !important;
    padding-right: 0.5rem !important;
    text-align: center; /* Opsional: membuat angka jam berposisi di tengah */
}

/* Opsional: Jaga agar baris header tidak pecah berantakan */
.table-repeater-wrapper th {
    white-space: nowrap !important;
}
.sticky-col-2 {
    position: sticky !important;
    left: 60px;
    z-index: 5;
    /*background: #f8fafc;*/
}

tr:nth-child(even) .sticky-col-2 {
    background-color: #fafafa;
}

.fi-ta-table thead tr th.sticky-col,
.fi-ta-table thead tr th.sticky-col-2 {
    z-index: 60;
}

.dark .sticky-col-2 {
    background-color: #18181b;
}
.dark tr:nth-child(odd) .sticky-col-2 {
    background-color: #18181b; 
}

.dark tr:nth-child(even) .sticky-col-2 {
    background-color: #242427;
}

.dark .fi-fo-table-repeater thead th {
    background-color: #18181b !important; /* abu gelap */
    color: #f3f4f6 !important;            /* teks terang */
}
.dark .aw-table-repeater-container th {
    background-color: #18181b !important; /* Warna abu gelap */
    color: #f3f4f6 !important;           /* Warna teks terang */
    border-color: #374151 !important;    /* Warna border agar tidak kontras */
}

/* Jika Anda ingin baris di dalam repeater juga menyesuaikan saat Dark Mode */
.dark .aw-table-repeater-container td {
    background-color: #111827; /* Lebih gelap dari header */
}
tr:nth-child(even) .sticky-col {
    background-color: #fafafa; /* abu-abu muda untuk baris genap */
}
.dark .custom-header-dark th {
    background-color: #18181b !important;
    color: #f3f4f6 !important;
    border-bottom: 1px solid #3f3f46; 
}

/* Memperbaiki pojok kiri atas */
.dark .custom-header-dark th:first-child {
    border-top-right-radius: 1.0rem; /* Sesuaikan dengan radius repeater kamu */
}

/* Memperbaiki pojok kanan atas */
.dark .custom-header-dark th:last-child {
    border-top-right-radius: 1.0rem; /* Sesuaikan dengan radius repeater kamu */
}
.dark .custom-header-dark th:first-child {
    border-top-left-radius: 1.0rem; /* Sesuaikan dengan radius repeater kamu */
}

/* Memperbaiki pojok kanan atas */
.dark .custom-header-dark th:last-child {
    border-top-left-radius: 1.0rem; /* Sesuaikan dengan radius repeater kamu */
}

tr:nth-child(odd) .sticky-col {
    background-color: #ffffff; /* putih untuk baris ganjil */
}
tr:nth-child(odd) .sticky-col-2 {
    background-color: #ffffff; /* putih untuk baris ganjil */
}

.dark .fi-ta-table thead tr {
    background-color:#18181b; 
}
.dark .sticky-col {
    background-color: #18181b; 
}
.dark tr:nth-child(odd) .sticky-col {
    background-color: #18181b; 
}

/* Baris Genap di Dark Mode */
.dark tr:nth-child(even) .sticky-col {
    background-color: #242427;
}

.fi-modal-window, 
.fi-modal-backdrop {
    z-index: 9999;
}

/* ==========================================================================
   PENGATURAN TABEL SECARA GLOBAL
   ========================================================================== */

/* Batasi tinggi tabel agar header atas tetap sticky saat di-scroll vertikal */
.fi-ta-content {
    max-height: calc(100vh - 250px);
    overflow-y: auto;
}

/* Sticky header atas tabel (Wajib background agar data tidak menembus saat di-scroll) */
/*.fi-ta-table thead tr {*/
/*    position: sticky;*/
/*    top: 0;*/
/*    z-index: 5; */
/*    background-color: white;*/
/*}*/

.dark .fi-ta-table thead tr {
    background-color: #18181b; 
}


@media (max-width: 768px) {
    .sticky-col,
    .sticky-col-2 {
        position: static !important;
        left: auto !important;
        z-index: auto !important;
    }
}