/* Gaya khusus halaman kelompok lead-kampanye: Calon Pasien (/lead), Corong (/corong), Kampanye (/kampanye),
   Biaya iklan (/kampanye/biaya), Widget website (/widget). Komponen bersama (tab, kartu-atur, chip, kosong) ada di
   gaya/dasar.css; token warna dari app.css (mode gelap ikut). Semua kelas di sini berawalan lk-. */

/* ---------- Baris alat: cari + segmen + tombol Saring ---------- */
.lk-alat{display:flex;flex-wrap:wrap;align-items:center;gap:8px 10px;margin:0 0 12px}
.tumpuk>.lk-alat{margin:0}
.lk-cari{position:relative;flex:1 1 280px;min-width:0;margin:0}
.lk-cari svg{position:absolute;left:13px;top:50%;transform:translateY(-50%);color:var(--fg-muted);pointer-events:none}
.lk-cari input[type=search]{padding-left:40px;border-color:var(--border);background:var(--surface)}
.lk-segmen{flex:0 1 auto;min-width:0}
.lk-segmen .chip{height:36px}
.lk-jumlah{display:inline-flex;align-items:center;justify-content:center;min-width:20px;height:20px;padding:0 6px;border-radius:999px;background:var(--primary);color:var(--on-primary);font-size:11.5px;font-weight:800;line-height:1}
.lk-chip-aktif{margin:0 0 12px}
.tumpuk>.lk-chip-aktif{margin:-8px 0 0}
.lk-chip-aktif .chip svg{flex:0 0 14px;opacity:.75}
.lk-chip-aktif .chip:hover svg{opacity:1}
.lk-hapus-semua{display:inline-flex;align-items:center;min-height:32px;padding:0 6px;font-size:13px;font-weight:700;text-decoration:none}
.lk-hapus-semua:hover{text-decoration:underline}

/* ---------- Panel terang (pengganti akordeon berkode; id KODE tetap di elemen ini) ---------- */
.lk-panel{min-width:0;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--bayang-kartu);overflow:hidden}
.lk-panel>.table-wrap{border:0;border-radius:0;background:transparent}
.lk-panel-kepala{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 16px;padding:16px 20px;border-bottom:1px solid var(--garis-lembut)}
.lk-panel-kepala>div:first-child{flex:1 1 220px;min-width:0}
.lk-panel-kepala h2{font-size:17px;font-weight:800}
.lk-panel-kepala .ringkas{margin:3px 0 0;font-size:13.5px;color:var(--fg-muted)}
.lk-panel-isi{padding:14px 20px 16px}
.lk-panel-kaki{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px 12px;padding:12px 16px;border-top:1px solid var(--garis-lembut)}
.lk-panel-catatan{margin:0;padding:12px 20px;border-top:1px solid var(--garis-lembut)}
.lk-paging{display:flex;flex-wrap:wrap;align-items:center;gap:8px}
.lk-kosong-kecil{margin:0}
.lk-panel .kolom-aksi-tetap th.aksi-tetap{background:var(--bg-kaki)}
.lk-panel .kolom-aksi-tetap td.aksi-tetap .btn+.btn{margin-left:6px}
.btn.lk-ikon-saja{width:36px;padding:0}

