.mc-booking { max-width: 640px; display: grid; gap: var(--wp--preset--spacing--50); }

/* مؤشّر التقدّم: ثلاث خطوات فوق النموذج، والخيط تحت الحالية cyan-500 —
   لكنه خيط وحد لا نص، فلا يخالف قاعدة «cyan-500 لا يكون نصًا». تفعيل
   الخطوة الحالية بـ :has() لا بصنف يضيفه جافاسكربت: العنصر أصلاً يملك
   السمة hidden على غير الحالية، فالانتقاء يقرأها مباشرة ويعمل حتى مع
   تعطيل جافاسكربت (حيث تظهر كل الخطوات فتُفعَّل كلها معًا، وهو تدهور معقول). */
.mc-booking__progress {
  display: flex;
  gap: var(--wp--preset--spacing--40);
  list-style: none;
  margin: 0;
  padding: 0;
}

.mc-booking__progress li {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1;
  padding-block-end: 10px;
  border-block-end: 3px solid var(--wp--preset--color--line-200);
  font-size: var(--wp--preset--font-size--small);
  color: var(--wp--preset--color--ink-500);
}

.mc-booking__progress-num {
  display: inline-flex;
  flex: none;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 50%;
  border: 1px solid var(--wp--preset--color--line-400);
  font-size: var(--wp--preset--font-size--label);
}

.mc-booking:has([data-mc-step="1"]:not([hidden])) .mc-booking__progress li[data-mc-progress="1"],
.mc-booking:has([data-mc-step="2"]:not([hidden])) .mc-booking__progress li[data-mc-progress="2"],
.mc-booking:has([data-mc-step="3"]:not([hidden])) .mc-booking__progress li[data-mc-progress="3"] {
  border-block-end-color: var(--wp--preset--color--brand-500);
  color: var(--wp--preset--color--brand-900);
  font-weight: 700;
}

.mc-booking:has([data-mc-step="1"]:not([hidden])) .mc-booking__progress li[data-mc-progress="1"] .mc-booking__progress-num,
.mc-booking:has([data-mc-step="2"]:not([hidden])) .mc-booking__progress li[data-mc-progress="2"] .mc-booking__progress-num,
.mc-booking:has([data-mc-step="3"]:not([hidden])) .mc-booking__progress li[data-mc-progress="3"] .mc-booking__progress-num {
  border-color: var(--wp--preset--color--brand-700);
  background: var(--wp--preset--color--brand-700);
  color: var(--wp--preset--color--white);
}

/* بطاقة خطوة الحجز: leading أضيق يرثه التصنيف وحقول التنبيه بداخلها —
   نفس أصل .mc-card في home.css. */
.mc-booking__step {
  display: grid;
  gap: 8px;
  border: var(--mc-border);
  border-radius: var(--mc-radius-md);
  padding: var(--wp--preset--spacing--60);
  background: var(--wp--preset--color--white);
  line-height: var(--mc-leading-body);
}

/* display من الثيم يتغلّب على قاعدة المتصفح [hidden]{display:none}
   لأن أنماط المؤلف تسبق أنماط المتصفح، فيلزم التصريح صراحةً. */
.mc-booking__step[hidden] { display: none; }

/* legend ليس h1-h6 فلا يرث line-height:1.35 عنصر العنوان في theme.json —
   وh-2 هنا حجم عنوان قسم كامل لخطوة واحدة من ثلاث. عنوان بطاقة قياسي بدلًا. */
.mc-booking__step legend { font-weight: 700; font-size: var(--mc-card-title-size); line-height: var(--mc-card-title-line); padding-inline: 6px; }

.mc-booking label { font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--ink-500); }

