/* Arabic / right-to-left. Loaded only on /ar/ pages, after main.css.
   Most of the layout already uses logical properties (inline/block), so only details are mirrored here. */

@font-face {
	font-family: "IBM Plex Sans Arabic";
	src: url("../fonts/ibm-plex-sans-arabic-400.woff2") format("woff2");
	font-weight: 400;
	font-style: normal;
	font-display: swap;
	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;
}
@font-face {
	font-family: "IBM Plex Sans Arabic";
	src: url("../fonts/ibm-plex-sans-arabic-600.woff2") format("woff2");
	font-weight: 500 600;
	font-style: normal;
	font-display: swap;
	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;
}
@font-face {
	font-family: "IBM Plex Sans Arabic";
	src: url("../fonts/ibm-plex-sans-arabic-700.woff2") format("woff2");
	font-weight: 700 800;
	font-style: normal;
	font-display: swap;
	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;
}

:root {
	/* Arabic glyphs from IBM Plex Sans Arabic, Latin glyphs (brand name, numbers) from Manrope. */
	--font: "Manrope", "IBM Plex Sans Arabic", system-ui, -apple-system, "Segoe UI", Tahoma, Arial, sans-serif;
}

body { line-height: 1.8; font-feature-settings: normal; }
:where(h1, h2, h3, h4) { letter-spacing: 0; line-height: 1.35; }
.hero__title, .page-head__title, .article__title, .thanks__title { letter-spacing: 0; line-height: 1.3; }
.hero__title { max-width: 16ch; }
.section__title { line-height: 1.35; }
.prose p, .prose li { line-height: 1.95; }
.btn { letter-spacing: 0; }

/* Labels that are uppercase + tracked in French look wrong in Arabic. */
.fact__label, .contact-list strong, .post-card__cat, .article__cat, .slots__label,
.site-footer__h, .hours__today, .cal__dow, .cal__tag { letter-spacing: 0; text-transform: none; }

/* Left-to-right fragments (phone numbers, references, brand). */
.ltr { direction: ltr; unicode-bidi: isolate; display: inline-block; }
.ltr-block { direction: ltr; text-align: right; color: var(--ink-soft); font-size: .95rem; }
input[type="tel"], input[type="email"] { text-align: right; }
input[type="tel"]::placeholder, input[type="email"]::placeholder { text-align: right; }

/* Direction icons point the other way. */
.link-arrow svg, .svc-card__more svg, .booking__nav [data-next] svg,
.cal__nav svg { transform: scaleX(-1); }
.link-arrow:hover .icon { transform: scaleX(-1) translateX(3px); }
.svc-card:hover .svc-card__more .icon { transform: scaleX(-1) translateX(3px); }

/* Hero: the tinted block behind the portrait sits on the other side. */
.hero__media::before { inset: 28px 28px -14px -14px; }

/* Hours table: labels right, times left. */
.hours th { text-align: right; }
.hours td { text-align: left; }

/* Brand stays in Latin script, left-to-right. */
.brand__text { text-align: left; }

/* Language switcher. */
.lang-switch { font-family: "Manrope", system-ui, sans-serif; }

/* Booking calendar: weeks start on Monday on the right. */
.cal__row { direction: rtl; }

/* Mobile action bar. */
.mobile-bar .mobile-bar__primary { font-size: 1rem; }