/* ==========================================================================
   branches.css — خاص بصفحة "مراكز التركيب" (الفروع)
   شركة السرعة المطلقة | كل القيم من tokens.css — RTL.
   القسمان مطابقان لفيجما (node 42:66): بطاقة "خدماتنا المميزة"، ثم بطاقة
   الموقع (map-card المشترك مع الرئيسية) وبداخلها صندوق العنوان + زر الخرائط.
   ========================================================================== */

/* ---- 1) بطاقة المقدّمة — عنوان + خط فاصل + فقرة (Figma #316:20002) ---- */
.branches-intro {
  padding: var(--space-32) var(--space-40);
  background-color: var(--color-surface);
  border: var(--border-width) solid var(--color-border);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-card-soft);
  margin-bottom: var(--space-40);
}
.branches-intro__title {
  font-size: var(--fs-lg);
  font-weight: var(--fw-black);
  color: var(--color-dark);
  text-align: start;
  padding-bottom: var(--space-20);
  margin-bottom: var(--space-20);
  border-bottom: var(--border-width) solid var(--color-border);
}
.branches-intro__text {
  font-size: var(--fs-xs);
  line-height: 1.95; /* فيجما: 27.3px على 14px */
  color: var(--color-text-secondary);
  text-align: start;
}

/* ---- 2) بطاقة الموقع (Figma #42:170) — بطاقة بيضاء بظل، خريطة + صندوق عنوان ----
   تعتمد على .map-card المشترك (map-card.css)؛ هنا نبدّل مظهر الحاوية فقط
   إلى بيضاء بظل (بدل رمادية بحدّ في الرئيسية). */
.branches-map .map-card {
  background-color: var(--color-surface);
  border: none;
  border-radius: var(--radius-md);
  box-shadow: var(--shadow-card-hover); /* ≈ فيجما 0 4px 20px rgba(0,0,0,.1) */
}
.branches-map .map-card__info {
  align-items: stretch; /* صندوق العنوان يملأ العمود */
  justify-content: center;
}

/* صندوق العنوان الرمادي داخل العمود (Figma #42:240) */
.branch-location {
  display: flex;
  flex-direction: column;
  gap: var(--space-16);
  padding: var(--space-20);
  background-color: var(--color-bg-alt);
  border-radius: var(--radius-sm);
}
/* عنوان العنوان: أيقونة موقع (يمين) + النص (Figma #42:241 + #42:244) */
.branch-location__head {
  display: flex;
  align-items: center;
  gap: var(--space-8);
}
.branch-location__pin {
  flex-shrink: 0;
  color: var(--color-accent);
  font-size: var(--fs-lg);
}
.branch-location__heading {
  font-size: var(--fs-base);
  font-weight: var(--fw-medium);
  color: var(--color-text);
  text-align: start;
}
/* صندوق أبيض داخلي يكرّر العنوان (Figma #42:245 + #42:246) */
.branch-location__address {
  padding: var(--space-12) var(--space-16);
  background-color: var(--color-surface);
  border-radius: var(--radius-xs);
  font-size: var(--fs-xs);
  color: var(--color-text-muted);
  text-align: start;
}
/* زر "الموقع على خرائط جوجل" — عنابي غامق، يلتصق باليسار (Figma #42:247) */
.branch-location__link {
  align-self: flex-end; /* end = يسار في RTL */
  background-color: var(--color-gradient-end);
  color: var(--color-text-invert);
  font-weight: var(--fw-medium);
  border-radius: var(--radius-xs);
}
.branch-location__link:hover {
  background-color: var(--color-primary-darkest);
  color: var(--color-text-invert);
}