/* =====================================================
   CSS COMMUN – Présidence de la République du Niger
   Toutes les pages secondaires héritent de ce fichier
   ===================================================== */
*{margin:0;padding:0;box-sizing:border-box}
:root{
  --or:#C9A84C;--or-light:#E8D28A;--or-dark:#8B6914;
  --vert:#027901;--vert-fonce:#1C2B1E;--vert-foncee:#F7F6F1;
  --blanc:#FAFAF7;--texte:#1A1A18;--texte-2:#4A4A42;
  --bordure:#E0D8B8;
}
html{scroll-behavior:smooth}
body{font-family:'Barlow',sans-serif;background:var(--blanc);color:var(--texte);overflow-x:clip;padding-top:6px}

/* ── ANTI-FLASH ──────────────────────────────────────────────────
   Tant que theme.js n'a pas appliqué les données publiées (ou une
   version mise en cache), on masque la page en douceur : on ne
   voit donc jamais le texte par défaut avant qu'il ne soit remplacé.
   Filet de sécurité 100% CSS : si le script ne s'exécute pas, le
   contenu redevient visible tout seul après 1.2s. */
body:not(.theme-ready){opacity:0;animation:theme-fallback-reveal 0s 1.2s forwards}
@keyframes theme-fallback-reveal{to{opacity:1}}
body{transition:opacity .25s ease}
@media (prefers-reduced-motion:reduce){body{transition:none}}

/* ── GRANDS ÉCRANS ───────────────────────────────────────────────
   Le contenu était plafonné à 1900px de large : sur un très grand
   écran (4K, TV, vidéoprojecteur...) cela ne laissait que des marges
   vides, sans agrandir le rendu. On agrandit désormais tout
   (texte, images, espacements) de façon proportionnelle, jusqu'à
   environ 2x sur les très grands écrans. */
@media (min-width:1920px){html{zoom:1.15}}
@media (min-width:2400px){html{zoom:1.4}}
@media (min-width:3000px){html{zoom:1.7}}
@media (min-width:3800px){html{zoom:2}}

