/*
 * ================================================================
 * Eternal White Palette
 * Putih Salju  #FFFFFF  — latar belakang utama
 * Abu-abu Muda #F5F5F5  — elemen sekunder, permukaan card
 * Abu-abu Sedang #D3D3D3 — tombol, border, aksen
 *
 * Teks: #2D2D2D (utama) | #757575 (sekunder) | #AAAAAA (muted)
 * ================================================================
 */

/* ================================================================
   1. LATAR BELAKANG HALAMAN
   ================================================================ */
body { background-color: #FFFFFF; }
.bg-gray-50  { background-color: #FFFFFF !important; }

/* ================================================================
   2. BORDER
   ================================================================ */
.border-gray-100 { border-color: #D3D3D3 !important; }
.border-gray-200 { border-color: #D3D3D3 !important; }
.divide-gray-100 > * + * { border-color: #D3D3D3 !important; }

/* ================================================================
   3. PERMUKAAN GELAP → Abu-abu Muda
   ================================================================ */
.bg-gray-950 {
  background-color: #F5F5F5 !important;
  color: #2D2D2D !important;
}
/* Teks yang sebelumnya putih di atas latar gelap */
.bg-gray-950.text-white          { color: #2D2D2D !important; }
.bg-gray-950 .text-white         { color: #ffffff !important; }
.bg-gray-950 .text-gray-300      { color: #888888 !important; }
.bg-gray-950 .text-gray-400      { color: #AAAAAA !important; }
.bg-gray-950 .text-gray-500      { color: #888888 !important; }
.bg-gray-950 .text-gray-600      { color: #757575 !important; }
.bg-gray-950 .text-gray-700      { color: #555555 !important; }

/* ================================================================
   4. TOMBOL UTAMA — Hitam → Ruangcamp #607d70
   ================================================================ */
.bg-black {
  background-color: #607d70 !important;
  color: #FFFFFF !important;
}
.bg-gray-800 { background-color: #506860 !important; color: #FFFFFF !important; }
.bg-gray-900 { background-color: #607d70 !important; color: #FFFFFF !important; }

.hover\:bg-gray-800:hover  { background-color: #506860 !important; color: #FFFFFF !important; }
.hover\:bg-black:hover     { background-color: #506860 !important; }

/* Shadow tombol hijau */
.bg-black.shadow-xl,
.bg-black.shadow-lg {
  box-shadow: 0 2px 12px rgba(96, 125, 112, 0.30) !important;
}

/* ================================================================
   5. AKSEN ORANYE → Ruangcamp #607d70
   ================================================================ */
.bg-orange-500 { background-color: #607d70 !important; color: #FFFFFF !important; }
.bg-orange-600 { background-color: #506860 !important; color: #FFFFFF !important; }
.hover\:bg-orange-600:hover { background-color: #506860 !important; }

.bg-orange-50  { background-color: #F0F4F2 !important; }
.bg-orange-100 { background-color: #E5EDEA !important; }

.border-orange-100 { border-color: #a8c0b8 !important; }
.border-orange-200 { border-color: #a8c0b8 !important; }

.text-orange-100 { color: #c8ddd8 !important; }
.text-orange-300 { color: #8aada4 !important; }
.text-orange-400 { color: #7a9d94 !important; }
.text-orange-500 { color: #607d70 !important; }
.text-orange-600 { color: #4f6a5d !important; }
.text-orange-700 { color: #3f5549 !important; }
.text-orange-800 { color: #2d3d35 !important; }

.shadow-orange-500\/20,
.shadow-orange-500\/30 { box-shadow: 0 2px 12px rgba(96, 125, 112, 0.25) !important; }

/* ================================================================
   6. ELEMEN NAVIGASI
   ================================================================ */
/* Tenant bottom nav — sudah bg-white, hanya perbaiki border */
nav.fixed { border-top-color: #D3D3D3 !important; }

/* Admin nav & header (bg-gray-950 → putih) */
nav.fixed.bg-gray-950 {
  background-color: #FFFFFF !important;
  border-top: 1px solid #D3D3D3 !important;
}
nav.fixed.bg-gray-950 .text-white  { color: #2D2D2D !important; }
nav.fixed.bg-gray-950 .text-gray-500 { color: #AAAAAA !important; }

header.fixed.bg-gray-950 {
  background-color: #FFFFFF !important;
  border-bottom: 1px solid #D3D3D3 !important;
}
header.fixed.bg-gray-950 .text-white     { color: #2D2D2D !important; }
header.fixed.bg-gray-950 .text-white\/70 { color: #888888 !important; }
header.fixed.bg-gray-950 .bg-white\/10  { background-color: #F5F5F5 !important; }
header.fixed.bg-gray-950 .text-gray-500 { color: #888888 !important; }

/* Dot aktif sudah diatur di section 7 */

/* ================================================================
   7. INPUT & FOCUS
   ================================================================ */
.focus\:ring-black:focus    { --tw-ring-color: #607d70 !important; }
.focus\:ring-orange-4:focus { --tw-ring-color: #607d70 !important; }
input:focus, select:focus, textarea:focus {
  outline: none;
  box-shadow: 0 0 0 2px rgba(96, 125, 112, 0.35) !important;
}

/* Dot aktif admin nav */
.bg-orange-400 { background-color: #607d70 !important; }

/* ================================================================
   8. LATAR ABU-ABU SEKUNDER
   ================================================================ */
.bg-gray-100  { background-color: #F5F5F5 !important; }
.hover\:bg-gray-100:hover  { background-color: #EFEFEF !important; }
.hover\:bg-gray-200:hover  { background-color: #E8E8E8 !important; }
.hover\:bg-gray-50:hover   { background-color: #F5F5F5 !important; }
.hover\:border-gray-300:hover { border-color: #BEBEBE !important; }

/* ================================================================
   9. CHIP / FILTER AKTIF
   ================================================================ */
/* Chip aktif (bg-black text-white) sudah tercakup di poin 4 */

/* ================================================================
   10. BAYANGAN (lebih lembut)
   ================================================================ */
.shadow-2xl { box-shadow: 0 8px 32px rgba(0, 0, 0, 0.10) !important; }
.shadow-xl  { box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08) !important; }
.shadow-lg  { box-shadow: 0 4px 16px rgba(0, 0, 0, 0.07) !important; }
.shadow-sm  { box-shadow: 0 1px 4px  rgba(0, 0, 0, 0.05) !important; }

/* ================================================================
   11. ADMIN LOGIN DARK → PUTIH
   ================================================================ */
.bg-gray-950.min-h-screen    { background-color: #F5F5F5 !important; }
.bg-white\/5                 { background-color: #FFFFFF !important; border: 1px solid #D3D3D3 !important; }
.bg-white\/10                { background-color: #F5F5F5 !important; }
.border-white\/10            { border-color: #D3D3D3 !important; }
.text-gray-700.text-xs       { color: #888888 !important; }
.text-gray-600.text-xs       { color: #888888 !important; }

/* Input admin login dark mode */
.border-white\/10.bg-white\/5 {
  border-color: #D3D3D3 !important;
  background-color: #FFFFFF !important;
  color: #2D2D2D !important;
}
.text-white.placeholder-gray-600::placeholder { color: #AAAAAA !important; }
input.text-white { color: #2D2D2D !important; }
input.placeholder-gray-600::placeholder { color: #AAAAAA !important; }