/* ==========================================================================
   Arabic / RTL overrides for report-2026.css
   Loaded only by index-ar.html, after the base stylesheet.
   ========================================================================== */

/* ---- typography ---------------------------------------------------------- */
body{
  font-family:'IBM Plex Sans Arabic','Noto Kufi Arabic',system-ui,-apple-system,sans-serif;
  line-height:1.7;
}
h1,h2,h3,.stat-value,.stat-suffix,.month-name,.media-title,.qmark,.num{
  font-family:'Noto Kufi Arabic','IBM Plex Sans Arabic',sans-serif;
  font-weight:800;
}
h1,h2,h3{line-height:1.35}
.body{line-height:1.95}
blockquote p{font-style:normal;line-height:1.95}
.hand{font-family:'Lemonada','IBM Plex Sans Arabic',cursive;font-size:1.2rem;line-height:1.7}

/* Arabic is a connected script: letter-spacing and uppercasing break it. */
.eyebrow,.badge,.month-year,.chip,.srclink,.srclink-inline,.subnav a{
  letter-spacing:normal;text-transform:none;
}
.eyebrow{font-size:.78rem}
.badge{font-size:.72rem}
.month-year{font-size:.7rem}

/* A drop cap severs the ligature of the first Arabic word — turn it off. */
.dropcap::first-letter{
  font-family:inherit;font-size:inherit;font-weight:inherit;
  color:inherit;float:none;margin:0;line-height:inherit;
}

/* Latin fragments (URLs, names, acronyms) inside Arabic text */
.ltr{direction:ltr;unicode-bidi:isolate;display:inline-block}

/* ---- mirrored layout ----------------------------------------------------- */
.month-items{
  border-left:0;border-right:2px dashed rgba(19,31,54,.2);
  padding-left:0;padding-right:1.35rem;
}
@media(min-width:768px){.month-items{padding-left:0;padding-right:2rem}}
.dot{left:auto;right:-1.7rem}
@media(min-width:768px){.dot{left:auto;right:-2.4rem}}

.stat-underline{transform-origin:right}

blockquote{
  border-left:0;border-right:4px solid var(--mustard);
  border-radius:.85rem 0 0 .85rem;
}
.qmark{left:auto;right:1rem}

.watch:hover{transform:translateX(-4px)}

.sparkle{right:auto;left:32%}
.star{right:auto;left:3rem}

/* diagonal band cuts, mirrored */
.diag{clip-path:polygon(0 0,100% 3vw,100% 100%,0 100%)}
.diag-up{clip-path:polygon(0 3vw,100% 0,100% 100%,0 100%)}

/* ---- mirrored hard shadows ----------------------------------------------- */
.frame-hero{box-shadow:-8px 8px 0 0 var(--red)}
.frame-mustard{box-shadow:-4px 4px 0 0 var(--mustard)}
.frame-blue{box-shadow:-5px 5px 0 0 var(--blue)}
.frame-book{box-shadow:-7px 7px 0 0 var(--mustard)}
.frame-standout{box-shadow:-6px 6px 0 0 var(--red)}

.btn-mustard{box-shadow:-3px 3px 0 0 var(--red)}
.btn-mustard:hover{box-shadow:-5px 5px 0 0 var(--red)}
.btn-navy{box-shadow:-3px 3px 0 0 var(--mustard)}
.btn-navy:hover{box-shadow:-5px 5px 0 0 var(--mustard)}
.btn-red{box-shadow:-3px 3px 0 0 var(--mustard)}
.btn-red:hover{box-shadow:-5px 5px 0 0 var(--mustard)}
.btn-cream{box-shadow:-5px 5px 0 0 var(--navy)}
.btn-cream:hover{box-shadow:-8px 8px 0 0 var(--navy)}

.stat{box-shadow:-4px 4px 0 0 var(--navy)}
.stat:hover{box-shadow:-7px 7px 0 0 var(--navy)}
.card:hover{box-shadow:-6px 6px 0 0 rgba(19,31,54,.12)}
.media-card:hover{box-shadow:-6px 6px 0 0 var(--red)}
.month-tag{box-shadow:-3px 3px 0 0 var(--mustard)}

/* ---- stats: the Arabic suffix "مليون" is a word, not a letter -------------- */
.stat-suffix{font-size:1.15rem;margin-right:.35rem}
.stat-label{font-size:.84rem}