/* ---------- Tabel Calon Pasien ---------- */
.lk-tabel th,.lk-tabel td{padding-left:12px;padding-right:12px}
.lk-tabel th,.lk-tabel th a.sort{white-space:normal}
.lk-tabel th{vertical-align:bottom}
.lk-tabel td{vertical-align:middle}
.lk-orang{display:flex;align-items:center;gap:12px;min-width:180px}
.lk-orang-teks{display:flex;flex-direction:column;min-width:0}
.lk-orang-teks a{color:inherit;text-decoration:none}
.lk-orang-teks a b{color:var(--fg-heading)}
.lk-orang-teks a:hover b,.lk-orang-teks a:focus-visible b{color:var(--primary);text-decoration:underline}
.lk-orang-teks b{font-weight:700;color:var(--fg-heading)}
.lk-av{flex:0 0 36px;width:36px;height:36px;border-radius:999px;display:inline-flex;align-items:center;justify-content:center;font-size:13px;font-weight:800;letter-spacing:.02em}
.lk-av.w0{background:#E0F2FE;color:#0369A1}
.lk-av.w1{background:#EAF1FE;color:#1D4ED8}
.lk-av.w2{background:#E6F6EC;color:#15803D}
.lk-av.w3{background:#FFF4E0;color:#A15C07}
.lk-av.w4{background:#FFEDE8;color:#B93A22}
.lk-av.w5{background:#EEF2F8;color:#44506A}
.lk-sumber{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.lk-tahap{display:inline-flex;align-items:center;height:24px;padding:0 10px;border-radius:999px;font-size:12px;font-weight:700;white-space:nowrap;background:#EEF2F8;color:#44506A}
.lk-tahap.th-dihubungi{background:#EAF1FE;color:#1D4ED8}
.lk-tahap.th-janji_npf{background:#E0F2FE;color:#0369A1}
.lk-tahap.th-npf,.lk-tahap.th-hamil{background:#E6F6EC;color:#15803D}
.lk-tahap.th-program{background:#FDECF3;color:#BE185D}
.lk-tahap.th-opu_et{background:#FFF4E0;color:#A15C07}
.lk-tahap.th-gugur{background:var(--bg-subtle);color:var(--fg-muted)}
.lk-tahap+small{margin-top:3px}
.lk-peluang{display:inline-flex;align-items:center;gap:8px;white-space:nowrap}
.lk-bar{flex:0 0 64px;width:64px;height:8px;border-radius:999px;background:var(--bg-subtle);overflow:hidden}
.lk-bar i{display:block;height:100%;min-width:2px;border-radius:999px;background:var(--primary)}
.lk-peluang b{min-width:3.2ch;font-weight:700;color:var(--fg-heading)}
.lk-tabel .k-sumber-kecil{display:none;align-items:center;gap:6px}
/* Layar sedang: kolom Sumber pindah ke bawah nama supaya tabel muat tanpa digeser. */
@media (max-width:1366px){
  .lk-tabel-hp .k-sumber{display:none}
  .lk-tabel-hp .k-sumber-kecil{display:flex}
  .lk-tabel-hp .lk-bar{flex-basis:52px;width:52px}
}
@media (prefers-color-scheme:dark){
  .lk-av.w0,.lk-tahap.th-janji_npf{background:#0C2A3F;color:#7DD3FC}
  .lk-av.w1,.lk-tahap.th-dihubungi{background:#172A4F;color:#93C5FD}
  .lk-av.w2,.lk-tahap.th-npf,.lk-tahap.th-hamil{background:#0F2A1C;color:#86EFAC}
  .lk-av.w3,.lk-tahap.th-opu_et{background:#2E2410;color:#FCD34D}
  .lk-av.w4{background:#3A211C;color:#FFB4A3}
  .lk-av.w5,.lk-tahap{background:#1B2742;color:#C3CCDD}
  .lk-tahap.th-program{background:#3A1729;color:#F9A8D4}
  .lk-tahap.th-gugur{background:var(--bg-subtle);color:var(--fg-muted)}
}

/* HP: baris tabel Calon Pasien menjadi kartu (nama + waktu, tahap, peluang, aksi); kolom lain disembunyikan. */
@media (max-width:640px){
  .lk-alat .lk-cari{flex-basis:100%}
  .lk-alat>.btn{margin-left:auto}
  .lk-alat>.lk-segmen{flex:1 1 100%;flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;padding-bottom:2px}
  .lk-alat>.lk-segmen::-webkit-scrollbar{display:none}
  .lk-alat>.lk-segmen .chip{flex:0 0 auto}
  .lk-alat>.spacer{display:none}
  /* Kampanye di HP: setiap baris menjadi kartu (nama + aksi, lalu angka berlabel). */
  .lk-tabel-kampanye{min-width:0}
  .lk-tabel-kampanye thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
  .lk-tabel-kampanye,.lk-tabel-kampanye tbody{display:block}
  .lk-tabel-kampanye tr{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px 12px;padding:14px 16px;border-bottom:1px solid var(--garis-lembut)}
  .lk-tabel-kampanye tr:last-child{border-bottom:0}
  .lk-tabel-kampanye td{display:block;padding:0;border:0;text-align:left;background:transparent!important}
  .lk-tabel-kampanye td:first-child{grid-column:1/-1;min-width:0}
  .lk-tabel-kampanye td[data-label]::before{content:attr(data-label);display:block;font-size:11.5px;font-weight:700;color:var(--fg-muted)}
  .lk-tabel-kampanye td.k-periode{grid-column:1/-1}
  .lk-tabel-kampanye td.aksi-tetap{grid-column:1/-1;position:static;box-shadow:none;width:auto;text-align:left}
  .lk-tabel-hp{min-width:0}
  .lk-tabel-hp thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0)}
  .lk-tabel-hp,.lk-tabel-hp tbody{display:block}
  .lk-tabel-hp tr{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-template-areas:"orang pesan" "tahap tahap" "peluang peluang" "aksi aksi";gap:8px 12px;padding:14px 16px;border-bottom:1px solid var(--garis-lembut)}
  .lk-tabel-hp tr:last-child{border-bottom:0}
  .lk-tabel-hp td{display:block;padding:0;border:0;background:transparent!important}
  .lk-tabel-hp .k-orang{grid-area:orang}
  .lk-tabel-hp .k-orang .lk-orang{min-width:0}
  .lk-tabel-hp .k-pesan{grid-area:pesan;text-align:right}
  .lk-tabel-hp .k-tahap{grid-area:tahap;display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px}
  .lk-tabel-hp .k-tahap small{display:inline;margin:0}
  .lk-tabel-hp .k-peluang{grid-area:peluang;display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px}
  .lk-tabel-hp .k-peluang small{display:inline}
  .lk-tabel-hp .k-pesan small{display:none}
  .lk-tabel-hp td.k-aksi{grid-area:aksi;position:static;box-shadow:none;text-align:left;width:auto}
  .lk-tabel-hp td.k-aksi .btn{min-height:40px}
  .lk-tabel-hp .k-sumber,.lk-tabel-hp .k-cs{display:none}
}

/* ---------- Kepala modal dengan anak judul (nama · kode) ---------- */
.lk-judul{flex:1;min-width:0}
.modal-kepala .lk-judul h2{margin:0}
.lk-tanpa-atas{margin-top:0}
.lk-tanpa-bawah{margin-bottom:0}
.lk-panduan{display:flex;flex-direction:column;gap:8px;margin:0;padding-left:20px;font-size:14px;line-height:1.55}
.copybox+.lk-panduan{margin-top:14px}
/* Modal Pindah tahap: "Alasan gugur" hanya tampil bila status = Gugur (tanpa dukungan :has tetap tampil). */
@supports selector(:has(*)){
  .lk-form-tahap .lk-alasan-gugur{display:none}
  .lk-form-tahap:has(select[name=status] option[value=gugur]:checked) .lk-alasan-gugur{display:block}
}

/* ---------- Corong ---------- */
.lk-corong th.lebar{width:38%}
.lk-corong .corong-batang{height:10px;min-width:80px;background:var(--primary-subtle)}
.lk-corong td>b{color:var(--fg-heading)}
.lk-corong .corong-sel small{display:inline;margin-left:4px}
.lk-help-rapat{margin:-8px 0 14px}

/* ---------- Kampanye & biaya iklan ---------- */
.lk-tabel-kampanye td:first-child{min-width:176px}
.lk-kp-nama{display:flex;flex-wrap:wrap;align-items:center;gap:4px 8px}
.lk-kp-nama b{color:var(--fg-heading)}
.lk-tabel small.lk-sumber{display:flex;gap:6px;white-space:normal;margin-top:2px}
.lk-isian-kode{max-width:220px}
.lk-isian-kode input{text-transform:uppercase}
.lk-lipat>summary{display:flex;align-items:center;gap:6px;min-height:40px;font-size:13.5px;font-weight:700;color:var(--primary);cursor:pointer;list-style:none}
.lk-lipat>summary::-webkit-details-marker{display:none}
.lk-lipat>summary::before{content:"";width:8px;height:8px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:rotate(-45deg);transition:transform .15s;margin:0 4px 0 2px}
.lk-lipat[open]>summary::before{transform:rotate(45deg)}
.lk-lipat-isi{margin-top:8px}
.lk-tahun{display:flex;align-items:center;gap:8px;margin:0}
.lk-tahun label{margin:0;font-size:13px;color:var(--fg-muted)}
.lk-tahun select{width:auto;min-width:112px}

/* ---------- Widget website ---------- */
.lk-ikon-warna{color:#fff}
.lk-swatch{display:inline-block;width:14px;height:14px;margin-right:6px;border-radius:4px;vertical-align:-2px;box-shadow:inset 0 0 0 1px rgba(15,30,61,.15)}
.lk-daftar-pendek{list-style:none;margin:0;padding:10px 12px;border-radius:10px;background:var(--bg);font-size:13px;font-weight:600;color:var(--fg-heading)}
.lk-daftar-pendek li{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.lk-daftar-pendek li+li{margin-top:4px}
.lk-saklar{margin:0 0 16px;padding:12px 14px;border:1px solid var(--border);border-radius:12px;cursor:pointer}
.lk-saklar:has(input:checked){border-color:var(--primary);background:var(--primary-subtle)}
.lk-saklar small{display:block;margin-top:2px;font-size:13px;color:var(--fg-muted)}
.lk-fieldset{margin:0 0 16px;padding:0;border:0;min-width:0}
.lk-fieldset legend{margin:0 0 8px;padding:0;font-size:13.5px;font-weight:600;color:var(--fg-heading)}
.lk-isian-warna{width:120px}
.lk-isian-warna input[type=color]{display:block;width:100%;height:44px;padding:4px;border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--surface);cursor:pointer}
.lk-tabel-isian input{max-width:120px}
.lk-widget .pil-cek input{flex:0 0 18px}
.lk-baris-bawah{align-items:flex-end}
.lk-tabel-isian td{padding-top:8px;padding-bottom:8px}
/* Kolom Alasan / sinyal terbaca (analisa AI terakhir) */
.lk-tabel .k-sinyal{min-width:220px;max-width:340px}
.lk-sinyal{display:flex;flex-wrap:wrap;gap:4px;margin:0 0 4px}
.lk-sinyal span{font-size:11.5px;line-height:1.35;padding:1px 8px}
.lk-alasan{display:block;font-size:12px;line-height:1.4;color:var(--fg-muted)}
@media (max-width:640px){
  .lk-tabel-hp tr{grid-template-areas:"orang pesan" "tahap tahap" "peluang peluang" "sinyal sinyal" "aksi aksi"}
  .lk-tabel-hp .k-sinyal{grid-area:sinyal;min-width:0;max-width:none}
}
/* Impor lead dari Excel: langkah di jendela & halaman pratinjau */
.lk-langkah-impor{margin:0 0 12px;padding-left:20px;display:grid;gap:14px}
.lk-langkah-impor p{margin:2px 0 8px}
.lk-form-impor{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.lk-form-impor input[type=file]{flex:1 1 220px;min-width:0}
.lk-impor-ringkas{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,180px),1fr));gap:12px;margin:0 0 14px}
.lk-impor-ringkas .kartu-angka{border:1px solid var(--border);border-radius:12px;background:var(--surface);padding:12px 14px;display:flex;flex-direction:column;gap:4px}
.lk-impor-ringkas .kartu-angka b{font-size:24px;color:var(--fg-heading)}
.lk-impor-aksi{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin:0 0 14px}
/* Sambungkan Google Sheet */
.lk-gsheet{display:flex;flex-wrap:wrap;align-items:center;gap:6px 10px;margin:0 0 12px;padding:10px 12px;border:1px dashed var(--border);border-radius:10px}
/* Google Sheet (views/lead/sheet*.ejs): pemetaan kolom, pilihan tab, baris yang sudah ada. */
.sh-peta{display:grid;grid-template-columns:max-content 1fr;gap:6px 16px;margin:0 0 14px}
.sh-peta dt{color:var(--fg-muted);font-size:13px}
.sh-peta dd{margin:0;font-weight:600;overflow-wrap:anywhere}
.sh-tab{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin:0 0 14px}
.sh-tab select{width:auto;min-width:180px}
.sh-tabel-peta{margin:0 0 14px}
.sh-tabel-peta td{vertical-align:middle}
.sh-tabel-peta select{width:100%;min-width:220px}
.sh-mulai{border:1px solid var(--border);border-radius:10px;padding:10px 14px;margin:0 0 12px;display:grid;gap:6px}
.sh-mulai legend{font-weight:600;padding:0 6px}
.sh-judul-baris{font-size:17px;margin:22px 0 10px}
.sh-aman{margin-top:14px}
.sh-aman>summary svg{color:var(--primary)}
.sh-aman .lk-panduan{margin:0}
.card+.card,.lk-impor-ringkas+.card{margin-top:14px}
/* Daftar pasien (views/lead/pasien.ejs): kolomnya sedikit, jadi kolom Asal lead tetap tampil sampai layar HP. */
@media (min-width:641px){.lk-tabel-pasien .k-sumber-kecil{display:none}}
@media (max-width:640px){.lk-tabel-pasien .k-asal{display:none}}