/* ==========================================================================
   صفحة متابعة المستفيد/ة /p/<رمز> و«تابعي طلبك» /portal — الإصدار 9.1 (مسار b-portal)
   خط 18px، أزرار 48–56px، أسود على أبيض بتباين عالٍ، الكهرماني للمال والمواعيد، الأخضر لما خلص،
   والأحمر للأخطاء التي تمنع فقط (لا لون أحمر في المصاريف أبدًا). لا تعتمد على app.css.
   ========================================================================== */

/* (إصلاح 9.1، B91-11/B91-20) الخط من public-site.css وحده (العربية 400/700). أُزيل الملفان اللاتينيان (≈40 KB):
   مداهما يشمل المسافة (U+0020) فكانا يُنزَّلان في كل صفحة. الأرقام ورقم الطلب بخط الجهاز كبقية صفحات الموقع العام. */

.bp-portal,
.bp-login {
  /* v11 visual (V11-61، V11-43): الأسماء تشير لأدوار v11 */
  --bp-ink: var(--label);
  --bp-soft: var(--label-2);
  --bp-teal: var(--primary-700);
  --bp-teal-d: var(--primary-900);
  --bp-teal-bg: var(--primary-50);
  --bp-gold: var(--accent-500);
  --bp-cream: var(--canvas);
  --bp-cream-2: var(--surface-tint);
  --bp-line: var(--separator);
  --bp-ok: #1d7a46;
  --bp-ok-bg: #e4f3ea;
  --bp-amber: #8a5200;
  --bp-amber-bg: #fff8ea;
  --bp-amber-line: #ecd3a3;
  --bp-wa: #157a3f;
  --bp-err: #b42318;
  --bp-bar-h: 64px;
  /* v10 experience (X10-C4): نفس تعريف app.css (الصفحة لا تحمّل app.css) */
  --scrim: rgb(var(--primary-900-rgb) / 0.48);
  --bp-radius: 20px;
  font-family: "IBM Plex Sans Arabic", "Noto Sans Arabic", "Noto Naskh Arabic", Tahoma, sans-serif;
  background: var(--bp-cream);
  margin: 0;
  color: var(--bp-ink);
}

.bp-portal *,
.bp-portal *::before,
.bp-portal *::after,
.bp-login *,
.bp-login *::before,
.bp-login *::after {
  box-sizing: border-box;
}

:where(.bp-portal, .bp-login) :where(button, input, textarea) {
  font: inherit;
  color: inherit;
}

.bp-portal img,
.bp-portal svg,
.bp-portal audio {
  max-width: 100%;
}

.bp-portal [hidden],
.bp-login [hidden] {
  display: none !important;
}

.bp-noscroll,
.bp-noscroll body {
  overflow: hidden;
}

/* تذييل الموقع الطويل لا يظهر على الموبايل في صفحتها الخاصة (التواصل في الشريط السفلي) */
.bp-portal .pub-footer {
  display: none;
}

.bp-main {
  min-height: 60vh;
}

.bp-sr {
  position: absolute !important;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}

.bp-ic {
  flex: none;
  vertical-align: middle;
}

/* ───────────── الصفحة ───────────── */

.bp-page {
  max-width: 560px;
  margin: 0 auto;
  padding: 8px 16px calc(var(--bp-bar-space, 120px) + 16px);
  font-size: 18px;
  line-height: 1.7;
}

.bp-page h1,
.bp-page h2,
.bp-page h3,
.bp-sheet h2 {
  font-family: inherit;
  margin: 0;
  color: var(--bp-ink);
  letter-spacing: 0;
}

.bp-page p {
  margin: 0;
}

.bp-greet h1 {
  font-size: 24px;
  line-height: 1.4;
  margin-top: 4px;
}

.bp-sub {
  font-size: 16px;
  color: var(--bp-soft);
}

.bp-greet-contact {
  display: none;
}

/* ───────────── الأزرار ───────────── */

.bp-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  min-height: 48px;
  padding: 6px 16px;
  border-radius: 14px;
  border: 2px solid transparent;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.35;
  text-decoration: none;
  cursor: pointer;
  text-align: center;
  background: transparent;
  -webkit-tap-highlight-color: transparent;
}

.bp-btn--block {
  display: flex;
  width: 100%;
}

.bp-btn--primary {
  min-height: 56px;
  font-size: 19px;
  background: var(--bp-teal);
  color: #fff;
}

.bp-btn--primary:hover {
  background: var(--bp-teal-d);
}

.bp-btn--primary[aria-disabled="true"] {
  background: rgb(var(--primary-700-rgb) / 0.65);
}

/* v9.2 (مراجعة الألوان): «ابعتي ردّك» قبل أن تكتب شيئًا زر يعمل (يُظهر تلميحًا)، فنصه الأبيض يجب أن يُقرأ لأي لونين:
   الطبقة الشفافة كانت 3.71:1 بالألوان الأصلية (4.02 في 9.1) و2.75:1 لأساسي فاتح؛ p600 أفتح قليلًا من p700 والأبيض عليه ≥ 4.5 (T8) */
.bp-btn--primary.is-soft {
  background: var(--primary-600);
}

.bp-btn--secondary {
  min-height: 52px;
  background: #fff;
  color: var(--bp-teal);
  border-color: var(--bp-teal);
}

.bp-btn--whatsapp {
  min-height: 52px;
  background: var(--bp-wa);
  color: #fff;
}

.bp-btn--text {
  color: var(--bp-teal);
  text-decoration: underline;
  text-underline-offset: 4px;
}

.bp-btn--ghost {
  color: var(--bp-teal);
  border-color: var(--bp-line);
  background: #fff;
}

.bp-btn:disabled {
  opacity: 0.6;
  cursor: not-allowed;
}

.bp-btn:focus-visible,
.bp-row:focus-visible,
.bp-linkbtn:focus-visible,
.bp-back:focus-visible,
.bp-icon-btn:focus-visible,
.bp-choice:focus-visible,
.bp-page a:focus-visible,
.bp-page summary:focus-visible {
  outline: 3px solid var(--bp-gold);
  outline-offset: 2px;
}

.bp-linkbtn {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: 4px 4px;
  border: 0;
  background: none;
  color: var(--bp-teal);
  font-size: 16px;
  font-weight: 700;
  text-decoration: underline;
  text-underline-offset: 4px;
  cursor: pointer;
}

.bp-icon-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 48px;
  height: 48px;
  flex: none;
  border: 1px solid var(--bp-line);
  border-radius: 12px;
  background: #fff;
  color: var(--bp-teal);
  cursor: pointer;
}

