/* Transaction Engine v1 */
.transaction-order-detail{background:radial-gradient(circle at 80% 5%,rgba(239,35,60,.08),transparent 25%)}
.transaction-order-head{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:26px 28px;margin:18px 0;background:linear-gradient(145deg,#151820,#0f1117);border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)}
.transaction-order-head h1{margin:4px 0 2px;font-size:clamp(26px,4vw,40px);letter-spacing:-.04em}.transaction-order-head p{margin:0;color:var(--muted)}.transaction-status-stack{display:flex;flex-wrap:wrap;gap:8px;justify-content:flex-end}
.transaction-payment-box{margin:0 0 22px;padding:26px;background:linear-gradient(135deg,rgba(239,35,60,.12),rgba(17,19,25,.98) 42%);border:1px solid rgba(239,35,60,.3);border-radius:22px;box-shadow:0 22px 60px rgba(0,0,0,.28)}
.transaction-payment-head{display:flex;align-items:flex-start;justify-content:space-between;gap:24px}.transaction-payment-head h2{margin:4px 0 4px;font-size:26px}.transaction-payment-head p{margin:0;color:var(--muted);max-width:640px}
.payment-countdown{min-width:140px;text-align:center;padding:11px 16px;border-radius:14px;background:#090a0e;border:1px solid var(--line)}.payment-countdown small{display:block;color:var(--muted);font-size:11px}.payment-countdown strong{display:block;font-size:22px;color:#fff;letter-spacing:.05em}
.transaction-payment-grid{display:grid;grid-template-columns:minmax(220px,.7fr) minmax(280px,1.3fr);gap:14px;margin-top:20px}.payment-total-card,.payment-account-card,.payment-qr-card,.payment-setup-card{min-height:150px;padding:20px;border-radius:16px;background:rgba(8,9,13,.72);border:1px solid var(--line);display:flex;flex-direction:column;justify-content:center}.payment-total-card span,.payment-account-card span{color:var(--muted);font-size:12px}.payment-total-card strong{font-size:30px;letter-spacing:-.04em}.payment-total-card small{color:#ff7b89}.payment-account-card strong{font-size:25px;letter-spacing:.04em;margin:4px 0}.payment-account-card .btn{align-self:flex-start;margin-top:12px}.payment-qr-card{align-items:center;text-align:center}.payment-qr-card img{width:170px;aspect-ratio:1;object-fit:contain;border-radius:12px;background:#fff;padding:8px}.payment-qr-card small{margin-top:8px;color:var(--muted)}.payment-setup-card{flex-direction:row;align-items:flex-start;gap:14px}.payment-setup-card>span{width:46px;height:46px;border-radius:13px;display:grid;place-items:center;background:rgba(245,158,11,.12);color:var(--warning)}.payment-setup-card strong{display:block}.payment-setup-card p{margin:4px 0 0;color:var(--muted)}.payment-setup-card code{color:#ff8996}.payment-panel-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:18px}
.transaction-layout{display:grid;grid-template-columns:minmax(0,1fr) 330px;gap:22px;align-items:start}.transaction-suborders{display:grid;gap:16px}.store-order-card{overflow:hidden;background:var(--surface);border:1px solid var(--line);border-radius:20px}.store-order-card>header{display:flex;justify-content:space-between;align-items:center;gap:18px;padding:20px 22px;border-bottom:1px solid var(--line)}.store-order-card>header small{color:var(--primary-2);font-weight:800;letter-spacing:.08em}.store-order-card>header h2{margin:2px 0 0;font-size:21px}.store-order-card>header>div:last-child{display:flex;gap:7px;flex-wrap:wrap}.store-order-card>footer{display:flex;justify-content:flex-end;gap:9px;padding:16px 22px;border-top:1px solid var(--line);background:rgba(255,255,255,.018)}
.store-order-meta{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--line)}.store-order-meta span{padding:13px 18px;background:#101218}.store-order-meta em{display:block;color:var(--muted);font-style:normal;font-size:11px}.store-order-meta strong{font-size:13px}.store-order-items{padding:8px 22px}.transaction-item-row{display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:13px;align-items:center;padding:14px 0;border-bottom:1px solid var(--line-soft)}.transaction-item-copy{min-width:0}.transaction-item-copy>strong{display:block}.transaction-item-copy small{display:block;color:var(--muted)}.transaction-item-copy>div{margin-top:6px}
.digital-secret-card{margin:14px 0 18px;padding:16px;background:linear-gradient(145deg,rgba(34,197,94,.08),rgba(12,14,19,.9));border:1px solid rgba(34,197,94,.25);border-radius:14px}.digital-secret-card>div{display:flex;align-items:center;gap:8px;color:#79e6a0}.digital-secret-card pre{white-space:pre-wrap;word-break:break-word;margin:12px 0;padding:14px;background:#08090d;border:1px dashed #334039;border-radius:11px;color:#e8ffef;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:13px}.digital-waiting{display:flex;gap:10px;align-items:center;margin:12px 0 16px;padding:12px 14px;border-radius:12px;background:#0d0f14;color:var(--muted)}.digital-waiting p{margin:0}.seller-delivery-form{display:grid;gap:10px;margin:14px 0 18px;padding:15px;border:1px dashed #3a3e4a;border-radius:14px}.seller-delivery-form textarea{width:100%;resize:vertical;background:#090a0e;border:1px solid var(--line);border-radius:11px;color:#fff;padding:12px;outline:0}.seller-delivery-form textarea:focus{border-color:var(--primary)}.seller-delivery-form .btn{justify-self:start}
.transaction-side-stack{display:grid;gap:16px;position:sticky;top:calc(var(--header) + 18px)}.transaction-summary-card,.transaction-timeline{padding:20px;background:var(--surface);border:1px solid var(--line);border-radius:18px}.transaction-summary-card h2,.transaction-timeline h2{font-size:18px;margin:0 0 15px}.transaction-summary-card>small,.transaction-summary-card>p{color:var(--muted)}.transaction-timeline>div{position:relative;display:flex;gap:12px;padding:0 0 17px}.transaction-timeline>div:not(:last-child):before{content:"";position:absolute;left:5px;top:12px;bottom:0;width:1px;background:var(--line)}.transaction-timeline i{width:11px;height:11px;margin-top:6px;border-radius:50%;background:var(--primary);box-shadow:0 0 0 4px rgba(239,35,60,.11);z-index:1}.transaction-timeline p{margin:0;min-width:0}.transaction-timeline strong,.transaction-timeline span,.transaction-timeline small{display:block}.transaction-timeline span{color:#c7c9d0;font-size:12px}.transaction-timeline small{color:var(--muted-2);font-size:10px;margin-top:3px}
.transaction-stats{margin-bottom:22px}.seller-order-list{display:grid;gap:13px}.seller-order-list>.table-card-head{background:var(--surface);border:1px solid var(--line);border-radius:17px;padding:18px 20px}.seller-order-card{padding:19px 21px;background:var(--surface);border:1px solid var(--line);border-radius:17px;transition:.2s ease}.seller-order-card:hover{border-color:#3b404d;transform:translateY(-1px)}.seller-order-main{display:flex;justify-content:space-between;gap:16px}.seller-order-main small{color:var(--muted)}.seller-order-main h3{margin:2px 0;font-size:19px}.seller-order-main p{margin:0;color:#bec2cc}.seller-order-main>strong{font-size:18px}.seller-order-status{display:flex;flex-wrap:wrap;gap:12px;margin:14px 0;padding:11px 0;border-block:1px solid var(--line-soft)}.seller-order-status>span{display:flex;align-items:center;gap:7px;color:var(--muted);font-size:12px}.seller-order-actions{display:flex;gap:9px;justify-content:flex-end}
.inventory-hero{display:flex;align-items:center;justify-content:space-between;gap:22px;margin-bottom:20px;padding:22px 24px;border-radius:20px;background:linear-gradient(135deg,#ef233c,#7a0d23);box-shadow:0 20px 50px rgba(239,35,60,.17)}.inventory-hero>div{display:flex;align-items:center;gap:14px}.inventory-hero h2{margin:0}.inventory-hero p{margin:2px 0 0;color:rgba(255,255,255,.78);max-width:780px}.inventory-layout{display:grid;grid-template-columns:280px minmax(0,1fr);gap:20px;align-items:start}.inventory-products{padding:13px;background:var(--surface);border:1px solid var(--line);border-radius:18px;position:sticky;top:calc(var(--header) + 18px)}.inventory-products h3{margin:6px 8px 12px}.inventory-products>a{display:flex;gap:10px;align-items:center;padding:11px;border-radius:13px;margin-bottom:5px}.inventory-products>a:hover,.inventory-products>a.active{background:var(--surface-3)}.inventory-products>a.active{box-shadow:inset 3px 0 var(--primary)}.inventory-products>a div{min-width:0}.inventory-products strong,.inventory-products small{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.inventory-products small{color:var(--muted);font-size:11px}.inventory-main{min-width:0}.inventory-title{display:flex;justify-content:space-between;align-items:center;padding:20px 22px;background:var(--surface);border:1px solid var(--line);border-radius:18px;margin-bottom:14px}.inventory-title h2{margin:3px 0}.inventory-title p{margin:0;color:var(--muted)}.inventory-variant-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 14px}.inventory-variant-tabs a{padding:8px 12px;border:1px solid var(--line);border-radius:10px;background:var(--surface);font-size:12px}.inventory-variant-tabs a.active{border-color:var(--primary);background:rgba(239,35,60,.1);color:#ff8795}.inventory-add-form{margin-bottom:15px}.inventory-add-form textarea{font-family:ui-monospace,SFMono-Regular,Menlo,monospace}.inventory-recent code{color:#e9ebf1}.pending-balance-label{display:inline-flex!important;margin-top:8px;padding:6px 10px;border-radius:9px;background:rgba(255,255,255,.09);color:#fff!important}.pending-balance-label strong{font-size:inherit!important}
.admin-transaction-actions{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.mini-action{min-height:30px;padding:5px 9px;border:1px solid var(--line);background:var(--surface-2);border-radius:8px;color:#fff;font-size:11px;font-weight:750}.mini-action.success{border-color:rgba(34,197,94,.35);color:#6ee797;background:rgba(34,197,94,.08)}.mini-action.danger{border-color:rgba(239,35,60,.35);color:#ff8290;background:rgba(239,35,60,.08)}.admin-refund-form{display:flex;gap:5px;align-items:center}.admin-refund-form input{width:130px;min-height:30px;padding:5px 8px;border-radius:8px;border:1px solid var(--line);background:#090a0e;color:#fff;font-size:11px}
@media(max-width:980px){.transaction-layout{grid-template-columns:1fr}.transaction-side-stack{position:static;grid-template-columns:1fr 1fr}.inventory-layout{grid-template-columns:1fr}.inventory-products{position:static;display:flex;overflow:auto;gap:6px}.inventory-products h3{display:none}.inventory-products>a{min-width:220px}.transaction-payment-grid{grid-template-columns:1fr 1fr}}
@media(max-width:680px){.transaction-order-head,.transaction-payment-head,.inventory-hero,.seller-order-main{align-items:flex-start;flex-direction:column}.transaction-order-head{padding:20px}.transaction-payment-box{padding:18px}.transaction-payment-grid,.transaction-side-stack{grid-template-columns:1fr}.payment-countdown{width:100%}.store-order-card>header{align-items:flex-start;flex-direction:column}.store-order-meta{grid-template-columns:1fr}.store-order-items{padding:7px 15px}.transaction-item-row{grid-template-columns:auto minmax(0,1fr)}.transaction-item-row>b{grid-column:2}.store-order-card>footer{justify-content:stretch;flex-direction:column}.store-order-card>footer .btn,.store-order-card>footer form,.store-order-card>footer form button{width:100%}.seller-order-actions{justify-content:stretch;flex-direction:column}.seller-order-actions .btn{width:100%}.inventory-hero{padding:18px}.inventory-hero .btn{width:100%}.inventory-title{align-items:flex-start;flex-direction:column}.admin-refund-form{align-items:stretch;flex-direction:column}.admin-refund-form input{width:100%}}

/* Transaction Engine v1.1 — kartu pesanan tetap lega pada tablet dan ponsel. */
@media(max-width:980px){
  .transaction-side-stack{grid-template-columns:1fr}
  .transaction-summary-card,.transaction-timeline{min-width:0}
  .transaction-timeline>div{grid-template-columns:12px minmax(0,1fr)}
  .transaction-timeline p{width:100%;overflow-wrap:anywhere}
}
@media(max-width:680px){
  .seller-order-list>.table-card-head{align-items:stretch;flex-direction:column}
  .seller-order-list>.table-card-head .table-search{width:100%}
  .seller-order-list>.table-card-head .table-search input{width:100%}
  .seller-order-card{padding:16px}
  .seller-order-main>strong{font-size:16px}
  .seller-order-status{display:grid;grid-template-columns:1fr;gap:9px}
  .transaction-order-head h1{font-size:27px;overflow-wrap:anywhere}
  .transaction-order-head p{line-height:1.6}
  .transaction-timeline{padding:18px}
  .transaction-timeline span{line-height:1.55}
}
