/**  -----------------------------------------------------------------
	CUSTOM CSS MODERNE - SPORTPOURTOUS V3
	Logo SVG dans le headerbar
	VERSION AVEC POLICE AGRANDIE
-----------------------------------------------------------------  **/

/* Force l'application des variables CSS */
:root {
	--bg-primary: #0a0a0a !important;
	--bg-secondary: #1a1a1a !important;
	--bg-card: rgba(26, 26, 26, 0.8) !important;
	--bg-hover: rgba(74, 144, 226, 0.1) !important;
	--border-color: rgba(255, 255, 255, 0.1) !important;
	--text-primary: #ffffff !important;
	--text-secondary: #cccccc !important;
	--text-muted: #999999 !important;
	--accent-blue: #4a90e2 !important;
	--accent-blue-dark: #357abd !important;
}

/* BODY ET BACKGROUND - POLICE DE BASE AGRANDIE */
body {
	background: #0a0a0a !important;
	color: #ffffff !important;
	font-family: 'Segoe UI', 'Open Sans', Arial, sans-serif !important;
	font-size: 16px !important; /* AJOUTÉ - Taille de base agrandie */
}

html {
	background: #0a0a0a !important;
	font-size: 16px !important; /* AJOUTÉ */
}

/* WRAPPER */
#wrap,
.wrap {
	background: #0a0a0a !important;
	border: none !important;
}

/* PAGE BODY */
#page-body,
.page-body {
	background: transparent !important;
	max-width: 1200px !important;
	margin: 0 auto !important;
	padding: 15px !important;
	font-size: 16px !important; /* AJOUTÉ */
}

/* HEADER MODERNE */
#page-header {
	background: #1a1a1a !important;
	border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4) !important;
	position: sticky !important;
	top: 0 !important;
	z-index: 999 !important;
}

.headerbar {
	background: linear-gradient(to bottom, rgba(26, 26, 26, 0.95) 0%, rgba(13, 13, 13, 0.95) 100%) !important;
	backdrop-filter: blur(10px) !important;
	border-radius: 0 !important;
	margin-bottom: 0 !important;
	padding: 15px 20px !important;
	border: none !important;
	border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
}

.headerbar .inner {
	max-width: 1200px !important;
	margin: 0 auto !important;
	display: flex !important;
	align-items: center !important;
	justify-content: space-between !important;
	gap: 30px !important;
	flex-wrap: wrap !important;
}

/* LOGO SVG CUSTOM DANS LE HEADERBAR */
.custom-logo-svg {
	width: 60px !important;
	height: 60px !important;
	filter: drop-shadow(0 0 15px rgba(0, 212, 255, 0.6)) !important;
	transition: all 0.4s ease !important;
	display: block !important;
}

.custom-logo-svg:hover {
	filter: drop-shadow(0 0 25px rgba(0, 212, 255, 0.9)) !important;
	transform: scale(1.1) rotate(5deg) !important;
}

/* Animation subtile du logo */
@keyframes logoFloat {
	0%, 100% {
		transform: translateY(0px);
	}
	50% {
		transform: translateY(-3px);
	}
}

.custom-logo-svg {
	animation: logoFloat 3s ease-in-out infinite !important;
}

/* Cache l'ancien logo de fond */
.site_logo {
	background-image: none !important;
	background: transparent !important;
	width: auto !important;
	height: auto !important;
	display: none !important;
}

/* SITE DESCRIPTION */
#site-description {
	display: flex !important;
	align-items: center !important;
	gap: 20px !important;
	flex: 1 !important;
}

#site-description .logo {
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
}

#site-description h1 {
	color: #00D4FF !important;
	font-size: 26px !important; /* MODIFIÉ - Était 24px */
	font-weight: 700 !important;
	margin: 0 !important;
	text-shadow: 0 0 20px rgba(0, 212, 255, 0.6) !important;
	font-family: 'Impact', 'Arial Black', sans-serif !important;
	letter-spacing: 2px !important;
}

#site-description p {
	display: none !important;
}

/* BARRE DE RECHERCHE */
#search-box.search-header {
	background: rgba(255, 255, 255, 0.05) !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	border-radius: 8px !important;
	padding: 8px 15px !important;
	display: flex !important;
	align-items: center !important;
	gap: 8px !important; /* AJOUTÉ - Espace entre les éléments */
}

#search-box input[type="search"],
#search-box input.inputbox {
	background: transparent !important;
	border: none !important;
	color: #ffffff !important;
	outline: none !important;
	font-size: 15px !important; /* AJOUTÉ */
	flex: 1 !important; /* AJOUTÉ - Prend l'espace disponible */
}

