/* Arabic pages only (loaded by app/[locale]/layout.tsx when the language is
   ar), after the generated rtl.css. Hand-written fixes for what mirroring the
   CSS automatically does not get right.

   Arabic font: the site font, Poppins, has no Arabic letters. These faces are
   also named "Poppins" but only cover Arabic characters (unicode-range), so
   every element that uses Poppins draws Arabic text with Cairo and Latin text,
   numbers and brand names with the real Poppins - no selector overrides.
   Cairo: SIL Open Font License 1.1 (https://github.com/Gue3bara/Cairo). */
@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 300;
  font-display: swap;
  src: url("/assets/fonts/cairo-arabic-300.woff2") format("woff2");
  unicode-range: U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC,U+102E0-102FB,U+10E60-10E7E,U+10EC2-10EC4,U+10EFC-10EFF,U+1EE00-1EE03,U+1EE05-1EE1F,U+1EE21-1EE22,U+1EE24,U+1EE27,U+1EE29-1EE32,U+1EE34-1EE37,U+1EE39,U+1EE3B,U+1EE42,U+1EE47,U+1EE49,U+1EE4B,U+1EE4D-1EE4F,U+1EE51-1EE52,U+1EE54,U+1EE57,U+1EE59,U+1EE5B,U+1EE5D,U+1EE5F,U+1EE61-1EE62,U+1EE64,U+1EE67-1EE6A,U+1EE6C-1EE72,U+1EE74-1EE77,U+1EE79-1EE7C,U+1EE7E,U+1EE80-1EE89,U+1EE8B-1EE9B,U+1EEA1-1EEA3,U+1EEA5-1EEA9,U+1EEAB-1EEBB,U+1EEF0-1EEF1;
}
@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("/assets/fonts/cairo-arabic-400.woff2") format("woff2");
  unicode-range: U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC,U+102E0-102FB,U+10E60-10E7E,U+10EC2-10EC4,U+10EFC-10EFF,U+1EE00-1EE03,U+1EE05-1EE1F,U+1EE21-1EE22,U+1EE24,U+1EE27,U+1EE29-1EE32,U+1EE34-1EE37,U+1EE39,U+1EE3B,U+1EE42,U+1EE47,U+1EE49,U+1EE4B,U+1EE4D-1EE4F,U+1EE51-1EE52,U+1EE54,U+1EE57,U+1EE59,U+1EE5B,U+1EE5D,U+1EE5F,U+1EE61-1EE62,U+1EE64,U+1EE67-1EE6A,U+1EE6C-1EE72,U+1EE74-1EE77,U+1EE79-1EE7C,U+1EE7E,U+1EE80-1EE89,U+1EE8B-1EE9B,U+1EEA1-1EEA3,U+1EEA5-1EEA9,U+1EEAB-1EEBB,U+1EEF0-1EEF1;
}
@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("/assets/fonts/cairo-arabic-500.woff2") format("woff2");
  unicode-range: U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC,U+102E0-102FB,U+10E60-10E7E,U+10EC2-10EC4,U+10EFC-10EFF,U+1EE00-1EE03,U+1EE05-1EE1F,U+1EE21-1EE22,U+1EE24,U+1EE27,U+1EE29-1EE32,U+1EE34-1EE37,U+1EE39,U+1EE3B,U+1EE42,U+1EE47,U+1EE49,U+1EE4B,U+1EE4D-1EE4F,U+1EE51-1EE52,U+1EE54,U+1EE57,U+1EE59,U+1EE5B,U+1EE5D,U+1EE5F,U+1EE61-1EE62,U+1EE64,U+1EE67-1EE6A,U+1EE6C-1EE72,U+1EE74-1EE77,U+1EE79-1EE7C,U+1EE7E,U+1EE80-1EE89,U+1EE8B-1EE9B,U+1EEA1-1EEA3,U+1EEA5-1EEA9,U+1EEAB-1EEBB,U+1EEF0-1EEF1;
}
@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  /* Cairo 700 for weight 600: Arabic letterforms look lighter than Latin at the
     same weight, and the theme uses 600 for its bold headings. */
  src: url("/assets/fonts/cairo-arabic-700.woff2") format("woff2");
  unicode-range: U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC,U+102E0-102FB,U+10E60-10E7E,U+10EC2-10EC4,U+10EFC-10EFF,U+1EE00-1EE03,U+1EE05-1EE1F,U+1EE21-1EE22,U+1EE24,U+1EE27,U+1EE29-1EE32,U+1EE34-1EE37,U+1EE39,U+1EE3B,U+1EE42,U+1EE47,U+1EE49,U+1EE4B,U+1EE4D-1EE4F,U+1EE51-1EE52,U+1EE54,U+1EE57,U+1EE59,U+1EE5B,U+1EE5D,U+1EE5F,U+1EE61-1EE62,U+1EE64,U+1EE67-1EE6A,U+1EE6C-1EE72,U+1EE74-1EE77,U+1EE79-1EE7C,U+1EE7E,U+1EE80-1EE89,U+1EE8B-1EE9B,U+1EEA1-1EEA3,U+1EEA5-1EEA9,U+1EEAB-1EEBB,U+1EEF0-1EEF1;
}
@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("/assets/fonts/cairo-arabic-700.woff2") format("woff2");
  unicode-range: U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC,U+102E0-102FB,U+10E60-10E7E,U+10EC2-10EC4,U+10EFC-10EFF,U+1EE00-1EE03,U+1EE05-1EE1F,U+1EE21-1EE22,U+1EE24,U+1EE27,U+1EE29-1EE32,U+1EE34-1EE37,U+1EE39,U+1EE3B,U+1EE42,U+1EE47,U+1EE49,U+1EE4B,U+1EE4D-1EE4F,U+1EE51-1EE52,U+1EE54,U+1EE57,U+1EE59,U+1EE5B,U+1EE5D,U+1EE5F,U+1EE61-1EE62,U+1EE64,U+1EE67-1EE6A,U+1EE6C-1EE72,U+1EE74-1EE77,U+1EE79-1EE7C,U+1EE7E,U+1EE80-1EE89,U+1EE8B-1EE9B,U+1EEA1-1EEA3,U+1EEA5-1EEA9,U+1EEAB-1EEBB,U+1EEF0-1EEF1;
}

