/* Pencarian wilayah — gaya menempel pada palet tema cro yang sudah ada.
   Ditulis sebagai berkas terpisah supaya tidak menyentuh cro.css. */

.cro-wil{position:relative;margin-bottom:14px}
.cro-wil-label{display:block;font-size:.87rem;font-weight:600;margin-bottom:6px}
.cro-wil-kotak{display:flex;align-items:center;gap:6px;background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.16);border-radius:10px;padding:0 10px;
  transition:border-color .12s ease,box-shadow .12s ease}
.cro-wil-kotak:focus-within{border-color:#e8590c;box-shadow:0 0 0 3px rgba(232,89,12,.18)}
.cro-wil-teks{flex:1 1 0;min-width:0;border:0;background:transparent;font:inherit;font-size:1rem;
  padding:12px 0;color:inherit;outline:none;-webkit-appearance:none;appearance:none}
.cro-wil-teks::placeholder{opacity:.6}
.cro-wil-hapus{flex:0 0 auto;border:0;background:transparent;color:inherit;opacity:.6;
  font-size:1.35rem;line-height:1;cursor:pointer;padding:2px 4px;-webkit-appearance:none;appearance:none}
.cro-wil-hapus:hover{opacity:1}
.cro-wil-terisi .cro-wil-kotak{border-color:#2f9e44}
.cro-wil-bantu{font-size:.79rem;opacity:.7;margin:6px 0 0;line-height:1.45}

/* daftar saran */
.cro-wil-saran{position:absolute;z-index:80;left:0;right:0;top:100%;margin:5px 0 0;padding:3px;
  list-style:none;max-height:296px;overflow-y:auto;-webkit-overflow-scrolling:touch;
  background:#1b1f24;border:1px solid rgba(255,255,255,.16);border-radius:10px;
  box-shadow:0 12px 34px rgba(0,0,0,.4)}
/* Baris induk adalah SATU-SATUNYA pembeda antara desa bernama sama
   ("Sukamaju" ada 71 buah), jadi ia harus benar-benar terbaca — bukan sekadar
   ada. Kontras dinaikkan dan tiap item diberi garis pemisah. */
.cro-wil-item{display:grid;grid-template-columns:1fr auto;gap:3px 8px;align-items:baseline;
  padding:10px 11px;border-radius:7px;cursor:pointer;
  border-bottom:1px solid rgba(255,255,255,.07)}
.cro-wil-item:last-child{border-bottom:0}
.cro-wil-item:hover,.cro-wil-aktif{background:rgba(232,89,12,.2)}
.cro-wil-item:hover .cro-wil-induk,.cro-wil-aktif .cro-wil-induk{color:#d7dee6}
.cro-wil-nama{font-weight:600;font-size:.95rem;min-width:0;overflow-wrap:anywhere}
.cro-wil-nama b{color:#ffa94d}
.cro-wil-induk{grid-column:1 / -1;font-size:.8rem;color:#aab4c0;line-height:1.4;overflow-wrap:anywhere}
.cro-wil-lvl{flex:0 0 auto;font-size:.68rem;font-weight:700;letter-spacing:.03em;
  padding:2px 7px;border-radius:99px;white-space:nowrap;text-transform:uppercase}
.cro-wil-lvl-1{background:#3b2f6b;color:#c7bcff}
.cro-wil-lvl-2{background:#1f4d3d;color:#8ce0bd}
.cro-wil-lvl-3{background:#5a3a10;color:#ffc987}
.cro-wil-lvl-4{background:#3a3f47;color:#c9d2dd}
.cro-wil-kosong{padding:12px 10px;font-size:.9rem;opacity:.7}

/* 🔴 Item grid/flex bawaannya `min-width:auto` — ia TIDAK BISA menyusut di
   bawah lebar isinya. Tabel hasil (min-width 300px + padding) karena itu
   melebarkan seluruh halaman: terukur scrollWidth 429px di layar 320px, dan
   gejalanya berupa pita kosong di tepi kanan yang ikut menggeser header.
   `min-width:0` pada rantai pembungkusnya yang membuat overflow-x pada tabel
   benar-benar bekerja. */
.cro-form-wil{min-width:0;max-width:100%}
.cro-wil-hasil,.cro-wil-pesan{min-width:0;max-width:100%}
.cro-wil-tabel-bungkus{max-width:100%}
/* lapis kedua: panel tema yang memuat form ini boleh menyusut. Dipakai bila
   peramban mendukung :has(); tanpa itu aturan di atas sudah cukup. */
.cro-panel:has(> .cro-form-wil){min-width:0;max-width:100%}

/* hasil perhitungan */
.cro-wil-pesan{background:rgba(255,255,255,.05);border:1px dashed rgba(255,255,255,.2);
  border-radius:10px;padding:14px;font-size:.92rem;opacity:.85;margin-top:14px}
.cro-wil-hasil{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.16);
  border-radius:12px;padding:14px;margin-top:14px}
.cro-wil-rute{display:flex;flex-wrap:wrap;align-items:center;gap:6px;font-size:.92rem;
  font-weight:600;margin-bottom:6px}
.cro-wil-rute-p{opacity:.6}
.cro-wil-dasar{font-size:.84rem;opacity:.75;margin:0 0 12px;line-height:1.5}
.cro-wil-tabel-bungkus{overflow-x:auto;-webkit-overflow-scrolling:touch;
  border:1px solid rgba(255,255,255,.12);border-radius:10px}
/* ⛔ TANPA min-width: apa pun yang memaksa lebar minimum akan merembet ke atas
   dan melebarkan halaman, karena `.cro-panel` milik tema tidak punya
   min-width:0 dan tidak boleh saya ubah (dipakai halaman lain). Tabel dibiarkan
   mengikuti lebar bungkusnya; kolom angka saja yang dijaga tetap satu baris. */
.cro-wil-tabel{width:100%;border-collapse:collapse;font-size:.85rem;table-layout:auto}
.cro-wil-tabel th,.cro-wil-tabel td{padding:9px 8px;text-align:left;
  border-bottom:1px solid rgba(255,255,255,.09);white-space:normal;overflow-wrap:anywhere}
.cro-wil-tabel td:nth-child(2),.cro-wil-tabel td:nth-child(3),
.cro-wil-tabel th:nth-child(2),.cro-wil-tabel th:nth-child(3){white-space:nowrap}
.cro-wil-tabel th{background:rgba(255,255,255,.07);font-weight:650;font-size:.8rem}
.cro-wil-tabel tbody tr:last-child td{border-bottom:0}
.cro-wil-tabel td:nth-child(2){font-variant-numeric:tabular-nums}
.cro-wil-cat{font-size:.72rem;opacity:.6;display:block}
.cro-wil-ingat{font-size:.79rem;opacity:.7;margin:11px 0 0;line-height:1.5}

/* berat + tombol */
.cro-wil-berat{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:end;margin-bottom:12px}
.cro-wil-berat input{width:100%;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.06);
  border-radius:10px;padding:12px 10px;font:inherit;font-size:1rem;color:inherit;outline:none;
  -webkit-appearance:none;appearance:none}
.cro-wil-berat input:focus{border-color:#e8590c;box-shadow:0 0 0 3px rgba(232,89,12,.18)}