/* BOUTONS DE RECHERCHE - MÊME TAILLE ET ESPACEMENT */
#search-box .button-search,
#search-box .button-search-end {
	width: 38px !important; /* AJOUTÉ - Largeur fixe identique */
	height: 38px !important; /* AJOUTÉ - Hauteur fixe identique */
	min-width: 38px !important;
	min-height: 38px !important;
	padding: 8px !important; /* AJOUTÉ - Padding uniforme */
	display: inline-flex !important; /* AJOUTÉ - Pour centrer l'icône */
	align-items: center !important;
	justify-content: center !important;
	margin: 0 !important; /* AJOUTÉ - Pas de marge */
	flex-shrink: 0 !important; /* AJOUTÉ - Ne rétrécit pas */
}

#search-box .button-search .icon,
#search-box .button-search-end .icon {
	font-size: 16px !important; /* AJOUTÉ - Taille icône uniforme */
	margin: 0 !important;
}

#search-box fieldset {
	display: flex !important; /* AJOUTÉ - Disposition flex */
	align-items: center !important;
	gap: 6px !important; /* AJOUTÉ - Petit espace entre les boutons */
	border: none !important;
	padding: 0 !important;
	margin: 0 !important;
}

/* NAVIGATION */
.navbar {
	background: rgba(26, 26, 26, 0.8) !important;
	border-radius: 0 !important;
	margin-bottom: 15px !important;
	padding: 0 !important;
	border: none !important;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.3) !important;
}

ul.linklist,
ul.navlinks {
	padding: 12px 20px !important;
	margin: 0 !important;
	display: flex !important;
	flex-wrap: wrap !important;
	gap: 5px !important;
	border-top: none !important;
}

ul.linklist a,
ul.navlinks a {
	color: #cccccc !important;
	text-decoration: none !important;
	padding: 8px 15px !important;
	border-radius: 6px !important;
	transition: all 0.3s ease !important;
	display: inline-block !important;
	font-size: 15px !important; /* AJOUTÉ */
}

ul.linklist a:hover,
ul.navlinks a:hover {
	background: rgba(74, 144, 226, 0.1) !important;
	color: #4a90e2 !important;
}

/* CARTES DE FORUM */
.forabg,
.forumbg {
	background: rgba(26, 26, 26, 0.8) !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	border-radius: 12px !important;
	margin-bottom: 20px !important;
	padding: 0 !important;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4) !important;
	overflow: hidden !important;
}

.forabg .inner,
.forumbg .inner {
	padding: 0 !important;
	background: transparent !important;
}

/* HEADERS DES FORUMS */
.forabg .header,
.forumbg .header {
	background: linear-gradient(135deg, #4a90e2 0%, #357abd 100%) !important;
	padding: 15px 20px !important;
	border-bottom: 1px solid rgba(255, 255, 255, 0.1) !important;
	border-radius: 0 !important;
}

.forabg .header a,
.forumbg .header a {
	color: white !important;
	font-size: 18px !important; /* MODIFIÉ - Était 16px */
	font-weight: 600 !important;
	text-decoration: none !important;
}

/* LISTES DE TOPICS */
ul.topiclist {
	margin: 0 !important;
	padding: 0 !important;
	list-style: none !important;
	background: transparent !important;
}

ul.topiclist li {
	margin-bottom: 2px !important;
	background: transparent !important;
	border: none !important;
}

ul.topiclist li:hover {
	background: rgba(255, 255, 255, 0.03) !important;
}

li.row {
	border-top: none !important;
	border-bottom: 1px solid rgba(255, 255, 255, 0.05) !important;
	padding: 15px 20px !important;
	background: transparent !important;
}

li.row:last-child {
	border-bottom: none !important;
}

li.header dt,
li.header dd {
	padding: 12px 15px !important;
	font-size: 13px !important; /* MODIFIÉ - Était 12px */
	font-weight: 600 !important;
	color: #999999 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.5px !important;
	background: rgba(0, 0, 0, 0.2) !important;
}

/* TITRES DE TOPICS - AGRANDI */
.topictitle {
	color: #ffffff !important;
	font-size: 17px !important; /* MODIFIÉ - Était 15px */
	font-weight: 500 !important;
	text-decoration: none !important;
}

.topictitle:hover {
	color: #4a90e2 !important;
}

/* INFORMATIONS DES TOPICS - AGRANDI */
.lastpost,
.topic-poster,
.posts,
.views {
	font-size: 14px !important; /* AJOUTÉ */
}

/* AUTEUR DES TOPICS */
.username,
.username-coloured {
	font-size: 15px !important; /* AJOUTÉ */
}

/* POSTS */
.post {
	background: rgba(26, 26, 26, 0.8) !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	border-radius: 12px !important;
	margin-bottom: 15px !important;
	padding: 0 !important;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4) !important;
}

