/* polish.css — v1 — 2026-11-13
   طبقة تفاصيل إضافية فوق app.css: لا تغيّر الألوان ولا التخطيط ولا الشعار.
   المصدر: مبادئ make-interfaces-feel-better وemil-design-eng (مهارات مفتوحة المصدر، MIT). */

/* أرقام ثابتة العرض: لا تقفز الأسعار والأوقات والعدادات عند تغيّرها */
body{font-variant-numeric:tabular-nums}

/* توازن الأسطر في العناوين وتفادي كلمة وحيدة في آخر الفقرة */
h1,h2,h3{text-wrap:balance}
p{text-wrap:pretty}

/* ضغط محسوس: الأزرار والشرائح تصغر قليلًا عند اللمس، بمنحنى سريع */
.btn,.chip{transition:transform .15s cubic-bezier(.23,1,.32,1),background-color .15s,border-color .15s}
.btn:not([disabled]):active,.chip:active{transform:scale(.97)}

/* مساحة لمس 44px دون تغيير الحجم المرئي (الشريحة 34px والزر الصغير 38px) */
.chip,.btn.small{position:relative}
.chip::after{content:"";position:absolute;inset-block:-5px;inset-inline:0}
.btn.small::after{content:"";position:absolute;inset-block:-3px;inset-inline:0}

@media (prefers-reduced-motion:reduce){
  .btn,.chip{transition:none}
  .btn:not([disabled]):active,.chip:active{transform:none}
}

/* ===== البطاقات في كل صفحات سولفنا — ترتيب وتقليل الفراغ — v3 — 2026-11-13 =====
   الشرائح داخل أي بطاقة تملأ عرضها بأعمدة متساوية بدل التكدس على جهة وترك الفراغ في الأخرى،
   وصفوف الاسم/القيمة بفواصل خفيفة. صفوف الشرائح المنزلقة خارج البطاقات (الفلاتر) لا تتأثر.
   لا تغيير في الألوان ولا الشعار ولا الخط، ويعمل في الوضعين الفاتح والداكن لأنه يستخدم متغيرات الهوية فقط. */
.card>.chips{display:grid;grid-template-columns:repeat(auto-fit,minmax(104px,1fr));gap:8px;overflow:visible;padding-bottom:0}
.card>.chips>.chip{height:44px;border-radius:12px;padding:0 10px;display:flex;align-items:center;justify-content:center;gap:6px;text-align:center;line-height:1.25}
.card>.chips>.chip::after{content:none}
.card>.hint{margin-top:-2px}
.card:has(>.kv:not(.m-stage)){gap:0}
.card>.kv:not(.m-stage){padding-block:7px;border-block-end:1px dashed var(--line);align-items:baseline}
.card>.kv:not(.m-stage):last-child{border-block-end:0}
.card:has(>.kv:not(.m-stage))>div:first-child:not(.kv){padding-block-end:6px}
.card>.inrow .btn.small{min-width:84px;height:auto}

/* ===== صفحة الطلب: بطاقة رئيسية أقوى + فاتورة بشكل إيصال — v4 — 2026-11-13 =====
   نفس الهوية: التدرّج هو تدرّج الشعار (--m-grad) والزر لون الأزرار المعتمد، والألوان كلها من متغيرات الثيم
   فيعمل في الفاتح والداكن. لا يُحذف أي عنصر من الصفحة؛ الترتيب البصري فقط. */

