/* ==========================================================================
   EN-TÊTE DU SITE DANS LE FORUM (app/Views/partials/forum-header.php)
   --------------------------------------------------------------------------
   Reprise des règles d'en-tête de :
   - css/app.css  (visiteur : .td-forum--guest)
   - css/game.css (joueur connecté : .td-forum--game)
   À tenir à jour en même temps que ces deux fichiers.

   Pourquoi une copie isolée :
   - app.css / game.css redéfinissent html, body, a, ul… et casseraient le forum ;
   - le forum fixe html à 10 px : les « rem » du site y seraient trop petits.
     Chaque taille est donc exprimée en multiple de --r, qui reproduit exactement
     la valeur de 1 rem sur le site (même échelle fluide, mêmes points de rupture).
   ========================================================================== */

/* ---------- Unité --r : 1 rem du site ---------- */
.td-forum--guest{--r:max(10px, min(calc(100vw / 104.5), calc(100vh / 58.8)))}
@supports (height:100dvh){
  .td-forum--guest{--r:max(10px, min(calc(100vw / 104.5), calc(100dvh / 58.8)))}
}
@media (max-width:1100px){ .td-forum--guest{--r:16px} }

.td-forum--game{--r:15px}
@media (min-width:1280px){ .td-forum--game{--r:clamp(12px, calc(100vw / 104.5), 24px)} }
@media (max-width:759px){ .td-forum--game{--r:15px} }

/* ---------- Remise à zéro locale (les styles du forum ne s'appliquent pas ici) ---------- */
.td-forum{
  --text-soft:#cfe3ff;
  --blue-400:#3aa0ff;
  --blue-line:#2f7fd6;
  position:relative;z-index:200;
  color:#fff;
  font-family:"Noto Sans","Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif;
  font-size:var(--r);font-weight:400;line-height:1.4;text-align:left;
}
.td-forum *,.td-forum *::before,.td-forum *::after{box-sizing:border-box}
.td-forum a,.td-forum a:hover,.td-forum a:focus{color:inherit;text-decoration:none}
.td-forum ul{list-style:none;margin:0;padding:0}
.td-forum li{margin:0;padding:0}
.td-forum img{display:block;max-width:100%}
.td-forum button{font:inherit;color:inherit;text-transform:none;letter-spacing:normal;box-shadow:none}
.td-forum form{margin:0}
.td-forum .svg-sprite{position:absolute;width:0;height:0;overflow:hidden}
.td-forum .icon{display:inline-block;width:1em;height:1em;flex:none;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}

/* ==========================================================================
   VISITEUR (repris de css/app.css – HEADER)
   ========================================================================== */
