/* A product-order confirmation surface, intentionally distinct from editorial UI. */
#modal.order-review-dialog { width:min(520px,calc(100% - 24px)); border:0; border-radius:16px; background:#f5f6f8; color:#17212e; font-family:var(--sans); }
.order-review-dialog .modal-head { padding:16px 20px; background:#fff; border-bottom:1px solid #e9edf1; gap:12px; }
.order-review-dialog .modal-head h2 { font-family:var(--sans); font-size:19px; font-weight:700; letter-spacing:0; }
.order-review-dialog .modal-head .icon-button { width:36px; height:36px; min-height:36px; border:0; background:#f3f4f6; color:#4b5563; }
.order-review-dialog .modal-body { padding:0; }
.order-review { --or-line:#e8ebef; padding:20px 20px 0; font-size:13px; line-height:1.5; }
.or-reference { display:flex; align-items:center; justify-content:space-between; gap:12px; font-size:11px; font-weight:700; letter-spacing:1px; color:#657080; }
.or-status { color:#95600b; background:#fff0cd; padding:4px 8px; border-radius:4px; font-size:11px; letter-spacing:0; }
.or-number { display:flex; flex-wrap:wrap; gap:4px 10px; color:#687382; font-size:11px; margin:12px 0 16px; }
.or-number span { color:#465366; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.or-product { background:#fff; display:grid; grid-template-columns:112px minmax(0,1fr); gap:16px; padding:16px; border:1px solid var(--or-line); border-radius:10px; }
.or-image { width:112px; height:112px; background:#fff; border:1px solid #f0f1f3; border-radius:6px; overflow:hidden; display:grid; place-items:center; }
.or-image img { width:100%; height:100%; object-fit:contain; }
.or-image>span { display:grid; justify-items:center; gap:8px; color:#7b8491; font-size:10px; padding:8px; }
.or-product-info { min-width:0; }
.or-product h3 { font-family:var(--sans); font-size:15px; font-weight:650; line-height:1.45; overflow-wrap:anywhere; margin:0 0 12px; }
.or-unit { color:#687382; font-size:11px; margin:0 0 8px; }
.or-unit strong { display:block; font-size:14px; color:#17212e; margin-top:3px; overflow-wrap:anywhere; font-variant-numeric:tabular-nums; }
.or-quantity { display:inline-flex; align-items:center; gap:12px; color:#687382; background:#f5f6f8; padding:4px 8px; border-radius:4px; font-size:11px; max-width:100%; flex-wrap:wrap; }
.or-quantity b { font-size:13px; color:#17212e; overflow-wrap:anywhere; }
.or-summary { background:#fff; border:1px solid var(--or-line); border-radius:10px; margin-top:12px; padding:16px; }
.or-total,.or-commission { display:flex; align-items:baseline; justify-content:space-between; gap:16px; }
.or-total>span { color:#465366; font-size:13px; flex-shrink:0; }
.or-total>strong { font-size:28px; line-height:1.2; letter-spacing:-.5px; color:#c74518; font-weight:750; text-align:right; overflow-wrap:anywhere; min-width:0; font-variant-numeric:tabular-nums; }
.or-commission { border-top:1px dashed var(--or-line); margin-top:14px; padding-top:12px; font-size:12px; }
.or-commission>span { color:#687382; }
.or-commission>strong { color:#13724e; font-size:16px; font-variant-numeric:tabular-nums; overflow-wrap:anywhere; }
.order-review-dialog .or-account { display:grid; grid-template-columns:1fr 1fr; gap:12px; padding:16px 4px; margin:0; }
.or-account dt { color:#687382; font-size:11px; margin-bottom:4px; }
.or-account dd { color:#344256; margin:0; font-size:13px; font-weight:600; overflow-wrap:anywhere; font-variant-numeric:tabular-nums; }
.or-actions { position:sticky; bottom:0; z-index:2; background:#fff; border-top:1px solid var(--or-line); margin:0 -20px; padding:12px 20px max(12px,env(safe-area-inset-bottom)); }
.or-actions p { color:#687382; text-align:center; font-size:11px; margin:0 0 10px; }
.or-actions .button { width:100%; justify-content:center; min-height:46px; border-radius:7px; font-size:14px; }
.or-actions .or-submit { background:#ce4a1b; color:#fff; border:1px solid #ce4a1b; font-weight:700; }
.or-actions .or-submit:hover { background:#b83d12; }
.or-actions .or-later { background:#fff; border:0; color:#687382; margin-top:4px; min-height:36px; font-size:12px; }
.or-actions .button:focus-visible { outline:3px solid #2563eb; outline-offset:2px; }
@media(max-width:359px) {
 .order-review { padding:16px 12px 0; }
 .or-product { grid-template-columns:88px minmax(0,1fr); gap:12px; padding:12px; }
 .or-image { width:88px; height:100px; }
 .or-product h3 { font-size:13px; }
 .or-total>strong { font-size:23px; }
 .or-actions { margin:0 -12px; padding-left:12px; padding-right:12px; }
}
#modal.order-feedback-dialog { width:min(300px,calc(100% - 40px)); border:0; border-radius:16px; background:#fff; color:#17212e; }
.order-feedback-dialog .modal-head { display:none; }
.order-feedback-dialog .modal-body { padding:28px 24px; }
.order-feedback { display:grid; justify-items:center; gap:16px; text-align:center; font-family:var(--sans); }
.order-feedback p { margin:0; color:#687382; font-size:13px; }
.order-feedback h3 { margin:0; font-family:var(--sans); font-size:19px; font-weight:650; }
.order-spinner { width:34px; height:34px; border:3px solid #e7eaee; border-top-color:#ce4a1b; border-radius:50%; animation:order-spin .7s linear infinite; }
.order-success-mark { display:grid; place-items:center; width:48px; height:48px; border-radius:50%; background:#e8f5ee; color:#13724e; font-size:28px; font-weight:700; }
.order-feedback .button { min-height:40px; padding:10px 24px; font-size:12px; }
@keyframes order-spin { to { transform:rotate(360deg); } }
@media(prefers-reduced-motion:reduce) { .order-spinner { animation:none; } }