/* daily-log.css — "Harian" (one day, read-only). Logic: daily-log.js. Every class starts with dl-. Phone first: one column, code first, the total big, details behind ▾.
 * Colours: green only for "terkirim", the grey/indigo tag for "rencana", amber for "might be incomplete"; no prices anywhere. */
.dl{container:dl/inline-size;max-width:900px;margin:0 auto;padding:.6rem .7rem 1.2rem;color:var(--dark,#101828);font-size:1rem}
.dl *,.dl *::before,.dl *::after{box-sizing:border-box}
.dl [hidden]{display:none!important}
.dl-btn{min-height:44px;min-width:44px;padding:.3rem .85rem;border:1.5px solid var(--border-input,#D0D5DD);border-radius:11px;background:#fff;color:var(--dark,#101828);font:inherit;font-size:.95rem;font-weight:700;cursor:pointer}
.dl-btn.is-on{background:var(--p,#4F46E5);border-color:var(--p,#4F46E5);color:#fff}
.dl-bar{margin-bottom:.6rem;padding:.5rem .6rem;background:#fff;border:1px solid var(--border,#E4E7EC);border-radius:12px}
.dl-nav{display:flex;align-items:center;gap:.4rem}
.dl-arrow{flex:none;font-size:1.4rem;line-height:1;padding:0 .6rem}
.dl-date{flex:1;min-width:0;text-align:center;font-size:1.15rem;line-height:1.3}
.dl-tools{display:flex;flex-wrap:wrap;gap:.4rem;margin-top:.45rem}
.dl-input{flex:1 1 9rem;min-width:0;min-height:44px;padding:.25rem .55rem;border:1.5px solid var(--border-input,#D0D5DD);border-radius:10px;font:inherit;font-size:1rem}
.dl-ref{margin-left:auto}
.dl-tag{display:inline-block;padding:.02rem .5rem;border-radius:8px;background:#EEF2FF;color:var(--p,#4F46E5);font-size:.8rem;font-weight:700;line-height:1.5;white-space:nowrap}
.dl-tag-ok{background:#ECFDF3;color:#067647}
.dl-tag-warn{background:#FFFAEB;color:#B54708}
.dl-chip{display:inline-block;flex:none;padding:.02rem .5rem;border-radius:8px;font-size:.78rem;font-weight:700;line-height:1.5;white-space:nowrap}
.dl-chip-ok{background:#ECFDF3;color:#067647}
.dl-chip-plan{background:#EEF2FF;color:var(--p,#4F46E5)}
.dl-chip-mid{background:#FFFAEB;color:#B54708}
.dl-grand{margin-bottom:.7rem;padding:.6rem .75rem;background:#fff;border:1px solid var(--border,#E4E7EC);border-left:4px solid var(--p,#4F46E5);border-radius:12px}
.dl-gt{font-size:.9rem;font-weight:800;color:var(--muted,#667085);margin-bottom:.15rem}
.dl-gl{display:grid;grid-template-columns:4.6rem minmax(0,1fr);gap:0 .4rem;align-items:baseline;padding:.15rem 0;line-height:1.4}
.dl-gk{display:inline-block;font-size:.88rem;font-weight:800;color:var(--ink2,#475467)}
.dl-sec{margin-bottom:.8rem}
.dl-h{margin:0 0 .25rem;font-size:1.1rem;font-weight:800}
.dl-sum{margin-bottom:.4rem;padding:.35rem .6rem;background:var(--light,#F8FAFC);border-radius:10px;font-size:.95rem;line-height:1.5}
.dl-sumk{font-weight:800}
.dl-n{color:var(--muted,#667085);font-size:.88rem}
.dl-big{font-size:1.15rem;font-weight:800;font-variant-numeric:tabular-nums}
.dl-sub{font-size:.9rem;color:var(--ink2,#475467);font-variant-numeric:tabular-nums}
.dl-sep{display:none}
.dl-zero{color:var(--muted,#667085);font-weight:700}
.dl-mute{margin:.2rem 0;padding:.5rem .2rem;color:var(--muted,#667085)}
.dl-warn{color:#B54708;font-weight:700;padding:.1rem .2rem}
.dl-list{border:1px solid var(--border,#E4E7EC);border-radius:12px;background:#fff}
.dl-r{border-top:1px solid #F2F4F7}
.dl-list>.dl-r:first-child,.dl-list>.dl-wk:first-child{border-top:0}
.dl-rs{display:grid;grid-template-columns:minmax(0,1fr) auto 1.4rem;align-items:center;gap:.1rem .5rem;min-height:56px;padding:.3rem .6rem;list-style:none;cursor:pointer}
.dl-rs::-webkit-details-marker{display:none}
.dl-rs2{min-height:56px}
.dl-static{border-top:1px solid #F2F4F7;cursor:default}
.dl-id{display:flex;flex-wrap:wrap;align-items:baseline;gap:0 .45rem;min-width:0}
.dl-code{font-size:1.15rem;font-weight:800;line-height:1.25;overflow-wrap:anywhere}
.dl-nm{font-size:.88rem;color:var(--muted,#667085);overflow-wrap:anywhere}
.dl-q{text-align:right;min-width:0;line-height:1.35}
.dl-tq{display:block}
.dl-chev{width:.6rem;height:.6rem;margin:0 .2rem;border-right:2.5px solid var(--muted,#667085);border-bottom:2.5px solid var(--muted,#667085);transform:rotate(45deg) translateY(-2px);transition:transform .15s}
.dl-r[open]>.dl-rs .dl-chev{transform:rotate(-135deg)}
.dl-chev-r{transform:rotate(-45deg)}
.dl-rb{padding:.1rem .6rem .5rem;background:var(--light,#F8FAFC);border-top:1px solid #F2F4F7}
.dl-rec{display:grid;grid-template-columns:3.2rem auto minmax(0,1fr);gap:.1rem .5rem;align-items:center;min-height:44px;padding:.15rem 0;border-top:1px solid #EAECF0;font-size:.92rem}
.dl-rec:first-child{border-top:0}
.dl-rt{color:var(--muted,#667085);font-variant-numeric:tabular-nums}
.dl-rq{font-weight:700;font-variant-numeric:tabular-nums}
.dl-rm{display:flex;flex-wrap:wrap;gap:.15rem .35rem;align-items:center;justify-content:flex-end}
.dl-who{font-size:.85rem;color:var(--muted,#667085)}
.dl-dates{margin:.35rem 0;font-size:.9rem;color:var(--ink2,#475467)}
.dl-line{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:.1rem .6rem;min-height:44px;padding:.2rem 0;border-top:1px solid #EAECF0}
.dl-line:first-child{border-top:0}
.dl-cust{font-size:.85rem;color:var(--muted,#667085)}
.dl-pos{font-size:1rem}
.dl-ppl{flex:1 1 60%;text-align:right;font-size:.95rem;line-height:1.4}
.dl-time{font-size:.82rem;color:var(--muted,#667085);font-variant-numeric:tabular-nums}
.dl-plan{font-size:.85rem;color:var(--muted,#667085)}
.dl-sub2{padding:.5rem .7rem;border-top:1px solid #F2F4F7}
.dl-link{min-height:44px;margin-top:.3rem;padding:.2rem .7rem;border:1.5px solid var(--border-input,#D0D5DD);border-radius:10px;background:#fff;color:var(--p,#4F46E5);font:inherit;font-size:.92rem;font-weight:700;cursor:pointer}
.dl-link-in{margin:0;min-width:44px;border:0;background:none;font-size:1.4rem;padding:0}
.dl-static{display:grid;grid-template-columns:minmax(0,1fr) auto 44px;align-items:center;gap:.1rem .5rem;padding:.3rem .6rem}
.dl-tbl{border:1px solid var(--border,#E4E7EC);border-radius:12px;background:#fff}
.dl-tr{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:.15rem .5rem;padding:.4rem .6rem;border-top:1px solid #F2F4F7}
.dl-tr:first-child{border-top:0}
.dl-th{display:none;font-size:.85rem;font-weight:800;color:var(--ink2,#475467)}
.dl-tc{min-width:0;line-height:1.35}
.dl-tc-code{grid-column:1/-1;display:flex;flex-wrap:wrap;align-items:baseline;gap:0 .45rem}
.dl-tc[data-l]::before{content:attr(data-l) " ";display:block;font-size:.78rem;font-weight:700;color:var(--muted,#667085)}
.dl-tc-d{grid-column:1/-1}
.dl-diff{font-weight:800;font-variant-numeric:tabular-nums}
.dl-diff-up{color:#B54708}
.dl-diff-dn{color:#067647}
@container dl (min-width:640px){
  .dl-tr{grid-template-columns:minmax(8rem,1.2fr) repeat(3,minmax(0,1.4fr));align-items:center}
  .dl-th{display:grid}
  .dl-tc-code,.dl-tc-d{grid-column:auto}
  .dl-tc[data-l]::before{display:none}
}
.dl-wk{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:.1rem;width:100%;min-height:56px;padding:.45rem 2rem .45rem .7rem;border:0;border-top:1px solid #F2F4F7;background:#fff;color:inherit;font:inherit;text-align:left;cursor:pointer}
.dl-wk .dl-chev-r{position:absolute;right:.6rem;top:50%;margin-top:-.3rem}
.dl-wd{font-size:1.05rem}
.dl-wc{display:grid;grid-template-columns:4.4rem minmax(0,1fr);gap:0 .4rem;align-items:baseline;width:100%;line-height:1.4;font-size:.95rem}
.dl-gv{min-width:0}
.dl-home{display:flex;align-items:center;gap:.6rem;width:100%;min-height:56px;margin:.5rem 0;padding:.4rem .8rem;border:1.5px solid var(--border-input,#D0D5DD);border-radius:12px;background:#fff;color:var(--dark,#101828);font:inherit;text-align:left;cursor:pointer}
.dl-home-ic{font-size:1.4rem}
.dl-home-t{flex:1;min-width:0;display:flex;flex-direction:column}
.dl-home-t b{font-size:1.05rem}
.dl-home-s{font-size:.9rem;color:var(--ink2,#475467)}
.dl-ov{position:fixed;inset:0;z-index:150;display:flex;justify-content:center;background:rgba(16,24,40,.45)}
.dl-panel{display:flex;flex-direction:column;width:100%;max-width:960px;max-height:100%;background:var(--light,#F8FAFC)}
.dl-phead{display:flex;align-items:center;justify-content:space-between;gap:.5rem;padding:.4rem .7rem;background:#fff;border-bottom:1px solid var(--border,#E4E7EC);font-size:1.05rem}
.dl-pbody{flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch}
@media (min-width:900px){.dl-ov{align-items:center}.dl-panel{max-height:92vh;border-radius:14px;overflow:hidden}}
.dl-loading{font-style:italic}
.dl-t .dl-code{font-size:1.1rem}
.dl-tc-p,.dl-tc-k{min-width:0;overflow-wrap:anywhere}
.dl-topbox,.dl-body{display:block}
.dl-x{flex:none;font-size:1.1rem}