.mc-booking input,
.mc-booking select,
.mc-booking textarea {
  font: inherit;
  padding: 11px 12px;
  /* حدّ الحقول الأغمق (line-400) لا حدّ الأقسام الفاتح: حدّ الأقسام
     تباينه ١٫٢:١ على الأبيض ويختفي، وحقل بلا حدّ ظاهر حقلٌ ضائع. */
  border: 1px solid var(--wp--preset--color--line-400);
  border-radius: var(--mc-radius-sm);
  background: var(--wp--preset--color--white);
  /* بلا تصريح صريح ترث الحقول أسود المتصفح، وهو خارج لوحة النظام */
  color: var(--wp--preset--color--ink-900);
}

.mc-booking [aria-invalid="true"] { border-color: var(--wp--preset--color--alert-600); }

.mc-booking__error { color: var(--wp--preset--color--alert-600); font-size: var(--wp--preset--font-size--small); }

.mc-booking__consent { display: flex; gap: 10px; align-items: start; color: var(--wp--preset--color--ink-900); }

/* visibility: hidden لا مجرد إزاحة خارج الشاشة: العنصر المزاح يبقى مرئيًا
   لقارئات الشاشة وأدوات الفحص، والقيمة تُرسل في الحالتين. */
.mc-booking__honeypot {
  position: absolute;
  inset-inline-start: -9999px;
  width: 1px;
  height: 1px;
  overflow: hidden;
  visibility: hidden;
}

.mc-booking__submit,
.mc-booking__next {
  justify-self: start;
  padding: 12px 28px;
  border: 0;
  border-radius: var(--mc-radius-sm);
  background: var(--wp--preset--color--brand-700);
  color: var(--wp--preset--color--white);
  font: inherit;
  font-weight: 500;
  cursor: pointer;
}

.mc-booking__back {
  justify-self: start;
  padding: 12px 20px;
  border: var(--mc-border);
  border-radius: var(--mc-radius-sm);
  background: transparent;
  font: inherit;
  cursor: pointer;
}

.mc-booking__promise {
  font-size: var(--wp--preset--font-size--small);
  color: var(--wp--preset--color--ink-500);
  border-inline-start: 3px solid var(--wp--preset--color--brand-500);
  padding-inline-start: 12px;
}

/* بطاقة التأكيد: leading أضيق يرثه رقم الطلب وملخّص الحجز والوعد تحته —
   نفس أصل .mc-card. لا صنف mc-card عليها (حدّها العلوي السميك خاص بها). */
.mc-confirm {
  max-width: 640px;
  padding: var(--wp--preset--spacing--70);
  background: var(--wp--preset--color--white);
  border: var(--mc-border);
  border-top: 4px solid var(--wp--preset--color--brand-700);
  border-radius: var(--mc-radius-md);
  line-height: var(--mc-leading-body);
}

.mc-confirm__reference {
  font-size: var(--wp--preset--font-size--h-2);
  background: var(--wp--preset--color--brand-100);
  padding: 12px 16px;
  border-radius: var(--mc-radius-sm);
}

.mc-confirm__summary { display: grid; grid-template-columns: max-content 1fr; gap: 8px 24px; }
.mc-confirm__summary dd { margin: 0; font-weight: 500; }

.mc-confirm__promise { border-inline-start: 3px solid var(--wp--preset--color--brand-500); padding-inline-start: 12px; }

.mc-booking__server-errors {
  border: 1px solid var(--wp--preset--color--alert-600);
  background: var(--wp--preset--color--white);
  border-radius: var(--mc-radius-sm);
  padding: var(--wp--preset--spacing--50);
  color: var(--wp--preset--color--alert-600);
}

.mc-account { display: grid; gap: var(--wp--preset--spacing--70); grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.mc-account--summary { grid-template-columns: 1fr; max-width: 640px; }
.mc-account__links { list-style: none; padding: 0; display: grid; gap: 8px; }

/* الدخول والتسجيل بطاقتان جنبًا إلى جنب (.mc-account
   auto-fit-minmax(280px,1fr))، فيتبعان نظام البطاقة القياسية نفسه —
   leading أضيق يرثه الوصف والحقول بداخلها. */
.mc-auth {
  display: grid;
  gap: 8px;
  align-content: start;
  border: var(--mc-border);
  border-radius: var(--mc-radius-md);
  padding: var(--wp--preset--spacing--60);
  background: var(--wp--preset--color--white);
  line-height: var(--mc-leading-body);
}

/* h-2 كان يجعل «دخول»/«حساب جديد» بحجم عنوان قسم — بطاقتان في شبكة، لا
   عنوانا صفحة. */
.mc-auth h2 { margin: 0 0 8px; font-size: var(--mc-card-title-size); line-height: var(--mc-card-title-line); }
.mc-auth label { font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--ink-500); }

