/* ===================================================
   ALL-TOKEN DARK THEME — CSS pour MyBB global.css
   Coller dans : Admin Panel > Thèmes > Modifier > global.css
   =================================================== */
@import url(https://fonts.googleapis.com/css2?family=Syne:wght@400;500;600;700&family=DM+Sans:opsz,wght@9..40,300;9..40,400;9..40,500&display=swap);
 
:root {
  --bg:     #0a0c0f;
  --bg2:    #0f1215;
  --bg3:    #141820;
  --bg4:    #1a2030;
  --border: rgba(255,255,255,0.07);
  --bh:     rgba(255,255,255,0.13);
  --gold:   #f0b429;
  --gold2:  #ffd166;
  --green:  #00d395;
  --red:    #ff4d4d;
  --blue:   #4f8ef7;
  --purple: #8b5cf6;
  --text:   #e8eaf0;
  --text2:  #8a8fa8;
  --text3:  #555c75;
  --fh:     'Syne', sans-serif;
  --fb:     'DM Sans', sans-serif;
}
 
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}
 
html, body {
  background: #0a0c0f !important;
  color: #e8eaf0 !important;
  font-family: 'DM Sans', sans-serif !important;
  font-size: 14px !important;
  line-height: 1.6 !important;
  min-height: 100vh;
}
 
a {
  color: #f0b429 !important;
  text-decoration: none !important;
  transition: color .15s;
}
a:hover { color: #ffd166 !important; }
 
/* ─────────────────────────────────────
   WRAPPER GLOBAL
───────────────────────────────────── */
#wrapper, .wrapper, #container {
  background: transparent !important;
  max-width: 1280px !important;
  margin: 0 auto !important;
  padding: 0 32px !important;
  width: 100% !important;
}
 
/* ─────────────────────────────────────
   HEADER
───────────────────────────────────── */
#header, .header {
  background: rgba(10,12,15,0.97) !important;
  border-bottom: 1px solid rgba(255,255,255,0.07) !important;
  position: sticky !important;
  top: 0 !important;
  z-index: 200 !important;
  padding: 0 !important;
  margin: 0 0 28px 0 !important;
  width: 100% !important;
  backdrop-filter: blur(20px) !important;
  left: 0 !important;
  max-width: 100% !important;
}
 
/* Logo */
#logo, .logo {
  display: inline-flex !important;
  align-items: center !important;
  padding: 13px 32px !important;
}
#logo img, .logo img {
  height: 38px !important;
  width: auto !important;
}
 
/* Nav bar */
.navigation_top, #nav, .nav, ul.menu, .menu {
  background: transparent !important;
  border: none !important;
  padding: 0 32px !important;
  display: flex !important;
  align-items: center !important;
  gap: 4px !important;
  height: 48px !important;
  border-top: 1px solid rgba(255,255,255,0.07) !important;
}
.navigation_top li, #nav li, ul.menu li {
  list-style: none !important;
  background: none !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
.navigation_top li a, #nav li a, ul.menu li a {
  color: #8a8fa8 !important;
  font-size: 13.5px !important;
  font-weight: 400 !important;
  padding: 6px 14px !important;
  border-radius: 8px !important;
  display: block !important;
  transition: color .15s, background .15s !important;
}
.navigation_top li a:hover, #nav li a:hover, ul.menu li a:hover {
  color: #e8eaf0 !important;
  background: #141820 !important;
}
.navigation_top li.selected a, ul.menu li.selected a {
  color: #e8eaf0 !important;
  background: #141820 !important;
  font-weight: 500 !important;
}
 
