/* [NALA_PAJAK_V1] Menu Pajak. Prefix .pjk-*. Token Nala yang sudah ada (--soga, --ink-*,
   --line, --surface, --hover). Kepala halaman serumpun dengan .pa-head (chrome gelap + kawung). */

.pjk-page{max-width:1120px}

/* ── Kepala ──────────────────────────────────────────────────────────────── */
.pjk-head{display:flex;align-items:flex-end;justify-content:space-between;gap:16px;flex-wrap:wrap;
  margin:calc(-1 * var(--page-pad)) calc(-1 * var(--page-pad)) 14px;
  padding:22px var(--page-pad) 18px;color:#F7F1DE;background-color:#3A2415;
  background-image:linear-gradient(90deg,rgba(58,36,21,.96),rgba(58,36,21,.82)),url('/static/motif/kawung.svg');
  background-size:auto,80px 80px;border-bottom:1px solid rgba(224,190,120,.5)}
.pjk-head h1{font-family:'Crimson Pro',serif;font-size:30px;line-height:1;margin:3px 0 4px;color:#FFF9E9}
.pjk-head p{margin:0;color:rgba(255,249,233,.78);font-size:12.5px}
.pjk-eyebrow{font-size:10px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:#E0BE78;margin-bottom:4px}
.pjk-pilih-tahun{display:flex;flex-direction:column;gap:3px;font-size:11px;font-weight:600;color:#E0BE78}
.pjk-tahun{font:inherit;font-size:14px;padding:7px 10px;border-radius:9px;border:1px solid rgba(224,190,120,.5);
  background:rgba(247,241,222,.1);color:#FFF9E9}
.pjk-tahun option{color:#2A1A10}

/* ── Pesan ───────────────────────────────────────────────────────────────── */
.pjk-galat{display:flex;justify-content:space-between;gap:10px;align-items:center;margin-bottom:12px;
  padding:10px 12px;border-radius:10px;background:#F8E1DB;color:#9A3412;font-size:13px}
.pjk-galat button{font:inherit;font-size:12px;border:0;background:transparent;color:#9A3412;text-decoration:underline;cursor:pointer}
.pjk-banner-merah{margin-bottom:12px;padding:10px 12px;border-radius:10px;background:#9A3412;color:#FFF5F0;font-size:13px;font-weight:600}
.pjk-peringatan{margin:8px 0;padding:8px 10px;border-radius:8px;background:#FBEFD5;color:#7A4E00;font-size:12.5px}
.pjk-galat-kecil{margin:8px 0;padding:8px 10px;border-radius:8px;background:#F8E1DB;color:#9A3412;font-size:12.5px;overflow-wrap:anywhere}
.pjk-proses{margin:8px 0;padding:8px 10px;border-radius:8px;background:var(--hover);color:var(--ink-2,var(--ink));font-size:12.5px}
.pjk-catatan{font-size:13px;color:var(--ink-3);margin:6px 0}

/* ── Batas omzet ─────────────────────────────────────────────────────────── */
.pjk-batas{margin-bottom:14px;padding:12px 14px;border:1px solid var(--line);border-radius:12px;background:var(--surface)}
.pjk-batas-teks{display:flex;gap:8px;flex-wrap:wrap;align-items:baseline;font-size:12.5px;color:var(--ink-3)}
.pjk-batas-teks b{font-size:17px;color:var(--ink)}
.pjk-batas-bar{height:8px;margin-top:8px;border-radius:999px;background:var(--hover);overflow:hidden}
.pjk-batas-bar div{height:100%;background:#4E7A3A}
.pjk-batas-kuning .pjk-batas-bar div{background:#C08A1E}
.pjk-batas-merah .pjk-batas-bar div{background:#9A3412}

/* ── Tabel tahunan ───────────────────────────────────────────────────────── */
.pjk-tabel{border:1px solid var(--line);border-radius:12px;background:var(--surface);overflow:hidden}
.pjk-tabel-kepala,.pjk-baris{display:grid;grid-template-columns:1.1fr 1.3fr 1.2fr 1.2fr 1fr 1.5fr;gap:10px;
  align-items:center;padding:10px 14px}
.pjk-tabel-kepala{font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:var(--ink-3);
  border-bottom:1px solid var(--line)}
.pjk-baris{font-size:13.5px;border-top:1px solid var(--line);cursor:pointer}
.pjk-tabel-kepala + .pjk-baris{border-top:0}
.pjk-baris:hover{background:var(--hover)}
.pjk-baris.on{background:var(--hover);box-shadow:inset 3px 0 0 var(--soga)}
.pjk-baris.redup{color:var(--ink-3)}
.pjk-baris span{display:flex;gap:4px;flex-wrap:wrap;align-items:center;min-width:0;font-variant-numeric:tabular-nums}
.pjk-c-bulan{font-weight:700}
.pjk-muat{padding:14px;color:var(--ink-3);font-size:13px}

.pjk-lencana{display:inline-block;padding:2px 8px;border-radius:999px;font-size:11.5px;font-weight:700;white-space:nowrap}
.pjk-abu{background:var(--hover);color:var(--ink-3)}
.pjk-kuning{background:#FBEFD5;color:#7A4E00}
.pjk-hijau{background:#E3EFD9;color:#2F5A1F}
.pjk-merah{background:#F8E1DB;color:#9A3412}

/* ── Detail bulan ────────────────────────────────────────────────────────── */
.pjk-detail{margin-top:16px}
.pjk-detail h2{font-family:'Crimson Pro',serif;font-size:24px;margin:0 0 10px}
.pjk-kolom{display:grid;grid-template-columns:1fr 1fr;gap:14px;align-items:start}
.pjk-panel{border:1px solid var(--line);border-radius:12px;background:var(--surface);padding:14px;min-width:0}
.pjk-panel-judul{display:flex;align-items:baseline;justify-content:space-between;gap:8px;margin-bottom:8px}
.pjk-panel-judul h3{margin:0;font-size:16px}
.pjk-panel-judul span{font-size:11.5px;color:var(--ink-3)}
.pjk-angka{display:grid;gap:6px;margin:8px 0}
.pjk-angka div{display:flex;justify-content:space-between;gap:10px;font-size:13px}
.pjk-angka dt{color:var(--ink-3)}
.pjk-angka dd{margin:0;font-weight:700;text-align:right;font-variant-numeric:tabular-nums}
.pjk-rumus{font-size:14px;padding:8px 10px;border-radius:8px;background:var(--hover);margin-bottom:6px}
.pjk-rumus b{font-size:16px}

.pjk-tombol{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.pjk-tombol button,.pjk-real button,.pjk-setor button{font:inherit;font-size:13px;padding:8px 13px;border-radius:9px;
  border:1px solid var(--soga-d,var(--soga));background:var(--soga);color:#FFF9E9;cursor:pointer}
.pjk-tombol button:disabled,.pjk-real button:disabled,.pjk-setor button:disabled{opacity:.45;cursor:not-allowed}
.pjk-real{margin-top:12px;padding-top:10px;border-top:1px dashed var(--line);display:flex;flex-direction:column;gap:8px}
.pjk-real label{display:flex;gap:8px;align-items:flex-start;font-size:12.5px;color:var(--ink-3)}
.pjk-real button.pjk-bahaya{align-self:flex-start;background:#9A3412;border-color:#7C2A0E}
.pjk-tangkapan{margin-top:10px;font-size:12.5px;display:flex;gap:8px;flex-wrap:wrap;align-items:center}
.pjk-tangkapan a{color:var(--soga-d,var(--soga))}
.pjk-harian{margin-top:10px;font-size:12.5px}
.pjk-harian summary{cursor:pointer;color:var(--soga-d,var(--soga));font-weight:600}
.pjk-harian table{width:100%;border-collapse:collapse;margin-top:6px;font-variant-numeric:tabular-nums}
.pjk-harian th,.pjk-harian td{padding:4px 6px;border-bottom:1px solid var(--line);text-align:right}
.pjk-harian th:first-child,.pjk-harian td:first-child{text-align:left}

.pjk-kode{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0}
.pjk-kode span{display:inline-flex;gap:6px;align-items:center;padding:5px 8px;border-radius:8px;background:var(--hover);font-size:12.5px}
.pjk-salin{font:inherit;font-size:11px;border:1px solid var(--line);border-radius:6px;background:var(--surface);
  padding:2px 6px;cursor:pointer;color:var(--ink-3)}
.pjk-setoran{list-style:none;margin:10px 0;padding:0;display:flex;flex-direction:column;gap:6px}
.pjk-setoran-baris{padding:8px 10px;border:1px solid var(--line);border-radius:9px;font-size:13px;overflow-wrap:anywhere}
.pjk-setoran-baris.batal{opacity:.6;text-decoration:line-through}
.pjk-setoran-baris.batal .pjk-batal-ket{text-decoration:none}
.pjk-setoran-meta{font-size:11.5px;color:var(--ink-3);margin-top:3px}
.pjk-link{font:inherit;font-size:11.5px;border:0;background:transparent;color:#9A3412;text-decoration:underline;cursor:pointer;margin-left:6px}

.pjk-setor{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-top:12px;padding-top:10px;border-top:1px dashed var(--line)}
.pjk-setor h4{grid-column:1/-1;margin:0;font-size:14px}
.pjk-setor label{display:flex;flex-direction:column;gap:3px;font-size:11.5px;font-weight:600;color:var(--ink-3);min-width:0}
.pjk-setor input{font:inherit;font-size:13px;padding:7px 9px;border:1px solid var(--line);border-radius:8px;
  background:var(--surface);color:var(--ink);min-width:0}
.pjk-setor .pjk-penuh{grid-column:1/-1}
.pjk-setor button{grid-column:1/-1;justify-self:start}

/* ── HP ──────────────────────────────────────────────────────────────────── */
@media (max-width:760px){
  .pjk-tabel-kepala{display:none}
  .pjk-baris{grid-template-columns:1fr 1fr;gap:6px 12px;padding:12px}
  .pjk-c-bulan{grid-column:1/-1;font-size:15px}
  .pjk-baris span[data-label]::before{content:attr(data-label);display:block;width:100%;font-size:10.5px;font-weight:600;
    color:var(--ink-3);text-transform:uppercase;letter-spacing:.03em}
  /* Bulan tanpa data: satu baris ringkas, bukan kartu enam kolom kosong. */
  .pjk-baris.kosong{grid-template-columns:1fr auto;padding:10px 12px}
  .pjk-baris.kosong .pjk-c-bulan{grid-column:auto;font-size:14px}
  .pjk-baris.kosong span[data-label]{display:none}
  .pjk-baris.kosong span[data-label="Setor PPh"]{display:flex}
  .pjk-baris.kosong span[data-label="Setor PPh"]::before{display:none}
  .pjk-kolom{grid-template-columns:1fr}
  .pjk-setor{grid-template-columns:1fr}
}

/* ── Tab Rekap | Panduan ─────────────────────────────────────────────────── */
.pjk-tabbar{display:flex;gap:6px;margin:0 0 14px;border-bottom:1px solid var(--line)}
.pjk-tab{font:inherit;font-size:13.5px;font-weight:600;padding:8px 14px;border:0;border-bottom:2px solid transparent;
  background:transparent;color:var(--ink-3);cursor:pointer;margin-bottom:-1px}
.pjk-tab:hover{color:var(--ink)}
.pjk-tab.on{color:var(--ink);border-bottom-color:var(--soga)}

/* ── Panduan ─────────────────────────────────────────────────────────────── */
.pjk-panduan{display:flex;flex-direction:column;gap:14px;font-size:13.5px;line-height:1.55;max-width:860px}
.pjk-panduan p{margin:6px 0}
.pjk-panduan-pengantar{color:var(--ink-3);margin:0}
.pjk-pandu-blok{border:1px solid var(--line);border-radius:12px;background:var(--surface);padding:14px 16px;min-width:0}
.pjk-pandu-blok h3{margin:0 0 8px;font-family:'Crimson Pro',serif;font-size:21px}
.pjk-pandu-utama{box-shadow:inset 3px 0 0 var(--soga)}
.pjk-langkah{list-style:none;margin:0;padding:0;display:flex;flex-direction:column}
.pjk-langkah li{display:grid;grid-template-columns:9.5em 1fr;gap:12px;padding:9px 0;border-top:1px solid var(--line)}
.pjk-langkah li:first-child{border-top:0;padding-top:2px}
.pjk-kapan{font-weight:700;color:var(--soga-d,var(--soga));font-variant-numeric:tabular-nums}
.pjk-ambil{list-style:none;margin:8px 0;padding:0;display:flex;flex-direction:column;gap:10px}
.pjk-ambil > li{padding:10px 12px;border-radius:10px;background:var(--hover)}
.pjk-ambil h4{margin:0 0 4px;font-size:14.5px}
.pjk-ambil ul,.pjk-centang,.pjk-sumber ul{margin:6px 0;padding-left:20px}
.pjk-ambil ul li,.pjk-centang li,.pjk-sumber li{margin:3px 0}
.pjk-ptkp{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:6px;margin:8px 0}
.pjk-ptkp div{display:flex;justify-content:space-between;gap:8px;padding:6px 9px;border-radius:8px;
  background:var(--surface);font-size:12.5px;font-variant-numeric:tabular-nums}
.pjk-ptkp b{white-space:nowrap}
.pjk-sumber a{color:var(--soga-d,var(--soga));overflow-wrap:anywhere}
@media (max-width:760px){
  .pjk-langkah li{grid-template-columns:1fr;gap:2px}
  .pjk-pandu-blok{padding:12px}
}
