/* custom css */

body{
    font-family: Poppins;
}

.form-group{
  margin-bottom: 2px;
}

/*
 * JARAK ANTAR-FIELD FORM = 2px (permintaan pemilik, 2026-10-06):
 *   “jarak antar field input, buat 2px ya, itu cukup untuk menghemat tempat.”
 * Dipasang SEKALI di sini — jangan ditambal per view.
 * ⚠️ Utility Bootstrap 5 (`mb-1`/`mb-2`/`mb-3`) memakai `!important`, sehingga aturan
 *    `.form-group{margin-bottom:2px}` di atas KALAH pada baris yang masih membawa `mb-*`.
 *    Karena itu aturan ini (a) memakai `!important` dan (b) menyebut varian `mb-*`-nya supaya
 *    benar-benar menang, dan (c) menetapkan `margin-top:0` supaya jaraknya pasti 2px
 *    (tidak menumpuk 2+2 saat pembungkusnya flex).
 * Berlaku untuk dua bentuk baris field yang dipakai aplikasi:
 *   · `class="form-group row"` (paling banyak)  · `class="row mb-3"` di dalam dialog.
 */
.form-group.row,
.form-group.row.mb-0, .form-group.row.mb-1, .form-group.row.mb-2, .form-group.row.mb-3,
.modal-body > .row.mb-1, .modal-body > .row.mb-2, .modal-body > .row.mb-3 {
  margin-top: 0 !important;
  margin-bottom: 2px !important;
}

.error{
  font-size: small;
  color: red;
  font-style: italic;
}

.livestamp{
  font-size: small;
  color: goldenrod;  
  font-style: italic;
}

.modal-header{
  border-bottom: none;
}
.modal-footer{
  border-top: none;
}

/*
 * ============================================================
 * FORM DI DALAM DIALOG — WAJIB BISA DI-SCROLL VERTIKAL
 * ============================================================
 * Instruksi pemilik (2026-10-04): *"perbaiki semua form didalam dialog, pastikan vertical scroll
 * bila overlap."*
 *
 * AKAR MASALAH — bukan `modal-dialog-scrollable` yang salah, melainkan tingkat pembungkus `<form>`:
 * Bootstrap/tema menghitung tinggi badan modal lewat rantai flex
 *   `.modal-dialog-scrollable .modal-content{max-height:100%;overflow:hidden}` → `.modal-body{overflow-y:auto}`
 * Pola yang dipakai SELURUH aplikasi menyisipkan satu tingkat:
 *   <div class="modal-content"><div class="modal-header">…</div>
 *     <form><div class="modal-body">…banyak field…</div><div class="modal-footer">…</div></form>
 *   </div>
 * Akibatnya `.modal-body` tidak lagi anak langsung `.modal-content` → tidak mendapat batas tinggi →
 * isinya membesar melebihi dialog lalu **DIPOTONG** oleh `overflow:hidden` tanpa scrollbar
 * (form panjang tidak bisa diisi sampai habis). Dua aturan berikut mengembalikan rantai flex itu
 * untuk SEMUA dialog di aplikasi, tanpa perlu mengubah satu per satu view.
 */
.modal-content > form {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-height: 0;
  overflow: hidden;
}
.modal-content > form > .modal-body {
  min-height: 0;
}

/*
 * Jaring pengaman untuk dialog berisi form yang TIDAK memakai `modal-dialog-scrollable`:
 * tinggi dialog dibatasi viewport sehingga badan modal menggulir dan tombol Simpan/Batal tetap
 * terlihat. Dikecualikan di layar <576px karena di sana modal memakai mode layar penuh
 * (`modal-fullscreen-sm-down`) — membatasi tingginya akan menyisakan celah di tepi layar.
 */
@media (min-width: 576px) {
  .modal-content:has(> form) {
    max-height: calc(100vh - 2rem);
  }
  .modal-content:has(> form) > form > .modal-body {
    overflow-y: auto;
  }
}

#particles-js{
  width: 100%;
  height: 100%;
  
  background-image: url('');
  background-size: cover;
  background-position: 50% 50%;
  background-repeat: no-repeat;
  position: fixed;
  z-index: -10;
  
}

.input-inline{
  margin-left: -20px;
}

/* Allow text copy in tables */
table, 
table * {
  user-select: text !important;
  -webkit-user-select: text !important;
  -moz-user-select: text !important;
}

/*
 * Status konektivitas **INTERMITTENT** (kualitas koneksi naik-turun / paket hilang) — 2026-10-05.
 * Tema Greeva tidak menyediakan `bg-orange`, sedangkan INTERMITTENT perlu warna yang BERBEDA dari
 * DATA BASI (kuning) dan OFFLINE (merah). Dipakai `helpers/deviceStatus.js` (badge) & peta (titik).
 */
.bg-intermittent { background-color: #ea580c !important; color: #fff !important; }
.bg-intermittent-subtle { background-color: rgba(234, 88, 12, 0.12) !important; color: #c2410c !important; }
.text-intermittent { color: #c2410c !important; }