.bp-icon-btn[aria-expanded="true"] {
  background: var(--bp-teal-bg);
  border-color: var(--bp-teal);
}

.bp-actions {
  display: grid;
  gap: 8px;
  margin-top: 12px;
}

/* ───────────── البطاقات ───────────── */

.bp-card {
  display: block;
  background: #fff;
  border: 1px solid var(--bp-line);
  border-radius: var(--bp-radius);
  padding: 12px 16px;
  margin-top: 10px;
  color: inherit;
  text-decoration: none;
}

.bp-card-title {
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 4px;
}

/* (إصلاح 9.1) «عايزة يوصلك الجديد على واتساب؟» — بطاقة ثانوية تحت «المطلوب منك» */
.bp-waconfirm .bp-btn {
  margin-top: 10px;
}

.bp-now {
  border: 2px solid var(--bp-gold);
  background: var(--bp-amber-bg);
  border-radius: var(--bp-radius);
  padding: 12px 16px 14px;
  margin-top: 12px;
}

.bp-now .bp-btn {
  margin-top: 12px;
}

.bp-kicker {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-size: 15px;
  font-weight: 700;
  color: var(--bp-amber);
}

.bp-dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--bp-gold);
}

.bp-now-title {
  font-size: 21px;
  line-height: 1.45;
  margin: 4px 0 6px;
}

.bp-now-list {
  margin: 0;
  padding-inline-start: 26px;
  font-size: 18px;
}

.bp-now-text {
  font-size: 17px;
  color: var(--bp-soft);
}

.bp-now-alt {
  text-align: center;
  margin-top: 4px;
}

.bp-now.is-calm {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  border: 1px solid var(--bp-line);
  background: #fff;
}

.bp-now.is-calm .bp-now-title {
  font-size: 19px;
}

.bp-calm-ic {
  color: var(--bp-ok);
  margin-top: 4px;
}

.bp-more {
  margin-top: 2px !important;
  font-size: 16px;
  text-align: center;
}

.bp-more a {
  display: inline-flex;
  align-items: center;
  min-height: 48px; /* (إصلاح 9.1) قاعدة الـ 48px للمستفيدة (B91-12) */
  padding-inline: 8px;
  color: var(--bp-teal);
  font-weight: 700;
}

.bp-clamp {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.bp-clamp3 {
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.bp-hidden-file {
  position: absolute;
  width: 1px;
  height: 1px;
  opacity: 0;
  pointer-events: none;
}

/* ───────────── «طلبك وصل لفين؟» ───────────── */

.bp-steps {
  list-style: none;
  margin: 4px 0 0;
  padding: 0;
}

.bp-step {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 3px 0;
  font-size: 17px;
}

.bp-step-dot {
  flex: 0 0 28px;
  height: 28px;
  border-radius: 50%;
  display: inline-grid;
  place-items: center;
  font-size: 15px;
  font-weight: 700;
  background: #ececec;
  color: #4f5a63;
  margin-top: 1px;
}

.bp-step.is-done .bp-step-dot {
  background: var(--bp-ok);
  color: #fff;
}

.bp-step.is-done .bp-step-title {
  color: var(--bp-soft);
}

.bp-step.is-current .bp-step-dot {
  background: var(--bp-gold);
  color: var(--on-accent); /* v9.2: كان أبيض على الذهبي (3.24:1) */
  box-shadow: 0 0 0 4px var(--accent-100);
}

.bp-step.is-current .bp-step-title {
  font-weight: 700;
}

.bp-step-text {
  display: flex;
  flex-direction: column;
}

.bp-step-hint {
  font-size: 15px;
  color: var(--bp-soft);
}

/* ───────────── القوائم والصفوف ───────────── */

.bp-rows,
.bp-cards,
.bp-items {
  list-style: none;
  margin: 0;
  padding: 0;
}

.bp-row {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  min-height: 56px;
  padding: 6px 2px;
  border: 0;
  border-bottom: 1px solid var(--bp-line);
  background: none;
  color: var(--bp-ink);
  text-decoration: none;
  text-align: start;
  font-size: 18px;
  cursor: pointer;
}

.bp-rows li:last-child .bp-row {
  border-bottom: 0;
}

.bp-row > .bp-ic:first-child {
  color: var(--bp-teal);
}

.bp-row > .bp-ic:last-child {
  color: #7a858f;
}

.bp-row.is-on {
  font-weight: 700;
}

.bp-row-main {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-width: 0;
}

.bp-row-title {
  overflow-wrap: anywhere;
}

.bp-row-sub {
  font-size: 15px;
  color: var(--bp-soft);
}

.bp-pill {
  display: inline-flex;
  align-items: center;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.4;
  padding: 2px 10px;
  border-radius: 99px;
  background: #eef1f3;
  color: #33414c;
  white-space: nowrap;
}

.bp-pill.is-ok {
  background: var(--bp-ok-bg);
  color: #145a33;
}

.bp-pill.is-amber {
  background: #fdf0d8;
  color: var(--bp-amber);
}

.bp-callback {
  margin-top: 10px;
}

.bp-ref {
  margin-top: 14px;
  font-size: 16px;
  color: var(--bp-soft);
}

.bp-code {
  font-family: "IBM Plex Sans Arabic", ui-monospace, monospace;
  font-weight: 700;
  color: var(--bp-ink);
  unicode-bidi: isolate;
  direction: ltr;
}

.bp-forget {
  margin-top: 16px;
  text-align: center;
}

.bp-forget .bp-linkbtn {
  font-size: 15px;
  font-weight: 400;
  color: var(--bp-soft);
}

.bp-empty {
  margin-top: 16px;
  font-size: 18px;
  color: var(--bp-soft);
}

.bp-meta {
  font-size: 15px;
  color: var(--bp-soft);
}

.bp-small {
  font-size: 15px;
  color: var(--bp-soft);
  margin-top: 8px !important;
}

/* ───────────── الشريط السفلي ───────────── */

.bp-bar {
  position: fixed;
  inset-inline: 0;
  bottom: 0;
  z-index: 40;
  background: #fff;
  border-top: 1px solid var(--bp-line);
  padding: 6px 16px calc(8px + env(safe-area-inset-bottom, 0px));
  box-shadow: 0 -4px 16px rgba(20, 33, 41, 0.06);
}

.bp-hours {
  max-width: 560px;
  margin: 0 auto 6px;
  font-size: 15px;
  line-height: 1.5;
  text-align: center;
  color: var(--bp-soft);
}

.bp-hours.is-closed {
  color: var(--bp-amber);
  font-weight: 700;
}

.bp-bar-btns {
  display: flex;
  gap: 8px;
  max-width: 560px;
  margin: 0 auto;
}

.bp-bar-btns > * {
  flex: 1;
  min-height: 52px;
  padding-inline: 8px;
}

/* ───────────── رأس الصفحات الفرعية ───────────── */

.bp-viewhead {
  display: flex;
  align-items: center;
  gap: 12px;
  flex-wrap: wrap;
  margin: 4px 0 8px;
}

.bp-back {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 48px;
  padding: 0 14px;
  border: 1px solid var(--bp-line);
  border-radius: 12px;
  background: #fff;
  color: var(--bp-teal);
  font-size: 17px;
  font-weight: 700;
  cursor: pointer;
}

.bp-viewtitle {
  font-size: 21px !important;
  line-height: 1.4;
}

body.pub .bp-viewtitle:focus,
body.pub .bp-viewtitle:focus-visible {
  outline: none;
}

/* ───────────── الورق المطلوب ───────────── */

.bp-msg {
  font-size: 18px;
}

.bp-item {
  padding: 12px 0;
  border-bottom: 1px solid var(--bp-line);
}

.bp-item:last-child {
  border-bottom: 0;
}

.bp-item-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  flex-wrap: wrap;
  margin-bottom: 6px;
}

.bp-item-name {
  font-size: 18px;
  font-weight: 700;
}

.bp-sent-files {
  list-style: none;
  margin: 4px 0 0;
  padding: 0;
}

.bp-sent-files a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 44px;
  font-size: 16px;
  color: var(--bp-teal);
}

