/* GST bill: only what app.css doesn't already cover. */
.tool-head .pill { margin-bottom: 12px; }
#iv-form > label { display: grid; gap: 8px; }
.iv-hint { margin: 8px 0 20px; }
#iv-form fieldset { gap: 10px; margin-bottom: 16px; }
#iv-form legend { font: 700 15px/1.3 var(--font); margin-bottom: 8px; }
.form .iv-quiet { font-size: 14px; font-weight: 400; color: var(--muted); }
.iv-box { background: var(--surface); border: 1px solid var(--border); border-radius: 14px; margin-bottom: 12px; }
.iv-box summary { display: flex; align-items: center; gap: 12px; min-height: 56px; padding: 8px 16px; cursor: pointer; list-style: none; }
.iv-box summary::-webkit-details-marker { display: none; }
.iv-box summary svg { color: var(--accent-text); flex-shrink: 0; }
.iv-sum { flex: 1; min-width: 0; }
.iv-sum strong, .iv-sum small { display: block; overflow-wrap: anywhere; }
.iv-sum small { font-size: 13px; color: var(--muted); }
.iv-edit { font-weight: 700; font-size: 14px; color: var(--accent-text); }
.iv-box > div { display: grid; gap: 14px; padding: 4px 16px 16px; }
.iv-bill-head { display: flex; justify-content: space-between; align-items: baseline; gap: 12px; margin-bottom: 10px; }
.iv-bill-head h2 { margin: 0; font-size: 20px; }
.skipped { margin: 12px 0; padding: 10px 12px; border-radius: 8px; background: #FEF3DC; color: #5C3300; font-size: 13px; }
.skipped ul { margin: 6px 0 0; padding-left: 18px; }

/* Item table: one line per item on wide screens, two lines on phones. */
.it-box { gap: 8px !important; }
.it-head, .it-row { display: grid; grid-template-columns: minmax(0, 1fr) 64px 92px 96px 92px 40px; gap: 6px; align-items: center; }
.it-head { font-size: 12px; font-weight: 600; color: var(--muted); padding: 0 2px; }
.it-head span:nth-child(5) { text-align: right; }
#it-rows { display: grid; gap: 8px; }
.it-row input, .it-row select { min-height: 46px; padding: 10px; }
.it-f { display: grid; gap: 2px; min-width: 0; }
.it-cap { display: none; font-size: 11px; font-weight: 600; color: var(--muted); padding-left: 2px; }
.it-qty, .it-rate { text-align: right; font-variant-numeric: tabular-nums; }
.it-gst { font-size: 14px; padding-right: 4px; }
.it-amt { text-align: right; font-weight: 700; font-variant-numeric: tabular-nums; white-space: nowrap; }
.it-del { width: 40px; height: 40px; border: 0; background: transparent; color: var(--muted); border-radius: 10px; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; }
.it-del:hover { background: var(--surface-2); color: var(--bad); }
.it-add { justify-self: start; min-height: 44px; }
.it-paste { border-top: 1px dashed var(--border); padding-top: 10px; }
.it-paste summary { cursor: pointer; font-weight: 600; color: var(--accent-text); }
.it-paste[open] { display: grid; gap: 8px; }
@media (max-width: 560px) {
  .it-head { display: none; }
  .it-row { grid-template-columns: 72px minmax(0, 1fr) 88px 40px; grid-template-areas: "desc desc amt amt" "qty rate gst del";
    padding: 10px; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface); }
  .it-desc { grid-area: desc; } .it-f-qty { grid-area: qty; } .it-f-rate { grid-area: rate; } .it-f-gst { grid-area: gst; }
  .it-cap { display: block; }
  .it-del { align-self: end; }
  .it-amt { grid-area: amt; } .it-del { grid-area: del; }
  .it-row .it-desc { border: 0; padding-left: 2px; font-weight: 600; }
  .it-row .it-amt { padding-right: 6px; }
}