.postbody {
	padding: 20px !important;
	background: transparent !important;
}

/* CONTENU DES POSTS - AGRANDI */
.content {
	color: #cccccc !important;
	line-height: 1.7 !important;
	font-size: 16px !important; /* AJOUTÉ */
}

/* DESCRIPTIONS DE FORUM - AGRANDI */
.forumdesc,
.forum-description {
	font-size: 14px !important; /* AJOUTÉ */
}

/* PANELS */
.panel {
	background: rgba(26, 26, 26, 0.8) !important;
	border: 1px solid rgba(255, 255, 255, 0.1) !important;
	border-radius: 12px !important;
	margin-bottom: 15px !important;
	padding: 20px !important;
	box-shadow: 0 4px 16px rgba(0, 0, 0, 0.4) !important;
}

/* BOUTONS */
.button,
input[type="submit"],
input[type="button"],
button {
	background: linear-gradient(135deg, #4a90e2 0%, #357abd 100%) !important;
	border: none !important;
	border-radius: 6px !important;
	color: white !important;
	padding: 8px 16px !important;
	font-weight: 500 !important;
	cursor: pointer !important;
	transition: all 0.3s ease !important;
	font-size: 15px !important; /* AJOUTÉ */
}

.button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
button:hover {
	transform: translateY(-2px) !important;
	box-shadow: 0 4px 12px rgba(74, 144, 226, 0.4) !important;
}

/* INPUTS */
input[type="text"],
input[type="password"],
input[type="email"],
textarea {
	background: rgba(255, 255, 255, 0.05) !important;
	border: 1px solid rgba(255, 255, 255, 0.2) !important;
	border-radius: 6px !important;
	color: #ffffff !important;
	padding: 10px !important;
	font-size: 15px !important; /* AJOUTÉ */
}

input:focus,
textarea:focus {
	border-color: #4a90e2 !important;
	outline: none !important;
	box-shadow: 0 0 0 3px rgba(74, 144, 226, 0.1) !important;
}

/* === NARROW LAYOUT (forum + mchat) =================================== */
:root { --content-width: 980px !important; }

#page-body,
.page-body {
  max-width: var(--content-width) !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.headerbar .inner,
.navbar .inner,
#page-footer .inner {
  max-width: var(--content-width) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

#mchat,
#mchat-input-panel,
#message-box,
.mchat-panel {
  max-width: var(--content-width) !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

#page-body *, #mchat * {
  box-sizing: border-box !important;
  max-width: 100% !important;
}

@media (min-width: 1600px) {
  :root { --content-width: 1080px !important; }
}

#wrap,
.wrap {
  max-width: var(--content-width) !important;
  width: 100% !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

/* === MCHAT INPUT FIX ==================== */
#mchat-input-panel textarea,
#mchat-input textarea,
#mchat-message,
#mchat-input-message,
#mchat-input #message-box textarea {
  height: 60px !important;
  min-height: 50px !important;
  max-height: 100px !important;
  background-color: #000 !important;
  color: #fff !important;
  border: 1px solid #333 !important;
  border-radius: 6px !important;
  padding: 6px 10px !important;
  resize: none !important;
  font-size: 15px !important; /* AJOUTÉ */
}

#mchat-input-panel textarea::placeholder,
#mchat-input textarea::placeholder {
  color: #aaa !important;
  opacity: 0.8;
}

#mchat-input-panel textarea:focus,
#mchat-input textarea:focus {
  outline: none !important;
  border-color: #666 !important;
  box-shadow: 0 0 4px #222 inset !important;
}

/* Responsive - Logo plus petit sur mobile */
@media (max-width: 768px) {
	.custom-logo-svg {
		width: 45px !important;
		height: 45px !important;
	}
	
	#site-description h1 {
		font-size: 22px !important; /* MODIFIÉ - Était 20px */
	}
	
	/* Police légèrement réduite sur mobile */
	body,
	html,
	#page-body {
		font-size: 15px !important;
	}
}

@media (max-width: 480px) {
	.custom-logo-svg {
		width: 40px !important;
		height: 40px !important;
	}
	
	#site-description h1 {
		font-size: 20px !important; /* MODIFIÉ - Était 18px */
	}
	
	/* Police encore plus réduite sur très petit mobile */
	body,
	html,
	#page-body {
		font-size: 14px !important;
	}
}

