/* pages/langganan.css — .pg-langganan (halaman) & .pg-lg-modal (form tambah/edit di modal) */
.pg-langganan{display:flex;flex-direction:column;gap:18px}
.pg-langganan .lg-note{display:flex;align-items:flex-start;gap:10px;margin-bottom:14px;font-size:var(--fs-sm);line-height:1.55;color:var(--text-2)}
.pg-langganan .lg-note .ic{flex:none;margin-top:2px;color:var(--brand-text)}
.pg-langganan .lg-due{display:flex;align-items:center;gap:10px;padding:12px 16px;border-radius:14px;background:var(--b-partial-bg);color:var(--b-partial-fg);font-size:var(--fs-sm);font-weight:600}
.pg-langganan .lg-due .ic{flex:none}
.pg-langganan .lg-client{display:flex;align-items:center;gap:10px;min-width:0}
.pg-langganan .lg-client a{font-weight:700;color:var(--ink);transition:color var(--dur-fast)}
.pg-langganan .lg-client a:hover{color:var(--brand-text)}
.pg-langganan .lg-inv{display:inline-flex;flex-direction:column;align-items:flex-start;gap:4px}
.pg-langganan .lg-inv a{font-weight:600;font-variant-numeric:tabular-nums;color:var(--ink);transition:color var(--dur-fast)}
.pg-langganan .lg-inv a:hover{color:var(--brand-text)}
.pg-langganan .lg-muted{color:var(--text-3)}
.pg-langganan .lg-acts{display:inline-flex;flex-wrap:wrap;justify-content:flex-end;gap:6px}
.pg-langganan .lg-gen{margin-left:auto}
.pg-langganan .lg-sched{white-space:nowrap}
.pg-langganan .lg-per{font-size:var(--fs-xs);font-weight:600;color:var(--text-3)} /* "/bln" di daftar ringkas HP */
@media (min-width:768px){
  .pg-langganan .lg-client a{white-space:nowrap}
  .pg-langganan .lg-acts{flex-wrap:nowrap}
}
@media (max-width:767px){
  .pg-langganan .lg-gen{flex:1 1 100%;margin-left:0;justify-content:center}
}
.pg-lg-modal .lg-preview{padding:10px 12px;border-radius:10px;background:var(--b-info-bg);color:var(--b-info-fg);font-size:var(--fs-sm);line-height:1.5}