.bp-missing {
  margin-top: 2px;
}

.bp-tip {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 8px;
  padding: 8px 12px;
  border-radius: 12px;
  background: var(--bp-amber-bg);
  font-size: 16px;
}

.bp-tip p {
  flex: 1;
}

.bp-note {
  margin-top: 4px;
}

.bp-note summary {
  display: flex;
  align-items: center;
  min-height: 48px;
  cursor: pointer;
  font-weight: 700;
  color: var(--bp-teal);
}

.bp-note[open] summary {
  margin-bottom: 6px;
}

.bp-note .bp-input {
  margin: 8px 0;
}

.bp-label {
  display: block;
  font-weight: 700;
  margin-bottom: 6px;
}

.bp-input {
  display: block;
  width: 100%;
  min-height: 52px;
  border: 1px solid var(--field-line);
  border-radius: 14px;
  padding: 10px 12px;
  font-size: 18px;
  line-height: 1.6;
  background: var(--fill-1);
  resize: vertical;
}

.bp-input:focus {
  outline: none;
  border-color: var(--primary-700);
  box-shadow: inset 0 0 0 1px var(--primary-700);
  background: #fff;
}

.bp-send-error,
.bp-restore {
  background: var(--bp-amber-bg);
  border: 1px solid var(--bp-amber-line);
  border-radius: 14px;
  padding: 12px;
  margin: 10px 0;
  color: #5c3800;
  font-size: 17px;
}

.bp-send-error .bp-btn {
  margin-top: 8px;
}

.bp-send-hint {
  font-size: 16px;
  color: var(--bp-amber);
  margin: 8px 0 4px !important;
  min-height: 1em;
}

.bp-done {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 12px !important;
  padding: 12px 14px;
  border-radius: 14px;
  background: var(--bp-ok-bg);
  color: #145a33;
  font-weight: 700;
}

/* ───────────── الرد ───────────── */

.bp-answer > * + * {
  margin-top: 10px;
}

.bp-summary {
  background: var(--bp-cream-2);
  border-radius: 14px;
  padding: 12px 14px;
}

.bp-summary h3,
.bp-steps-todo h3,
.bp-bring h3 {
  font-size: 16px;
  font-weight: 700;
  color: var(--bp-amber);
  margin-bottom: 2px;
}

.bp-summary p {
  font-size: 19px;
  line-height: 1.8;
}

.bp-steps-todo ol {
  list-style: none;
  margin: 0;
  padding: 0;
}

.bp-todo {
  display: flex;
  align-items: center;
  gap: 10px;
  min-height: 56px;
  padding: 6px 0;
  border-bottom: 1px solid var(--bp-line);
}

.bp-todo-n {
  flex: 0 0 28px;
  height: 28px;
  border-radius: 50%;
  display: inline-grid;
  place-items: center;
  background: var(--bp-teal-bg);
  color: var(--bp-teal);
  font-weight: 700;
  font-size: 15px;
}

.bp-todo-text {
  flex: 1;
  font-size: 18px;
}

.bp-todo.is-done .bp-todo-text {
  color: var(--bp-soft);
  text-decoration: line-through;
}

.bp-todo-check {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 0;
  min-width: 56px;
  min-height: 48px;
  font-size: 15px;
  color: var(--bp-soft);
  cursor: pointer;
}

.bp-todo-check input {
  width: 32px;
  height: 32px;
  margin: 0;
  accent-color: var(--bp-ok);
}

.bp-full summary {
  display: flex;
  align-items: center;
  min-height: 48px;
  cursor: pointer;
  font-weight: 700;
  color: var(--bp-teal);
}

.bp-fulltext {
  font-size: 17px;
  line-height: 1.8;
}

.bp-fulltext p + p {
  margin-top: 10px;
}

.bp-strong {
  font-weight: 700;
}

.bp-voice {
  background: var(--bp-teal-bg);
  border-radius: 14px;
  padding: 10px 12px;
}

.bp-voice audio {
  width: 100%;
  margin-top: 6px;
}

/* ───────────── المواعيد ───────────── */

.bp-event-link {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.bp-event-date {
  display: flex;
  flex-direction: column;
  font-weight: 700;
}

.bp-event-what {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}

.bp-line {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  font-size: 18px;
  margin-top: 6px !important;
}

.bp-line .bp-ic {
  color: var(--bp-teal);
  margin-top: 4px;
}

.bp-event > .bp-btn {
  margin-top: 8px;
}

.bp-bring {
  background: var(--bp-cream-2);
  border-radius: 14px;
  padding: 12px 14px;
  margin: 12px 0;
}

.bp-bring ul {
  margin: 0;
  padding-inline-start: 22px;
}

.bp-respond {
  display: grid;
  gap: 8px;
}

.bp-response {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  font-weight: 700;
  color: #145a33;
}

.bp-cal {
  margin-top: 8px !important;
}

.bp-cal a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 48px;
  color: var(--bp-teal);
  font-weight: 700;
}

