/* ============================================================
   LEGACY DARK MODE — LAPISAN TRANSISI, AKAN DIHAPUS
   ============================================================

   File ini berisi mekanisme dark mode LAMA: menimpa utility terang
   (.bg-white, .text-gray-800, dst) dengan !important saat .dark aktif.

   Kenapa masih ada:
   Beberapa view belum dikonversi ke token semantik dan masih 100%
   bergantung pada lapisan ini — terutama views/category/index.php
   (45 class warna, 0 varian dark:) dan views/stock/movement.php (70, 0).
   Menghapusnya sekarang akan membuat kedua halaman itu rusak total
   di dark mode.

   Kenapa harus hilang:
   1. !important di sini MENGALAHKAN varian dark: yang ditulis kemudian,
      jadi selama file ini aktif, komponen baru tidak bisa mengatur
      warnanya sendiri.
   2. Pemetaannya menyamakan permukaan yang seharusnya berbeda
      (lihat catatan di bawah).

   Cara kerja transisi:
   Seluruh aturan di-scope ke `body.legacy-dark`. View yang sudah
   dikonversi ke token cukup menyetel di paling atas file-nya:

       $this->params['modernTheme'] = true;

   dan views/layouts/main.php akan melepas class tersebut untuk halaman
   itu saja. Jadi view lama dan baru bisa hidup berdampingan.

   Hapus file ini (beserta class body-nya di main.php) begitu tidak ada
   lagi view yang menyetel modernTheme = false.
   ============================================================ */

body.legacy-dark.dark,
.dark body.legacy-dark {
    background-color: #0f172a;
    color: #e2e8f0;
}

/* --- Permukaan --------------------------------------------- */

.dark body.legacy-dark .bg-white {
    background-color: #1e293b !important;
}

/* PERBAIKAN BUG: sebelumnya dipetakan ke #1e293b, sama persis dengan
   .bg-white di atas. Akibatnya input ber-.bg-gray-50 di dalam kartu
   ber-.bg-white kehilangan SELURUH kontras di dark mode — tepi field
   tidak terlihat sama sekali. Sekarang dibuat lebih gelap dari kartu
   supaya field terbaca sebagai bidang yang cekung. */
.dark body.legacy-dark .bg-gray-50,
.dark body.legacy-dark .bg-slate-50 {
    background-color: #0f172a !important;
}

.dark body.legacy-dark .bg-gray-100 {
    background-color: #334155 !important;
}

/* --- Teks --------------------------------------------------- */

.dark body.legacy-dark .text-gray-800,
.dark body.legacy-dark .text-gray-900 {
    color: #f1f5f9 !important;
}

.dark body.legacy-dark .text-gray-700 {
    color: #e2e8f0 !important;
}

.dark body.legacy-dark .text-gray-600 {
    color: #cbd5e1 !important;
}

.dark body.legacy-dark .text-gray-500 {
    color: #94a3b8 !important;
}

.dark body.legacy-dark .text-gray-400 {
    color: #64748b !important;
}

/* --- Border ------------------------------------------------- */

.dark body.legacy-dark .border-gray-100,
.dark body.legacy-dark .border-gray-200,
.dark body.legacy-dark .border-gray-200\/50 {
    border-color: #334155 !important;
}

.dark body.legacy-dark .border-gray-300 {
    border-color: #475569 !important;
}

/* --- Form --------------------------------------------------- */

.dark body.legacy-dark input,
.dark body.legacy-dark select,
.dark body.legacy-dark textarea {
    background-color: #0f172a !important;
    border-color: #475569 !important;
    color: #e2e8f0 !important;
}

.dark body.legacy-dark input::placeholder,
.dark body.legacy-dark textarea::placeholder {
    color: #64748b !important;
}

.dark body.legacy-dark input:focus,
.dark body.legacy-dark select:focus,
.dark body.legacy-dark textarea:focus {
    border-color: #6366f1 !important;
}

/* --- Header ------------------------------------------------- */

.dark body.legacy-dark .bg-white\/80 {
    background-color: rgba(30, 41, 59, 0.85) !important;
}

.dark body.legacy-dark header {
    background-color: rgba(30, 41, 59, 0.85) !important;
    border-color: #334155 !important;
}

/* --- Tabel -------------------------------------------------- */

.dark body.legacy-dark table thead {
    background-color: #1e293b !important;
}

.dark body.legacy-dark table thead th {
    color: #94a3b8 !important;
    border-color: #334155 !important;
}

.dark body.legacy-dark table tbody td {
    border-color: #1e293b !important;
    color: #e2e8f0 !important;
}

.dark body.legacy-dark table tbody tr:hover {
    background-color: #334155 !important;
}

/* --- Modal -------------------------------------------------- */

.dark body.legacy-dark .bg-black\/40 {
    background-color: rgba(0, 0, 0, 0.6) !important;
}

/* --- Hover -------------------------------------------------- */

.dark body.legacy-dark .hover\:bg-gray-50:hover {
    background-color: #334155 !important;
}

.dark body.legacy-dark .hover\:bg-gray-100:hover,
.dark body.legacy-dark .hover\:bg-gray-200:hover {
    background-color: #475569 !important;
}

/* --- Bayangan ----------------------------------------------- */

/* PERBAIKAN BUG: blok lama meratakan .shadow-sm, .shadow, .shadow-lg,
   .shadow-xl, DAN .shadow-2xl menjadi SATU nilai box-shadow yang sama.
   Efeknya modal (shadow-2xl) tampak sedatar kartu biasa (shadow-sm) —
   hierarki elevasi hilang sepenuhnya di dark mode.

   Blok itu dihapus, bukan dipindahkan. Skala bayangan bawaan Tailwind
   sudah benar; yang perlu di dark mode hanyalah membuatnya lebih pekat,
   dan itu ditangani token --shadow di tema baru. */

/* Catatan: aturan .dark untuk .glass-card dan scrollbar TIDAK ikut
   dipindah ke sini — keduanya masih dimiliki custom.css tanpa scope,
   sehingga tetap berlaku di semua halaman (lama maupun yang sudah
   dikonversi). Menyalinnya ke sini hanya akan membuat definisi ganda. */

/* --- Badge -------------------------------------------------- */

.dark body.legacy-dark .badge-in {
    background-color: #064e3b;
    color: #6ee7b7;
}

.dark body.legacy-dark .badge-out {
    background-color: #7f1d1d;
    color: #fca5a5;
}

.dark body.legacy-dark .badge-low-stock {
    background-color: #78350f;
    color: #fcd34d;
}