/* ===== FORCER L'ANIMATION DES GIFS ===== */

img[src*=".gif"],
img[src*="imgur.com"] {
    animation: none !important;
    image-rendering: auto !important;
    will-change: auto !important;
    transform: none !important;
    opacity: 1 !important;
    pointer-events: auto !important;
}

/* Forcer l'animation pour les images du programme */
.match-image-container img,
table img[src*=".gif"] {
    animation: none !important;
    image-rendering: auto !important;
}

/* ===== FIX CHAT FINAL - Hauteur réduite + Texte agrandi ===== */
/* ===== FIX CHAT FINAL - INTERLIGNE RÉDUIT ===== */

/* Réduire la HAUTEUR du chat */
#mchat,
.mchat-panel,
#mchat-container {
	height: 300px !important;
	max-height: 300px !important;
	min-height: 300px !important;
}

/* Zone des messages - POLICE AGRANDIE */
#mchat-messages,
.mchat-messages {
	padding: 6px !important;
	font-size: 15px !important; /* MODIFIÉ - Était 14px */
	line-height: 1.3 !important; /* MODIFIÉ - Était 1.1 pour plus d'espace */
}

/* Messages individuels - POLICE AGRANDIE */
#mchat .mchat-message,
.mchat-message,
#mchat-messages .mchat-message {
	padding: 4px 8px !important; /* MODIFIÉ - Plus d'espace */
	margin-bottom: 3px !important; /* MODIFIÉ - Plus d'espace entre messages */
	font-size: 15px !important; /* MODIFIÉ - Était 14px */
	line-height: 1.3 !important; /* MODIFIÉ */
}

/* Texte du message - INTERLIGNE AMÉLIORÉ */
#mchat .mchat-message .text,
.mchat-message .text,
#mchat-messages .text {
	line-height: 1.3 !important; /* MODIFIÉ */
	margin: 0 !important;
	padding: 0 !important;
	font-size: 15px !important; /* AJOUTÉ */
}

/* Nom d'utilisateur - AGRANDI */
#mchat .mchat-message .username,
.mchat-message .username,
#mchat .username,
#mchat-messages .username {
	font-size: 14px !important; /* MODIFIÉ - Était 13px */
	line-height: 1.3 !important;
	font-weight: 600 !important;
	margin-right: 5px !important;
}

/* Timestamp - LISIBLE */
#mchat .mchat-message .mchat-date,
.mchat-date,
#mchat-messages .mchat-date {
	font-size: 11px !important; /* MODIFIÉ - Était 10px */
	line-height: 1.3 !important;
}

/* Panel de saisie - COMPACT */
#mchat-input-panel,
.mchat-input-panel,
#message-box {
	padding: 6px !important;
}

/* Zone de texte - TAILLE MAINTENUE */
#mchat-input-panel textarea,
#mchat-input textarea,
#mchat-message,
#mchat-input-message,
#message-box textarea {
	height: 45px !important;
	min-height: 45px !important;
	max-height: 65px !important;
	font-size: 15px !important; /* MODIFIÉ - Était 13px */
	line-height: 1.3 !important;
	padding: 6px !important;
}

/* Boutons du chat - LISIBLES */
#mchat input[type="submit"],
#mchat button[type="submit"],
.mchat-submit {
	padding: 6px 14px !important; /* MODIFIÉ - Plus grand */
	font-size: 14px !important; /* MODIFIÉ - Était 12px */
}

/* Titre du chat - LISIBLE */
#mchat .mchat-header,
.mchat-header {
	padding: 8px 10px !important; /* MODIFIÉ */
	font-size: 15px !important; /* MODIFIÉ - Était 13px */
	line-height: 1.3 !important;
}

/* Ajuster l'interligne dans le chat */
#mchat p,
#mchat-messages p,
.mchat-message p {
	margin: 0 !important;
	padding: 0 !important;
	line-height: 1.3 !important; /* MODIFIÉ */
}

/* Forcer l'interligne partout dans le chat */
#mchat *,
#mchat-messages *,
.mchat-message * {
	line-height: 1.3 !important; /* MODIFIÉ */
}

/* ===== TEXTE GÉNÉRAL DU FORUM - AGRANDI ===== */

/* Statistiques et infos générales */
.gensmall,
.genmed {
	font-size: 14px !important; /* AJOUTÉ */
}

/* Pagination */
.pagination {
	font-size: 15px !important; /* AJOUTÉ */
}

/* Footer */
#page-footer {
	font-size: 14px !important; /* AJOUTÉ */
}