/* ───────────── المصاريف (بلا أحمر) ───────────── */

.bp-info {
  background: var(--bp-cream-2);
  border: 1px solid var(--bp-line);
  border-radius: 14px;
  padding: 12px 14px;
  font-size: 17px;
}

.bp-info p + p {
  margin-top: 6px;
}

.bp-consent {
  border: 2px solid var(--bp-gold);
  background: var(--bp-amber-bg);
}

.bp-consent .bp-btn {
  margin-top: 8px;
}

.bp-invoice > * + * {
  margin-top: 6px;
}

.bp-inv-desc {
  font-size: 18px;
}

.bp-inv-amount {
  font-size: 24px;
  font-weight: 700;
  direction: rtl;
}

.bp-inv-due {
  font-size: 16px;
}

.bp-inv-due.is-past {
  color: #4f5a63;
}

.bp-howpay summary {
  display: flex;
  align-items: center;
  min-height: 48px;
  cursor: pointer;
  font-weight: 700;
  color: var(--bp-teal);
}

/* ───────────── الرسائل ───────────── */

.bp-thread {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.bp-bubble {
  max-width: 88%;
  border-radius: 16px;
  padding: 8px 12px;
  border: 1px solid var(--bp-line);
  background: #fff;
  align-self: flex-start;
}

.bp-bubble.is-mine {
  align-self: flex-end;
  background: var(--bp-teal-bg);
  border-color: var(--primary-200);
}

.bp-bubble-who {
  font-size: 15px;
  font-weight: 700;
  color: var(--bp-soft);
}

.bp-bubble-ch {
  font-weight: 400;
}

.bp-bubble-text {
  font-size: 17px;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

/* (إصلاح 9.1) «REQ-2026-00032» لا ينكسر بعد «REQ-»، والرابط والاسم الطويل ينكسران داخل حدودهما */
.bp-ref-inline {
  white-space: nowrap;
}

.bp-url-inline,
.bp-fname {
  word-break: break-all;
}

/* v12 gate (V-10): «.jpg» sits on the name's left, a hair apart */
.bp-fname-ext {
  margin-right: 0.15em;
}

.bp-bubble-time {
  font-size: 15px;
  color: var(--bp-soft);
  margin-top: 2px !important;
}

.bp-bubble audio {
  display: block;
  width: 240px;
  max-width: 100%;
  margin-top: 6px;
}

.bp-doc {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 44px;
  color: var(--bp-teal);
  font-size: 16px;
  overflow-wrap: anywhere;
}

.bp-composer {
  position: sticky;
  bottom: calc(var(--bp-bar-space, 120px) + 8px);
  z-index: 5;
  margin-top: 12px;
  background: #fff;
  border: 1px solid var(--bp-line);
  border-radius: var(--bp-radius);
  padding: 10px;
  box-shadow: 0 6px 20px rgba(20, 33, 41, 0.08);
}

.bp-compose-text {
  min-height: 56px;
  resize: none;
}

.bp-compose-row {
  display: flex;
  gap: 8px;
  align-items: center;
  margin-top: 8px;
}

.bp-compose-send {
  flex: 1;
  min-height: 52px !important;
}

.bp-compose-rec,
.bp-compose-cam {
  margin-top: 8px;
}

.bp-compose-ctx {
  display: flex;
  align-items: center;
  gap: 6px;
  font-size: 15px;
  font-weight: 700;
  color: var(--bp-teal);
  margin-bottom: 6px !important;
}

.bp-compose-ctx .bp-icon-btn {
  width: 44px;
  height: 44px;
  margin-inline-start: auto;
}

/* ───────────── الحالات: تحميل، نت، رابط ───────────── */

.bp-sk {
  background: #eee6d6;
  border-radius: 12px;
  margin-top: 12px;
}

.bp-sk-h1 {
  height: 32px;
  width: 60%;
}

.bp-sk-line {
  height: 18px;
  width: 80%;
}

.bp-sk-card {
  height: 220px;
  border-radius: var(--bp-radius);
}

.bp-sk-card.is-short {
  height: 160px;
}

.bp-state {
  text-align: center;
  padding: 24px 16px;
}

.bp-state h1 {
  font-size: 22px;
  margin-top: 8px;
}

.bp-state p {
  margin-top: 6px;
  color: var(--bp-soft);
}

.bp-state-ic {
  display: inline-grid;
  place-items: center;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  background: var(--bp-teal-bg);
  color: var(--bp-teal);
}

.bp-state .bp-actions {
  text-align: start;
}

.bp-new {
  text-align: center;
  margin-top: 4px;
}

.bp-new a {
  display: inline-flex;
  align-items: center;
  min-height: 48px; /* (إصلاح 9.1) قاعدة الـ 48px للمستفيدة (B91-12) */
  padding-inline: 8px;
  color: var(--bp-teal);
  font-weight: 700;
}

.bp-noscript {
  font-size: 18px;
}

/* ───────────── اللوحة السفلية والتنبيهات ───────────── */

.bp-sheet-wrap {
  position: fixed;
  inset: 0;
  z-index: 100;
  display: flex;
  align-items: flex-end;
  justify-content: center;
}

/* v10 (X10-M2): التعتيم طبقة مستقلة تتبع موضع اللوحة (شفافيتها فقط)، والعقدة المغادرة لا تلتقط لمسًا (L-64) */
.bp-sheet-scrim {
  position: absolute;
  inset: 0;
  z-index: -1;
  background: var(--scrim);
}

.bp-sheet-wrap.is-leaving {
  pointer-events: none;
}

/* مقبض السحب (يظهر بعد تحميل الحركة): هدف لمس بارتفاع 44px، والشريط المرئي 40×4 */
.bp-sheet-grip {
  height: 44px;
  margin: -14px -16px -30px;
  background: linear-gradient(#cfc7b8, #cfc7b8) 50% 8px / 40px 4px no-repeat;
}

.bp-sheet-grip,
.bp-sheet-head {
  touch-action: none;
}

.bp-sheet-head {
  position: relative;
}

.bp-sheet {
  width: 100%;
  max-width: 560px;
  background: #fff;
  border-radius: 20px 20px 0 0;
  padding: 14px 16px calc(16px + env(safe-area-inset-bottom, 0px));
  font-size: 18px;
  font-family: inherit;
}

.bp-sheet-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 10px;
}

.bp-sheet h2 {
  font-size: 20px;
}

.bp-choices {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8px;
}

.bp-choice {
  min-height: 56px;
  border: 2px solid var(--bp-line);
  border-radius: 14px;
  background: #fff;
  font-size: 18px;
  font-weight: 700;
  cursor: pointer;
}

.bp-choice[aria-checked="true"] {
  border-color: var(--bp-teal);
  background: var(--bp-teal-bg);
  color: var(--bp-teal);
}

.bp-sheet .bp-btn--primary {
  margin-top: 12px;
}

.bp-toasts {
  position: fixed;
  inset-inline: 16px;
  bottom: calc(var(--bp-bar-space, 120px) + 12px);
  z-index: 120;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 8px;
  pointer-events: none;
}

.bp-toast {
  pointer-events: auto;
  display: flex;
  align-items: center;
  gap: 8px;
  max-width: 520px;
  width: 100%;
  padding: 12px 14px;
  border-radius: 14px;
  background: var(--bp-ink);
  color: #fff;
  font-size: 17px;
  line-height: 1.5;
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
  /* v10 (X10-F1): يدخل من الحافة السفلية (12px + شفافية) ويخرج من نفس المسار بمنحنى معكوس */
  opacity: 0;
  transform: translateY(12px);
  transition:
    transform var(--dur-release, 200ms) var(--ease-out, ease-out),
    opacity var(--dur-release, 200ms) var(--ease-out, ease-out);
}

.bp-toast.is-in {
  opacity: 1;
  transform: none;
}

.bp-toast.is-out {
  opacity: 0;
  transform: translateY(12px);
  transition-timing-function: var(--ease-in-mirror, ease-in);
}

.bp-toast .bp-ic {
  color: #8fd3ad;
}

.bp-toast-btn {
  margin-inline-start: auto;
  min-height: 44px;
  padding: 0 14px;
  border: 0;
  border-radius: 10px;
  background: #fff;
  color: var(--bp-teal);
  font-weight: 700;
  cursor: pointer;
}

@media (prefers-reduced-motion: reduce) {
  .bp-toast {
    transform: none !important;
  }
}

/* ───────────── الشاشات الأعرض ───────────── */

@media (min-width: 1024px) {
  .bp-portal .bp-bar {
    display: none;
  }

  .bp-portal .pub-footer {
    display: block;
  }

  .bp-page {
    padding-bottom: 40px;
  }

  .bp-greet-contact {
    display: flex;
    gap: 8px;
    margin-top: 10px;
  }

  .bp-greet-contact > * {
    flex: 1;
  }

  .bp-composer {
    bottom: 12px;
  }

  .bp-toasts {
    bottom: 24px;
  }
}

/* ═════════════ «تابعي طلبك» /portal (portal-login.js) ═════════════ */

.bp-login .bp-page {
  padding-bottom: 32px;
}

.bp-login-title {
  font-size: 24px !important;
  margin-top: 6px !important;
}

/* v11 fixer-public (K5، GP-6 P1): شعار المكتب الذهبي الداكن فوق «متابعة طلبك/طلبكم»؛ الصندوق محجوز (width/height) فلا إزاحة */
.pub-signin-logo {
  display: block;
  width: min(52vw, 200px);
  height: auto;
  margin: 12px auto 4px;
}

@media (min-width: 700px) {
  .pub-signin-logo {
    width: 240px;
    margin-top: 24px;
  }
}

.bp-login .bp-card h2 {
  font-size: 19px;
  line-height: 1.5;
}

.bp-login .bp-card > p {
  margin-top: 4px;
  color: var(--bp-soft);
}

.bp-field {
  margin-top: 10px;
}

.bp-field .bp-input {
  direction: ltr;
  text-align: right;
  min-height: 52px;
}

.bp-code-input {
  min-height: 56px !important;
  font-size: 26px !important;
  letter-spacing: 8px;
  text-align: center !important;
}

.bp-hint {
  font-size: 15px;
  color: var(--bp-soft);
  margin-top: 4px !important;
}

.bp-error {
  color: var(--bp-err);
  font-weight: 700;
  font-size: 16px;
  margin-top: 8px !important;
}

.bp-safety {
  display: flex;
  gap: 8px;
  align-items: flex-start;
  margin-top: 14px !important;
  font-size: 16px;
  color: var(--bp-soft);
}

.bp-saved {
  border: 2px solid var(--bp-gold);
  background: var(--bp-amber-bg);
}

.bp-saved .bp-btn {
  margin-top: 8px;
}

.bp-demo {
  margin-top: 14px;
  font-size: 16px;
  color: var(--bp-soft);
}

.bp-demo summary {
  min-height: 44px;
  display: flex;
  align-items: center;
  cursor: pointer;
  font-weight: 700;
}

/* v11 fixer-public (V16): «للتجربة» يظهر قابلًا للفتح (سهم يدور عند الفتح) لا عنوانًا يتيمًا */
.bp-demo summary {
  gap: 10px;
  list-style: none;
}

.bp-demo summary::-webkit-details-marker {
  display: none;
}

.bp-demo summary::after {
  content: "";
  width: 7px;
  height: 7px;
  margin-top: -4px;
  border-inline-end: 2px solid currentColor;
  border-block-end: 2px solid currentColor;
  transform: rotate(45deg);
}

.bp-demo[open] summary::after {
  margin-top: 4px;
  transform: rotate(-135deg);
}

.bp-nocode {
  margin-top: 12px;
  border: 1px solid var(--bp-amber-line);
  background: var(--bp-amber-bg);
}

.bp-row-links {
  display: flex;
  gap: 16px;
  flex-wrap: wrap;
  margin-top: 4px;
}

/* ───────────── مراجعة 9.1 ───────────── */

/* «المحامي هيقابلك فين؟» سطر منفصل عن «هاتي معاكي» (مكان لقاء، مش ورقة) */
.bp-meet {
  background: var(--bp-teal-bg);
  border-radius: 14px;
  padding: 12px 14px;
  margin: 0 0 12px;
}

.bp-meet h3 {
  font-size: 17px;
  margin: 0 0 4px;
}

.bp-meet p {
  margin: 0;
}

/* زر واحد مملوء في كل شاشة: «ابعتي الورق» هو الأساسي، و«صوّري» في كل صف محدد (مش مملوء) */
.bp-item .bmf-pick-camera.bmf-btn-primary {
  background: var(--bp-teal-bg);
  color: var(--bp-teal);
  border: 2px solid var(--bp-teal);
}

.bp-item .bmf-pick-camera.bmf-btn-primary:hover:not(:disabled) {
  background: var(--primary-100);
  color: var(--bp-teal-d);
}

/* الشريط السفلي مع خط كبير (Android «كبير جدًا»): «اتصلي بينا» تفضل سطر واحد */
.bp-bar-btns .bp-btn {
  white-space: nowrap;
}

@media (max-width: 340px) {
  .bp-bar {
    padding-inline: 10px;
  }

  .bp-bar-btns .bp-btn {
    gap: 6px;
    padding-inline: 6px;
    font-size: 17px;
  }
}

/* (v10 gate C-17) تكبير 200% على شاشة 360 (≈180 بكسل CSS) أو خط كبير جدًا: الزران يلتفان لسطرين بدل أن يُقص
   «اكتبيلنا» خارج الشاشة (الحد الأدنى لعرض كل زر هو نصه كاملًا)، والشارات في صفوف الأقسام تلتف داخلها. */
.bp-bar-btns {
  flex-wrap: wrap;
}

@media (max-width: 279.98px) {
  /* الشريط في آخر الصفحة بدل أن يغطي أكثر من نصف الشاشة مع رأس الصفحة (وفي الرأس زر الاتصال)؛
     portal.js يجعل --bp-bar-space صفرًا حين لا يكون الشريط ثابتًا */
  .bp-bar {
    position: static;
    padding-top: 4px;
    box-shadow: none;
  }

  .bp-bar .bp-hours {
    font-size: 14px;
    line-height: 1.4;
    margin-bottom: 4px;
  }

  .bp-bar-btns {
    gap: 6px;
  }

  .bp-bar-btns > * {
    min-height: 44px;
  }

  /* صف القسم يلتف: الأيقونة والعنوان في السطر الأول، والشارة والسهم تحتهما حين لا يتسع السطر */
  .bp-row {
    flex-wrap: wrap;
    column-gap: 8px;
    row-gap: 2px;
  }

  .bp-row-main {
    flex: 1 1 4em;
  }

  .bp-row > .bp-pill {
    white-space: normal;
    text-align: center;
  }
}

/* ═════════════ v10 experience — ضغط فوري، شريط «كروم»، أرقام بعرض ثابت، تفضيلات الإتاحة ═════════════
   الرموز (--press-*, --ease-out, --dur-*) من public-site.css (المحمّل قبل هذا الملف). */

/* (X10-P2) الأزرار تنضغط مع الإصبع؛ صفوف القوائم تُعتّم فقط (صفوف iOS تُضاء ولا تنكمش) */
.bp-btn,
.bp-icon-btn,
.bp-choices button,
.bp-row {
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
  transition:
    transform var(--dur-release, 200ms) var(--ease-out, ease-out),
    background-color 0.15s ease,
    border-color 0.15s ease,
    color 0.15s ease;
}

.bp-btn:active:not(:disabled),
.bp-icon-btn:active,
.bp-choices button:active {
  transform: scale(var(--press-scale, 0.97));
  background-image: linear-gradient(var(--press-dim), var(--press-dim));
  transition-duration: var(--dur-press, 80ms);
}

.bp-row:active {
  background-image: linear-gradient(var(--press-dim), var(--press-dim));
}

/* (X10-L2) الشريط السفلي «كروم»: المحتوى يمر تحته؛ بلا دعم للتمويه يبقى أبيض */
.bp-bar {
  background: rgb(255 255 255 / 0.86);
  -webkit-backdrop-filter: saturate(180%) blur(20px);
  backdrop-filter: saturate(180%) blur(20px);
}

@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
  .bp-bar {
    background: #fff;
  }
}

/* ألوان مؤسسة مخصصة (#bm-theme): الشريط صلب (عقد التباين للأبيض لا للشفاف) */
html:has(#bm-theme) .bp-bar {
  background: #fff;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

/* (X10-T1) المبالغ والأكواد بأرقام بعرض ثابت */
.bp-inv-amount,
.bp-code {
  font-variant-numeric: tabular-nums;
}

/* (X10-A2/A3) شفافية أقل أو تباين أعلى: شريط معتم؛ والألوان القسرية: حدود للوحة والتنبيه */
@media (prefers-reduced-transparency: reduce) {
  .bp-bar {
    background: #fff;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }
}

@media (prefers-contrast: more) {
  .bp-bar {
    background: #fff;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    border-color: var(--bp-ink);
  }
}

@media (forced-colors: active) {
  .bp-sheet,
  .bp-toast {
    border: 1px solid CanvasText;
  }

  .bp-btn:active {
    outline: 2px solid Highlight;
  }
}

/* ==========================================================================
   v11 visual (V-3، V11-43): صفحة المتابعة و«تابعي طلبك» بلغة v11 — صفحة بيضاء، بطاقات بسطح هادئ بلا حدود،
   زر واحد ممتلئ أخضر، والثانوي ملوّن خفيف، والنصي أخضر؛ متتبع الخطوات بشكله (تم = p700، الحالي = حلقة ذهبية).
   داخل @media screen فلا يتغير شيء عند الطباعة (L11-29).
   ========================================================================== */

@media screen {
  .bp-card,
  .bp-info,
  .bp-bubble,
  .bp-now.is-calm {
    border: 0;
    background: var(--surface-tint);
  }

  .bp-now,
  .bp-saved,
  .bp-consent {
    border: 0;
    background: var(--gold-wash);
  }

  .bp-restore,
  .bp-nocode {
    border: 0;
    background: var(--warn-weak);
  }

  .bp-composer {
    border: 0;
    box-shadow: var(--e-2), 0 0 0 1px var(--separator);
  }

  .bp-btn--secondary {
    border-color: transparent;
    background: var(--tint-weak);
    color: var(--tint);
  }

  .bp-btn--ghost {
    border-color: transparent;
    background: var(--fill-1);
    color: var(--tint);
  }

  .bp-btn--text,
  .bp-linkbtn {
    text-decoration: none;
  }

  .bp-icon-btn,
  .bp-back {
    border: 0;
    background: var(--fill-1);
  }

  .bp-choice {
    border-color: transparent;
    background: var(--fill-1);
  }

  /* التركيز (V11-09): p700 (كان ذهبيًا 2:1 على الأبيض) */
  .bp-btn:focus-visible,
  .bp-row:focus-visible,
  .bp-linkbtn:focus-visible,
  .bp-back:focus-visible,
  .bp-icon-btn:focus-visible,
  .bp-choice:focus-visible,
  .bp-page a:focus-visible,
  .bp-page summary:focus-visible {
    outline-color: var(--primary-700);
  }

  .bp-step-dot {
    background: var(--fill-2);
    color: var(--label-2);
  }

  .bp-step.is-done .bp-step-dot {
    background: var(--tint);
    color: var(--on-tint);
  }

  .bp-step.is-current .bp-step-dot {
    background: var(--gold-wash);
    box-shadow: 0 0 0 2px var(--gold-line);
  }

  .bp-row > .bp-ic:last-child {
    color: var(--label-3);
  }

  .bp-pill {
    background: var(--fill-1);
    color: var(--label-2);
  }

  .bp-bar {
    border-top: 0;
    box-shadow: inset 0 1px 0 var(--separator);
  }
}

@media screen and (forced-colors: active) {
  .bp-card,
  .bp-now,
  .bp-btn--secondary,
  .bp-choice {
    outline: 1px solid CanvasText;
  }
}

/* ==========================================================================
   v12 look (LK-1، K12-54، L12-13): صفحة الطلب /p/ و«متابعة طلب» /portal للأفراد والشركات (data-side=paid) — ورقة بيضاء،
   الترحيب بخط الواجهة (فيه اسم العميل، لا وجه العناوين أبدًا)، صندوق واحد فقط لـ«مطلوب منكم الآن» حين يوجد ما يُطلب، وإلا سطر
   هادئ بلا صندوق؛ المراحل قائمة بخطوط ومعيّنات (زخرفة الشعار)، الأقسام روابط بخطوط بلا أيقونات، وشريط التواصل في آخر الصفحة
   لا ثابتًا. «خيري» (data-side=charity) يبقى بشكل v11. داخل @media screen.
   ========================================================================== */

@media screen {
  body[data-side="paid"]:is(.bp-portal, .bp-login) {
    --bp-radius: 2px;
    --bp-teal-bg: var(--paper-2);
    --bp-ok-bg: var(--paper-2);
    --bp-amber-bg: var(--paper-2);
    background: var(--paper);
    color: var(--ink);
  }

  body[data-side="paid"] .bp-page {
    max-width: 640px;
    padding-inline: var(--gutter);
  }

  body[data-side="paid"] .bp-greet {
    padding-block: clamp(20px, 5vw, 40px) 8px;
  }

  body[data-side="paid"] .bp-greet h1 {
    color: var(--ink);
    font: 600 clamp(24px, 0.6vw + 22px, 30px)/1.4 var(--f-ui);
  }

  body[data-side="paid"] :is(.bp-sub, .bp-meta, .bp-small, .bp-step-hint, .bp-row-sub, .bp-hint) {
    color: var(--ink-2);
  }

  body[data-side="paid"] .bp-sub {
    margin-top: 6px;
    font: var(--t-ui);
  }

  /* الأزرار (K12-20) */
  body[data-side="paid"] .bp-btn {
    min-height: 48px;
    padding: 0 22px;
    border: 1px solid transparent;
    border-radius: 2px;
    box-shadow: none;
    font: 600 16px/1.2 var(--f-ui);
  }

  body[data-side="paid"] .bp-btn--primary {
    min-height: 50px;
    background: var(--act);
    color: var(--on-act);
  }

  body[data-side="paid"] .bp-btn--primary:hover {
    background: var(--act-hover);
  }

  body[data-side="paid"] :is(.bp-btn--secondary, .bp-btn--ghost) {
    border-color: var(--ink);
    background: none;
    color: var(--ink);
  }

  body[data-side="paid"] :is(.bp-btn--secondary, .bp-btn--ghost):hover {
    background: var(--paper-2);
  }

  body[data-side="paid"] :is(.bp-btn--text, .bp-btn--whatsapp, .bp-linkbtn) {
    min-height: 44px;
    padding-inline: 4px;
    border-color: transparent;
    background: none;
    color: var(--act);
    font-weight: 600;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-underline-offset: 0.32em;
  }

  body[data-side="paid"] .bp-btn .bp-ic,
  body[data-side="paid"] .bp-row > .bp-ic:first-child,
  body[data-side="paid"] .bp-calm-ic {
    display: none;
  }

  body[data-side="paid"] :is(.bp-btn, .bp-row, .bp-linkbtn, .bp-back, .bp-icon-btn, .bp-choice):focus-visible,
  body[data-side="paid"] .bp-page :is(a, summary):focus-visible {
    outline: none;
    box-shadow: var(--focus);
  }

  body[data-side="paid"] .bp-btn:active:not(:disabled) {
    transform: none;
  }

  /* الصندوق الوحيد: «مطلوب منكم الآن» بحد حبر 1px؛ لا شيء مطلوب = سطر بلا صندوق */
  body[data-side="paid"] .bp-now {
    margin-top: 24px;
    padding: 24px;
    border: 1px solid var(--ink);
    border-radius: 0;
    background: var(--paper);
  }

  body[data-side="paid"] .bp-now.is-calm {
    display: block;
    padding: 16px 0;
    border: 0;
    border-block: 1px solid var(--rule);
  }

  body[data-side="paid"] .bp-now-title {
    color: var(--ink);
    font: var(--t-head);
  }

  body[data-side="paid"] .bp-now.is-calm .bp-now-title {
    font: var(--t-ui-strong);
  }

  body[data-side="paid"] .bp-now-text {
    color: var(--ink-2);
    font: var(--t-ui);
  }

  body[data-side="paid"] .bp-kicker {
    color: var(--ink-2);
    font: var(--t-label);
  }

  body[data-side="paid"] .bp-kicker .bp-dot {
    display: none;
  }

  /* الأقسام والبطاقات: خطوط لا أسطح */
  body[data-side="paid"] :is(.bp-card, .bp-info, .bp-bubble, .bp-saved, .bp-consent, .bp-restore, .bp-nocode) {
    border: 0;
    border-radius: 0;
    background: none;
    box-shadow: none;
  }

  body[data-side="paid"] .bp-card {
    margin-top: 32px;
    padding: 0;
  }

  body[data-side="paid"] .bp-card-title,
  body[data-side="paid"] .bp-viewtitle {
    padding-block-end: 10px;
    border-block-end: 1px solid var(--ink);
    color: var(--ink);
    font: var(--t-head);
  }

  body[data-side="paid"] :is(.bp-info, .bp-consent, .bp-saved, .bp-restore, .bp-nocode) {
    padding: 14px 18px;
    border-inline-start: 2px solid var(--act);
    background: var(--paper-2);
  }

  body[data-side="paid"] .bp-bubble {
    padding: 12px 0;
    border-block-end: 1px solid var(--rule);
  }

  body[data-side="paid"] .bp-bubble.is-mine {
    padding-inline-start: 16px;
    border-inline-start: 2px solid var(--rule-2);
  }

  /* المراحل: معيّنات صغيرة (تم = حبر ثانٍ ممتلئ، الحالية = أخضر ممتلئ، القادمة = محيط) وخطوط بين الصفوف */
  body[data-side="paid"] .bp-steps {
    margin-top: 0;
  }

  body[data-side="paid"] .bp-step {
    gap: 14px;
    align-items: baseline;
    padding: 14px 0;
    border-block-end: 1px solid var(--rule);
    color: var(--ink-2);
    font: var(--t-ui);
  }

  body[data-side="paid"] .bp-step-dot {
    flex: 0 0 9px;
    width: 9px;
    height: 9px;
    margin: 0 4px;
    overflow: hidden;
    border: 1.5px solid var(--ink-3);
    border-radius: 0;
    background: none;
    box-shadow: none;
    color: transparent;
    font-size: 0;
    transform: rotate(45deg);
  }

  body[data-side="paid"] .bp-step.is-done .bp-step-dot {
    border-color: var(--ink-2);
    background: var(--ink-2);
  }

  body[data-side="paid"] .bp-step.is-current .bp-step-dot {
    border-color: var(--act);
    background: var(--act);
    box-shadow: none;
  }

  body[data-side="paid"] .bp-step.is-current .bp-step-title {
    color: var(--ink);
    font-weight: 600;
  }

  body[data-side="paid"] .bp-step.is-done .bp-step-title {
    color: var(--ink-2);
  }

  /* «طلبكم»: روابط بخطوط */
  body[data-side="paid"] .bp-row {
    min-height: 52px;
    padding: 8px 0;
    border-bottom: 1px solid var(--rule);
    color: var(--ink);
    font: var(--t-ui);
  }

  body[data-side="paid"] .bp-rows li:last-child .bp-row {
    border-bottom: 1px solid var(--rule);
  }

  body[data-side="paid"] .bp-row:hover {
    background: var(--paper-2);
  }

  body[data-side="paid"] .bp-row > .bp-ic:last-child {
    color: var(--ink-3);
  }

  body[data-side="paid"] .bp-pill {
    padding: 0;
    border-radius: 0;
    background: none;
    color: var(--ink-2);
    font: var(--t-small);
  }

  body[data-side="paid"] .bp-callback {
    margin-top: 24px;
  }

  body[data-side="paid"] .bp-ref {
    margin-top: 20px;
    color: var(--ink-3);
    font: var(--t-small);
  }

  /* v12 gate (V-16): رقم الطلب بخط الصفحة (Plex اللاتيني) وأرقام ثابتة العرض، لا خط monospace للجهاز */
  body[data-side="paid"] .bp-code {
    font-family: var(--f-ui);
    font-weight: 600;
    font-variant-numeric: tabular-nums;
  }

  /* الحقول */
  body[data-side="paid"] .bp-input {
    min-height: 52px;
    border: 1px solid var(--field-line);
    border-radius: 2px;
    background: var(--paper);
    box-shadow: none;
  }

  body[data-side="paid"] .bp-input:focus {
    outline: none;
    border-color: var(--act);
    box-shadow: inset 0 0 0 1px var(--act);
  }

  body[data-side="paid"] :is(.bp-icon-btn, .bp-back, .bp-choice) {
    border: 1px solid var(--rule-2);
    border-radius: 2px;
    background: var(--paper);
  }

  body[data-side="paid"] .bp-choice[aria-checked="true"] {
    border-color: var(--act);
    box-shadow: inset 0 0 0 1px var(--act);
  }

  body[data-side="paid"] .bp-composer {
    border-radius: 0;
    box-shadow: 0 0 0 1px var(--rule-2);
  }

  body[data-side="paid"] .bp-sheet {
    border-radius: var(--r-28) var(--r-28) 0 0;
  }

  /* التواصل في آخر الصفحة (لا شريط ثابت فوق المحتوى): مواعيد العمل سطر، ثم «اتصلوا بنا» خطّي و«واتساب» رابط */
  body[data-side="paid"] .bp-bar {
    position: static;
    max-width: 640px;
    margin: 32px auto 0;
    padding: 20px var(--gutter) calc(28px + env(safe-area-inset-bottom, 0px));
    border-top: 1px solid var(--rule);
    background: var(--paper);
    box-shadow: none;
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
  }

  body[data-side="paid"] .bp-hours {
    margin: 0 0 12px;
    color: var(--ink-2);
    font: var(--t-small);
    text-align: start;
  }

  body[data-side="paid"] .bp-hours.is-closed {
    color: var(--warn);
    font-weight: 600;
  }

  body[data-side="paid"] .bp-bar-btns {
    justify-content: flex-start;
    gap: 8px 24px;
  }

  body[data-side="paid"] .bp-bar-btns > * {
    flex: 0 0 auto;
    min-height: 48px;
  }

  /* /portal: العلامة في الرأس تكفي (A16: لا شعاران في شاشة واحدة)؛ حقل واحد وزر ممتلئ واحد */
  body[data-side="paid"] .pub-signin-logo {
    display: none;
  }

  body[data-side="paid"] .bp-login-title {
    margin-top: clamp(20px, 5vw, 40px) !important;
    color: var(--ink);
    font: var(--d2) !important;
  }

  body.bp-login[data-side="paid"] .bp-card h2 {
    font: var(--t-head);
  }

  /* «إرسال الكود» زر النموذج الأساسي (صنفه واتساب): ممتلئ هنا وحده */
  body.bp-login[data-side="paid"] form .bp-btn--whatsapp {
    min-height: 50px;
    margin-top: 12px;
    padding: 0 22px;
    background: var(--act);
    color: var(--on-act);
    text-decoration: none;
  }

  body.bp-login[data-side="paid"] form .bp-btn--whatsapp:hover {
    background: var(--act-hover);
  }

  body[data-side="paid"] .bp-new a {
    color: var(--act);
    font: var(--t-ui);
  }

  body[data-side="paid"] .bp-safety {
    color: var(--ink-3);
    font: var(--t-small);
  }

  body[data-side="paid"] .bp-demo summary {
    color: var(--ink-2);
  }
}

@media screen and (forced-colors: active) {
  body[data-side="paid"] :is(.bp-btn, .bp-now, .bp-row) {
    border: 1px solid CanvasText;
  }

  body[data-side="paid"] .bp-step-dot {
    forced-color-adjust: none;
  }
}