@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 800;
  font-display: swap;
  src: url("/assets/fonts/cairo-arabic-800.woff2") format("woff2");
  unicode-range: U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC,U+102E0-102FB,U+10E60-10E7E,U+10EC2-10EC4,U+10EFC-10EFF,U+1EE00-1EE03,U+1EE05-1EE1F,U+1EE21-1EE22,U+1EE24,U+1EE27,U+1EE29-1EE32,U+1EE34-1EE37,U+1EE39,U+1EE3B,U+1EE42,U+1EE47,U+1EE49,U+1EE4B,U+1EE4D-1EE4F,U+1EE51-1EE52,U+1EE54,U+1EE57,U+1EE59,U+1EE5B,U+1EE5D,U+1EE5F,U+1EE61-1EE62,U+1EE64,U+1EE67-1EE6A,U+1EE6C-1EE72,U+1EE74-1EE77,U+1EE79-1EE7C,U+1EE7E,U+1EE80-1EE89,U+1EE8B-1EE9B,U+1EEA1-1EEA3,U+1EEA5-1EEA9,U+1EEAB-1EEBB,U+1EEF0-1EEF1;
}
@font-face {
  font-family: "Poppins";
  font-style: normal;
  font-weight: 900;
  font-display: swap;
  src: url("/assets/fonts/cairo-arabic-900.woff2") format("woff2");
  unicode-range: U+0600-06FF,U+0750-077F,U+0870-088E,U+0890-0891,U+0897-08E1,U+08E3-08FF,U+200C-200E,U+2010-2011,U+204F,U+2E41,U+FB50-FDFF,U+FE70-FE74,U+FE76-FEFC,U+102E0-102FB,U+10E60-10E7E,U+10EC2-10EC4,U+10EFC-10EFF,U+1EE00-1EE03,U+1EE05-1EE1F,U+1EE21-1EE22,U+1EE24,U+1EE27,U+1EE29-1EE32,U+1EE34-1EE37,U+1EE39,U+1EE3B,U+1EE42,U+1EE47,U+1EE49,U+1EE4B,U+1EE4D-1EE4F,U+1EE51-1EE52,U+1EE54,U+1EE57,U+1EE59,U+1EE5B,U+1EE5D,U+1EE5F,U+1EE61-1EE62,U+1EE64,U+1EE67-1EE6A,U+1EE6C-1EE72,U+1EE74-1EE77,U+1EE79-1EE7C,U+1EE7E,U+1EE80-1EE89,U+1EE8B-1EE9B,U+1EEA1-1EEA3,U+1EEA5-1EEA9,U+1EEAB-1EEBB,U+1EEF0-1EEF1;
}
/* Inputs whose content is always Latin (phone, e-mail, numbers) stay left to
   right inside the right-to-left form, aligned with the other fields. */
