/* Smart Desa Mura — hanya untuk yang tidak bisa dilakukan Tailwind */

:root { color-scheme: light; }

html { -webkit-text-size-adjust: 100%; }

body {
  font-family: 'Plus Jakarta Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  font-size: 15px;
  line-height: 1.55;
  background: #F6F7F6;
}

/* Atribut `hidden` harus menang atas kelas tata letak Tailwind.
   Tanpa ini, elemen ber-`hidden` yang juga punya kelas seperti `flex` atau `grid`
   tetap terlihat, karena aturan dari lembar gaya penulis mengalahkan aturan bawaan browser. */
[hidden] { display: none !important; }

/* Angka lurus ke bawah: NIK, nomor KK, rupiah, tanggal */
.angka { font-variant-numeric: tabular-nums; letter-spacing: -0.01em; }

/* Skala ukuran baku (lihat PRD §2.2) */
.judul-halaman { font-size: 24px; font-weight: 700; line-height: 1.25; }
.judul-bagian  { font-size: 18px; font-weight: 600; line-height: 1.35; }
.teks-isi      { font-size: 15px; font-weight: 400; }
.label-tabel   { font-size: 13px; font-weight: 500; }
.angka-besar   { font-size: 32px; font-weight: 700; line-height: 1.15; font-variant-numeric: tabular-nums; }

/* Batang gulir yang tidak berisik */
.gulir-halus::-webkit-scrollbar { width: 8px; height: 8px; }
.gulir-halus::-webkit-scrollbar-thumb { background: #C3C8C6; border-radius: 999px; }
.gulir-halus::-webkit-scrollbar-track { background: transparent; }

/* Transisi hanya untuk yang menjawab aksi pengguna (PRD §2.5) */
.transisi-cepat { transition: background-color 150ms ease, border-color 150ms ease, color 150ms ease, opacity 150ms ease, transform 180ms ease; }

.modal-masuk { animation: modalMasuk 180ms ease-out; }
@keyframes modalMasuk { from { opacity: 0; transform: translateY(8px) scale(.985); } to { opacity: 1; transform: none; } }

.panel-masuk { animation: panelMasuk 200ms ease-out; }
@keyframes panelMasuk { from { transform: translateX(100%); } to { transform: none; } }

.toast-masuk { animation: toastMasuk 180ms ease-out; }
@keyframes toastMasuk { from { opacity: 0; transform: translateX(16px); } to { opacity: 1; transform: none; } }

.laci-masuk { animation: laciMasuk 180ms ease-out; }
@keyframes laciMasuk { from { transform: translateX(-100%); } to { transform: none; } }

/* Sorotan singkat saat kolom terisi otomatis */
.sorot-isi { animation: sorotIsi 900ms ease-out; }
@keyframes sorotIsi { 0% { background-color: #EEF4F1; } 100% { background-color: transparent; } }

/* Titik berdenyut pada indikator asisten */
.denyut span { display:inline-block; width:6px; height:6px; border-radius:999px; background:#6B7370; animation: denyut 1.2s infinite ease-in-out; }
.denyut span:nth-child(2) { animation-delay: .18s; }
.denyut span:nth-child(3) { animation-delay: .36s; }
@keyframes denyut { 0%,80%,100% { opacity:.25; transform: translateY(0);} 40% { opacity:1; transform: translateY(-3px);} }

/* Kursor mengetik pada jawaban asisten */
.kursor-ketik::after { content:'▌'; margin-left:1px; opacity:.6; animation: kedip 1s steps(2) infinite; }
@keyframes kedip { 50% { opacity: 0; } }

/* Dokumen surat A4 */
.kertas-a4 {
  width: 794px; min-height: 1123px; background:#fff; padding: 64px 72px;
  font-family: 'Plus Jakarta Sans', serif; color:#14211C;
  transform-origin: top center;
}
.kertas-a4 .isi-surat { font-size: 15px; line-height: 1.9; text-align: justify; }

/* Kartu Keluarga memakai margin lebih sempit daripada surat biasa, karena dua tabelnya
   lebar. Dengan padding 40px kiri-kanan tersisa ~714px, cukup untuk seluruh kolom blanko. */
.kertas-a4.kertas-kk { padding: 40px 40px 48px; }

/* Peta */
.leaflet-container { font-family: 'Plus Jakarta Sans', sans-serif; background:#1c2422; }
.leaflet-popup-content-wrapper { border-radius: 8px; }
.leaflet-popup-content { margin: 14px 16px; font-size: 14px; }
.penanda-kegiatan { display:flex; align-items:center; justify-content:center; border-radius:999px; border:2px solid #fff; box-shadow:0 1px 3px rgba(0,0,0,.35); color:#fff; font-size:11px; font-weight:700; }

/* Bingkai HP untuk tampilan warga */
.bingkai-hp {
  width: 390px; height: 800px; background:#fff; border:10px solid #14211C;
  border-radius: 44px; overflow: hidden; position: relative;
  box-shadow: 0 24px 48px -24px rgba(20,33,28,.45);
}
.poni-hp { position:absolute; top:0; left:50%; transform:translateX(-50%); width:150px; height:26px; background:#14211C; border-radius:0 0 16px 16px; z-index:20; }

/* Cetak: hanya dokumen surat yang keluar */
@media print {
  body * { visibility: hidden !important; }
  .area-cetak, .area-cetak * { visibility: visible !important; }
  .area-cetak { position: absolute; inset: 0; margin: 0; box-shadow: none; }
  /* Sedikit margin dalam supaya surat tetap rapi walau margin browser diset nol. */
  .kertas-a4 { width: 100%; min-height: auto; padding: 8mm 10mm; }
  /* Pratinjau di layar diperkecil dengan transform; saat dicetak harus penuh lagi. */
  .area-cetak * { transform: none !important; }
  .area-cetak > div { width: 100% !important; }
  .area-cetak { background: #fff !important; padding: 0 !important; border: 0 !important; }
}

/* Hormati prefers-reduced-motion (PRD §8) */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after {
    animation-duration: 0.001ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: 0.001ms !important;
  }
}