/* 🚚 Kirim langsung supplier (sja-dropship.js, docs/SJA_DROPSHIP.md "Layar"). Phone first: no sideways scroll at 360px, every tap
   target >= 44px, the two confirm buttons 52px. Neutral grey for the badge and the explanation (lesson warning-colors-only-for-warnings):
   red only for a refusal / error, green only for "saved". The sheet scrolls in its own box (.sds-body, overflow-anchor:none);
   sja-dropship.js keeps the row being read in place itself (sdsKeep), the same on Chromium and on iOS Safari. */
.sds-entry { display: flex; align-items: center; gap: .6rem; width: 100%; min-height: 56px; margin: 0 0 .6rem; padding: .5rem .8rem; box-sizing: border-box; border: 1.5px solid #CBD5E1; border-radius: 12px; background: #fff; color: var(--dark); font: inherit; font-weight: 800; font-size: 1rem; text-align: left; cursor: pointer; box-shadow: var(--sh-sm); }
.sds-entry span:nth-child(2) { flex: 1; min-width: 0; }
.sds-entry-ic { font-size: 1.4rem; }

.sds-ov { position: fixed; inset: 0; z-index: 150; display: flex; justify-content: center; background: rgba(16, 24, 40, .45); }
.sds-sheet { display: flex; flex-direction: column; width: 100%; max-width: 720px; height: 100%; background: #EEF1F4; min-width: 0; }
.sds-bar { display: flex; align-items: center; gap: .4rem; flex: 0 0 auto; padding: .35rem .5rem; padding-top: calc(.35rem + env(safe-area-inset-top)); background: #fff; border-bottom: 1px solid var(--border); }
.sds-back { min-height: 44px; padding: .3rem .7rem; border: 1px solid var(--border-input); border-radius: 10px; background: #fff; color: var(--dark); font: inherit; font-weight: 800; font-size: .95rem; cursor: pointer; white-space: nowrap; }
.sds-title { flex: 1; min-width: 0; font-weight: 800; font-size: 1rem; color: var(--dark); overflow-wrap: anywhere; }
.sds-body { flex: 1 1 auto; min-height: 0; overflow-y: auto; overflow-x: hidden; overscroll-behavior: contain; -webkit-overflow-scrolling: touch; overflow-anchor: none; padding: .5rem .55rem calc(1.2rem + env(safe-area-inset-bottom)); min-width: 0; }
.sds-intro { font-size: .86rem; color: var(--ink2); line-height: 1.45; margin: .1rem .2rem .45rem; overflow-wrap: anywhere; }
.sds-meta { font-size: .82rem; color: var(--ink2); margin: 0 .2rem .3rem; line-height: 1.5; overflow-wrap: anywhere; }
.sds-quiet { font-size: .84rem; color: var(--muted); }
.sds-pad { padding: .6rem .2rem; }
.sds-link { min-height: 44px; padding: 0 .3rem; border: none; background: none; color: var(--p); font: inherit; font-weight: 700; font-size: .84rem; text-decoration: underline; cursor: pointer; }
.sds-note { font-size: .85rem; border-radius: 10px; padding: .5rem .65rem; margin: .4rem 0; overflow-wrap: anywhere; line-height: 1.4; }
.sds-note-d { background: #FEF2F2; color: #991B1B; border-left: 4px solid var(--danger); }
.sds-note-w { background: #FFFBEB; color: #92400E; border-left: 4px solid var(--warn); }
.sds-note-i { background: var(--light); color: var(--ink2); border-left: 4px solid var(--border-input); }
.sds-h { font-weight: 800; font-size: .95rem; color: var(--dark); margin: .2rem .2rem .35rem; }
.sds-h2 { margin-top: .5rem; }
.sds-hint { font-size: .76rem; color: var(--muted); margin: 0 .2rem .4rem; overflow-wrap: anywhere; }

.sds-btn { min-height: 48px; padding: .45rem .9rem; border: none; border-radius: 10px; background: var(--p); color: #fff; font: inherit; font-weight: 800; font-size: .95rem; cursor: pointer; white-space: nowrap; }
.sds-btn:disabled { background: #C7CBD6; color: #fff; cursor: default; }
.sds-btn2 { min-height: 44px; padding: .3rem .8rem; border: 1px solid var(--border-input); border-radius: 10px; background: #fff; color: var(--dark); font: inherit; font-weight: 700; font-size: .9rem; cursor: pointer; }
.sds-btn2:disabled { color: var(--muted); cursor: default; }
.sds-card { padding: .6rem .7rem; margin: .6rem 0 .5rem; border: 1px solid var(--border); border-radius: 12px; background: #fff; box-shadow: var(--sh-sm); min-width: 0; }

.sds-p, .sds-f { padding: .6rem .65rem; margin: 0 0 .45rem; border: 1px solid var(--border); border-radius: 12px; background: #fff; min-width: 0; }
.sds-f { margin: .4rem 0 0; }
.sds-p1 { display: flex; justify-content: space-between; align-items: flex-start; gap: .5rem; min-width: 0; }
.sds-pn { min-width: 0; font-size: .95rem; overflow-wrap: anywhere; }
.sds-pname { display: block; font-size: .8rem; color: var(--ink2); font-weight: 400; overflow-wrap: anywhere; }
.sds-tag { display: inline-block; font-size: .68rem; font-weight: 800; border-radius: 6px; padding: .02rem .35rem; border: 1px solid #CBD5E1; background: #F1F5F9; color: #334155; vertical-align: middle; }

.sds-cost { margin-top: .45rem; }
.sds-fl { display: block; font-size: .84rem; font-weight: 800; color: var(--dark); margin: 0 0 .2rem; }
.sds-fl small { font-weight: 400; color: var(--muted); }
.sds-cost-row { display: flex; gap: .4rem; align-items: stretch; min-width: 0; }
.sds-cin { flex: 1 1 auto; min-width: 0; width: 100%; min-height: 48px; box-sizing: border-box; padding: 0 .6rem; border: 1px solid var(--border-input); border-radius: 10px; background: #fff; font: inherit; font-size: 20px; font-weight: 800; font-variant-numeric: tabular-nums; }
.sds-echo { font-size: .9rem; font-weight: 800; color: var(--dark); margin-top: .25rem; font-variant-numeric: tabular-nums; }
.sds-cur { font-size: .8rem; color: var(--ink2); margin-top: .25rem; overflow-wrap: anywhere; }
.sds-err { font-size: .86rem; font-weight: 700; color: #B42318; margin-top: .3rem; overflow-wrap: anywhere; }
.sds-err:empty, .sds-echo:empty, .sds-okmsg:empty { display: none; }
.sds-okmsg { font-size: .86rem; font-weight: 700; color: #05603A; margin-top: .3rem; overflow-wrap: anywhere; }
.sds-sw { margin-top: .5rem; }

.sds-ask { margin-top: .5rem; padding: .55rem .6rem; border: 1px solid var(--border-input); border-radius: 12px; background: var(--light); }
.sds-ask-t { font-weight: 800; font-size: .92rem; color: var(--dark); overflow-wrap: anywhere; }
.sds-ask-l { margin: .3rem 0 .2rem; padding-left: 1.1rem; font-size: .84rem; color: var(--ink2); line-height: 1.4; }
.sds-ask-l li { margin: .15rem 0; overflow-wrap: anywhere; }
.sds-err-box { background: #FEF2F2; border-left: 4px solid var(--danger); border-radius: 8px; padding: .45rem .6rem; }
.sds-ask-b { display: grid; grid-template-columns: 1fr 1fr; gap: .4rem; margin-top: .45rem; }
.sds-ask-b .sds-btn, .sds-ask-b .sds-btn2 { min-height: 52px; width: 100%; }
.sds-ask-b .sds-btn2:only-child { grid-column: 1 / -1; }

.sds-q { width: 100%; min-height: 48px; box-sizing: border-box; padding: 0 .7rem; border: 1px solid var(--border-input); border-radius: 10px; background: #fff; font: inherit; font-size: 16px; }