/* ─────────────────────────────────────
   BREADCRUMB / NAVIGATION
───────────────────────────────────── */
.navigation, #breadcrumb {
  background: transparent !important;
  border: none !important;
  padding: 10px 0 16px !important;
  font-size: 12.5px !important;
  color: #555c75 !important;
}
.navigation a, #breadcrumb a {
  color: #555c75 !important;
  font-size: 12.5px !important;
}
.navigation a:hover, #breadcrumb a:hover { color: #f0b429 !important; }
.navigation .separator, .navigation span { color: #555c75 !important; }
 
/* ─────────────────────────────────────
   TABLES MYBB (catégories, forums, threads)
───────────────────────────────────── */
.tborder {
  background: transparent !important;
  border: none !important;
  border-collapse: separate !important;
  border-spacing: 0 0 8px 0 !important;
  width: 100% !important;
  margin-bottom: 8px !important;
}
 
/* En-tête de catégorie */
.thead, .thead td, .thead th,
table .thead td, table .thead th {
  background: #141820 !important;
  color: #555c75 !important;
  font-family: 'Syne', sans-serif !important;
  font-size: 10.5px !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: .08em !important;
  padding: 10px 16px !important;
  border: none !important;
}
 
/* Titre de catégorie (gros titre de section) */
.tcat, .tcat td, .tcat th {
  background: #0f1215 !important;
  border: 1px solid rgba(255,255,255,0.07) !important;
  border-radius: 12px 12px 0 0 !important;
  padding: 16px 20px !important;
}
.tcat a, .tcat span, .tcat td a, .tcat th a {
  font-family: 'Syne', sans-serif !important;
  font-size: 14.5px !important;
  font-weight: 600 !important;
  color: #e8eaf0 !important;
  letter-spacing: -.01em !important;
}
.tcat a:hover { color: #f0b429 !important; }
 
/* Lignes de forum */
.trow1, .trow2 {
  background: #0f1215 !important;
  transition: background .15s !important;
}
.trow1:hover, .trow2:hover {
  background: #141820 !important;
}
.trow1 td, .trow2 td {
  border-bottom: 1px solid rgba(255,255,255,0.04) !important;
  border-left: none !important;
  border-right: none !important;
  border-top: none !important;
  padding: 14px 16px !important;
  color: #e8eaf0 !important;
  font-family: 'DM Sans', sans-serif !important;
  font-size: 13px !important;
  vertical-align: middle !important;
}
 
/* Ligne surlignée */
.trow_shaded, .trow_shaded td {
  background: #141820 !important;
}
 
/* Pied de tableau */
.tfoot, .tfoot td, .tfoot th {
  background: #141820 !important;
  border: none !important;
  border-radius: 0 0 12px 12px !important;
  padding: 10px 16px !important;
  color: #555c75 !important;
  font-size: 12px !important;
  font-family: 'DM Sans', sans-serif !important;
}
 
/* Encadrement forum (ligne de forum dans la liste) */
.forumdisplay_regular, .forumdisplay_locked, .forum_on, .forum_off {
  background: #0f1215 !important;
  border: 1px solid rgba(255,255,255,0.07) !important;
  border-radius: 12px !important;
  margin-bottom: 6px !important;
  transition: border-color .2s !important;
}
.forumdisplay_regular:hover, .forumdisplay_locked:hover {
  border-color: rgba(255,255,255,0.13) !important;
}
 
/* Noms de forums et sujets */
.forum_name a, .subject_new a, .subject_old a,
.threadlist .subject a, strong.subject_new a, strong.subject_old a {
  color: #e8eaf0 !important;
  font-weight: 500 !important;
  font-size: 13.5px !important;
  font-family: 'DM Sans', sans-serif !important;
}
.forum_name a:hover, .subject_new a:hover, .subject_old a:hover,
.threadlist .subject a:hover {
  color: #f0b429 !important;
}
 
/* Description forum */
.forum_description, .smalltext {
  color: #8a8fa8 !important;
  font-size: 12.5px !important;
  font-family: 'DM Sans', sans-serif !important;
  margin-top: 3px !important;
}
 
/* Stats (messages, sujets) */
.forumstats, .threadstats, .stats {
  color: #555c75 !important;
  font-size: 12px !important;
  font-variant-numeric: tabular-nums !important;
  text-align: center !important;
}
 
/* Dernier message */
.lastpost, .lastpost a {
  color: #555c75 !important;
  font-size: 12px !important;
}
.lastpost a:hover { color: #f0b429 !important; }
 
/* Icônes de forum (points colorés) */
.forum_icon, .thread_icon {
  opacity: .7 !important;
}
 
/* ─────────────────────────────────────
   WELCOME BLOCK (bloc d'accueil invité)
───────────────────────────────────── */
#panel, .panel, .welcomeblock {
  background: #0f1215 !important;
  border: 1px solid rgba(255,255,255,0.07) !important;
  border-radius: 14px !important;
  padding: 20px !important;
  margin-bottom: 20px !important;
  color: #8a8fa8 !important;
  font-size: 13px !important;
}
#panel h3, .welcomeblock h3 {
  font-family: 'Syne', sans-serif !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  color: #e8eaf0 !important;
  margin-bottom: 6px !important;
}
#panel h5, .welcomeblock h5 {
  font-size: 13px !important;
  font-weight: 400 !important;
  color: #8a8fa8 !important;
  margin-bottom: 12px !important;
}
 
