/* PlayArea OS marketing site - the Arabic (right-to-left) copy under /ar/ (REQ-504).
   Loaded AFTER the English stylesheets, only on /ar/ pages, so the English site is untouched.
   Font: Cairo, the same self-hosted files the app uses (SIL OFL 1.1, licence beside them).
   Rules: Latin letters keep Nunito / Inter (the faces listed first); only Arabic glyphs fall through to Cairo. */
@font-face{font-family:'Cairo';font-style:normal;font-weight:400;font-display:swap;src:url('/assets/fonts/cairo-v5-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}
@font-face{font-family:'Cairo';font-style:normal;font-weight:600;font-display:swap;src:url('/assets/fonts/cairo-v5-arabic-600.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}
@font-face{font-family:'Cairo';font-style:normal;font-weight:700;font-display:swap;src:url('/assets/fonts/cairo-v5-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}

html[dir="rtl"]{
  --font-sans:'Inter','Cairo',Arial,sans-serif;
  --font-ui:'Inter','Cairo',Arial,sans-serif;
  --font-body:var(--font-ui);
  --font-display:'Nunito','Cairo','Arial Rounded MT Bold',Arial,sans-serif;
}

/* Arabic is not spaced capitals: tracking and uppercase break the joined letters. */
html[dir="rtl"] *{letter-spacing:0!important;text-transform:none!important}

/* Cairo has tall ascenders and deep descenders; give lines a little more air than the Latin faces. */
html[dir="rtl"] body{line-height:1.8}
html[dir="rtl"] h1,html[dir="rtl"] h2,html[dir="rtl"] h3,html[dir="rtl"] h4{line-height:1.3}
html[dir="rtl"] p,html[dir="rtl"] li,html[dir="rtl"] dd{line-height:1.85}
html[dir="rtl"] .eyebrow{font-weight:700}

/* Prices, phone numbers, e-mail and other left-to-right runs keep their own direction inside Arabic lines. */
html[dir="rtl"] bdi[dir="ltr"],html[dir="rtl"] a[href^="mailto:"]{unicode-bidi:isolate}

/* The English skip link hides itself with a negative `left`; in a right-to-left page that stretches the scroll area. */
html[dir="rtl"] .skip-link{left:auto;right:-9999px}
html[dir="rtl"] .skip-link:focus{left:auto;right:8px}

/* Code and formulas are left-to-right text; keep them that way inside the right-to-left page. */
html[dir="rtl"] pre,html[dir="rtl"] code,html[dir="rtl"] kbd{direction:ltr;text-align:left;unicode-bidi:isolate}

/* The "English text governs" notice under the title of the Arabic Privacy and Terms pages. */
html[dir="rtl"] .ar-legal-note{margin:16px 0 12px}

/* Phone review fixes (Ahmad, 2026-10-11) ------------------------------------------------------- */
/* The header is laid out left to right in both languages (rules in home.css), so the menu button needs no mirror rule. */
/* Cards and tables whose English CSS says `text-align: left` must follow the reading direction. `html` in front
   lifts these just above the English element rules without beating a class that centres on purpose. */
html .benefit-list,html .pai-service-detail,html .pai-service-content,html .pai-live-popup,html .product-categories,
html .help-card,html .pm-corner,html .pm-caption,html .price-matrix thead th:first-child,
html .price-matrix tbody th[scope="row"],html .pm-full tr.pm-cat th,html caption,html th,html td{text-align:start}
html .product-window{text-align:start}
html .product-window .bub{text-align:start}
/* The till receipt in the POS tile: a long Arabic label must not run into its amount. */
html[dir="rtl"] .paper .brow{align-items:baseline}
html[dir="rtl"] .paper .brow>span{flex:1 1 auto;min-width:0;white-space:normal;line-height:1.25}
html[dir="rtl"] .paper .brow>b{flex:none}
