/* ================================================================
   MOBILE - header responsive + menu burger + tous les breakpoints
   Ne pas mettre de styles desktop ici.
   Ne pas ajouter de @media dans les autres fichiers CSS.
================================================================ */

/* -- Burger ---------------------------------------------------- */
.nav-burger,
.nav-burger--inline {
  display: none;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  width: 38px;
  height: 38px;
  background: var(--bg-2);
  border: 1px solid var(--border-sub);
  border-radius: var(--radius-sm);
  cursor: pointer;
  padding: 6px;
  flex-shrink: 0;
  transition: border-color var(--t), background var(--t);
}
.nav-burger:hover {
  border-color: var(--accent);
  background: var(--accent-sub);
}
.nav-burger span {
  display: block;
  height: 2px;
  background: var(--accent);
  border-radius: 2px;
  transition: transform 0.25s ease, opacity 0.2s ease, background 0.2s;
}
.nav-burger.open span                  { background: var(--accent); }
.nav-burger.open span:nth-child(1)     { transform: translateY(7px) rotate(45deg); }
.nav-burger.open span:nth-child(2)     { opacity: 0; }
.nav-burger.open span:nth-child(3)     { transform: translateY(-7px) rotate(-45deg); }

/* -- Masquer nav desktop, afficher burger ---------------------- */
@media (max-width: 1024px) {
  .nav-menu       { display: none; }
  .nav-agenda-btn { display: none; }
  .nav-burger     { display: flex; }

  /* Header pleine largeur */
  .nav-inner              { padding: 0 12px; }
  .nav-logo               { flex: 1; gap: 4px; }
  .nav-right              { margin-left: auto; gap: 8px; }

  /* Logo centré absolument pour ne pas dépendre des éléments autour */
  .nav-logo-text          { position: absolute; left: 50%; transform: translateX(-50%); }
  .nav-inner              { position: relative; }

  /* Burger inline visible sur mobile */
  .nav-burger--inline     { display: flex; }

  /* Home btn même taille que le burger */
  .nav-home-btn           { width: 38px; height: 38px; font-size: 0.95rem; }

  /* Masquer uniquement les points et le bouton Staff (texte, prend trop de place) */
  .nav-points             { display: none; }
  .nav-admin-btn          { display: none; }

  /* Réduire la taille des icônes boutons */
  .nav-icon-btn           { width: 30px; height: 30px; font-size: 0.85rem; }

  /* Avatar toujours en dernier à droite */
  .nav-right              { flex-direction: row; }
  .nav-right .avatar-ring { order: 99; }
}

@media (max-width: 480px) {
  .nav-logo-text { display: none; }
  .nav-points    { display: none; }
}

/* -- Menu mobile (panneau) ------------------------------------- */
.mobile-menu {
  position: fixed;
  top: var(--header-h);
  left: 0;
  right: 0;
  background: rgba(10,10,10,0.98);
  border-bottom: 1px solid var(--border-sub);
  display: none;
  flex-direction: column;
  max-height: calc(100dvh - var(--header-h));
  overflow-y: auto;
  z-index: 499;
  scrollbar-width: thin;
  scrollbar-color: var(--accent) transparent;
}
.mobile-menu::-webkit-scrollbar       { width: 3px; }
.mobile-menu::-webkit-scrollbar-thumb { background: var(--accent); border-radius: 2px; }
.mobile-menu.open {
  display: flex;
  animation: mobileMenuIn 0.22s cubic-bezier(0.4,0,0.2,1);
}
@keyframes mobileMenuIn {
  from { opacity: 0; transform: translateY(-8px); }
  to   { opacity: 1; transform: translateY(0); }
}

/* -- Sections -------------------------------------------------- */
.mobile-section { border-bottom: 1px solid rgba(255,255,255,0.05); }
.mobile-section:last-child { border-bottom: none; }
.mobile-section-title {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.68rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 1px;
  color: var(--accent);
  padding: 12px 18px 6px;
  cursor: pointer;
  user-select: none;
}
.mobile-section-title::before {
  content: '';
  display: inline-block;
  width: 3px;
  height: 12px;
  background: var(--accent);
  border-radius: 2px;
  flex-shrink: 0;
}
/* Chevron accordéon */
.mobile-section-title .mobile-chevron {
  margin-left: auto;
  font-size: 0.6rem;
  opacity: 0.6;
  transition: transform 0.2s;
}
.mobile-section.open > .mobile-section-title .mobile-chevron {
  transform: rotate(180deg);
}

/* -- Liens : masqués par défaut, visibles quand section ouverte -- */
.mobile-section-body {
  overflow: hidden;
  max-height: 0;
  transition: max-height 0.25s ease;
}
.mobile-section.open > .mobile-section-body {
  max-height: 600px;
}

