/* =====================================================================
   WE CAN Casablanca-Settat — Couche amazighe (tifinagh)
   Fichier additif : chargé APRÈS assets/site.css, qui n'est pas modifié.
   Aucune règle ne s'applique tant que data-lang ne vaut pas "zgh" :
   le site français et le site arabe restent rigoureusement inchangés.
   ===================================================================== */

/* 1. POLICE — Alexandria ne couvre pas le bloc tifinagh U+2D30–2D7F.
   Sous-setter avant mise en ligne :
     pyftsubset NotoSansTifinagh.ttf --unicodes=U+2D30-2D7F \
   Sous-ensemble officiel Google Fonts (SIL OFL), 11 496 octets,
   deja restreint au bloc tifinagh. */
@font-face{
  font-family:'Noto Sans Tifinagh';
  font-style:normal;font-weight:400 700;font-display:swap;
  src:local('Noto Sans Tifinagh'), url('tifinagh.woff2') format('woff2');
  unicode-range:U+2D30-2D7F;
}
:root{ --f-zgh:'Noto Sans Tifinagh','Alexandria',system-ui,sans-serif; }

/* 2. VISIBILITÉ — réplique stricte du bloc « Bilingue » de site.css. */
/* Certains conteneurs de site.css (bandeau defilant, entre autres) posent
   un display:flex plus specifique que le simple .zgh : sans !important,
   la version amazighe resterait visible en francais et en arabe. */
html:not([data-lang="zgh"]) .zgh{display:none !important}
/* Correctif : site.css pose un display:flex sur les items du bandeau
   defilant, plus specifique que .ar{display:none}. Resultat, la version
   arabe du bandeau restait visible sur la page francaise. Symetrie retablie. */
html[data-lang="fr"] .ar{display:none !important}
html[data-lang="ar"] .fr{display:none !important}
html[data-lang="zgh"] .fr,
html[data-lang="zgh"] .ar{display:none !important}
html[data-lang="zgh"] .zgh{display:inline}
html[data-lang="zgh"] p.zgh,
html[data-lang="zgh"] div.zgh,
html[data-lang="zgh"] li.zgh,
html[data-lang="zgh"] h1.zgh,
html[data-lang="zgh"] h2.zgh,
html[data-lang="zgh"] h3.zgh,
html[data-lang="zgh"] h4.zgh,
html[data-lang="zgh"] .blk.zgh{display:block}

/* Bloc encore sans version amazighe : site.js y depose une copie du
   francais marquee data-repli. Decommenter la regle ci-dessous en
   recette pour reperer d'un coup d'oeil ce qui reste a traduire.
html[data-lang="zgh"] .zgh[data-repli]{outline:2px dashed #e11;outline-offset:2px}
*/

/* 3. TYPOGRAPHIE — le tifinagh se lit de gauche à droite ; pas de casse,
   pas d'italique, glyphes géométriques à hauteur d'œil uniforme. */
html[data-lang="zgh"] body{font-family:var(--f-zgh);line-height:1.9}
html[data-lang="zgh"] .kicker,
html[data-lang="zgh"] .btn,
html[data-lang="zgh"] .nav-links>a,
html[data-lang="zgh"] .dd>button,
html[data-lang="zgh"] .dd-m a,
html[data-lang="zgh"] .tb,
html[data-lang="zgh"] .pill,
html[data-lang="zgh"] .chip,
html[data-lang="zgh"] .status,
html[data-lang="zgh"] label,
html[data-lang="zgh"] input,
html[data-lang="zgh"] select,
html[data-lang="zgh"] textarea,
html[data-lang="zgh"] .ck,
html[data-lang="zgh"] .consent,
html[data-lang="zgh"] .note,
html[data-lang="zgh"] .crumb{font-family:var(--f-zgh)}
html[data-lang="zgh"] h1,
html[data-lang="zgh"] h2,
html[data-lang="zgh"] h3,
html[data-lang="zgh"] h4{font-family:var(--f-zgh);font-weight:700;letter-spacing:0;line-height:1.34}
html[data-lang="zgh"] .h-xl{font-size:clamp(1.9rem,4.6vw,3.5rem);letter-spacing:.005em;line-height:1.3;font-weight:700}
html[data-lang="zgh"] .h-l{font-size:clamp(1.5rem,3.2vw,2.4rem);letter-spacing:.005em;line-height:1.34;font-weight:700}
html[data-lang="zgh"] .h-m{letter-spacing:0;line-height:1.4;font-weight:700}
html[data-lang="zgh"] .kicker{text-transform:none;letter-spacing:0;font-size:.82rem}
/* L'italique n'existe pas en tifinagh : les <em> sont marqués par la couleur. */
html[data-lang="zgh"] .h-xl em,
html[data-lang="zgh"] .h-l em,
html[data-lang="zgh"] .h-m em{font-style:normal;color:var(--violet)}
html[data-lang="zgh"] .dark .h-xl em,
html[data-lang="zgh"] .dark .h-l em,
html[data-lang="zgh"] .dark .h-m em{color:var(--yellow)}
html[data-lang="zgh"] .ticker-t{animation-direction:normal}

/* 4. LOGO — icone unique (sans texte), commune aux trois langues. */

/* 6. Garde-fou leve le 25/08/2026 : l'arbre /zgh/ est complet (10 pages),
   l'entree amazighe du selecteur est donc ouverte au public. */

@media print{ .langsel{display:none} html[data-lang="zgh"] .zgh{display:inline} }
/* 5. SELECTEUR DE LANGUE - trois badges toujours visibles FR / AR / AMZ */
.langsel{display:inline-flex;align-items:center;position:relative}
.langsel-btn{display:none!important}
.langsel-menu{display:inline-flex;align-items:center;gap:5px;position:static;opacity:1;visibility:visible;transform:none;background:none;border:0;box-shadow:none;padding:0;margin:0;min-width:0;pointer-events:auto}
.langsel-menu a{display:inline-flex;align-items:center;justify-content:center;min-width:38px;padding:5px 6px;font-family:'Alexandria',Arial,sans-serif;font-size:11px;font-weight:500;line-height:1;letter-spacing:.06em;color:#5F5E5A;text-decoration:none;border:1px solid rgba(36,42,86,.18);border-radius:6px;background:transparent;transition:color .18s ease,border-color .18s ease,background-color .18s ease}
.langsel-menu a:hover{color:#8607F7;border-color:rgba(134,7,247,.45);background:rgba(134,7,247,.06)}
.langsel-menu a:focus-visible{outline:2px solid rgba(134,7,247,.55);outline-offset:2px}
.langsel-menu a[aria-current="true"]{background:#8607F7;border-color:#8607F7;color:#fff;cursor:default}
.langsel-menu a[aria-current="true"]:hover{background:#8607F7;border-color:#8607F7;color:#fff}
.dark .langsel-menu a,#hdr.scr .langsel-menu a{color:rgba(255,255,255,.72);border-color:rgba(255,255,255,.28)}
.dark .langsel-menu a:hover,#hdr.scr .langsel-menu a:hover{color:#fff;border-color:rgba(255,255,255,.6);background:rgba(255,255,255,.1)}
.dark .langsel-menu a[aria-current="true"],#hdr.scr .langsel-menu a[aria-current="true"]{background:#fff;border-color:#fff;color:#8607F7}
@media (max-width:640px){.langsel-menu{gap:4px}.langsel-menu a{min-width:32px;padding:4px 5px;font-size:10px;letter-spacing:.04em}}