[dir="rtl"] input[type="tel"],
[dir="rtl"] input[type="email"],
[dir="rtl"] input[type="number"],
[dir="rtl"] .iti {
  direction: ltr;
  text-align: right;
}

/* Arrows and chevrons point the reading direction (Feather "icon-*" and Font
   Awesome). Logos and the phone / WhatsApp icons are not mirrored. */
[dir="rtl"] .icon-arrow-right,
[dir="rtl"] .icon-arrow-left,
[dir="rtl"] .icon-arrow-up-right,
[dir="rtl"] .icon-arrow-up-left,
[dir="rtl"] .icon-arrow-right-circle,
[dir="rtl"] .icon-arrow-left-circle,
[dir="rtl"] .icon-chevron-right,
[dir="rtl"] .icon-chevron-left,
[dir="rtl"] .icon-chevrons-right,
[dir="rtl"] .icon-chevrons-left,
[dir="rtl"] .fa-arrow-right,
[dir="rtl"] .fa-arrow-left,
[dir="rtl"] .fa-angle-right,
[dir="rtl"] .fa-angle-left,
[dir="rtl"] .fa-chevron-right,
[dir="rtl"] .fa-chevron-left {
  display: inline-block;
  transform: scaleX(-1);
}

/* Notched shapes are drawn with SVG masks, which mirroring the CSS does not
   flip: mirror the shape itself. */
[dir="rtl"] .icon-bx-wraper.style-6::after,
[dir="rtl"] .icon-bx-wraper.style-6 .bg,
[dir="rtl"] .icon-bx-wraper.style-7::after,
[dir="rtl"] .icon-bx-wraper.style-7 .bg,
[dir="rtl"] .dz-card.style-1::after {
  transform: scaleX(-1);
}
/* The header's two corner shapes are a mirrored pair (the right one is
   pre-flipped); after mirroring they swap sides, so they swap flips too. */
[dir="rtl"] .site-header.box-header::before {
  transform: rotateY(180deg);
}
[dir="rtl"] .site-header.box-header::after {
  transform: none;
}

/* Slider progress bars live outside the Swiper container (no .swiper-rtl),
   so their fill must grow from the right explicitly. */
[dir="rtl"] .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
  transform-origin: right top;
}

/* "10k patientes" badge: keep the label on one line so the badge sizes to it. */
[dir="rtl"] .info-widget .clearfix {
  white-space: nowrap;
}

/* Dates and other Latin snippets keep their own order inside Arabic text. */
[dir="rtl"] .post-date {
  direction: ltr;
  unicode-bidi: isolate;
}