/* ─────────────────────────────────────
   FORMULAIRE DE LOGIN (sidebar)
───────────────────────────────────── */
.loginbox, #loginbox, .login_panel {
  background: #0f1215 !important;
  border: 1px solid rgba(255,255,255,0.07) !important;
  border-radius: 14px !important;
  padding: 18px 20px !important;
}
.loginbox table, #loginbox table { background: transparent !important; border: none !important; }
.loginbox td, #loginbox td { background: transparent !important; border: none !important; padding: 6px 0 !important; }
.loginbox input[type=text], .loginbox input[type=password],
#loginbox input[type=text], #loginbox input[type=password] {
  background: #141820 !important;
  border: 1px solid rgba(255,255,255,0.07) !important;
  border-radius: 9px !important;
  color: #e8eaf0 !important;
  font-family: 'DM Sans', sans-serif !important;
  font-size: 13px !important;
  padding: 8px 12px !important;
  width: 100% !important;
  outline: none !important;
}
.loginbox input:focus, #loginbox input:focus {
  border-color: #f0b429 !important;
}
 
/* ─────────────────────────────────────
   BOUTONS
───────────────────────────────────── */
input[type=submit], input[type=button],
.button, button, .submit_button {
  background: #f0b429 !important;
  color: #0a0c0f !important;
  border: none !important;
  border-radius: 9px !important;
  padding: 8px 20px !important;
  font-family: 'DM Sans', sans-serif !important;
  font-size: 13px !important;
  font-weight: 600 !important;
  cursor: pointer !important;
  transition: background .15s, transform .15s !important;
}
input[type=submit]:hover, .button:hover, button:hover {
  background: #ffd166 !important;
  transform: translateY(-1px) !important;
}
 
/* ─────────────────────────────────────
   FORMULAIRES GÉNÉRAUX
───────────────────────────────────── */
input[type=text], input[type=email], input[type=password],
input[type=search], textarea, select {
  background: #141820 !important;
  border: 1px solid rgba(255,255,255,0.07) !important;
  border-radius: 9px !important;
  color: #e8eaf0 !important;
  font-family: 'DM Sans', sans-serif !important;
  font-size: 13px !important;
  padding: 8px 12px !important;
  outline: none !important;
  transition: border-color .15s !important;
}
input:focus, textarea:focus, select:focus {
  border-color: #f0b429 !important;
}
input::placeholder, textarea::placeholder { color: #555c75 !important; }
label { color: #8a8fa8 !important; font-size: 13px !important; }
 
/* ─────────────────────────────────────
   POSTS / MESSAGES
───────────────────────────────────── */
.post, .postbit, .postbit_classic {
  background: #0f1215 !important;
  border: 1px solid rgba(255,255,255,0.07) !important;
  border-radius: 12px !important;
  margin-bottom: 12px !important;
  overflow: hidden !important;
}
.post_head, .postbit .thead, .postbit_classic .thead {
  background: #141820 !important;
  border-bottom: 1px solid rgba(255,255,255,0.07) !important;
  padding: 10px 16px !important;
  font-size: 12px !important;
  color: #555c75 !important;
}
.post_author, .postbit .author {
  font-weight: 600 !important;
  color: #f0b429 !important;
}
.post_body, .postbit .post_content {
  padding: 16px !important;
  color: #e8eaf0 !important;
  font-family: 'DM Sans', sans-serif !important;
  font-size: 14px !important;
  line-height: 1.75 !important;
  background: transparent !important;
  border: none !important;
}
.postbit_author, .post_author_info {
  background: #141820 !important;
  border-right: 1px solid rgba(255,255,255,0.07) !important;
  padding: 16px !important;
  color: #8a8fa8 !important;
  font-size: 12.5px !important;
}
 
/* Réponse rapide */
#quickreply, .quick_reply_main, #quick-reply-table {
  background: #0f1215 !important;
  border: 1px solid rgba(255,255,255,0.07) !important;
  border-radius: 12px !important;
  padding: 16px !important;
  margin-top: 16px !important;
}
#quickreply textarea {
  width: 100% !important;
  min-height: 100px !important;
}
 