/* البطاقة الرئيسية: شريط تدرّج الشعار، رقم الطلب، والحالة بخط واضح */
[data-order-wait]{position:relative;overflow:hidden;padding:26px 16px 16px;border-radius:20px;order:-4;
  background:radial-gradient(120% 90% at 50% -30%,color-mix(in srgb,#EE5DA6 13%,transparent),transparent 62%),var(--surface)}
[data-order-wait]::before{content:"";position:absolute;inset-inline:0;inset-block-start:0;height:5px;background:var(--m-grad,linear-gradient(125deg,#FF967D,#EE5DA6 50%,#8A78EF))}
[data-order-wait] [data-order-number]{letter-spacing:-.02em}
[data-order-wait] .pill{font-size:16px;line-height:1.5;padding:7px 16px;border-radius:999px}
[data-order-wait]>.hint{font-size:13px}
.o-eta{display:flex;flex-direction:column;align-items:center;gap:0;font-size:12px;color:var(--muted)}
.o-eta bdi{font-size:22px;font-weight:700;color:var(--ink);letter-spacing:.01em}
[data-order-wait]>.btn.sec.small:last-child{align-self:center;height:32px;border-color:transparent;background:transparent;color:var(--muted);font-weight:600;text-decoration:underline;text-underline-offset:3px}

/* زر التتبع يلتصق بالبطاقة الرئيسية كأنهما قطعة واحدة: أهم إجراء في أعلى الصفحة */
[data-track-open]{order:-3}
[data-order-wait] ~ [data-timeline]{order:-2}
[data-order-wait] ~ .o-inv{order:-1}
[data-order-wait]:has(~ [data-track-open]){border-end-start-radius:0;border-end-end-radius:0;border-block-end:0;margin-block-end:-12px}
[data-order-wait] ~ [data-track-open]{border-start-start-radius:0;border-start-end-radius:0;border-block-start:0;border-end-start-radius:20px;border-end-end-radius:20px;padding:4px 16px 16px}
[data-order-wait] ~ [data-track-open]{clip-path:inset(0 -14px -16px -14px)}
[data-order-wait] ~ [data-track-open]>:not(.btn){display:none}
[data-order-wait] ~ [data-track-open]>.btn{height:54px;font-size:16px;border-radius:16px}

/* الفاتورة: إيصال بقصّة جانبية، بنود، ثم الإجمالي بخط كبير */
.o-inv{gap:0;padding:16px;border-radius:20px}
.o-inv .grow{flex:1;min-inline-size:0}
.o-inv-h{display:flex;align-items:flex-start;gap:12px;padding-block-end:12px}
.o-inv-biz{font-size:17px;font-weight:700;line-height:1.35}
.o-inv-no{flex:none;font-size:13px;font-weight:700;color:var(--blue-ink,var(--ink));background:var(--blue-soft,var(--bg));border-radius:999px;padding:4px 12px}
.o-inv-lines{display:flex;flex-direction:column;gap:10px;padding-block:4px 14px}
.o-inv-l{display:flex;align-items:flex-start;gap:12px;font-size:15px}
.o-inv-l .t{font-weight:600}
.o-inv-p{flex:none;font-weight:600}
.o-inv-cut{position:relative;block-size:0;border-block-start:2px dashed var(--line);margin-inline:-16px;margin-block-end:6px}
.o-inv-cut::before,.o-inv-cut::after{content:"";position:absolute;inset-block-start:-11px;inline-size:20px;block-size:20px;border-radius:50%;background:var(--bg);border:1px solid var(--line)}
.o-inv-cut::before{inset-inline-start:-11px;clip-path:inset(0 0 0 50%)}
.o-inv-cut::after{inset-inline-end:-11px;clip-path:inset(0 50% 0 0)}
[dir="rtl"] .o-inv-cut::before{clip-path:inset(0 50% 0 0)}
[dir="rtl"] .o-inv-cut::after{clip-path:inset(0 0 0 50%)}
.o-inv>.kv:not(.m-stage){border-block-end:0;padding-block:5px}
.o-inv-t{display:flex;justify-content:space-between;align-items:baseline;gap:12px;margin-block-start:10px;padding-block-start:12px;border-block-start:1px solid var(--line);font-weight:700;font-size:15px}
.o-inv-t>span:last-child{font-size:26px;font-weight:800;letter-spacing:-.01em}
.o-inv-f{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding-block-start:10px}
.o-inv-f .pill{font-size:13px;padding:4px 12px;border-radius:999px}

/* ===== صفحة الطلب v5 — 2026-11-13: نسبة الإنجاز على شريط الرحلة، مركبة أوضح، وطيّ البطاقات بسهم ===== */
.m-journey .m-track{margin-block-start:66px}
.m-journey .m-veh{width:64px;top:auto;bottom:4px;inset-inline-start:calc(var(--p,0%) - 32px)}
.m-journey .m-pct{position:absolute;bottom:40px;inset-inline-start:calc(var(--p,0%) - 24px);inline-size:48px;text-align:center;font-size:13px;font-weight:700;line-height:22px;border-radius:999px;color:var(--on-blue,#fff);background:var(--blue,#6B4FC4);transition:inset-inline-start 900ms var(--m-ease,ease-out)}
.m-journey[data-done] .m-pct{background:var(--ok-bg);color:var(--ok)}

[data-fold]{position:relative}
[data-fold]>:first-child{padding-inline-end:40px}
.o-fold{position:absolute;inset-block-start:4px;inset-inline-end:4px;inline-size:44px;block-size:44px;border:0;background:transparent;border-radius:12px;display:grid;place-items:center;color:var(--muted)}
.o-fold::before{content:"";width:9px;height:9px;border-right:2px solid currentColor;border-bottom:2px solid currentColor;transform:translateY(-2px) rotate(45deg);transition:transform .2s cubic-bezier(.23,1,.32,1)}
[data-folded="0"]>.o-fold::before{transform:translateY(2px) rotate(-135deg)}
.o-fold:active{background:var(--line)}
.o-fold:focus-visible{outline:2px solid var(--focus,var(--blue));outline-offset:-2px}
/* مطويّة: يبقى السطر الأول فقط؛ المراحل تُبقي شريط الرحلة والمرحلة الحالية؛ الفاتورة تُبقي الإجمالي وحالة الدفع */
[data-folded="1"]>:not(:first-child):not(.o-fold){display:none!important}
[data-timeline][data-folded="1"]>.m-journey{display:flex!important}
[data-timeline][data-folded="1"]>.kv.m-stage[data-m="now"]{display:flex!important}
[data-timeline][data-folded="1"]:not(:has(>.m-stage[data-m="now"]))>.kv.m-stage:nth-last-child(2){display:flex!important}
[data-timeline][data-folded="1"]>.kv.m-stage::after{display:none}
.o-inv[data-folded="1"]>.o-inv-t,.o-inv[data-folded="1"]>.o-inv-f{display:flex!important}
.o-inv[data-folded="1"]>.o-inv-h{padding-block-end:0}
.o-inv[data-fold]>.o-inv-h{padding-inline-end:36px}
@media (prefers-reduced-motion:reduce){.o-fold::before,.m-journey .m-pct{transition:none}}

/* ===== صفحة الطلب v6 — 2026-11-13: بطاقة «تفاصيل الطلب» تجمع الحالة والدفعات للعميل ===== */
[data-order-details]>div:first-child{padding-block-end:10px}
/* حالة التجهيز والتسليم والدفع تبقى ظاهرة وهي مطويّة: العميل يجب أن يرى «بانتظار القبول» حتى بعد نجاح الدفع (اختبار UI-09) */
[data-order-details][data-folded="1"]>div:nth-child(2){display:flex!important;padding-block-end:0}
[data-order-details]>div:nth-child(2){padding-block-end:6px}
[data-order-details]>[data-order-payments]{margin-block-start:12px;padding-block-start:6px;border-block-start:1px solid var(--line);gap:0}
[data-order-details]>[data-order-payments]>.card{border:0;padding:0;box-shadow:none;background:transparent;border-radius:0}
[data-order-details]>[data-order-payments]>.inrow{margin-block-start:10px;align-items:center}
[data-order-details] .inrow>.grow{flex:1;min-inline-size:0}
[data-order-details] .inrow>.btn.small{flex:none;white-space:nowrap}