/* Before/after comparison: the slider keeps its left-to-right maths; the
   component swaps the photos and labels so "before" is on the right. */
[dir="rtl"] .twentytwenty-container {
  direction: ltr;
}

/* "Pourquoi la Tunisie" photo: the decorative pink ring (inline SVG) curves
   around the side opposite the badge; mirror it with the badge. */
[dir="rtl"] .content-media .item3 svg {
  transform: scaleX(-1);
}

/* Its "10k" badge: the Arabic label must not be squeezed under the avatars
   (its intrinsic width is measured before the Arabic font has loaded). */
[dir="rtl"] .info-widget.style-1 .clearfix {
  flex-shrink: 0;
  min-width: max-content;
}

/* Round "go" buttons (hero, reviews heading): their ↗ arrow is an inline SVG,
   not an icon font. */
[dir="rtl"] a.btn-square > svg {
  transform: scaleX(-1);
}

/* Blog card meta pills ("date", "by ServiHealth"): Arabic is wider and reads
   larger than Latin at the same size; one notch smaller keeps both pills on
   one line, as in the original. */
[dir="rtl"] .dz-card.style-1 .dz-meta li {
  font-size: 12px;
  /* Physical sides: the date pill is itself left to right, the dot is on the right. */
  padding-right: 19px;
  padding-left: 11px;
}

/* Icon-font glyphs are private-use characters, which the bidi algorithm treats
   as left-to-right letters: next to Latin text ("Contact@…") they join its
   left-to-right run and end up on the left. Isolated, they follow the
   right-to-left order of the markup. */
[dir="rtl"] i[class*="icon-"],
[dir="rtl"] i[class*="fa-"],
[dir="rtl"] i[class*="flaticon"] {
  unicode-bidi: isolate;
}

/* Accordions: the closed chevron (Feather chevron-right) points to the reading
   direction; opening turns it down, mirroring the left-to-right animation. */
[dir="rtl"] .dz-accordion .accordion-button.collapsed::after {
  transform: rotate(180deg);
}

/* Breadcrumb separator: the left-pointing double angle (Font Awesome). A flip
   would also move its spacing to the wrong side. */
[dir="rtl"] .breadcrumb-row ul .breadcrumb-item + .breadcrumb-item::before {
  content: "\f100";
}

/* Testimonial cards: the quotation-mark glyph faces the Arabic text. */
[dir="rtl"] .testimonial-detail::after {
  transform: scaleX(-1);
}

/* Footer pattern: an asymmetric image, so a mirrored copy anchored on the
   right (the component sets the original inline). */
[dir="rtl"] .site-footer.style-1 {
  background-image: url("/assets/images/background/bg5-rtl.webp") !important;
  background-position: right top;
}

/* Hero wave under every page banner (inline SVG, same path everywhere): its
   thick end sits on the start side. */
[dir="rtl"] svg.banner-shape {
  transform: scaleX(-1);
}

/* Rich-text tables (procedure pages): header alignment set by the layout's
   inline styles. */
[dir="rtl"] .section-content table th {
  text-align: right;
}

/* The notched shapes above are flipped as a whole (transform), which flips
   their corner radii too: they must keep the original left-to-right radii,
   not the mirrored ones, or the flip undoes the mirroring. */
[dir="rtl"] .icon-bx-wraper.style-6::after {
  border-radius: 20px 20px 0 20px;
}
[dir="rtl"] .icon-bx-wraper.style-7::after {
  border-radius: 15px 0 15px 15px;
}
[dir="rtl"] .dz-card.style-1::after {
  border-radius: 30px 30px 0 30px;
}

/* Phone field: the widget stays left to right inside the form, so its flag and
   caret keep their left-to-right order. Mirror them: flag on the outer (right)
   edge, caret between it and the text. */
[dir="rtl"] .iti__selected-flag {
  flex-direction: row-reverse;
  padding: 0 8px 0 6px;
}
