/* Invitation Vivante — mise en page miroir pour les langues lues de droite à gauche (arabe).
   Chargé seulement quand <html dir="rtl">. Les grilles et flex se retournent tout seuls : on ne corrige ici que ce qui est écrit en gauche/droite. */
html[dir=rtl] body{text-align:right}
html[dir=rtl] input,html[dir=rtl] textarea,html[dir=rtl] select{text-align:right}
html[dir=rtl] input[type=email],html[dir=rtl] input[type=url],html[dir=rtl] input[type=tel],html[dir=rtl] input[type=number],html[dir=rtl] input[type=date],html[dir=rtl] input[type=time],html[dir=rtl] input.ltr{direction:ltr;text-align:right}
/* alignements écrits à gauche → droite */
html[dir=rtl] .kind,html[dir=rtl] .swatch,html[dir=rtl] .fm,html[dir=rtl] .plan-o,html[dir=rtl] .reassure-i,html[dir=rtl] .chips button,html[dir=rtl] .tracks button,
html[dir=rtl] .cmp tbody th,html[dir=rtl] .cmp tr.g th,html[dir=rtl] .mcard,html[dir=rtl] .occ-ask button.o,html[dir=rtl] .it{text-align:right}
html[dir=rtl] .top .save{text-align:left}
html[dir=rtl] .prog .h{text-align:left}
/* listes et retraits */
html[dir=rtl] .fm ul{padding-left:0;padding-right:18px}
html[dir=rtl] .cmp tbody th{padding-left:0;padding-right:18px}
html[dir=rtl] .cmp tr.g th{padding-left:0;padding-right:12px}
html[dir=rtl] .pc .amt small,html[dir=rtl] .notif .ic{margin-left:0;margin-right:8px}
html[dir=rtl] .play svg,html[dir=rtl] .tracks button i svg{margin-left:0;margin-right:4px}
/* éléments posés à gauche / à droite de l'écran */
html[dir=rtl] .pv-badge,html[dir=rtl] .live,html[dir=rtl] .demo-pill,html[dir=rtl] .ph .st{left:auto;right:12px}
html[dir=rtl] .exitq-x,html[dir=rtl] .mute,html[dir=rtl] .film .hint,html[dir=rtl] .pc.best .tag,html[dir=rtl] .lb .x{right:auto;left:12px}
html[dir=rtl] .hero .biz-logo{left:auto;right:max(18px,env(safe-area-inset-right))}
html[dir=rtl] .dots{right:auto;left:8px}
html[dir=rtl] .lb .p{left:auto;right:10px}
html[dir=rtl] .lb .n{right:auto;left:10px}
html[dir=rtl] .dark::before{right:auto;left:-300px}
html[dir=rtl] .tabs-bar .badge{right:auto;left:calc(50% - 22px)}
html[dir=rtl] .m-prev{left:auto;right:8px}
html[dir=rtl] .stage .phone:not(.on){left:0;right:0}
/* trait d'accent d'une annonce */
html[dir=rtl] .card.annonce{border-left:0;border-right:4px solid var(--acc)}
/* frise du programme */
html[dir=rtl] .prog::before{left:auto;right:58px}
html[dir=rtl] .prog li::before{left:auto;right:53px}
/* interrupteurs */
html[dir=rtl] .sw-t i::after{left:auto;right:3px}
html[dir=rtl] .sw-t input:checked+i::after{transform:translateX(-22px)}
/* listes déroulantes : la flèche passe à gauche */
html[dir=rtl] select,html[dir=rtl] .lang-pick{background-position:22px calc(50% + 2px),27px calc(50% + 2px);padding-left:34px;padding-right:14px}
/* flèches : les icônes de direction se retournent */
html[dir=rtl] .ic-arrow,html[dir=rtl] .btn .ic,html[dir=rtl] #next svg,html[dir=rtl] .back,html[dir=rtl] summary::after{transform:scaleX(-1)}
html[dir=rtl] summary::after{transform:rotate(45deg)}
/* barre de progression d'un film : démarre à droite */
html[dir=rtl] .film .bar i b{float:right}
/* code, adresses, liens et chiffres de paiement : restent de gauche à droite dans le texte arabe */
html[dir=rtl] code,html[dir=rtl] .codebox code,html[dir=rtl] .qr,html[dir=rtl] .mono{direction:ltr;unicode-bidi:embed}
/* le décor des modèles et les canvas ne se retournent pas : leur contenu est dessiné, pas lu */
html[dir=rtl] canvas{direction:ltr}
/* vignettes de modèles : étiquette en haut à droite */
html[dir=rtl] .mini .m-tx{direction:rtl}
html[dir=rtl] .mgal,html[dir=rtl] .mchips{direction:rtl}
html[dir=rtl] .hero .in,html[dir=rtl] .gate-in{direction:rtl}
html[dir=rtl] .chips button,html[dir=rtl] .tracks button,html[dir=rtl] .cmp tbody th,html[dir=rtl] .cmp tr.g th,html[dir=rtl] .feat{text-align:right}

/* échelle typographique de l'invitation reçue : facteur 1,1 par pas en arabe (lecture plus dense : mission design-excellence, lot 1) */
html[dir=rtl]{--iv-fs-1:15.4px;--iv-fs-2:18.7px;--iv-fs-3:23.1px;--iv-fs-4:28.6px;--iv-fs-5:36.3px;--iv-fs-6:45.1px}