/* Gaya tambahan untuk versi berbasis database (Stok Awal, Pembelian, modal, struk). */
.dev-banner{background:#fff3d7;color:#8a5a08;font-size:11px;font-weight:700;text-align:center;padding:6px 12px;border-bottom:1px solid #f0dca8}
.badge.out{color:#b3261e;background:#ffe3e0}
.mini{border:1px solid #d8e1dc;background:#fff;border-radius:7px;padding:5px 8px;font-size:11px;font-weight:700;color:#53645b;margin-left:4px}
.mini.danger{color:#b3261e}
.row-actions{white-space:nowrap;text-align:right}
.muted-row td{opacity:.55}
.modal-panel.wide{width:min(760px,100%);max-height:92vh;overflow:auto}
.modal-panel .actions{display:flex;gap:10px;justify-content:flex-end;margin-top:6px}
.modal-panel .actions .outline{height:42px;padding:0 16px}
.err{color:#b3261e;font-size:12px;font-weight:600;min-height:16px;margin:0}
.hint{font-size:11px;color:var(--muted);margin:0}
.pay-total{font-size:28px;font-weight:800;color:var(--green);margin:4px 0 14px}
.quick-cash{display:flex;gap:6px;flex-wrap:wrap;margin-top:8px}
.quick-cash button{border:1px solid #d8e1dc;background:#fff;border-radius:8px;padding:7px 10px;font-size:11px;font-weight:700;color:#53645b}
.change-box{background:var(--mint);color:var(--green);border-radius:10px;padding:12px;font-weight:800;display:flex;justify-content:space-between;font-size:13px}
.discount-input{width:110px;border:1px solid #d8e1dc;border-radius:8px;padding:6px 8px;font-size:12px;text-align:right}
.input-table input,.input-table select{margin:0;padding:8px;font-size:12px;width:100%;border:1px solid #d8e1dc;border-radius:7px}
.input-table input[type=number]{text-align:right;min-width:70px}
.input-table td{vertical-align:middle}
.input-table select.unit{width:auto}
.price-cell{display:flex;gap:6px;min-width:190px}
.price-cell input{flex:1}
.input-table th.num,.input-table td.num{text-align:right}
.purchase-line{display:grid;grid-template-columns:2.2fr .7fr .7fr 1.4fr auto;gap:8px;align-items:end;padding:10px 0;border-bottom:1px solid var(--line)}
.purchase-line label{font-size:10px}
.purchase-line .price-cell{min-width:0}
.purchase-line .sub{font-size:12px;font-weight:800;text-align:right;padding-bottom:10px;white-space:nowrap}
.total-bar{display:flex;justify-content:space-between;align-items:center;font-size:14px;font-weight:800;padding:12px 0}
.total-bar b{color:var(--green);font-size:18px}
.receipt{font-family:"Courier New",monospace;font-size:12px;width:100%;max-width:300px;margin:0 auto;color:#000;background:#fff;padding:6px}
.receipt h3{text-align:center;margin:0 0 2px;font-size:15px}
.receipt .c{text-align:center}
.receipt hr{border:0;border-top:1px dashed #000;margin:8px 0}
.receipt .r{display:flex;justify-content:space-between;gap:8px}
.receipt .it{margin-bottom:4px}
.login-modal{z-index:100;background:rgba(12,35,25,.85)}
.settings-grid .span-2{grid-column:1/-1}
.user-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:10px 0;border-bottom:1px solid var(--line);font-size:12px}
.user-row small{display:block;color:var(--muted);font-size:10px;margin-top:3px}
.bar-chart.dense{gap:2px}
.bar-chart.dense span,.bar-chart.dense i{width:50%}
.bar-chart.dense small{font-size:9px}
.bar-chart span[title],.bar-chart i[title]{min-height:1px}
.loading{padding:30px;text-align:center;color:var(--muted);font-size:12px}
.summary-line{display:flex;gap:18px;flex-wrap:wrap;font-size:12px;color:var(--muted);padding:12px 16px;border-top:1px solid var(--line)}
.summary-line b{color:var(--green)}
@media(max-width:700px){.purchase-line{grid-template-columns:1fr 1fr}.purchase-line .full{grid-column:1/-1}}
@media print{
  body *{visibility:hidden}
  #receiptBody,#receiptBody *{visibility:visible}
  #receiptBody{position:absolute;left:0;top:0;width:76mm;max-width:none}
}
.product:disabled{opacity:.5;cursor:not-allowed}