/* Reset & Hardcore Grid Style */
.js-datatable {
    border-collapse: collapse !important;
    border: 1px solid #000 !important; /* Garis luar hitam */
}

.js-datatable thead th {
    background-color: #000 !important; /* Header Hitam */
    color: #ffffff !important;        /* Teks Putih */
    font-weight: 900 !important;
    text-transform: uppercase;
    padding: 6px 10px !important;
    border: 1px solid #333 !important; /* Garis antar header */
    font-size: 11px !important;
}

.js-datatable tbody td {
    padding: 4px 8px !important;
    border: 1px solid #ccc !important; /* Garis antar cell abu-abu */
    background-color: #fff !important; /* Paksa semua row putih (no zebra) */
    color: #333 !important;
    font-size: 11px !important;
}

/* Menghilangkan sisa-sisa rounded dan shadow */
.dt-container *, .dt-search input {
    border-radius: 0 !important;
    box-shadow: none !important;
}

/* Perbaikan Kotak Search DataTables */
.dt-search input, 
.dataTables_filter input {
    background-color: #ffffff !important; /* Latar Belakang Putih */
    color: #000000 !important;            /* Teks Hitam */
    border: 1px solid #000000 !important; /* Border Hitam Tegas */
    padding: 4px 10px !important;
    font-size: 11px !important;
    font-weight: bold !important;
    outline: none !important;
    border-radius: 0px !important;        /* Tetap kaku (Excel-style) */
    width: 200px !important;              /* Ukuran pas untuk pencarian */
}

/* Efek saat kotak search diklik (Focus) */
.dt-search input:focus, 
.dataTables_filter input:focus {
    border: 1px solid #2563eb !important; /* Sedikit aksen biru saat diketik */
    background-color: #ffffff !important;
}

/* Merapikan Label "Search" jika ada */
.dt-search label, 
.dataTables_filter label {
    font-size: 10px !important;
    font-weight: 900 !important;
    text-transform: uppercase !important;
    margin-right: 5px !important;
}

/* Pastikan header tetap rapi saat scroll aktif */
.dt-scroll-head th {
    border-bottom: 2px solid #000 !important;
}

/* Mempercantik scrollbar agar terlihat minimalis di dalam widget */
.dt-scroll-body::-webkit-scrollbar {
    width: 6px;
    height: 6px;
}
.dt-scroll-body::-webkit-scrollbar-track {
    background: #f1f5f9;
}
.dt-scroll-body::-webkit-scrollbar-thumb {
    background: #000; /* Hitam agar sesuai tema */
}

/* Menghilangkan shadow bawaan browser pada input date di dropdown */
input[type="date"]::-webkit-calendar-picker-indicator {
    cursor: pointer;
    filter: invert(0); /* Tetap hitam */
}

/* Transisi Alpine.js */
[x-cloak] { display: none !important; }