/* ===========================================================
   KiSmart - Layout Fix v4 (2026-05-30)
   - Mode buttons (Otomatis / Manual) → 2-col grid + warna aktif jelas
   - Tombol kehadiran siswa (H S I A B D U) → 7-col grid rapi
   - Bottom nav lebih rapat ke bawah
   - Hilangkan kotak berlapis (double card padding)
   =========================================================== */

/* ---------- Bottom nav: rapat ke bawah ---------- */
nav.fixed.inset-x-0.bottom-0,
.bottom-nav,
[class*="bottom-nav"]{
  padding-bottom: 0 !important;
}
nav.fixed.inset-x-0.bottom-0 > *,
.bottom-nav > *{
  padding-bottom: max(2px, env(safe-area-inset-bottom)) !important;
}
nav.fixed.inset-x-0.bottom-0 a,
nav.fixed.inset-x-0.bottom-0 button{
  min-height: 52px !important;
}
/* override audit-polish yang menaikkan posisi */
:root{
  --bottom-nav-h: 60px !important;
}
main, [data-page], .page-content{
  padding-bottom: calc(60px + env(safe-area-inset-bottom)) !important;
}

/* ---------- Mode selector: grid 2 kolom ---------- */
[data-ns-mode-group="1"]{
  display: grid !important;
  grid-template-columns: 1fr 1fr !important;
  gap: 10px !important;
  padding: 6px !important;
  background: #f3f6f4 !important;
  border-radius: 14px !important;
}
[data-ns-mode-group="1"] > button{
  width: 100% !important;
  margin: 0 !important;
  min-height: 48px !important;
  border-radius: 10px !important;
  border: 2px solid transparent !important;
  background: #ffffff !important;
  color: #4b5563 !important;
  font-weight: 600 !important;
  font-size: 14px !important;
  transition: all 150ms ease !important;
  box-shadow: 0 1px 2px rgba(0,0,0,.04) !important;
}
[data-ns-mode-group="1"] > button[data-ns-active="otomatis"]{
  background: #1f7a4d !important;
  border-color: #1f7a4d !important;
  color: #ffffff !important;
  box-shadow: 0 4px 12px rgba(31,122,77,.28) !important;
}
[data-ns-mode-group="1"] > button[data-ns-active="manual"]{
  background: #4f46e5 !important;
  border-color: #4f46e5 !important;
  color: #ffffff !important;
  box-shadow: 0 4px 12px rgba(79,70,229,.28) !important;
}

/* ---------- Tombol kehadiran siswa: grid 7 kolom ---------- */
[data-ns-att-group="1"]{
  display: grid !important;
  grid-template-columns: repeat(7, minmax(0,1fr)) !important;
  gap: 6px !important;
  margin: 10px 0 !important;
  width: 100% !important;
}
[data-ns-att-group="1"] > button{
  width: 100% !important;
  min-width: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  min-height: 40px !important;
  border-radius: 10px !important;
  font-weight: 700 !important;
  font-size: 14px !important;
  border: 1.5px solid #e5e7eb !important;
  background: #ffffff !important;
  color: #374151 !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: all 120ms ease !important;
}
[data-ns-att-group="1"] > button[data-ns-att-active="1"]{
  color: #fff !important;
  border-color: transparent !important;
  transform: scale(0.96) !important;
  box-shadow: 0 3px 8px rgba(0,0,0,.18) !important;
}
[data-ns-att-group="1"] > button[data-ns-att-active="1"][data-att="H"]{ background:#1f7a4d !important; }
[data-ns-att-group="1"] > button[data-ns-att-active="1"][data-att="S"]{ background:#d97706 !important; }
[data-ns-att-group="1"] > button[data-ns-att-active="1"][data-att="I"]{ background:#2563eb !important; }
[data-ns-att-group="1"] > button[data-ns-att-active="1"][data-att="A"]{ background:#dc2626 !important; }
[data-ns-att-group="1"] > button[data-ns-att-active="1"][data-att="B"]{ background:#b91c1c !important; }
[data-ns-att-group="1"] > button[data-ns-att-active="1"][data-att="D"]{ background:#7c3aed !important; }
[data-ns-att-group="1"] > button[data-ns-att-active="1"][data-att="U"]{ background:#6b7280 !important; }

/* ---------- Hilangkan kotak berlapis: kurangi padding kartu dalam-kartu ---------- */
.rounded-2xl > .rounded-2xl,
.rounded-xl > .rounded-xl,
[class*="rounded-2"] > [class*="rounded-2"],
[class*="border"][class*="rounded"] > [class*="border"][class*="rounded"]{
  border: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  padding-left: 0 !important;
  padding-right: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
}

/* Lebar konten mobile lebih efisien */
@media (max-width: 767px){
  main, .page-content, [data-page]{
    padding-left: 10px !important;
    padding-right: 10px !important;
  }
  .max-w-3xl, .max-w-2xl, .max-w-xl, .max-w-lg, .container{
    max-width: 100% !important;
  }
  /* Kartu utama: padding lebih kompak */
  .rounded-2xl, .rounded-xl{
    padding-left: 14px !important;
    padding-right: 14px !important;
  }
}