/* Komponen transparan: mengikuti tema situs (light/dark). Peta & kontrol melayang selalu terang seperti Google Maps. */
.agi-map-card{--c-besar:#ea4335;--c-umkm:#1a73e8;--g-blue:#1a73e8;--g-line:#dadce0;--g-tx:#202124;--g-mute:#5f6368;--g-shadow:0 1px 2px rgba(60,64,67,.3),0 2px 6px 2px rgba(60,64,67,.15)}

/* ===== Daftar lokasi (ikut warna tema) ===== */
.agi-strip{margin-bottom:.9rem}
.agi-strip-head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:.5rem;font-weight:700;color:inherit}
.agi-strip-head small{font-weight:500;opacity:.65}
.agi-list{list-style:none;margin:0;padding:0 0 .6rem;display:flex;gap:.6rem;overflow-x:auto;scroll-snap-type:x proximity;scrollbar-width:thin}
.agi-list li{flex:0 0 260px;scroll-snap-align:start}
.agi-list li button{width:100%;height:100%;text-align:left;display:flex;gap:.7rem;align-items:center;padding:.6rem .8rem;border:1px solid rgba(128,128,128,.35);background:transparent;border-radius:12px;cursor:pointer;color:inherit;font:inherit;transition:background .15s,border-color .15s}
.agi-list li button:hover{background:rgba(128,128,128,.12)}
.agi-list li button.is-active{border-color:var(--g-blue);background:rgba(26,115,232,.1)}
.agi-list li button:focus-visible{outline:2px solid var(--g-blue);outline-offset:2px}
.agi-thumb{flex:none;width:42px;height:42px;border-radius:8px;background:#fff;border:1px solid var(--g-line);object-fit:contain;padding:3px}
.agi-thumb.is-empty{display:block;background:var(--c-besar);border-color:transparent}
.agi-thumb.is-empty.umkm{background:var(--c-umkm)}
.agi-list b{display:block;font-size:.88rem;line-height:1.3}
.agi-list .agi-meta{display:block;font-size:.76rem;opacity:.7;margin-top:2px}
.agi-empty{flex:1;padding:1rem;font-size:.9rem;opacity:.7}

/* ===== Peta ===== */
.agi-stage{border-radius:14px;overflow:hidden;border:1px solid rgba(128,128,128,.35)}
.agi-map-shell{position:relative;height:660px;background:#e5e3df;font-family:Roboto,"Segoe UI",Helvetica,Arial,sans-serif}
.agi-map-shell:fullscreen{height:100vh}
.agi-map-shell:-webkit-full-screen{height:100vh}
#agi-peta-potensial{position:absolute;inset:0;background:#e5e3df;z-index:0;font-family:inherit}
.agi-map-loader{position:absolute;inset:0;z-index:1200;display:grid;place-items:center;background:#e5e3df;transition:opacity .4s}
.agi-map-loader.is-hidden{opacity:0;pointer-events:none}
.agi-map-loader i{width:36px;height:36px;border-radius:50%;border:3px solid #d2e3fc;border-top-color:var(--g-blue);animation:agi-spin .9s linear infinite}
@keyframes agi-spin{to{transform:rotate(360deg)}}

/* Pencarian + chip filter melayang */
.agi-float{position:absolute;top:12px;left:12px;right:64px;z-index:500;display:flex;flex-direction:column;gap:.55rem;pointer-events:none}
.agi-float>*{pointer-events:auto}
.agi-search{position:relative;display:block;margin:0;max-width:440px}
.agi-search svg{position:absolute;left:14px;top:50%;transform:translateY(-50%);color:var(--g-mute);pointer-events:none}
.agi-search input{width:100%;height:46px;border:0;border-radius:24px;background:#fff;color:var(--g-tx);padding:0 1rem 0 46px;font-size:.95rem;box-shadow:var(--g-shadow);color-scheme:light}
.agi-search input::placeholder{color:var(--g-mute)}
.agi-search input:focus{outline:0;box-shadow:0 1px 6px rgba(32,33,36,.28),0 0 0 2px var(--g-blue)}
.agi-filters{display:flex;gap:.45rem;overflow-x:auto;padding:2px 2px 6px;scrollbar-width:none}
.agi-filters::-webkit-scrollbar{display:none}
.agi-chip{flex:none;display:inline-flex;align-items:center;gap:.45rem;height:34px;padding:0 .9rem;border:1px solid var(--g-line);border-radius:17px;background:#fff;color:#3c4043;font:500 .84rem/1 inherit;font-family:inherit;cursor:pointer;white-space:nowrap;box-shadow:0 1px 2px rgba(60,64,67,.25);transition:background .15s,border-color .15s,color .15s;color-scheme:light}
.agi-chip:hover{background:#f8f9fa}
.agi-chip[aria-pressed="true"]{background:#e8f0fe;border-color:#d2e3fc;color:#1967d2}
.agi-chip:focus-visible{outline:2px solid var(--g-blue);outline-offset:1px}
.agi-dot{width:10px;height:10px;border-radius:50%;background:var(--c-besar)}
.agi-dot.umkm{background:var(--c-umkm)}
.agi-select{appearance:none;-webkit-appearance:none;padding-right:2rem;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%235f6368' stroke-width='3' stroke-linecap='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .7rem center}

.agi-hud{position:absolute;left:50%;bottom:14px;transform:translateX(-50%);z-index:500;display:flex;align-items:center;gap:.5rem;padding:.45rem .95rem;border-radius:20px;background:#fff;color:var(--g-tx);font-size:.82rem;white-space:nowrap;box-shadow:var(--g-shadow);pointer-events:none}
.agi-hud strong{font-variant-numeric:tabular-nums}
.agi-sep{width:1px;height:14px;background:var(--g-line);margin:0 .25rem}
.agi-map-marker{display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--c-besar)}
.agi-map-marker.umkm{background:var(--c-umkm)}

/* ===== Pin gaya Google Maps ===== */
.agi-pin{--c:var(--c-besar);position:relative;width:34px;height:46px;transform-origin:50% 100%;transition:transform .15s}
.agi-pin.umkm{--c:var(--c-umkm)}
.agi-pin svg.agi-shape{display:block;filter:drop-shadow(0 2px 2px rgba(0,0,0,.35))}
.agi-pin .agi-ico{position:absolute;left:10px;top:9px;width:14px;height:14px;color:var(--c)}
.agi-pin .agi-ico svg{width:14px;height:14px;display:block}
.agi-halo{position:absolute;left:50%;bottom:-3px;width:26px;height:10px;margin-left:-13px;border-radius:50%;background:var(--c);opacity:0;animation:agi-halo 2.8s ease-out infinite;animation-delay:var(--d,0s)}
.leaflet-marker-icon:hover .agi-pin{transform:translateY(-3px) scale(1.1)}
@keyframes agi-halo{0%{transform:scale(.4);opacity:.55}100%{transform:scale(1.8);opacity:0}}
.agi-booting .agi-pin{animation:agi-drop .6s cubic-bezier(.3,1.4,.5,1) both;animation-delay:calc(var(--i,0)*45ms + .2s)}
@keyframes agi-drop{from{transform:translateY(-34px);opacity:0}to{transform:none;opacity:1}}

.agi-cluster{display:grid;place-items:center;border-radius:50%;color:#fff;font-weight:700;font-size:.95rem;background:var(--g-blue);border:2px solid #fff;box-shadow:0 0 0 6px rgba(26,115,232,.28),0 2px 6px rgba(0,0,0,.35)}

/* ===== Kartu hover ===== */
.leaflet-tooltip.agi-hover{background:transparent;border:0;box-shadow:none;padding:0;opacity:1;white-space:normal}
.leaflet-tooltip.agi-hover::before{display:none}
.agi-hcard{display:flex;gap:.8rem;width:310px;padding:.7rem;border-radius:12px;background:#fff;color:var(--g-tx);box-shadow:0 2px 6px 2px rgba(60,64,67,.25),0 1px 2px rgba(60,64,67,.3);animation:agi-fade .16s ease-out;font-family:Roboto,"Segoe UI",Helvetica,Arial,sans-serif}
.agi-hcard img,.agi-hcard .agi-noimg{flex:none;width:84px;height:84px;border-radius:8px;background:#f1f3f4;object-fit:contain;padding:6px}
.agi-hcard .agi-noimg{display:grid;place-items:center;background:var(--c-besar);color:#fff}
.agi-hcard.umkm .agi-noimg{background:var(--c-umkm)}
.agi-hcard .agi-noimg svg{width:34px;height:34px}
.agi-hcard b{display:block;font-size:.95rem;line-height:1.25;margin:.1rem 0 .15rem;font-weight:500}
.agi-hcard .agi-kec{font-size:.78rem;color:var(--g-mute);margin-bottom:.4rem}
.agi-hcard .agi-hint{font-size:.72rem;color:var(--g-blue);font-weight:500}
.agi-kind{display:inline-block;font-size:.7rem;font-weight:500;color:var(--g-mute)}
@keyframes agi-fade{from{opacity:0;transform:translateY(3px)}to{opacity:1;transform:none}}
.agi-tags{display:flex;flex-wrap:wrap;gap:.3rem;margin-bottom:.35rem}
.agi-tag{padding:.12rem .55rem;border-radius:999px;border:1px solid var(--g-line);color:#3c4043;background:#fff;font-size:.72rem;font-weight:500}
.agi-tag.modal{background:#e8f0fe;border-color:#d2e3fc;color:#1967d2}

/* ===== Popup (kartu tempat) ===== */
.agi-map-card .leaflet-popup-content-wrapper{padding:0;border-radius:12px;overflow:hidden;background:#fff;color:var(--g-tx);box-shadow:0 2px 6px 2px rgba(60,64,67,.25),0 1px 2px rgba(60,64,67,.3)}
.agi-map-card .leaflet-popup-content{margin:0;width:300px!important;font-family:Roboto,"Segoe UI",Helvetica,Arial,sans-serif}
.agi-map-card .leaflet-popup-close-button{top:8px;right:8px;width:28px;height:28px;border-radius:50%;background:rgba(255,255,255,.9);color:var(--g-mute);font-size:20px;line-height:28px;text-align:center;padding:0}
.agi-pop-cover{height:130px;display:grid;place-items:center;background:#f1f3f4}
.agi-pop-cover img{max-width:70%;max-height:100px;object-fit:contain}
.agi-pop-cover .agi-noimg{display:grid;place-items:center;width:100%;height:100%;background:var(--c-besar);color:#fff}
.agi-pop-cover .agi-noimg.umkm{background:var(--c-umkm)}
.agi-pop-cover .agi-noimg svg{width:44px;height:44px}
.agi-pop-body{padding:.9rem 1rem 1rem}
.agi-pop-body h4{margin:0 0 .15rem;font-size:1.15rem;font-weight:500;line-height:1.25;color:var(--g-tx)}
.agi-pop-body .agi-kind{margin-bottom:.6rem}
.agi-row{display:flex;gap:.6rem;align-items:center;font-size:.86rem;color:#3c4043;margin:.4rem 0}
.agi-row svg{flex:none;width:18px;height:18px;color:var(--g-blue)}
.agi-pop-actions{display:flex;gap:.5rem;margin-top:.8rem}
.agi-pop-actions a{flex:1;text-align:center;padding:.5rem;border-radius:18px;font-size:.82rem;font-weight:500;text-decoration:none;color:#fff;background:var(--g-blue);border:1px solid var(--g-blue)}
.agi-pop-actions a.alt{background:#fff;color:var(--g-blue);border-color:var(--g-line)}

/* ===== Kontrol Leaflet (putih, bulat, bayangan) ===== */
.agi-map-card .leaflet-bar,.agi-map-card .leaflet-control-layers,.agi-map-card .leaflet-control-measure{border:0;border-radius:8px;box-shadow:var(--g-shadow);overflow:hidden}
.agi-map-card .leaflet-bar a,.agi-map-card .leaflet-bar button{background-color:#fff;color:#5f6368;border-bottom-color:#e8eaed}
.agi-map-card .leaflet-bar a:hover,.agi-map-card .leaflet-bar button:hover{background-color:#f1f3f4;color:#202124}
.agi-map-card .leaflet-control-layers{background:#fff;color:var(--g-tx)}
.agi-map-card .leaflet-control-scale-line{background:rgba(255,255,255,.8);color:#3c4043;border-color:#5f6368}
.agi-btn{width:30px;height:30px;display:grid;place-items:center;cursor:pointer;border:0;padding:0}
.agi-btn svg{stroke:currentColor}
.agi-btn.is-on{background-color:#e8f0fe!important;color:var(--g-blue)!important}
/* Atribusi data peta (wajib secara lisensi) dibuat kecil & halus, tanpa tulisan Leaflet */
.agi-map-card .leaflet-control-attribution{background:rgba(255,255,255,.75);color:#5f6368;font-size:10px;padding:0 6px}
.agi-map-card .leaflet-control-attribution a{color:#3c4043}

.agi-retry{margin-left:.5rem;border:1px solid currentColor;background:transparent;color:inherit;border-radius:8px;padding:.1rem .7rem;cursor:pointer}

@media (max-width:991px){
  .agi-map-shell{height:560px}
  .agi-list li{flex-basis:230px}
  .agi-hcard{width:270px}
}
@media (prefers-reduced-motion:reduce){
  .agi-halo,.agi-booting .agi-pin,.agi-hcard{animation:none!important}
  .agi-map-loader i{animation-duration:3s}
}