/* Halaman publik marketplace (/cari, /kos) — reuse token & app.css; tambahan: kartu listing, galeri, bilah aksi. */
.pub-head{display:flex;align-items:center;gap:.6rem}
.pub-head .merek{font-family:Poppins;font-weight:800;color:var(--jk-navy);text-decoration:none;font-size:1.1rem}
.pub-head .merek small{display:block;font-family:Inter;font-weight:500;font-size:.72rem;color:var(--tinta-3)}
.pub-cari{display:flex;gap:.5rem;margin:.2rem 0 .6rem}
.pub-cari input{flex:1}
.pub-cari button{flex:0 0 auto;min-width:46px}
.pub-grid{display:grid;gap:.75rem}
.kos-iklan{display:block;background:var(--kartu);border:1px solid var(--garis);border-radius:14px;overflow:hidden;text-decoration:none;color:inherit;box-shadow:var(--shadow-sm)}
.kos-iklan:active{transform:scale(.99)}
.kos-iklan .gbr{aspect-ratio:16/9;background:var(--lembut-2);display:grid;place-items:center;color:var(--tinta-3);overflow:hidden}
.kos-iklan .gbr img{width:100%;height:100%;object-fit:cover;display:block}
.kos-iklan .gbr svg{width:40px;height:40px}
.kos-iklan .isi{padding:.7rem .85rem .8rem}
.kos-iklan .nm{font-family:Poppins;font-weight:700;font-size:1.05rem;color:var(--tinta);display:flex;justify-content:space-between;gap:.5rem;align-items:baseline}
.kos-iklan .lok{font-size:.85rem;color:var(--tinta-2);margin:.15rem 0 .35rem}
.kos-iklan .harga{font-family:Poppins;font-weight:700;color:var(--jk-blue)}
.kos-iklan .harga small{font-family:Inter;font-weight:500;color:var(--tinta-3)}
.kos-iklan .fas{display:flex;flex-wrap:wrap;gap:.3rem;margin-top:.4rem}
.kos-iklan .fas span,.tag{font-size:.72rem;padding:.15rem .5rem;border-radius:999px;background:var(--lembut);color:var(--tinta-2)}
.tag.jenis{background:var(--biru-lembut);color:var(--jk-navy);font-weight:600}
.tag.kosong{background:color-mix(in srgb,var(--status-good) 16%,var(--viz-surface));color:var(--viz-good-text);font-weight:600}
.galeri{display:flex;gap:.5rem;overflow-x:auto;scroll-snap-type:x mandatory;margin:0 -.85rem .8rem;padding:0 .85rem;scrollbar-width:none}
.galeri::-webkit-scrollbar{display:none}
.galeri img{flex:0 0 86%;aspect-ratio:4/3;object-fit:cover;border-radius:12px;scroll-snap-align:start;background:var(--lembut-2)}
.tipe-kartu{background:var(--kartu);border:1px solid var(--garis);border-radius:12px;padding:.75rem .85rem;margin-bottom:.6rem}
.tipe-kartu .nm{font-weight:700;color:var(--tinta);display:flex;justify-content:space-between;gap:.5rem}
.tipe-kartu .harga-list{margin:.3rem 0;color:var(--jk-blue);font-weight:600;font-size:.92rem;line-height:1.5}
.tipe-kartu .ket{font-size:.82rem;color:var(--tinta-2)}
.aksi-bawah{position:sticky;bottom:0;display:flex;gap:.6rem;padding:.7rem 0 calc(.6rem + env(safe-area-inset-bottom,0px));background:linear-gradient(transparent,var(--viz-page) 30%)}
.aksi-bawah .btn{flex:1;min-height:48px;font-weight:700;display:flex;align-items:center;justify-content:center;gap:.4rem;text-decoration:none}
.aksi-bawah .btn svg{width:var(--icon-md);height:var(--icon-md)}
.btn-wa{background:#25D366;color:#fff;border:0;border-radius:12px}
.pub-empty{text-align:center;padding:2.5rem 1rem;color:var(--tinta-3)}
.pub-empty svg{width:48px;height:48px;margin-bottom:.5rem}
.pub-foot{text-align:center;font-size:.75rem;color:var(--tinta-3);padding:1.2rem 0 .6rem}
.pub-foot a{color:var(--jk-blue);text-decoration:none}
.prose{white-space:pre-line;color:var(--tinta-2);font-size:.92rem;line-height:1.55}

/* ===== M7: paritas field-level dengan Mamikos ===== */
.chip.kecil{min-height:34px;padding:.4rem .8rem;font-size:.8rem}
.chip svg{width:var(--icon-sm);height:var(--icon-sm);vertical-align:-3px}
.hasil-head{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin:.2rem 0 .6rem}
.hasil-head h2{margin:0;font-size:.95rem;font-weight:700;color:var(--tinta)}
.gbr{position:relative}
.gbr-badge{position:absolute;left:.5rem;bottom:.5rem;background:rgba(11,20,32,.72);color:#fff;font-size:.72rem;padding:.2rem .5rem;border-radius:999px;display:inline-flex;align-items:center;gap:.25rem}
.kos-iklan .gbr .gbr-badge svg,.gbr-badge svg{width:12px;height:12px}
.baris-tag{display:flex;gap:.35rem;flex-wrap:wrap;margin-bottom:.3rem}
.tag.tunggu{background:color-mix(in srgb,var(--status-warn) 22%,var(--viz-surface));color:var(--tinta);font-weight:600}
.kos-iklan .fas-baris{font-size:.8rem;color:var(--tinta-2);margin:.2rem 0 .35rem;display:flex;flex-wrap:wrap;gap:.3rem .5rem;align-items:center}
.rating{display:inline-flex;align-items:center;gap:.2rem;color:var(--tinta);font-weight:700}
.rating svg,.bintang svg{width:14px;height:14px;fill:var(--status-warn);stroke:var(--status-warn)}
.rating small{font-weight:400;color:var(--tinta-3)}
.diskon{display:flex;align-items:center;gap:.3rem;font-size:.78rem;color:var(--jk-telat);font-weight:600}
.diskon svg{width:12px;height:12px}.diskon s{color:var(--tinta-3);font-weight:400}
.hemat{font-size:.78rem;color:var(--viz-good-text);font-weight:600;margin-top:.15rem}
/* Filter bottom-sheet */
.filter-sheet{border:0;padding:0;width:min(480px,100vw);max-width:100vw;max-height:92dvh;margin:auto auto 0;border-radius:18px 18px 0 0;background:var(--kartu);color:var(--tinta);box-shadow:var(--shadow-md)}
.filter-sheet::backdrop{background:rgba(0,0,0,.45)}
.filter-sheet form{display:flex;flex-direction:column;max-height:92dvh}
.fs-head{display:flex;justify-content:space-between;align-items:center;padding:.9rem 1rem .5rem;font-size:1.05rem}
.fs-body{overflow-y:auto;padding:0 1rem .5rem}
.fs-body h4{margin:.9rem 0 .4rem;font-size:.9rem;color:var(--jk-navy)}
.fs-grid{display:grid;grid-template-columns:1fr 1fr;gap:.4rem}.fs-grid.satu{grid-template-columns:1fr}
.fcek{display:flex;align-items:center;gap:.5rem;min-height:40px;padding:.2rem .5rem;border:1px solid var(--garis);border-radius:9px;font-size:.85rem;cursor:pointer}
.fcek input{width:18px;height:18px;margin:0;accent-color:var(--jk-blue)}
.fcek:has(input:checked){border-color:var(--jk-blue);background:var(--biru-lembut)}
.fs-harga{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}.fs-harga label{font-size:.8rem;color:var(--tinta-3);display:flex;flex-direction:column;gap:.25rem}
.fs-foot{display:flex;gap:.6rem;padding:.7rem 1rem calc(.8rem + env(safe-area-inset-bottom,0px));border-top:1px solid var(--garis)}
.fs-foot .btn{flex:1;min-height:46px}
/* Detail */
.nav-seksi{position:sticky;top:-.85rem;z-index:5;display:flex;gap:.3rem;overflow-x:auto;background:var(--viz-page);margin:-.85rem -.85rem .6rem;padding:.6rem .85rem;scrollbar-width:none;border-bottom:1px solid var(--garis)}
.nav-seksi::-webkit-scrollbar{display:none}
.nav-seksi a{flex:0 0 auto;text-decoration:none;color:var(--tinta-2);font-size:.85rem;font-weight:600;padding:.35rem .6rem;border-radius:999px;border-bottom:2px solid transparent}
.nav-seksi a.aktif{color:var(--jk-blue);border-bottom-color:var(--jk-blue)}
.galeri-bar{display:flex;justify-content:space-between;align-items:center;margin:-.5rem 0 .6rem}.galeri-bar .gbr-badge{position:static}
.judul-kos{font-family:Poppins;font-size:1.25rem;margin:.2rem 0 .3rem;color:var(--tinta)}
.ketersediaan{display:flex;align-items:center;gap:.4rem;font-size:.85rem;color:var(--viz-good-text);font-weight:600;margin:.5rem 0}
.ketersediaan.penuh{color:var(--status-serious)}.ketersediaan .sisa{color:var(--jk-sisa)}.ketersediaan svg{width:16px;height:16px}
.pemilik-box{display:flex;gap:.7rem;align-items:center;background:var(--kartu);border:1px solid var(--garis);border-radius:12px;padding:.7rem .85rem;margin:.4rem 0 .6rem}
.pemilik-box .av{width:42px;height:42px;border-radius:50%;background:var(--jk-navy);color:#fff;display:grid;place-items:center;font-family:Poppins;font-weight:800;flex:0 0 auto}
.prose.lipat{display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden}
.chip-wrap{display:flex;flex-wrap:wrap;gap:.35rem;margin-bottom:.4rem}
.tag.ikon-tag{display:inline-flex;align-items:center;gap:.3rem;font-size:.8rem;padding:.3rem .6rem}.tag.ikon-tag svg{width:13px;height:13px;color:var(--jk-blue)}
.info-kotak{background:var(--kartu);border:1px solid var(--garis);border-radius:12px;padding:.7rem .85rem;margin:.4rem 0 .6rem}
.tipe-kartu .tipe-meta{display:flex;flex-wrap:wrap;gap:.3rem;margin:.35rem 0}
.tipe-kartu .harga-list small{font-family:Inter;font-weight:500;color:var(--tinta-3);font-size:.78rem;margin-left:.15rem}
.tipe-kartu .btn{margin-top:.5rem}
.review-rata{display:flex;gap:.8rem;align-items:center;margin:.3rem 0 .5rem}.review-rata .angka{font-family:Poppins;font-weight:800;font-size:2rem;color:var(--tinta)}
.bintang{display:inline-flex;gap:1px}.bintang i{display:inline-flex}.bintang i svg{fill:var(--lembut-2);stroke:var(--lembut-2)}.bintang i.on svg{fill:var(--status-warn);stroke:var(--status-warn)}
.sub-rating{display:flex;gap:.8rem;flex-wrap:wrap;font-size:.82rem;color:var(--tinta-2);margin-bottom:.6rem}
.ulasan{background:var(--kartu);border:1px solid var(--garis);border-radius:12px;padding:.7rem .85rem;margin-bottom:.5rem}
.ulasan-hd{display:flex;justify-content:space-between;gap:.5rem;margin-bottom:.2rem}.ulasan p{margin:.3rem 0 0;font-size:.9rem;color:var(--tinta-2)}
.bintang-input{display:flex;gap:.2rem}.bintang-input button{border:0;background:transparent;width:40px;height:40px;padding:0;cursor:pointer}
.bintang-input button svg{width:28px;height:28px;fill:var(--lembut-2);stroke:var(--lembut-2)}.bintang-input button.on svg{fill:var(--status-warn);stroke:var(--status-warn)}
.foto-grid{display:grid;grid-template-columns:1fr 1fr;gap:.4rem}.foto-grid img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:8px}
/* Bilah bawah detail: harga + durasi + CTA */
.bar-harga{flex-direction:column;gap:.4rem;background:var(--kartu);border-top:1px solid var(--garis);margin:0 -.85rem;padding:.6rem .85rem calc(.6rem + env(safe-area-inset-bottom,0px))}
.bar-harga .harga-wrap{display:grid;grid-template-columns:1fr auto;gap:.2rem .6rem;align-items:center}
.bar-harga .harga{font-family:Poppins;font-weight:700;color:var(--jk-blue);font-size:1.05rem}.bar-harga .harga small{font-family:Inter;font-weight:500;color:var(--tinta-3)}
.bar-harga select{grid-column:2;grid-row:1/4;width:auto;max-width:170px;font-size:.8rem;padding:.4rem .5rem}
.bar-harga .cta-wrap{display:flex;flex-direction:column;gap:.3rem}
.bar-harga .cta-baris{display:flex;gap:.5rem}.bar-harga .cta-baris .btn{flex:1;min-height:46px}.bar-harga .cta-baris .btn-wa{flex:0 0 52px}
.fs-head .ikon-btn{border:0;background:var(--lembut);border-radius:50%;width:36px;height:36px}

/* J5: foto per tipe kamar di kartu tipe iklan */
.tipe-foto { display: flex; gap: .4rem; overflow-x: auto; scroll-snap-type: x mandatory; margin: .4rem 0 .5rem; }
.tipe-foto img { flex: 0 0 auto; width: 132px; height: 96px; object-fit: cover; border-radius: 10px; scroll-snap-align: start; background: var(--viz-border, #e5e7eb); }

/* Favorit (hati) ala Mamikos: di pojok foto kartu & di samping judul detail; disimpan di browser penyewa. */
.hati{position:absolute;right:.5rem;top:.5rem;width:36px;height:36px;border-radius:999px;border:0;background:rgba(255,255,255,.9);color:var(--jk-telat);display:grid;place-items:center;cursor:pointer;box-shadow:var(--shadow-sm)}
.hati svg{width:18px;height:18px;fill:none;transition:fill var(--t-cepat)}
.hati.on svg{fill:currentColor}
.hati:focus-visible{outline:0;box-shadow:var(--ring)}
.kos-iklan .gbr{position:relative}
.judul-baris{display:flex;align-items:flex-start;gap:.5rem}
.judul-baris .judul-kos{flex:1;min-width:0}
.judul-baris .hati{position:static;flex:none;background:var(--lembut);box-shadow:none}
.cta-teks{display:flex;gap:.25rem;flex-wrap:wrap;justify-content:flex-end}

/* Peta /cari (Leaflet + OSM): sheet penuh, pin berlabel harga ala Mamikos, popup kartu mini. */
.peta-wrap{height:70vh;min-height:320px;border-radius:12px;overflow:hidden;background:var(--lembut-2)}
.pin-harga{background:transparent;border:0}
.pin-harga span{display:inline-block;transform:translate(-50%,-100%);background:var(--jk-blue);color:#fff;font-weight:700;font-size:.78rem;padding:.25rem .5rem;border-radius:999px;white-space:nowrap;box-shadow:var(--shadow-md);border:2px solid #fff}
.pin-kartu{display:block;color:var(--tinta);text-decoration:none;font-size:.85rem;line-height:1.35;min-width:150px}
.pin-kartu .biru{color:var(--jk-blue)}.pin-kartu .hijau{color:var(--brand-green);font-weight:700}
.leaflet-popup-content{margin:.6rem .8rem}
.baris-aksi{display:flex;gap:.5rem;flex-wrap:wrap;margin:.4rem 0}
a.saldo-baris.tap{text-decoration:none;color:inherit}
.app-head #btnBagikan{margin-left:auto}
.app-head #btnBagikan svg{width:20px;height:20px}