/* -- Liens ----------------------------------------------------- */
.mobile-menu a {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 11px 18px;
  font-size: 0.9rem;
  color: rgba(255,255,255,0.65);
  transition: color 0.15s, background 0.15s, padding-left 0.15s;
  border-left: 2px solid transparent;
}
.mobile-menu a:hover, .mobile-menu a:active {
  color: #fff;
  background: rgba(192,57,43,0.08);
  border-left-color: var(--accent);
  padding-left: 22px;
}
.mobile-menu a i {
  width: 16px;
  text-align: center;
  color: var(--accent);
  font-size: 0.8rem;
  flex-shrink: 0;
}

/* -- Liens directs (hors accordéon) ---------------------------- */
.mobile-direct-link {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 18px;
  font-size: 0.9rem;
  color: rgba(255,255,255,0.85);
  border-bottom: 1px solid rgba(255,255,255,0.05);
  transition: color 0.15s, background 0.15s, padding-left 0.15s;
  border-left: 2px solid var(--accent);
}
.mobile-direct-link:hover, .mobile-direct-link:active {
  color: #fff;
  background: rgba(192,57,43,0.1);
  padding-left: 22px;
}
.mobile-direct-link i {
  width: 16px;
  text-align: center;
  color: var(--accent);
  font-size: 0.8rem;
  flex-shrink: 0;
}

/* -- Sous-accordéon -------------------------------------------- */
.mobile-subsection { border-top: 1px solid rgba(255,255,255,0.04); }
.mobile-subsection-title {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 18px 10px 28px;
  font-size: 0.65rem;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.8px;
  color: rgba(192,57,43,0.85);
  cursor: pointer;
  user-select: none;
}
.mobile-subsection-title .mobile-chevron {
  margin-left: auto;
  font-size: 0.55rem;
  opacity: 0.6;
  transition: transform 0.2s;
}
.mobile-subsection.open > .mobile-subsection-title .mobile-chevron {
  transform: rotate(180deg);
}
.mobile-subsection-body {
  overflow: hidden;
  max-height: 0;
  transition: max-height 0.2s ease;
}
.mobile-subsection.open > .mobile-subsection-body {
  max-height: 400px;
}

/* -- Sous-liens ------------------------------------------------ */
.mobile-sub-link { padding-left: 34px !important; font-size: 0.84rem !important; color: rgba(255,255,255,0.5) !important; }
.mobile-sub-link:hover, .mobile-sub-link:active { padding-left: 38px !important; color: rgba(255,255,255,0.85) !important; }
.mobile-section-title--sub { font-size: 0.62rem; color: rgba(192,57,43,0.7); padding: 8px 18px 4px 34px; letter-spacing: 0.8px; cursor: default; }
.mobile-section-title--sub::before { display: none; }