/* DRAPEAU */
.drapeau{display:flex;height:6px;position:fixed;top:0;left:0;right:0;width:100%;z-index:1000}
.drapeau span{flex:1}
.d-orange{background:#E76F1A}
.d-blanc{background:#FFF;border-top:1px solid #ddd;border-bottom:1px solid #ddd}
/* .d-vert{background:#128622} */
.d-vertT{background:#0a851a}

/* TOPBAR */
.topbar{background:#ffffff !important;padding:7px 40px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px;box-shadow:0 2px 6px rgba(0,0,0,.08);position:relative;z-index:1}
.topbar ul{display:flex;gap:24px;list-style:none}
.topbar a{color:var(--vert-fonce);font-size:11px;font-weight:500;letter-spacing:0.08em;text-decoration:none;text-transform:uppercase;transition:color .2s}
.topbar a:hover{color:var(--or-dark)}
.topbar-right{font-size:11px;color:#5A5A52;letter-spacing:.05em;display:flex;align-items:center;gap:18px}
.topbar-social{display:flex;gap:10px;align-items:center}
.topbar-social a{width:26px;height:26px;border-radius:50%;background:#FAFAF7;border:1px solid rgba(0,0,0,.06);display:flex;align-items:center;justify-content:center;box-shadow:0 3px 8px rgba(0,0,0,.18);transition:transform .2s,box-shadow .2s}
.topbar-social a svg{width:14px;height:14px}
.topbar-social a:hover{transform:translateY(-2px);box-shadow:0 5px 12px rgba(0,0,0,.25)}
#rs-facebook-top{color:#1877F2 !important}
#rs-twitter-top{color:#000 !important}
#rs-youtube-top{color:#FF0000 !important}
.lang-switch{display:flex;gap:4px}
.lang-btn{background:transparent;border:1px solid rgba(255,255,255,.18);color:#8a9a82;font-size:10px;font-weight:500;padding:3px 8px;cursor:pointer;letter-spacing:.05em;font-family:'Barlow',sans-serif;transition:all .15s}
.lang-btn.active,.lang-btn:hover{color:#1A1200;background:var(--or);border-color:var(--or)}

/* RECHERCHE GLOBALE */
.nav-inner{max-width:1900px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;flex-wrap:nowrap;gap:10px}

.nav-list{display:flex;list-style:none;flex-wrap:nowrap;flex-shrink:1;min-width:0}
.nav-list a{white-space:nowrap}

.nav-search{
  display:flex;
  align-items:center;
  background:rgba(255,255,255,.08);
  border:1px solid rgba(201,168,76,.3);
  border-radius:999px;
  padding:3px 4px 3px 14px;
  margin:10px 0;
  flex-shrink:0;
  transition:border-color .2s, background .2s, box-shadow .2s;
}
.nav-search:focus-within{
  border-color:var(--or);
  background:rgba(255,255,255,.12);
  box-shadow:0 0 0 3px rgba(201,168,76,.15);
}
.nav-search input{
  background:transparent;
  border:none;
  padding:7px 6px;
  font-size:12px;
  color:#FAFAF7;
  width:130px;
  font-family:'Barlow',sans-serif;
  letter-spacing:.01em;
}
.nav-search input::placeholder{color:#FAFAF7;opacity:.55}
.nav-search input:focus{outline:none}
.nav-search button{
  background:var(--or);
  border:none;
  color:#1A1200;
  width:28px;
  height:28px;
  border-radius:50%;
  cursor:pointer;
  font-size:12px;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  transition:background .2s, transform .15s;
}
.nav-search button:hover{background:var(--or-light);transform:scale(1.05)}
.nav-search button:active{transform:scale(.95)}

/* Réduit progressivement le menu ET la barre de recherche pour que tout tienne toujours sur une ligne */
@media (max-width:1500px) and (min-width:769px){
  .nav-list a{padding:14px 9px;font-size:11.5px}
  .nav-search input{width:100px}
}
@media (max-width:1300px) and (min-width:769px){
  .nav-list a{padding:14px 6px;font-size:11px}
  .nav-search input{width:80px}
}
@media (max-width:1150px) and (min-width:769px){
  .nav-list a{padding:12px 5px;font-size:10.5px}
  .nav-search{margin:6px 0}
  .nav-search input{width:60px}
}

/* HEADER */
header{background:#fff;padding:0;position:relative;overflow:hidden;border-bottom:1px solid rgba(201,168,76,.2)}
#site-logo{width:250px !important;height:72px !important}
header::after{content:'';position:absolute;bottom:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,var(--or),transparent)}
.header-inner{max-width:1900px;margin:0 auto;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:24px;min-height:78px}
.header-brand{display:flex;align-items:center;gap:10px;padding-left:0;justify-self:start}
.header-text .eyebrow{font-size:7px;letter-spacing:.14em;color:var(--or-dark);text-transform:uppercase;font-weight:500;margin-bottom:0;opacity:.85}
.header-text h1{font-family:'Cormorant Garamond',serif;font-size:14px;font-weight:600;color:#184a1c;line-height:1.05}
.header-text .devise{font-family:'Cormorant Garamond',serif;font-size:10px;font-weight:400;color:rgba(126,95,12,.91);margin-top:0;font-style:italic}
.header-motto{display:none;align-items:center;justify-content:center;justify-self:center;gap:14px;font-family:'Cormorant Garamond',serif;font-style:italic;font-size:21px;color:#184a1c;font-weight:500}
.header-motto i{color:var(--or-dark);font-style:normal;font-size:16px}
.header-actions{display:flex;align-items:center;gap:12px;flex-shrink:0;justify-self:end}
.header-search-btn{align-self:center;width:38px;height:38px;border-radius:50%;border:1px solid var(--bordure);background:#F5F2E8;color:var(--texte-2);display:flex;align-items:center;justify-content:center;cursor:pointer;transition:all .2s}
.header-search-btn:hover{border-color:var(--or);color:var(--vert-fonce)}
.header-write-btn{display:flex;align-items:center;background:var(--vert-fonce);color:#EDDBA0;padding:12px 28px;font-size:12.5px;font-weight:600;letter-spacing:.03em;text-decoration:none;white-space:nowrap;transition:background .2s}
.header-write-btn:hover{background:#12331d}
@media (min-width:1100px){.header-motto{display:flex}}
@media (max-width:640px){.header-write-btn{display:none}}

/* NAV — reste à sa place normale (sous le logo). En scrollant, se colle juste
   sous le drapeau (qui, lui, est fixe en permanence) une fois qu'on l'atteint. */
nav{background:#1A2720;padding:0 40px;border-top:1px solid rgba(201,168,76,.15);border-bottom:1px solid rgba(201,168,76,.15);position:sticky;top:6px;z-index:900;box-shadow:0 4px 14px rgba(0,0,0,.15)}
.nav-inner{max-width:1900px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;flex-wrap:nowrap;gap:12px}
.nav-list{display:flex;list-style:none;flex-wrap:wrap}.nav-list{display:flex;list-style:none;flex-wrap:nowrap;flex-shrink:1;min-width:0}.nav-list>li{position:relative}
.nav-list a{display:block;padding:14px 15px;color:var(--blanc);font-size:13px;font-weight:700;letter-spacing:.05em;text-decoration:none;text-transform:uppercase;transition:all .2s;border-bottom:2px solid transparent}
.nav-list a:hover,.nav-list a.active{color:var(--or-light);border-bottom-color:var(--or)}
.nav-list .caret{margin-left:4px;font-size:8px;opacity:.6;display:inline-block}
.dropdown-menu{display:none;position:absolute;top:100%;left:0;min-width:250px;background:#fff;border:1px solid var(--bordure);border-top:2px solid var(--or);box-shadow:0 14px 30px rgba(0,0,0,.18);z-index:1500;padding:6px 0;list-style:none}
.nav-list>li:hover .dropdown-menu{display:block}
.dropdown-menu li a{padding:11px 20px;font-size:11px;letter-spacing:.03em;color:var(--texte-2);text-transform:none;border-bottom:none;white-space:nowrap}
.dropdown-menu li a:hover{background:#F5F2E8;color:var(--or-dark)}
@media (max-width:1024px){
  .nav-search{margin:8px 0}
  .nav-search{flex-shrink:0}
}

/* MEGA-MENU — panneau élargi avec bloc "à la une" à côté de la liste */
.mega-panel{display:none;position:absolute;top:100%;left:0;min-width:420px;max-width:calc(100vw - 32px);align-items:stretch;gap:14px;background:#fff;border:1px solid var(--bordure);border-top:2px solid var(--or);box-shadow:0 14px 30px rgba(0,0,0,.18);z-index:1500;padding:10px}
/* Les derniers éléments du menu sont proches du bord droit de l'écran :
   on ouvre leur panneau vers la gauche pour qu'il reste entièrement visible
   (sinon le bloc "mega-feature" à côté de la liste sortait de l'écran). */
.nav-list>li:nth-last-child(-n+2) .mega-panel{left:auto;right:0}
.nav-list>li:hover .mega-panel{display:flex}
.mega-panel .dropdown-menu{display:block;position:static;background:transparent;border:none;box-shadow:none;padding:0;width:230px;flex:none}
.mega-feature{width:190px;flex-shrink:0;margin-left:0;padding:20px 18px;display:flex;flex-direction:column;gap:9px;background:linear-gradient(155deg,#F5F2E8,#EDE6CE);color:var(--vert-fonce);text-decoration:none;transition:background .2s;border:1px solid var(--bordure);white-space:normal}
.mega-feature:hover{background:linear-gradient(155deg,#EFE9D0,#E4DAB4)}
.mega-feature-visual{color:var(--or-dark)}
.mega-feature-tag{font-size:10px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:var(--or-dark)}
.mega-feature-title{font-family:'Cormorant Garamond',serif;font-size:16px;line-height:1.3;font-weight:600;color:#027901}

/* SÉLECTEUR DE LANGUE — menu déroulant (globe + FR/EN/AR/HA) */
.lang-select{position:relative}
.lang-select .lang-toggle{display:flex;align-items:center;gap:6px;background:none;border:none;color:#8a9a82;font-size:11px;font-weight:700;letter-spacing:.05em;padding:4px 2px;cursor:pointer;font-family:'Barlow',sans-serif}
.lang-select .lang-toggle:hover{color:var(--or-light)}
.lang-menu{position:absolute;top:calc(100% + 10px);right:0;background:#fff;color:#1A1A18;border-radius:2px;box-shadow:0 14px 32px rgba(8,31,23,.28);min-width:170px;padding:6px;opacity:0;visibility:hidden;transform:translateY(-6px);transition:all .16s ease;z-index:2000;border-top:3px solid var(--or);list-style:none}
.topbar .lang-menu,.lang-menu{display:block !important;flex-direction:column;gap:0}
.lang-select.open .lang-menu{opacity:1;visibility:visible;transform:translateY(0)}
.lang-menu li a{display:block;padding:9px 12px;border-radius:2px;font-size:13px;font-weight:600;color:#1A1A18;text-decoration:none}
.lang-menu li a:hover{background:#F5F2E8}
.lang-menu li a.active{color:var(--or-dark)}

/* SKELETON */
.skeleton{background:linear-gradient(90deg,#e8e3d0 25%,#f5f2e8 50%,#e8e3d0 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:4px;display:inline-block}
@keyframes shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}

/* TICKER — bandeau "Dernière minute" (présent sur toutes les pages) */
.ticker{display:flex;align-items:center;gap:18px;background:#F7F4EC;color:#2B281F;padding:0 24px;height:36px;overflow:hidden;border-bottom:1px solid #DFD6BC}
.ticker-label{display:flex;align-items:center;gap:7px;flex-shrink:0;font-size:10.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#96741C;border-right:1px solid #DFD6BC;padding-right:16px}
.ticker-label svg{color:#B08A24;animation:ticker-pulse 1.6s ease-in-out infinite}
@keyframes ticker-pulse{0%,100%{opacity:1}50%{opacity:.3}}
.ticker-track-wrap{flex:1;overflow:hidden}
.ticker-track{display:flex;gap:64px;white-space:nowrap;width:max-content;font-size:12.5px;font-weight:500;color:#2B281F;animation:tickerScroll var(--tk-dur,34s) linear infinite;will-change:transform}
.ticker-track.paused{animation-play-state:paused}
.ticker-toggle{flex-shrink:0;background:#E3D9BC;border:none;color:#2B281F;width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer}
@keyframes tickerScroll{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@media (max-width:640px){.ticker-label span{display:none}}

@media (max-width:1450px) and (min-width:769px){
  .nav-list a{padding:14px 10px;font-size:11.5px}
  .nav-search input{width:110px}
}
@media (max-width:1250px) and (min-width:769px){
  .nav-list a{padding:14px 7px;font-size:11px}
  .nav-search{margin:8px 0}
  .nav-search input{width:90px}
}

.mega-panel .mega-feature,
.mega-panel .mega-feature *{
  white-space:normal !important;
}
.mega-feature-title{
  overflow-wrap:break-word;
  word-break:break-word;
  min-width:0;
}

.topbar-social a{
    width:34px;
    height:34px;
    display:flex;
    align-items:center;
    justify-content:center;
    border-radius:50%;
    background:#fff;
    box-shadow:0 3px 8px rgba(0,0,0,.15);
    font-size:18px;
}

.fa-facebook-f{color:#1877F2;}
.fa-x-twitter{color:#000;}
.fa-youtube{color:#FF0000;}