.mc-auth input {
  font: inherit;
  padding: 11px 12px;
  /* حدّ الحقول الأغمق (line-400) لا حدّ الأقسام الفاتح — انظر تعليق
     حقول الحجز أعلاه لسبب الاستثناء. */
  border: 1px solid var(--wp--preset--color--line-400);
  border-radius: var(--mc-radius-sm);
  background: var(--wp--preset--color--white);
  color: var(--wp--preset--color--ink-900);
}

.mc-auth__hint { font-size: var(--wp--preset--font-size--small); margin: 0; }

.mc-appointments { display: grid; gap: var(--wp--preset--spacing--50); max-width: 720px; }
.mc-appointment__ref { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin: 0 0 8px; font-weight: 700; }

.mc-appointment__status {
  font-size: var(--wp--preset--font-size--label);
  font-weight: 500;
  padding: 2px 10px;
  border-radius: var(--mc-radius-sm);
  background: var(--wp--preset--color--brand-100);
  color: var(--wp--preset--color--brand-900);
}

/* لا ترقية في الجدول لخلفية شارة: أقرب بديل لوني بنفس درجة الفتوح هو
   حدّ الأقسام الفاتح (line-200)، لا حدّ الحقول الأغمق المخصّص للنماذج. */
.mc-appointment__status--cancelled { background: var(--wp--preset--color--line-200); color: var(--wp--preset--color--ink-900); }

.mc-record, .mc-results { display: grid; gap: var(--wp--preset--spacing--50); max-width: 760px; }
.mc-record__window, .mc-results__note {
  font-size: var(--wp--preset--font-size--small);
  color: var(--wp--preset--color--ink-500);
  border-inline-start: 3px solid var(--wp--preset--color--brand-500);
  padding-inline-start: 12px;
}
/* عنوان بطاقة قياسي لا h-2: قيد ملف طبي واحد بين عدة، لا عنوان قسم. */
.mc-record__date { font-size: var(--mc-card-title-size); line-height: var(--mc-card-title-line); margin: 0 0 8px; }
.mc-record__files { list-style: none; padding: 0; display: grid; gap: 6px; }

/* عنوان بطاقة قياسي لا h-2: اسم تحليل واحد بين عدة نتائج، لا عنوان قسم. */
.mc-result__name { font-size: var(--mc-card-title-size); line-height: var(--mc-card-title-line); margin: 0 0 4px; }
.mc-result__panel { font-size: var(--wp--preset--font-size--small); color: var(--wp--preset--color--ink-500); font-weight: 400; }
.mc-result__value { font-size: var(--wp--preset--font-size--h-2); margin: 0 0 8px; }

.mc-result__flag {
  font-size: var(--wp--preset--font-size--label);
  padding: 2px 10px;
  border-radius: var(--mc-radius-sm);
  background: var(--wp--preset--color--brand-50);
  color: var(--wp--preset--color--ink-900);
}
/* قيمة شاذّة: لون تحذيري (warn-600) يميّزها عن أزرق العلامة وأحمر
   الخطر الحرج، فتُقرأ «غير طبيعية» لا «خطأ» ولا «هوية بصرية». */
.mc-result__flag--high, .mc-result__flag--low {
  border: 1px solid var(--wp--preset--color--warn-600);
  color: var(--wp--preset--color--warn-600);
  background: var(--wp--preset--color--white);
}

.mc-record-gate { max-width: 520px; display: grid; gap: var(--wp--preset--spacing--50); }