/* -- Footer auth ----------------------------------------------- */
.mobile-menu-footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 14px 18px;
  gap: 10px;
  background: rgba(192,57,43,0.04);
  border-top: 1px solid rgba(192,57,43,0.15);
}
.mobile-menu-footer a {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 0.85rem;
  font-weight: 600;
  color: rgba(255,255,255,0.7);
  padding: 8px 14px;
  border-radius: var(--radius-sm);
  border: 1px solid var(--border-sub);
  background: var(--bg-2);
  transition: color var(--t), background var(--t), border-color var(--t);
  border-left: 2px solid transparent !important;
}
.mobile-menu-footer a:hover { color: #fff; border-color: var(--accent) !important; background: var(--accent-sub); }
.mobile-menu-footer a i { color: var(--accent); width: auto; }

/* ================================================================
   RESPONSIVE - breakpoints extraits des fichiers de pages
================================================================ */

/* base */
@media (max-width: 768px) { .grid-2,.grid-3{grid-template-columns:1fr} main,.page-content{padding:20px 14px} }

/* cards */
@media (max-width: 600px) { .cards-grid{grid-template-columns:1fr} .card{padding:16px} }

/* footer */
@media (max-width: 600px) { .footer-icons{justify-content:center} }

/* modal */
@media (max-width: 600px) { .modal{padding:20px;max-width:96%} }

/* auth */
@media (max-width: 480px) {
  .auth-card h2{margin:24px 20px 4px;font-size:1.4rem}
  .auth-subtitle{margin:0 20px 20px}
  .auth-card .form-group{margin:0 20px 14px}
  .auth-card .form-check{margin:0 20px 14px}
  .auth-card .btn-primary{width:calc(100% - 40px);margin:8px 20px 0}
  .auth-links{margin:16px 20px 24px}
  .alert{margin:0 20px 16px}
}

@media (min-width: 769px) and (max-width: 1024px) {
  .encadres-grid { grid-template-columns: repeat(2,1fr) }
  .home-row-top  { grid-template-columns: 1fr 1fr }
  .home-tournois-col .encadre-card--compact { max-height: none }
}
@media (max-width: 768px) {
  /* grille → colonne, ordre mobile : Agenda → Annonces → Tournois */
  .home-row-top {
    display: flex !important;
    flex-direction: column !important;
  }
  .home-block--agenda   { order: 1; max-height: none; width: 100% !important; min-width: 0; }
  .home-block--annonces { order: 2; width: 100% !important; min-width: 0; }
  .home-block--tournois { order: 3; width: 100% !important; min-width: 0; }
  .home-tournois-col    { width: 100% !important; min-width: 0; }
  .home-row-top > .encadre-card { max-height: none }
  .home-tournois-col .encadre-card--compact { max-height: none }
  .home-row-tables { display: flex !important; flex-direction: column !important; }
  .home-row-tables > .encadre-card { width: 100% !important; min-width: 0; }
  .home-connected  { padding: 20px 12px 60px }
  .home-welcome-identity { flex-direction: column; gap: 12px; text-align: center }
  .home-welcome-text     { text-align: center }
  .discord-widget        { display: none }
  .encadres-grid         { grid-template-columns: 1fr }
  .recruit-pillars       { grid-template-columns: 1fr }
  .recruit-announce-body { grid-template-columns: 1fr }
  .recruit-announce-sep  { display: none }
}

/* profil */
@media (max-width: 540px) {
  .pf-header{flex-wrap:wrap}
  .pf-header-actions{width:100%;border-top:1px solid #1a1a1a;padding-top:12px;margin-top:4px;flex-wrap:wrap}
  .tpl-class-grid,.pf-duo,.gear-stats-inputs{grid-template-columns:1fr}
  .pf-duo .pf-section--duo:first-child{border-right:none;padding-right:0}
  .pf-duo .pf-section--duo:last-child{padding-left:0}
}

/* membres */
@media (max-width: 600px) { .membrepage-grid{grid-template-columns:repeat(auto-fill,minmax(155px,1fr));gap:1rem} .mb-avatar{width:64px;height:64px} }

/* annonce */
@media (max-width: 600px) { .annonce-date{display:none} .agenda-modal{padding:1.4rem} }

/* donjon */
@media (max-width: 600px) { .cg-header-row{flex-direction:column;align-items:flex-start} .cg-sessions-grid{grid-template-columns:1fr} }

/* coaching */
@media (max-width: 900px) { .cpvp-hero-content{flex-direction:column;text-align:center;padding:28px 20px} .cpvp-hero-left{align-items:center} .cpvp-hero-coach{justify-content:center} .cpvp-intro-cards,.cpvp-notes-grid,.cpvp-axes-grid{grid-template-columns:1fr} .mu-grid{grid-template-columns:repeat(4,1fr)} }
@media (max-width: 700px) { .mu-page-grid{grid-template-columns:1fr} .mu-page-block--full{grid-column:auto} .mu-page-title-block{flex-direction:column;align-items:flex-start} }
@media (max-width: 600px) { .mu-grid{grid-template-columns:repeat(3,1fr)} .mu-tabs{flex-direction:column} }

/* gestionusers */
@media (max-width: 768px) {
  .gu-page { padding: 1rem 0.75rem 2rem; }

  /* Header */
  .gu-header { flex-direction: column; align-items: flex-start; gap: 0.75rem; }
  .gu-title  { font-size: 1.2rem; }
  .gu-stats  { gap: 0.4rem; }
  .gu-stat   { padding: 0.4rem 0.6rem; min-width: 48px; }
  .gu-stat-val { font-size: 1rem; }

  /* Toolbar : recherche pleine largeur, filtres scrollables */
  .gu-toolbar { flex-direction: column; align-items: stretch; gap: 0.6rem; }
  .gu-search-wrap { min-width: 0; }
  .gu-filter-btns { display: flex; flex-wrap: nowrap; overflow-x: auto; gap: 0.4rem; padding-bottom: 4px; }
  .gu-filter-btn  { flex-shrink: 0; font-size: 0.72rem; padding: 5px 10px; }

  /* Tableau → cartes */
  .gu-table-wrap { overflow: visible; }
  .gu-table, .gu-table tbody, .gu-table tr, .gu-table td { display: block; width: 100%; }
  .gu-table thead { display: none; }
  .gu-table tbody tr {
    background: #0f0f0f;
    border: 1px solid rgba(192,57,43,0.12);
    border-radius: 12px;
    margin-bottom: 0.75rem;
    padding: 0.75rem;
    display: flex;
    flex-wrap: wrap;
    gap: 0.5rem 1rem;
    align-items: center;
  }
  .gu-table td { padding: 0; border: none; width: auto; }
  /* Utilisateur : pleine largeur */
  .gu-table td:nth-child(1) { width: 100%; }
  /* Points et jetons : label avant la valeur */
  .gu-table td:nth-child(3)::before { content: 'Points : '; font-size: 0.68rem; color: #666; text-transform: uppercase; letter-spacing: 0.04em; }
  .gu-table td:nth-child(4)::before { content: 'Jetons : '; font-size: 0.68rem; color: #666; text-transform: uppercase; letter-spacing: 0.04em; }
  /* Discord, Email vérifié, En ligne : cacher — visible dans la modal */
  .gu-table td:nth-child(5),
  .gu-table td:nth-child(6),
  .gu-table td:nth-child(7) { display: none !important; }
  /* Bouton Gérer : poussé à droite */
  .gu-table td:nth-child(8) { margin-left: auto; }

  /* Modal plein écran */
  .gu-modal-overlay { align-items: flex-end; padding: 0; }
  .gu-modal {
    width: 100% !important;
    max-width: 100% !important;
    max-height: 92vh;
    border-radius: 18px 18px 0 0;
    overflow-y: auto;
  }

  /* Tabs : scrollables horizontalement */
  .gu-modal-tabs { flex-wrap: nowrap; overflow-x: auto; gap: 0; padding-bottom: 2px; }
  .gu-tab { flex-shrink: 0; font-size: 0.72rem; padding: 7px 10px; }
  .gu-tab i { display: none; }

  /* Économie : colonnes → lignes */
  .gu-economy-grid { grid-template-columns: 1fr; }
  .gu-eco-row { flex-direction: column; }
  .gu-eco-row .gu-input { width: 100%; }

  /* Reset grid : 1 colonne */
  .gu-reset-grid { grid-template-columns: 1fr; }

  /* Historique logs */
  .gu-log-row { flex-wrap: wrap; gap: 0.4rem; }
  .gu-log-date { margin-left: 0; font-size: 0.7rem; }
  .gu-history-filters { flex-wrap: nowrap; overflow-x: auto; padding-bottom: 4px; }
  .gu-hfilter { flex-shrink: 0; }

  /* Pagination */
  .gu-pagination { flex-wrap: wrap; justify-content: center; gap: 4px; }
}

/* inscription */
@media (max-width: 900px) { .atoraxion-group-grid,.blackshrine-group-grid{grid-template-columns:repeat(3,1fr)} }
@media (max-width: 540px) { .atoraxion-group-grid,.blackshrine-group-grid{grid-template-columns:repeat(2,1fr)} }

/* inscription_node */
@media (max-width: 900px) { .nw-role-blocks{grid-template-columns:1fr 1fr;grid-template-areas:"rl rl" "flank main" "ele-main ele-main" "ele-reserve ele-reserve" "def def"} }
@media (max-width: 640px) { .nw-role-blocks{grid-template-columns:1fr;grid-template-areas:"rl" "ele-reserve" "flank" "main" "ele-main" "def"} }

/* aosranked */
@media (max-width: 600px) { .ar-match-teams{grid-template-columns:1fr} .ar-match-live-frame{padding:20px} .ar-title{font-size:1.5rem} .ar-register-form,.ar-my-registration{max-width:100%} }
@media (max-width: 480px) { .ar-manage-grid{grid-template-columns:1fr} }

/* tournoi */
@media (max-width: 720px) { .aoa-podium{grid-template-columns:1fr} .aoa-hero-inner{flex-direction:column;align-items:flex-start} }
@media (max-width: 680px) { .paris-hero-inner{flex-direction:column;align-items:flex-start} .paris-solde-badge{align-items:flex-start} .paris-matchup{flex-direction:column;gap:14px} .paris-fighter--right{align-items:flex-start;text-align:left} .paris-admin-row{flex-direction:column} .paris-admin-group.paris-admin-cote{max-width:100%} }
@media (max-width: 640px) { .buildaoa-images-grid{grid-template-columns:1fr} }
@media (max-width: 600px) { .buildaoa-details-grid{grid-template-columns:1fr} .buildinhouse-mainrow{grid-template-columns:1fr} .buildinhouse-row{grid-template-columns:1fr} }
@media (max-width: 580px) { .paris-create-matchup{grid-template-columns:1fr} .paris-create-fighter:first-child{border-right:none;border-bottom:1px solid rgba(255,255,255,0.05)} .paris-create-fighter:last-child{border-left:none} .paris-create-vs{padding:10px;font-size:0.75rem} .paris-create-submit{justify-content:flex-start} }
@media (max-width: 560px) { .paris-duel{grid-template-columns:1fr} .paris-duel-fighter:first-child{border-right:none;border-bottom:1px solid rgba(255,255,255,0.05)} .paris-duel-fighter:last-child{border-left:none} .paris-duel-sep{flex-direction:row;padding:10px 16px;border-bottom:1px solid rgba(255,255,255,0.04)} .paris-bet-row{flex-direction:column;align-items:center} .paris-toast{white-space:normal;text-align:center} }