.td-forum--guest .site-header{
  position:relative;z-index:5;
  height:calc(5.94 * var(--r));
  background:linear-gradient(180deg,#0a2250 0%,#081a3f 100%);
  border-bottom:1px solid rgba(70,150,235,.35);
  box-shadow:0 calc(.2 * var(--r)) calc(1.2 * var(--r)) rgba(0,0,0,.45);
}
.td-forum--guest .container{width:100%;max-width:calc(104.5 * var(--r));margin-inline:auto;position:relative}
.td-forum--guest .header__inner{display:flex;align-items:center;height:100%;padding:0 calc(1.8 * var(--r)) 0 calc(3 * var(--r))}

.td-forum--guest .logo{display:flex;align-items:center;gap:calc(1.1 * var(--r));flex:none}
.td-forum--guest .logo__icon{max-height:100%}

.td-forum--guest .main-nav{flex:1;margin-left:calc(5.6 * var(--r))}
.td-forum--guest .main-nav ul{display:flex;align-items:center;gap:calc(.25 * var(--r))}
.td-forum--guest .main-nav a{
  display:flex;align-items:center;gap:calc(.6 * var(--r));
  height:calc(3.8 * var(--r));padding:0 calc(1.65 * var(--r));
  border:1px solid transparent;border-radius:calc(.4 * var(--r));
  font-size:calc(1.1 * var(--r));font-weight:600;white-space:nowrap;
  transition:background .2s,border-color .2s,box-shadow .2s;
  position:relative;
}
.td-forum--guest .main-nav a .icon{width:calc(1.75 * var(--r));height:calc(1.75 * var(--r));color:var(--blue-400)}
.td-forum--guest .main-nav a:hover{background:rgba(40,120,220,.22)}

.td-forum--guest .auth{display:flex;align-items:center;gap:calc(1.35 * var(--r));flex:none}
.td-forum--guest .btn-sm{
  display:inline-flex;align-items:center;justify-content:center;
  height:calc(3.44 * var(--r));padding:0 calc(1.65 * var(--r));
  border-radius:calc(.5 * var(--r));
  font-size:calc(1.15 * var(--r));font-weight:600;white-space:nowrap;
  transition:filter .2s,background .2s,box-shadow .2s;
}
.td-forum--guest .btn-sm--outline{border:1.5px solid var(--blue-line);background:rgba(10,40,95,.55);min-width:calc(9.9 * var(--r))}
.td-forum--guest .btn-sm--outline:hover{background:rgba(30,100,200,.45)}
.td-forum--guest .btn-sm--solid{
  background:linear-gradient(180deg,#2e9bff,#0b6fdc);
  border:1.5px solid #3aa0ff;font-weight:500;min-width:calc(8.05 * var(--r));
  box-shadow:0 0 calc(1.1 * var(--r)) rgba(30,140,255,.5),inset 0 1px 0 rgba(255,255,255,.3);
  color:#041227;
}
.td-forum--guest .btn-sm--solid,.td-forum--guest .btn-sm--solid:hover{color:#041227}
.td-forum--guest .btn-sm--solid:hover{filter:brightness(1.12)}

@media (max-width:1100px){
  .td-forum--guest .site-header{height:auto}
  .td-forum--guest .header__inner{flex-wrap:wrap;gap:calc(.9 * var(--r)) var(--r);padding:calc(.9 * var(--r)) calc(1.1 * var(--r))}
  .td-forum--guest .auth{margin-left:auto;gap:calc(.6 * var(--r))}
  .td-forum--guest .btn-sm{height:calc(2.6 * var(--r));padding:0 var(--r);font-size:var(--r);min-width:0}
  .td-forum--guest .main-nav{order:3;flex:0 0 100%;margin:0;overflow-x:auto;-webkit-overflow-scrolling:touch}
  .td-forum--guest .main-nav ul{width:max-content}
  .td-forum--guest .main-nav a{height:calc(3 * var(--r));padding:0 calc(1.1 * var(--r));font-size:var(--r)}
  .td-forum--guest .main-nav a .icon{width:calc(1.4 * var(--r));height:calc(1.4 * var(--r))}
}

/* ==========================================================================
   JOUEUR CONNECTÉ (repris de css/game.css – EN-TÊTE)
   ========================================================================== */
.td-forum--game .site-header{
  position:relative;z-index:10;
  background:linear-gradient(180deg,#0b2556 0%,#071a3e 100%);
  border-bottom:1px solid rgba(70,150,235,.35);
  box-shadow:0 calc(.2 * var(--r)) calc(1.2 * var(--r)) rgba(0,0,0,.5);
}
.td-forum--game .header__inner{display:flex;align-items:stretch;max-width:calc(104.5 * var(--r));height:calc(4.9 * var(--r));margin-inline:auto;padding-left:calc(1.75 * var(--r))}

.td-forum--game .logo{display:flex;align-items:center;flex:none;padding-right:calc(1.5 * var(--r))}
.td-forum--game .logo__icon{height:calc(3.1 * var(--r));width:auto}

/* ---------- Menu principal ---------- */
.td-forum--game .main-nav{flex:1;min-width:0}
/* .menu est aussi une classe du forum (menus déroulants) : toutes ses propriétés sont redéfinies */
.td-forum--game .menu{
  display:flex;position:static;z-index:auto;height:100%;align-items:stretch;gap:calc(.05 * var(--r));
  width:auto!important;min-width:0;max-width:none!important;margin:0;padding:0;
  border:0;border-radius:0;background:none;box-shadow:none;color:inherit;
  opacity:1;visibility:visible;transform:none;transition:none;
}
.td-forum--game .menu > li{position:relative;display:flex}

.td-forum--game .m-top{
  display:flex;align-items:center;gap:calc(.4 * var(--r));height:100%;padding:0 calc(.55 * var(--r));margin:0;border:0;background:none;
  font-size:calc(.88 * var(--r));font-weight:600;line-height:1.4;white-space:nowrap;border-radius:0;
  cursor:pointer;transition:background .2s;
}
.td-forum--game .m-top .icon{width:calc(1.45 * var(--r));height:calc(1.45 * var(--r));color:#6db8ff}
.td-forum--game .m-caret{width:calc(.8 * var(--r));height:calc(.8 * var(--r));flex:none;fill:none;stroke:currentColor;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;opacity:.8;transition:transform .2s}
.td-forum--game .menu > li:hover > .m-top{background:rgba(40,120,220,.22)}
.td-forum--game .m-top:focus-visible,.td-forum--game .m-grp:focus-visible,.td-forum--game .m-sub a:focus-visible{outline:2px solid #8fd0ff;outline-offset:-2px}

/* sous-menus */
.td-forum--game .m-sub{display:none}
.td-forum--game .menu > li > .m-sub{
  position:absolute;top:100%;left:0;z-index:20;
  width:max-content;min-width:calc(15 * var(--r));max-width:min(calc(31 * var(--r)),92vw);padding:calc(.4 * var(--r)) 0;
  border:1px solid rgba(110,170,240,.45);border-top:0;border-radius:0 0 calc(.7 * var(--r)) calc(.7 * var(--r));
  background:linear-gradient(180deg,#10347a,#0a2552);box-shadow:0 calc(.8 * var(--r)) calc(1.6 * var(--r)) rgba(0,0,0,.5);
}
.td-forum--game .m-sub a,.td-forum--game .m-grp{
  display:flex;align-items:center;gap:calc(.65 * var(--r));width:100%;padding:calc(.5 * var(--r)) var(--r);margin:0;border:0;background:none;text-align:left;
  font-size:calc(.9 * var(--r));font-weight:500;line-height:1.25;color:#e6f0ff;cursor:pointer;transition:background .15s;
}
.td-forum--game .m-sub a:hover,.td-forum--game .m-grp:hover{background:rgba(60,150,255,.3);color:#fff}
.td-forum--game .m-ico{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;color:#6db8ff}
/* illustrations du menu (clé « image » de config/menu.php), comme game.css */
.td-forum--game .m-top .icon--img{width:calc(2.2 * var(--r));height:calc(2.2 * var(--r));flex:none;object-fit:contain}
.td-forum--game .m-ico--img{width:24px;height:24px;object-fit:contain}
.td-forum--game .m-ico--avatar{border-radius:50%;object-fit:cover}
.td-forum--game .m-grp .m-caret{margin-left:auto}
.td-forum--game .m-sub3{background:rgba(3,14,38,.4);padding:calc(.15 * var(--r)) 0 calc(.25 * var(--r))}
.td-forum--game .m-sub3 a{padding-left:calc(2.3 * var(--r));font-size:calc(.86 * var(--r))}

/* ouverture par clic / toucher / clavier (classe posée par js/app.js) */
.td-forum--game .m-group.is-open > .m-sub{display:block}
.td-forum--game .m-group.is-open > .m-top .m-caret,.td-forum--game .m-group.is-open > .m-grp .m-caret{transform:rotate(180deg)}

/* ouverture au survol (ordinateur) */
@media (min-width:1280px) and (hover:hover){
  .td-forum--game .menu > li:hover > .m-sub,.td-forum--game .menu > li:focus-within > .m-sub{display:block}
  .td-forum--game .m-group--l3:hover > .m-sub3,.td-forum--game .m-group--l3:focus-within > .m-sub3{display:block}
  .td-forum--game .menu > li:hover > .m-top .m-caret,.td-forum--game .m-group--l3:hover > .m-grp .m-caret{transform:rotate(180deg)}
  /* dégradé vertical au survol : s'achève sur la couleur du haut du sous-menu (#10347a) */
  /* + trait de 1 px à gauche (comme le cadre du sous-menu), en ombre interne pour ne pas décaler le contenu */
  .td-forum--game .menu > li.m-group:not(.is-active):hover > .m-top{background:linear-gradient(180deg,rgba(70,160,255,.08) 0%,rgba(45,130,235,.38) 55%,#10347a 100%);box-shadow:inset 1px 0 0 rgba(110,170,240,.45)}
}

/* bouton burger (visible seulement sur tablette / mobile) */
.td-forum--game .burger{display:none;align-items:center;justify-content:center;width:calc(3.6 * var(--r));margin:0;padding:0;border:0;border-left:1px solid rgba(100,170,240,.28);background:none;cursor:pointer;color:#fff}
.td-forum--game .burger .bars,.td-forum--game .burger .bars::before,.td-forum--game .burger .bars::after{display:block;width:calc(1.4 * var(--r));height:2px;border-radius:2px;background:currentColor;transition:transform .2s,top .2s,background .2s}
.td-forum--game .burger .bars{position:relative}
.td-forum--game .burger .bars::before,.td-forum--game .burger .bars::after{content:"";position:absolute;left:0}
.td-forum--game .burger .bars::before{top:calc(-.42 * var(--r))}
.td-forum--game .burger .bars::after{top:calc(.42 * var(--r))}
.td-forum--game .burger[aria-expanded="true"] .bars{background:transparent}
.td-forum--game .burger[aria-expanded="true"] .bars::before{top:0;transform:rotate(45deg)}
.td-forum--game .burger[aria-expanded="true"] .bars::after{top:0;transform:rotate(-45deg)}
.td-forum--game .burger:focus-visible{outline:2px solid #8fd0ff;outline-offset:-3px}

/* ---------- Bloc latéral : profil, enquête en cours, messagerie ---------- */
.td-forum--game .hd-side{display:flex;align-items:stretch;flex:none}
.td-forum--game .hd-side > *{border-left:1px solid rgba(100,170,240,.28)}
.td-forum--game .hd-user{position:relative;display:flex;margin-left:calc(.3 * var(--r))}
.td-forum--game .hd-user__toggle{display:flex;align-items:center;gap:calc(.7 * var(--r));padding:0 calc(1.1 * var(--r)) 0 calc(.9 * var(--r));margin:0;border:0;background:none;cursor:pointer;text-align:left}
.td-forum--game .hd-user__toggle:hover{background:rgba(40,120,220,.18)}
.td-forum--game .hd-user__toggle:focus-visible{outline:2px solid #8fd0ff;outline-offset:-3px}
.td-forum--game .hd-user__avatar{width:calc(3.6 * var(--r));height:calc(3.6 * var(--r));flex:none;border-radius:50%;object-fit:cover;border:2px solid rgba(160,205,255,.8);background:#14336b;overflow:hidden}
.td-forum--game .hd-user b{display:block;font-size:calc(.95 * var(--r));font-weight:700;line-height:1.2;max-width:calc(10 * var(--r));overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.td-forum--game .lvl{display:inline-block;margin:calc(.2 * var(--r)) 0 0 auto;padding:calc(.05 * var(--r)) calc(.75 * var(--r));border-radius:calc(.8 * var(--r));background:#1b73d9;font-size:calc(.78 * var(--r));font-weight:700;line-height:1.4}
.td-forum--game .hd-user .who{display:flex;flex-direction:column;align-items:flex-start}
.td-forum--game .hd-user .who .lvl{align-self:flex-end}

.td-forum--game .hd-user__panel{
  display:none;position:absolute;top:100%;right:0;z-index:20;min-width:100%;width:max-content;padding:calc(.4 * var(--r)) 0;
  border:1px solid rgba(110,170,240,.45);border-top:0;border-radius:0 0 calc(.7 * var(--r)) calc(.7 * var(--r));
  background:linear-gradient(180deg,#10347a,#0a2552);box-shadow:0 calc(.8 * var(--r)) calc(1.6 * var(--r)) rgba(0,0,0,.5);
}
.td-forum--game .hd-user.is-open > .hd-user__panel{display:block}
@media (hover:hover){ .td-forum--game .hd-user:hover > .hd-user__panel,.td-forum--game .hd-user:focus-within > .hd-user__panel{display:block} }
.td-forum--game .hd-user__panel a,.td-forum--game .hd-user__panel button{
  display:flex;align-items:center;gap:calc(.65 * var(--r));width:100%;padding:calc(.5 * var(--r)) var(--r);margin:0;border:0;background:none;
  font-size:calc(.9 * var(--r));font-weight:500;line-height:1.4;color:#e6f0ff;cursor:pointer;text-align:left;
}
.td-forum--game .hd-user__panel a:hover,.td-forum--game .hd-user__panel button:hover{background:rgba(60,150,255,.3);color:#fff}

.td-forum--game .hd-case{display:flex;flex-direction:column;justify-content:center;padding:0 calc(1.2 * var(--r));min-width:calc(10 * var(--r))}
.td-forum--game .hd-case small{font-size:calc(.8 * var(--r));color:var(--text-soft);line-height:1.2}
.td-forum--game .hd-case b{font-size:calc(.95 * var(--r));font-weight:700;line-height:1.3}

/* Barre de progression (élément <progress>) */
.td-forum--game .bar{display:block;width:calc(8.1 * var(--r));max-width:100%;height:calc(.6 * var(--r));margin-top:calc(.45 * var(--r));border:0;border-radius:calc(.4 * var(--r));background:rgba(255,255,255,.22);overflow:hidden;-webkit-appearance:none;appearance:none;color:#57d977}
.td-forum--game .bar::-webkit-progress-bar{background:rgba(255,255,255,.22);border-radius:calc(.4 * var(--r))}
.td-forum--game .bar::-webkit-progress-value{background:linear-gradient(90deg,#2fbf57,#57d977);border-radius:calc(.4 * var(--r))}
.td-forum--game .bar::-moz-progress-bar{background:linear-gradient(90deg,#2fbf57,#57d977);border-radius:calc(.4 * var(--r))}

.td-forum--game .hd-mail,.td-forum--game .hd-mail:hover{position:relative;display:flex;align-items:center;justify-content:center;width:calc(4.6 * var(--r));color:#d6e8ff}
.td-forum--game .hd-mail:hover{background:rgba(40,120,220,.18)}
.td-forum--game .hd-mail .icon{width:calc(2.2 * var(--r));height:calc(2.2 * var(--r))}
.td-forum--game .hd-mail .dot{position:absolute;top:calc(.9 * var(--r));right:calc(.8 * var(--r));min-width:calc(1.35 * var(--r));height:calc(1.35 * var(--r));padding:0 calc(.3 * var(--r));border-radius:var(--r);background:#ee2e3c;color:#fff;font-size:calc(.75 * var(--r));font-weight:700;display:grid;place-items:center;border:1px solid rgba(255,255,255,.6)}

/* ---------- Tablette (< 1280 px) : menu replié derrière le burger ---------- */
@media (max-width:1279px){
  .td-forum--game .header__inner{flex-wrap:wrap;height:auto;padding:0}
  .td-forum--game .logo{order:1;padding:calc(.7 * var(--r)) var(--r)}
  .td-forum--game .logo__icon{height:calc(2.8 * var(--r))}
  .td-forum--game .hd-side{order:2;margin-left:auto}
  .td-forum--game .hd-user__toggle{padding:calc(.5 * var(--r)) var(--r)}
  .td-forum--game .hd-user__avatar{width:calc(3.2 * var(--r));height:calc(3.2 * var(--r))}
  .td-forum--game .hd-case{padding:0 var(--r);min-width:0}
  .td-forum--game .hd-mail{width:calc(4 * var(--r))}
  .td-forum--game .burger{display:flex;order:3}

  /* Panneau de navigation : fermé par défaut, ouvert par le burger (js/app.js) */
  .td-forum--game .main-nav{order:4;flex:0 0 100%;display:none;border-top:1px solid rgba(100,170,240,.25);background:rgba(4,16,40,.55)}
  .td-forum--game .site-header.nav-is-open .main-nav,.has-no-js .td-forum--game .main-nav{display:block}
  .td-forum--game .menu{flex-direction:column;height:auto;padding:calc(.4 * var(--r)) calc(.6 * var(--r)) calc(.8 * var(--r));gap:calc(.15 * var(--r))}
  .td-forum--game .menu > li{flex-direction:column}
  .td-forum--game .m-top{width:100%;min-height:calc(3 * var(--r));padding:0 calc(.8 * var(--r));border-radius:calc(.5 * var(--r));font-size:var(--r)}
  .td-forum--game .m-top .m-caret{margin-left:auto}
  .td-forum--game .menu > li > .m-sub{position:static;width:auto;min-width:0;max-width:none;margin:calc(.2 * var(--r)) 0 calc(.3 * var(--r));border:1px solid rgba(110,170,240,.3);border-radius:calc(.5 * var(--r));box-shadow:none}
  .td-forum--game .m-sub a,.td-forum--game .m-grp{min-height:calc(2.75 * var(--r));font-size:calc(.95 * var(--r))}
  .td-forum--game .m-sub3 a{font-size:calc(.92 * var(--r))}
  .has-no-js .td-forum--game .m-sub{display:block}

  .td-forum--game .hd-user__panel{right:auto;left:0}
}

/* ---------- Mobile (< 760 px) ---------- */
@media (max-width:759px){
  .td-forum--game .hd-side{order:2;flex:1 1 0;min-width:0;justify-content:flex-end}
  .td-forum--game .hd-case{display:none}
  .td-forum--game .hd-user{border-left:0;margin:0;min-width:0}
  .td-forum--game .hd-user__toggle{min-width:0;padding:calc(.5 * var(--r)) calc(.4 * var(--r)) calc(.5 * var(--r)) 0}
  .td-forum--game .hd-user .who{min-width:0}
  .td-forum--game .hd-user b{max-width:100%}
  .td-forum--game .hd-user__avatar{width:calc(2.8 * var(--r));height:calc(2.8 * var(--r))}
  .td-forum--game .logo{padding:calc(.6 * var(--r)) calc(.9 * var(--r))}
  .td-forum--game .logo__icon{height:calc(2.4 * var(--r))}
  .td-forum--game .hd-mail{width:calc(3.4 * var(--r));border-left:0}
  .td-forum--game .hd-mail .dot{right:calc(.5 * var(--r))}
  .td-forum--game .burger{width:calc(3.2 * var(--r))}
}