/* bk-pintu.css — pilihan masuk (Pembeli / Penjual).
   Dibuka HANYA saat pengunjung menekan tombol "Login" (elemen [data-pintu]), tidak otomatis.
   HP: bottom sheet. Desktop: kartu di tengah. */
.pintu{position:fixed;top:0;bottom:0;left:0;width:100vw;z-index:9990;display:flex;align-items:flex-end;justify-content:center;
  background:rgba(6,32,28,.55);backdrop-filter:blur(3px);padding:0}
.pintu[hidden]{display:none !important}
.pintu-in{width:min(480px,100%);max-height:92vh;overflow:auto;background:#fff;
  border-radius:26px 26px 0 0;padding:10px 18px calc(16px + env(safe-area-inset-bottom));
  box-shadow:0 -18px 44px rgba(4,28,24,.28);animation:pintuNaik .34s cubic-bezier(.22,1,.36,1) both}
@keyframes pintuNaik{from{transform:translateY(26px);opacity:0}to{transform:none;opacity:1}}

/* pegangan + kepala */
.pintu-grab{width:40px;height:4.5px;border-radius:999px;background:#DCE6E0;margin:6px auto 14px}
.pintu-head{display:flex;align-items:flex-start;gap:12px}
.pintu-head img{width:44px;height:44px;flex:0 0 44px;border-radius:14px;object-fit:cover;background:#F1F8F3}
.pintu-head .txt{flex:1;min-width:0}
.pintu-head h2{margin:0;font-family:var(--font-head);font-size:18.5px;line-height:1.22;color:#10231D;letter-spacing:-.2px}
.pintu-head p{margin:3px 0 0;font-size:12.5px;line-height:1.4;color:#5B6F66}
.pintu-tutup{flex:0 0 38px;width:38px;height:38px;border-radius:12px;border:1.5px solid #E3EBE6;background:#fff;
  color:#4A6058;display:grid;place-items:center;cursor:pointer}
.pintu-tutup:hover{background:#F4F8F5}

/* dua pilihan peran */
.pintu-pilih{display:grid;gap:10px;margin-top:16px}
.pintu-opt{display:flex;align-items:center;gap:12px;min-height:82px;padding:13px 14px;border-radius:18px;
  border:1.6px solid #DCE6E0;background:#fff;text-decoration:none;color:inherit;
  transition:border-color .16s,box-shadow .16s,transform .12s}
.pintu-opt:hover{border-color:#BEE6CF;box-shadow:0 8px 20px rgba(9,46,38,.08)}
.pintu-opt:active{transform:scale(.985)}
.pintu-opt .ic{width:44px;height:44px;flex:0 0 44px;border-radius:14px;display:grid;place-items:center;color:#fff}
.pintu-opt .txt{flex:1;min-width:0}
.pintu-opt b{display:block;font-family:var(--font-head);font-size:15px;line-height:1.28;color:#10231D}
.pintu-opt .s{display:block;font-size:12.3px;line-height:1.4;color:#5B6F66;margin-top:2px}
.pintu-opt .chev{margin-left:auto;flex:0 0 auto;display:flex;color:#9AA9A2}
.pintu-opt.cust{border-color:#BEE6CF}
.pintu-opt.cust .ic{background:linear-gradient(135deg,#25D366,#128C7E)}
.pintu-opt.merch{border-color:#D8E3DC}
.pintu-opt.merch .ic{background:linear-gradient(135deg,#0B5B4F,#0F7A6E)}

/* kaki: lihat dulu + tautan kecil */
.pintu-kaki{margin-top:14px;border-top:1px solid #EEF3F0;padding-top:12px;text-align:center}
.pintu-batal{width:100%;min-height:48px;border:0;border-radius:14px;background:#F4F8F5;color:#2F453C;
  font-family:var(--font-head);font-weight:700;font-size:13.5px;cursor:pointer}
.pintu-batal:hover{background:#EBF3EE}
.pintu-note{margin:10px 0 0;font-size:12px;line-height:1.5;color:#5F7268}
.pintu-note a{color:var(--wa-green-dark);font-weight:700;text-decoration:none;border-bottom:1px solid rgba(7,94,84,.25)}

@media (min-width:821px){
  .pintu{align-items:center;padding:20px}
  .pintu-in{border-radius:22px;padding-top:18px;box-shadow:0 24px 60px rgba(4,28,24,.34);
    animation:pintuMuncul .26s ease both}
  .pintu-grab{display:none}
}
@keyframes pintuMuncul{from{opacity:0;transform:translateY(10px) scale(.98)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.pintu-in{animation:none}}