/* ─────────────────────────────────────
   PAGINATION
───────────────────────────────────── */
.pagination, .pages {
  display: flex !important;
  gap: 4px !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  padding: 8px 0 !important;
}
.pagination a, .pagination span, .pages a, .pages span {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  min-width: 32px !important;
  height: 32px !important;
  padding: 0 8px !important;
  background: #141820 !important;
  border: 1px solid rgba(255,255,255,0.07) !important;
  border-radius: 8px !important;
  font-size: 13px !important;
  color: #8a8fa8 !important;
  transition: all .15s !important;
}
.pagination a:hover, .pages a:hover {
  background: #1a2030 !important;
  color: #e8eaf0 !important;
  border-color: rgba(255,255,255,0.13) !important;
}
.pagination .active_page, .pagination .pagination_current,
.pages .active_page {
  background: #f0b429 !important;
  color: #0a0c0f !important;
  border-color: #f0b429 !important;
  font-weight: 600 !important;
}
 
/* ─────────────────────────────────────
   ALERTES
───────────────────────────────────── */
.error, .red_alert, .error_message {
  background: rgba(255,77,77,.1) !important;
  border: 1px solid rgba(255,77,77,.25) !important;
  border-radius: 10px !important;
  color: #ff4d4d !important;
  padding: 12px 16px !important;
  margin: 8px 0 !important;
}
.success, .success_alert {
  background: rgba(0,211,149,.1) !important;
  border: 1px solid rgba(0,211,149,.25) !important;
  border-radius: 10px !important;
  color: #00d395 !important;
  padding: 12px 16px !important;
  margin: 8px 0 !important;
}
 
/* ─────────────────────────────────────
   STATISTIQUES DU FORUM (bas de page)
───────────────────────────────────── */
#stats, .forum_stats, .board_stats {
  background: #0f1215 !important;
  border: 1px solid rgba(255,255,255,0.07) !important;
  border-radius: 14px !important;
  padding: 16px 20px !important;
  margin-top: 20px !important;
  color: #555c75 !important;
  font-size: 12.5px !important;
}
#stats a, .forum_stats a { color: #8a8fa8 !important; }
#stats a:hover, .forum_stats a:hover { color: #f0b429 !important; }
 
/* ─────────────────────────────────────
   FOOTER
───────────────────────────────────── */
#footer, .footer {
  background: #0f1215 !important;
  border-top: 1px solid rgba(255,255,255,0.07) !important;
  padding: 20px 32px !important;
  margin-top: 40px !important;
  color: #555c75 !important;
  font-size: 12px !important;
  text-align: center !important;
}
#footer a, .footer a {
  color: #555c75 !important;
  font-size: 12px !important;
}
#footer a:hover, .footer a:hover { color: #f0b429 !important; }
 
/* ─────────────────────────────────────
   SCROLLBAR
───────────────────────────────────── */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: #0a0c0f; }
::-webkit-scrollbar-thumb { background: #1a2030; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #555c75; }
 
/* ─────────────────────────────────────
   SÉLECTION DE TEXTE
───────────────────────────────────── */
::selection { background: rgba(240,180,41,.25); color: #e8eaf0; }
 
/* ─────────────────────────────────────
   RESPONSIVE
───────────────────────────────────── */
@media (max-width: 900px) {
  #wrapper, .wrapper, #container { padding: 0 16px !important; }
  #footer { padding: 16px !important; }
  .navigation_top, #nav, ul.menu { padding: 0 8px !important; height: auto !important; flex-wrap: wrap !important; }
}
 