/* allmenu.css — halaman "All Menu" (pengganti tab Qur'an di menu bawah).
   Tema terang: putih + hijau LAZISMU, tanpa efek berat (blur/animasi) supaya
   ringan di WebView Android kelas menengah. */

.am-page{background:var(--bg)}

/* ---------- kepala halaman ---------- */
.am-head{padding:16px 16px 14px; background:linear-gradient(160deg,#EAF7EF 0%,#F7FCF9 55%,#fff 100%);
  border-bottom:1px solid var(--garis)}
.am-head-row{display:flex; align-items:flex-start; gap:12px}
.am-head-row>div{flex:1; min-width:0}
.am-hai{margin:0; font-size:12px; font-weight:650; letter-spacing:.06em; text-transform:uppercase; color:#3E7A5C}
.am-head h2{font-size:21px; color:var(--hijau-tua); margin-top:2px}
.am-sub{margin:7px 0 0; font-size:12.5px; color:var(--abu); line-height:1.45}

.am-cari{display:flex; align-items:center; gap:9px; margin-top:13px; padding:11px 13px; background:#fff;
  border:1.3px solid var(--garis); border-radius:13px; box-shadow:0 2px 8px rgba(11,36,24,.04); color:var(--abu)}
.am-cari input{flex:1; min-width:0; border:0; outline:0; background:transparent; color:var(--tinta); font-size:14px}
.am-cari input::placeholder{color:var(--abu2)}
.am-cari:focus-within{border-color:var(--hijau-soft2); box-shadow:0 0 0 3px rgba(14,107,69,.08)}

/* ---------- isi ---------- */
.am-body{gap:18px; padding-top:16px}
.am-hasil{display:flex; flex-direction:column; gap:20px}

.am-grup{background:#fff; border:1.3px solid var(--garis); border-radius:16px; padding:14px 13px 13px;
  box-shadow:0 1px 2px rgba(122,46,2,.03)}
.am-grup-head{display:flex; align-items:center; gap:8px}
.am-grup-ik{width:27px; height:27px; border-radius:9px; display:inline-flex; align-items:center; justify-content:center;
  background:var(--hijau-soft); color:var(--hijau)}
.am-grup-head b{flex:1; min-width:0; font-size:14px; color:var(--hijau-tua); letter-spacing:-.01em}
.am-grup-head i{font-style:normal; font-size:11.5px; font-weight:700; color:var(--hijau);
  background:var(--hijau-soft); border-radius:99px; padding:2px 8px}
.am-grup-ket{margin:5px 0 11px 35px; font-size:11.8px; color:var(--abu); line-height:1.4}

.am-grid{display:grid; gap:8px; grid-template-columns:1fr}
.am-item{display:flex; align-items:center; gap:10px; width:100%; text-align:left; padding:10px 11px;
  border:1.2px solid #F1F5F2; border-radius:12px; background:#FCFDFC; transition:background .15s, border-color .15s}
.am-item:active{background:var(--hijau-soft); border-color:var(--hijau-soft2)}
.am-ik{width:33px; height:33px; flex:0 0 33px; border-radius:10px; display:inline-flex; align-items:center; justify-content:center;
  background:#EEF7F1; color:var(--hijau)}
.am-tx{flex:1; min-width:0; display:flex; flex-direction:column; gap:1px}
.am-tx b{font-size:13.2px; font-weight:650; color:var(--tinta); line-height:1.3}
.am-tx i{font-style:normal; font-size:11.3px; color:var(--abu); line-height:1.35;
  overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.am-ar{color:var(--abu2); flex:0 0 auto}

@media (min-width:520px){
  .am-grid{grid-template-columns:repeat(auto-fill,minmax(250px,1fr))}
}

/* ---------- kartu bersihkan cache ---------- */
.am-bersih{background:#fff; border:1.3px solid var(--garis); border-radius:16px; padding:14px;
  display:flex; flex-direction:column; gap:8px}
.am-bersih-head{display:flex; align-items:center; gap:8px; color:var(--hijau-tua)}
.am-bersih-head b{font-size:13.5px}
.am-bersih p{font-size:12.3px; line-height:1.5}

/* ---------- tombol pintas All Menu di Beranda ---------- */
.am-masuk{display:flex; align-items:center; gap:11px; width:100%; text-align:left; padding:12px 13px;
  background:#fff; border:1.3px solid var(--garis); border-radius:15px; box-shadow:0 1px 2px rgba(122,46,2,.04)}
.am-masuk:active{background:var(--hijau-soft)}
.am-masuk-ik{width:36px; height:36px; flex:0 0 36px; border-radius:11px; display:inline-flex; align-items:center;
  justify-content:center; background:var(--hijau-soft); color:var(--hijau)}
.am-masuk-tx{flex:1; min-width:0; display:flex; flex-direction:column}
.am-masuk-tx b{font-size:13.6px; color:var(--hijau-tua)}
.am-masuk-tx i{font-style:normal; font-size:11.4px; color:var(--abu)}
.am-masuk>svg{color:var(--abu2); flex:0 0 auto}

/* ---------- halaman "Kata Mutiara" (mutiara.js) ---------- */
/* Slide bergambar memakai tinggi alami gambar (bukan 100% dari induk tanpa
   tinggi) supaya tidak muncul kotak kosong di halaman ini. */
.mt-page .slider{margin:0}
.mt-page .slider + .sl-dots{margin-top:12px}
.mt-page .slide.ada-gambar{display:flex; flex-direction:column; justify-content:flex-end;
  border:1.3px solid var(--garis); background:#F7FBF8}
.mt-page .slide.ada-gambar .sl-img{width:100%; height:auto; min-height:150px; max-height:62vh; display:block}
.mt-page .slide{padding:18px 16px 16px}