:root { color-scheme: dark; }
* { box-sizing: border-box; }
body { margin: 0; min-height: 100vh; background: #050914; color: #f8fafc; font-family: "Readex Pro", system-ui, sans-serif; }
a { color: inherit; }
.orders-shell { width: min(1120px, calc(100% - 32px)); margin: 0 auto; padding: 22px 0 70px; }
.orders-topbar { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 34px; }
.orders-logo { display: block; width: 142px; }
.orders-logo img { display: block; width: 100%; height: auto; object-fit: contain; }
.orders-back { display: inline-flex; align-items: center; min-height: 44px; padding: 9px 14px; border: 1px solid #263247; border-radius: 10px; color: #cbd5e1; text-decoration: none; }
.orders-heading { margin-bottom: 22px; }
.orders-heading h1 { margin: 0 0 8px; font-size: clamp(27px, 5vw, 42px); }
.orders-heading p { margin: 0; color: #94a3b8; line-height: 1.9; }
.orders-card { border: 1px solid #1c2940; border-radius: 18px; background: #0b111d; box-shadow: 0 20px 60px rgba(0,0,0,.18); }
.orders-detail { padding: 24px; }
.order-number { direction: ltr; unicode-bidi: isolate; color: #8de9ff; font: 700 15px ui-monospace, Consolas, monospace; }
.order-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; overflow: hidden; margin-top: 20px; border: 1px solid #1c2940; border-radius: 13px; background: #1c2940; }
.order-field { min-width: 0; padding: 15px; background: #0d1524; }
.order-field span { display: block; margin-bottom: 7px; color: #7f8da6; font-size: 12px; }
.order-field strong { display: block; overflow-wrap: anywhere; color: #f8fafc; }
.order-payment-note { margin-top: 20px; padding: 15px; border: 1px solid rgba(251,191,36,.24); border-radius: 12px; background: rgba(251,191,36,.07); color: #fde68a; line-height: 1.9; }
.delivery-handoff { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-top: 16px; padding: 17px; border: 1px solid rgba(34,197,94,.26); border-radius: 13px; background: rgba(34,197,94,.07); }
.delivery-handoff h2 { margin: 0 0 6px; font-size: 17px; }
.delivery-handoff p { margin: 0; color: #bbf7d0; line-height: 1.7; font-size: 13px; }
.delivery-handoff button { flex: 0 0 auto; min-height: 46px; padding: 10px 16px; border: 0; border-radius: 10px; background: #22c55e; color: #04110a; font: inherit; font-size: 14px; font-weight: 700; cursor: pointer; }
.delivery-handoff button:disabled { opacity: .62; cursor: wait; }
.delivery-handoff .handoff-message { flex-basis: 100%; color: #cbd5e1; }
.delivery-handoff .handoff-message.error { color: #fecaca; }
.delivery-handoff .handoff-message.success { color: #bbf7d0; }
.payment-support { margin-top:16px;padding:17px;border:1px solid rgba(56,189,248,.25);border-radius:13px;background:rgba(56,189,248,.05); }
.payment-support h2 { margin:0 0 6px;font-size:17px; }.payment-support p{margin:0;color:#cbd5e1;line-height:1.8;font-size:13px;}.payment-support form{display:grid;gap:11px;margin-top:14px;}.payment-support label{display:grid;gap:7px;color:#cbd5e1;font-size:13px;}.payment-support textarea,.payment-support input[type=file]{width:100%;min-width:0;padding:10px;border:1px solid #334155;border-radius:10px;background:#0d1524;color:#fff;font:inherit;}.payment-support textarea{min-height:108px;resize:vertical;}.payment-support .review-order-link{justify-self:start;}
.status-badge { display: inline-flex; align-items: center; width: fit-content; padding: 6px 10px; border-radius: 999px; font-size: 12px; }
.status-pending { background: rgba(251,191,36,.1); color: #fde68a; }
.status-paid, .status-delivered { background: rgba(34,197,94,.12); color: #bbf7d0; }
.status-failed, .status-expired { background: rgba(239,68,68,.12); color: #fecaca; }
.status-ready { background: rgba(56,189,248,.12); color: #bae6fd; }
.orders-list { display: grid; gap: 12px; }
.order-item { display:grid;gap:12px;padding:18px;transition:border-color .2s ease,transform .2s ease; }
.order-item:hover { border-color:#315bff; transform:translateY(-1px); }
.order-detail-link { display:grid;grid-template-columns:minmax(0,1.6fr) minmax(130px,.7fr) minmax(130px,.7fr) auto;gap:15px;align-items:center;color:inherit;text-decoration:none; }
.order-item h2 { margin: 5px 0 0; font-size: 16px; }
.order-meta { color: #94a3b8; font-size: 12px; }
.order-item-summary { margin-top: 8px; color: #cbd5e1; font-size: 13px; line-height: 1.7; }
.order-total { font-size: 18px; font-weight: 800; direction: ltr; unicode-bidi: isolate; }
.order-item-actions { display: flex; flex-wrap: wrap; gap: 9px; }
.order-action { display: inline-flex; align-items: center; justify-content: center; min-height: 40px; padding: 8px 12px; border: 1px solid #334155; border-radius: 9px; background: #0d1524; color: #dbeafe; font: inherit; font-size: 13px; text-decoration: none; cursor: pointer; }
.order-action:hover,.order-action:focus-visible { border-color: #67d7ff; color: #fff; outline: 0; }
.order-cancel-action { border-color: rgba(248,113,113,.5); color: #fecaca; }
.order-cancel-action:hover,.order-cancel-action:focus-visible { border-color: #fca5a5; color: #fff; }
.order-cancel-action:disabled { cursor: wait; opacity: .6; }
.state-box { padding: 28px; text-align: center; color: #a8b2c2; }
.state-box h2 { color: #fff; }
.state-box a { display: inline-flex; margin-top: 12px; color: #8de9ff; }
.orders-pagination { display: flex; justify-content: center; align-items: center; gap: 10px; margin-top: 20px; }
.orders-pagination button { min-height: 44px; padding: 9px 15px; border: 1px solid #263247; border-radius: 10px; background: #111827; color: #fff; font: inherit; cursor: pointer; }
.orders-pagination button:disabled { opacity: .45; cursor: not-allowed; }
.orders-pagination span { color: #94a3b8; font-size: 13px; }
.review-action,.review-order-link,.retry-button { display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:9px 14px;border:1px solid #67d7ff;border-radius:10px;background:#102a3b;color:#b8efff;font:inherit;font-weight:700;text-decoration:none;cursor:pointer; }
.order-item .review-action { justify-self:start; }
.retry-button { margin-top:12px; }
.hidden { display: none !important; }
@media (max-width: 720px) {
    .orders-shell { width: min(100% - 24px, 1120px); padding-top: 14px; }
    .orders-logo { width: 122px; }
    .orders-back { width: 44px; padding: 0; justify-content: center; font-size: 0; }
    .orders-back::after { content: "→"; font-size: 19px; }
    .orders-detail { padding: 17px; }
    .order-grid { grid-template-columns: 1fr; }
    .delivery-handoff { align-items: stretch; flex-direction: column; }
    .delivery-handoff button { width: 100%; }
    .payment-support .review-order-link { width:100%; }
    .order-detail-link { grid-template-columns: 1fr; gap: 10px; }
    .order-total { font-size: 17px; }
    .order-item-actions,.order-action { width: 100%; }
    .order-item .review-action,.review-order-link { width:100%; }
}

/* NOWPayments method selector: scoped to the payment detail page. */
.payment-methods { margin-top:20px; padding:16px; border:1px solid rgba(103,215,255,.24); border-radius:13px; background:rgba(16,42,59,.45); }
.payment-methods h2 { margin:0 0 6px; font-size:17px; }
.payment-methods > p { margin:0; color:#cbd5e1; font-size:13px; line-height:1.8; }
.payment-method-list { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:10px; margin-top:14px; }
.payment-method-option { display:flex; align-items:center; gap:10px; min-width:0; min-height:50px; padding:10px 12px; border:1px solid #334155; border-radius:10px; background:#0d1524; color:#f8fafc; cursor:pointer; }
.payment-method-option:has(input:checked) { border-color:#67d7ff; background:#102a3b; }
.payment-method-option input { flex:0 0 auto; accent-color:#67d7ff; }
.payment-method-option span { min-width:0; overflow-wrap:anywhere; }
.payment-method-message { min-height:20px; margin-top:10px !important; color:#fde68a !important; }
.payment-method-message.error { color:#fecaca !important; }
@media (max-width:720px) { .payment-method-list { grid-template-columns:1fr; } .payment-method-option { min-height:54px; } }
