/* ── Page Header ── */
.pg-header { display:flex;align-items:center;justify-content:space-between;margin-bottom:24px;flex-wrap:wrap;gap:12px; }
.pg-header-left { display:flex;align-items:center;gap:14px; }
.pg-header-icon { width:44px;height:44px;background:linear-gradient(135deg,#f97316,#ea580c);border-radius:12px;display:flex;align-items:center;justify-content:center;color:#fff;font-size:18px; }
.pg-header-left h1 { font-size:22px;font-weight:800;color:var(--clr-dark,#fff);margin:0; }
.pg-header-left p { font-size:13px;color:var(--clr-muted,#64748b);margin:2px 0 0; }

/* ── Tabs ── */
.ao-tabs { display:flex;gap:8px;margin-bottom:20px;flex-wrap:wrap; }
.ao-tab-btn { padding:9px 18px;border-radius:20px;border:1.5px solid var(--clr-border,#e2e8f0);background:#fff;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s;color:var(--clr-muted,#64748b); }
.ao-tab-btn.active { background:#f97316;border-color:#f97316;color:#fff;box-shadow:0 2px 8px rgba(249,115,22,.3); }

/* ── Status Filter ── */
.ao-status-filter { display:flex;gap:8px;margin-bottom:20px;flex-wrap:wrap; }
.ao-status-pill { padding:5px 14px;border-radius:20px;border:1.5px solid var(--clr-border,#e2e8f0);background:#fff;font-size:12px;font-weight:600;cursor:pointer;transition:all .2s;color:var(--clr-dark,#1e293b); }
.ao-status-pill.active { border-color:#f97316;color:#f97316;background:#fff7ed; }

/* ── Order Card ── */
.ao-card { background:#fff;border-radius:14px;box-shadow:0 2px 12px rgba(0,0,0,.05);margin-bottom:14px;overflow:hidden;border:1.5px solid var(--clr-border,#e2e8f0);transition:border-color .2s; }
.ao-card:hover { border-color:rgba(249,115,22,.3); }
.ao-card-header { padding:18px 20px;cursor:pointer;display:flex;align-items:center;gap:16px; }
.ao-card-icon { width:44px;height:44px;border-radius:10px;background:#fff7ed;display:flex;align-items:center;justify-content:center;font-size:18px;color:#f97316;flex-shrink:0; }
.ao-card-main { flex:1;min-width:0; }
.ao-card-title { font-size:14px;font-weight:700;color:var(--clr-dark,#1e293b);margin-bottom:4px;display:flex;align-items:center;gap:8px;flex-wrap:wrap; }
.ao-card-meta { font-size:12px;color:var(--clr-muted,#64748b);display:flex;gap:12px;flex-wrap:wrap; }
.ao-card-meta span { display:flex;align-items:center;gap:4px; }
.ao-card-right { text-align:right;flex-shrink:0; }
.ao-card-total { font-size:16px;font-weight:800;color:var(--clr-dark,#1e293b); }
.ao-card-total-label { font-size:11px;color:var(--clr-muted,#64748b); }
.ao-expand-icon { font-size:12px;color:var(--clr-muted,#64748b);margin-left:8px;transition:transform .25s; }
.ao-expand-icon.open { transform:rotate(180deg); }

/* ── Status Badge ── */
.ao-badge { font-size:11px;font-weight:700;padding:3px 10px;border-radius:20px; }
.ao-badge-pending   { background:#fffbeb;color:#d97706;border:1px solid #fde68a; }
.ao-badge-confirmed { background:#eff6ff;color:#2563eb;border:1px solid #bfdbfe; }
.ao-badge-active    { background:#f0fdf4;color:#16a34a;border:1px solid #bbf7d0; }
.ao-badge-completed { background:#f1f5f9;color:#475569;border:1px solid #e2e8f0; }
.ao-badge-cancelled { background:#fef2f2;color:#dc2626;border:1px solid #fecaca; }

/* ── Delivery Badge ── */
.ao-delivery-badge { font-size:11px;font-weight:600;padding:3px 8px;border-radius:20px;background:#fff7ed;color:#f97316;border:1px solid rgba(249,115,22,.3); }

/* ── Order Type Badge ── */
.ao-type-badge  { font-size:11px;font-weight:700;padding:3px 10px;border-radius:20px; }
.ao-type-rental { background:#eff6ff;color:#2563eb;border:1px solid #bfdbfe; }
.ao-type-sales  { background:#fdf4ff;color:#9333ea;border:1px solid #e9d5ff; }

/* ── Type Filter ── */
.ao-type-filter { display:flex;gap:8px;margin-bottom:12px;flex-wrap:wrap;align-items:center; }
.ao-type-filter-label { font-size:12px;font-weight:700;color:var(--clr-muted,#64748b);margin-right:4px; }
.ao-type-pill { padding:5px 14px;border-radius:20px;border:1.5px solid var(--clr-border,#e2e8f0);background:#fff;font-size:12px;font-weight:600;cursor:pointer;transition:all .2s;color:var(--clr-dark,#1e293b); }
.ao-type-pill.active { border-color:#2563eb;color:#2563eb;background:#eff6ff; }

/* ── Expanded Body ── */
.ao-card-body { padding:0 20px;overflow:hidden;max-height:0;transition:max-height .4s ease,padding .3s; }
.ao-card-body.open { max-height:1000px;padding:0 20px 20px; }
.ao-body-sep { height:1px;background:var(--clr-border,#e2e8f0);margin-bottom:16px; }

/* ── Items in expand ── */
.ao-order-item { display:flex;gap:12px;align-items:center;padding:10px 0;border-bottom:1px solid var(--clr-border,#e2e8f0); }
.ao-order-item:last-child { border-bottom:none; }
.ao-order-item-img { width:48px;height:48px;border-radius:8px;overflow:hidden;border:1px solid var(--clr-border,#e2e8f0);flex-shrink:0; }
.ao-order-item-img img { width:100%;height:100%;object-fit:cover; }
.ao-order-item-name { font-size:13px;font-weight:700;color:var(--clr-dark,#1e293b);margin-bottom:2px; }
.ao-order-item-meta { font-size:11px;color:var(--clr-muted,#64748b); }
.ao-order-item-total { font-size:13px;font-weight:700;margin-left:auto;color:var(--clr-dark,#1e293b);flex-shrink:0; }

/* ── Status Stepper ── */
.ao-stepper { display:flex;align-items:center;margin:16px 0; }
.ao-step-dot { width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:11px;font-weight:700;flex-shrink:0;z-index:1; }
.ao-step-dot.done { background:#16a34a;color:#fff; }
.ao-step-dot.active { background:#f97316;color:#fff;box-shadow:0 0 0 4px rgba(249,115,22,.2); }
.ao-step-dot.pending { background:#e2e8f0;color:#64748b; }
.ao-step-line { flex:1;height:2px;background:#e2e8f0; }
.ao-step-line.done { background:#16a34a; }
.ao-step-info { font-size:10px;color:var(--clr-muted,#64748b);text-align:center;margin-top:4px; }

/* ── Actions ── */
.ao-actions { display:flex;gap:8px;flex-wrap:wrap;margin-top:14px; }
.ao-action-btn { padding:8px 14px;border-radius:8px;font-size:12px;font-weight:700;cursor:pointer;display:inline-flex;align-items:center;gap:5px;border:none;transition:all .2s; }
.ao-btn-pay     { background:#f97316;color:#fff; }
.ao-btn-pay:hover { background:#ea6c0a; }
.ao-btn-extend  { background:#fff;color:#f97316;border:1.5px solid #f97316; }
.ao-btn-return  { background:#fff;color:#dc2626;border:1.5px solid #fca5a5; }
.ao-btn-track   { background:#f1f5f9;color:var(--clr-dark,#1e293b);border:1.5px solid var(--clr-border,#e2e8f0); }

/* ── Payments ── */
.ao-payment-row { display:flex;justify-content:space-between;font-size:12px;padding:6px 0;border-bottom:1px solid var(--clr-border,#e2e8f0); }
.ao-payment-row:last-child { border-bottom:none; }

/* ── Empty / Loading ── */
.ao-empty { text-align:center;padding:60px 20px; }
.ao-empty i { font-size:48px;color:#e2e8f0;display:block;margin-bottom:16px; }
.ao-empty h5 { font-size:18px;font-weight:700;color:var(--clr-dark,#1e293b);margin-bottom:8px; }
.ao-empty p { color:var(--clr-muted,#64748b);margin-bottom:20px; }
.ao-empty-btn { display:inline-flex;align-items:center;gap:6px;background:#f97316;color:#fff;border-radius:8px;padding:10px 20px;font-size:13px;font-weight:700;text-decoration:none; }

/* ── Modal ── */
.ao-modal-bg { position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,.5);z-index:9999;display:flex;align-items:center;justify-content:center;padding:20px; }
.ao-modal { background:#fff;border-radius:16px;padding:28px;max-width:460px;width:100%;max-height:90vh;overflow-y:auto; }
.ao-modal-title { font-size:16px;font-weight:800;color:var(--clr-dark,#1e293b);margin-bottom:16px; }
.ao-modal-label { font-size:12px;font-weight:600;color:var(--clr-muted,#64748b);margin-bottom:6px;display:block; }
.ao-modal-input { width:100%;border:1.5px solid var(--clr-border,#e2e8f0);border-radius:8px;padding:9px 12px;font-size:13px;outline:none;margin-bottom:12px; }
.ao-modal-input:focus { border-color:#f97316; }
.ao-modal-actions { display:flex;gap:10px;margin-top:8px; }
.ao-modal-submit { flex:1;background:#f97316;color:#fff;border:none;border-radius:8px;padding:11px;font-size:14px;font-weight:700;cursor:pointer; }
.ao-modal-cancel { flex:1;background:#fff;color:var(--clr-dark,#1e293b);border:1.5px solid var(--clr-border,#e2e8f0);border-radius:8px;padding:11px;font-size:14px;font-weight:700;cursor:pointer; }

/* ── Refund Preview in Cancel Modal ── */
.ao-refund-box { background:#fff8f1;border:1.5px solid #fed7aa;border-radius:10px;padding:14px;margin-bottom:14px; }
.ao-refund-title { font-size:13px;font-weight:700;color:#c2410c;margin-bottom:10px; }
.ao-refund-title i { margin-right:6px; }
.ao-refund-row { display:flex;justify-content:space-between;font-size:13px;padding:5px 0; }
.ao-refund-label { color:#475569; }
.ao-refund-value { font-weight:600;color:#0f172a; }
.ao-refund-value.deduct { color:#dc2626; }
.ao-refund-value.green  { color:#16a34a; }
.ao-refund-deduct .ao-refund-label { color:#dc2626; }
.ao-refund-divider { border-top:1.5px dashed #fed7aa;margin:8px 0; }
.ao-refund-total { font-weight:700; }
.ao-refund-total .ao-refund-label { color:#0f172a; }
.ao-refund-note { margin-top:10px;font-size:11px;color:#78350f;background:#fef3c7;border-radius:6px;padding:7px 10px; }
.ao-refund-note i { color:#f97316;margin-right:4px; }

/* ── Pagination ── */
.ao-pagination { display:flex;align-items:center;gap:8px;justify-content:center;margin-top:24px; }
.ao-page-btn { width:36px;height:36px;border-radius:8px;border:1.5px solid var(--clr-border,#e2e8f0);background:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;font-size:13px;font-weight:600;transition:all .2s; }
.ao-page-btn.active,.ao-page-btn:hover { background:#f97316;border-color:#f97316;color:#fff; }
.ao-page-btn:disabled { opacity:.5;cursor:not-allowed; }
