/* --------------------------------------------------------------------------------------- */
/* Style name:			promaterial                                                        */
/* Inherited from:		prosilver (the default phpBB 3.3.x style)                          */
/* Original author:		phpBB Limited ( https://www.phpbb.com/ )                           */
/* Modified by:			Mazeltof ( https://www.mazeland.fr/ )                              */
/* --------------------------------------------------------------------------------------- */

/**	 bidi.css  --------------------------------------------------  **/
/* Notification mark read link */
.rtl .dropdown-extended a.mark_read {
	border-radius: 0 3px 3px 0;
}
.rtl .search-box .inputbox {
	border-radius: 0 3px 3px 0;
}
.rtl .search-header .button-search-end {
	border-radius: 3px 0 0 3px;
}

/**  common.css  ------------------------------------------------  **/
/* General Markup Styles */
body {
	padding: 10px 0 16px 0;
	font-family: 'Libre Franklin', Trebuchet, Arial, sans-serif;
}
/* Main blocks */
.wrap {
	border-radius: 3px;
	padding: 10px;
}
.page-body {
	margin: 4px 0;
}
.site_logo {
	width: 290px;
	height: 50px;
}
/* Round cornered boxes and backgrounds */
.headerbar {
	border-radius: 3px;
	margin-bottom: 12px;
}
.navbar {
	border-radius: 3px;
	margin-bottom: 12px;
}
.forabg {
	border-radius: 3px;
	margin-bottom: 24px;
}
.forumbg {
	border-radius: 3px;
	margin-bottom: 12px;
}
.panel {
	border-radius: 3px;
	margin-bottom: 10px;
}
.post {
	border-radius: 3px;
}
.dropdown {
	border-radius: 3px;
}
.dropdown .dropdown-contents {
	border-radius: 3px;
}
.pagination li a, .pagination li span {
	border-radius: 3px;
}
.row .pagination li a, .row .pagination li span {
	border-radius: 3px;
}
.loading_indicator {
	border-radius: 3px;
}
div.rules {
	border-radius: 3px;
}
.dropdown-extended .header {
	border-radius: 3px 3px 0 0;
}
.badge {
	border-radius: 3px;
}
.post {
	margin-bottom: 12px;
}
/* General classes for placing floating blocks */
fieldset.fields1 ul.recipients  input.button2{
	padding: 2px 6px;
}
/* Action-bars */
.action-bar {
	margin: 10px 0;
}
.forabg + .action-bar {
	margin: 12px 0 6px 0;
}
.action-bar .button {
    margin-right: 6px;
}
.action-bar .button-search {
    margin-right: 0;
}
/* Pagination */
.pagination > ul > li {
    margin-right: 2px;
}
.pagination li.active span {
	font-weight: 600;
}
/* Miscellaneous styles */
.footer-row {
	font-size: 1.1em;
	line-height: 1.4em;
}
.headerspace {
	margin-top: 0;
}
p.post-notice {
	border-radius: 3px;
}

/**  content.css  -----------------------------------------------  **/
/* Post body styles */
.postbody img.postimage {
	border-radius: 3px;
}
/* Attachments */
.attach-image img {
	border-radius: 3px;
}
/* Show scrollbars for items with overflow on iOS devices */
.postbody .content::-webkit-scrollbar, .topicreview::-webkit-scrollbar, .post_details::-webkit-scrollbar, .codebox code::-webkit-scrollbar, .attachbox dd::-webkit-scrollbar, .attach-image::-webkit-scrollbar, .dropdown-extended ul::-webkit-scrollbar {
	border-radius: 3px;
}
.postbody .content::-webkit-scrollbar-thumb, .topicreview::-webkit-scrollbar-thumb, .post_details::-webkit-scrollbar-thumb, .codebox code::-webkit-scrollbar-thumb, .attachbox dd::-webkit-scrollbar-thumb, .attach-image::-webkit-scrollbar-thumb, .dropdown-extended ul::-webkit-scrollbar-thumb {
	border-radius: 3px;
}

/**  buttons.css  -----------------------------------------------  **/
/* Button Styles */
.button {
	border-radius: 3px;
}
/* Posting page styles */
.button-search,
.button-search-end  {
	border-radius: 0;
}
.button-search-end {
	border-radius: 0 3px 3px 0;
}
/* Post control buttons */
.post-buttons > li {
    margin-right: 6px;
}
.post-buttons .button, .format-buttons .button {
	margin-top: 4px;
}

/**  cp.css  ----------------------------------------------------  **/
/* CP tabs shared */
.tabs .tab > a {
	border-radius: 3px 3px 0 0;
}
.minitabs .tab > a {
	border-radius: 3px 3px 0 0;
}
.cp-mini {
	border-radius: 3px;
}
/* Friends list */
.cp-mini {
	margin: 12px 15px 15px 12px;
}
/* Responsive *CP navigation */
@media only screen and (max-width: 900px), only screen and (max-device-width: 900px) {
	.navigation li:first-child a {
		border-top-left-radius: 3px;
		border-top-right-radius: 3px;
	}
	.navigation li:last-child a {
		border-bottom-left-radius: 3px;
		border-bottom-right-radius: 3px;
	}
}

/**  forms.css  -------------------------------------------------  **/
/* Definition list layout for forms */
fieldset.fields1 div {
	margin-bottom: 6px;
}
/* Quick-login on index page */
fieldset.quick-login {
	margin-top: 0;
}
/* Posting page styles */
/* Buttons used in the editor */
.format-buttons {
	margin: 11px 0 2px 0;
}
/* Form button styles */
input.button1, input.button2 {
	font-size: 13px;
}
a.button1, input.button1, input.button3, a.button2, input.button2 {
	display: inline-block;
	padding: 2px 8px;
	font-size: 13px;
	font-weight: 600;
	font-family: "Libre Franklin", Verdana, Arial, Helvetica;
	line-height: 1.4;
	text-align: center;
	white-space: nowrap;
	vertical-align: middle;
	-ms-touch-action: manipulation;
	    touch-action: manipulation;
	cursor: pointer;
	-webkit-user-select: none;
	   -moz-user-select: none;
	    -ms-user-select: none;
	        user-select: none;
	border: 1px solid transparent;
	border-radius: 3px;
}
a.button1, input.button1 {
	font-weight: bold;
	border: 1px solid transparent;
}
input.button3 {
	padding: 0;
	margin: 0;
	line-height: 5px;
	height: 12px;
	background-image: none;
	font-variant: small-caps;
}
input[type="button"], input[type="submit"], input[type="reset"], input[type="checkbox"], input[type="radio"] {
	cursor: pointer;
}
/* Topic and forum Search */
.search-box .inputbox {
	border-radius: 3px 0 0 3px;
}
/* Search box (header) */
.search-header {
	border-radius: 3px;
	margin-right: 10px;
}

/**  links.css  -------------------------------------------------  **/
/* Notification mark read link */
.dropdown-extended a.mark_read {
	border-radius: 3px 0 0 3px;
}

/**  colours.css  -----------------------------------------------  **/
/* Colours and backgrounds for common.css */
html, body {
	background-attachment: fixed;
	background-position: top center;
	background-repeat: no-repeat;
	background-size: cover;
}
/* Round cornered boxes and backgrounds */
.wrap {
	box-shadow: 3px 3px 0px 1px rgba(0, 0, 0, 0);
	-webkit-box-shadow: 3px 3px 0px 1px rgba(0, 0, 0, 0);
}
.headerbar, .forabg, .forumbg {

}




/* =========================================================================
   MISE EN PAGE DU HEADERBAR (Logo | Nav | Search)
   ========================================================================= */

/* 1. Conteneur principal : active Flexbox */
.headerbar .inner {
    display: flex;
    align-items: center; /* Alignement vertical au centre */
    justify-content: space-between; /* Espace équitable entre les trois éléments */
    flex-wrap: wrap; /* Permet le passage à la ligne sur mobile */
}

/* 2. La Navigation : Centrage et Marges Automatiques */
#main-nav {
    /* Marge auto pour repousser les éléments de chaque côté et centrer la nav */
    margin-left: auto;
    margin-right: auto;
    
    /* Assurez-vous que les éléments de liste sont en ligne */
    /* Vous avez déjà des règles pour les ul dans le code fourni, 
       mais celles-ci sont plus spécifiques à la nouvelle structure. */
}

/* 3. Style de la liste (déjà partiellement défini, on s'assure qu'elle est bien formatée) */
#main-nav ul {
    display: flex; /* Alignement horizontal des liens */
    list-style: none;
    margin: 0;
    padding: 0;
}

#main-nav ul li {
    margin: 0 10px; /* Espace entre les liens de la navigation */
}


/* 1. Conteneur principal */
.headerbar .inner {
    display: flex;
    align-items: center; /* Alignement vertical */
    justify-content: space-between;
    flex-wrap: wrap; 
}

/* 2. Le Logo et la Recherche conservent leur taille */
#site-description, 
#search-box {
    flex-shrink: 0; /* Empêche ces éléments de réduire leur taille */
}

/* 3. La Navigation (Utilise l'espace et centre son contenu) */
#main-nav {
    flex-grow: 1; /* Prend tout l'espace disponible */
    margin: 0 15px; /* Petite marge de sécurité horizontale */
}

#main-nav ul {
    justify-content: center; /* Centre les liens à l'intérieur de l'espace #main-nav */
}



/* footer */
.footer {
    display: flex;
    justify-content: space-between; /* espace entre gauche et droite */
    flex-wrap: wrap; /* pour que ça passe en colonne sur mobile */
    padding: 1em 0 0 0;
    border-top: 1px rgb(144 144 144)  solid;
    border-bottom: 1px rgb(144 144 144) solid;
    padding: 10px;
    margin: 12px;
}

.footer-left,
.footer-right {
    flex: 1 1 300px; /* largeur minimum et adaptable */
    margin: 0.5em 0;
}




/* 4. Gestion Responsive (en dessous de 700px) */
@media (max-width: 1000px) {
	#main-nav {
        flex-grow: 0; /* Prend tout l'espace disponible */
        margin-left: 20%; /* Petite marge de sécurité horizontale */
	}
}

@media (max-width: 850px) {
    /* 1. Empiler les éléments (Logo, Nav, Search) */
    .headerbar .inner {
        flex-direction: column; 
        align-items: center; /* Centrer l'empilement */
    }

    /* 2. La navigation prend 100% de la largeur */
    #main-nav {
        width: 100%;
        order: 2; /* S'assure qu'elle est en deuxième position, après le logo */
        margin: 10px 0;
        /* text-align: center est déjà là, mais on le garde pour le rappel */
    }
    
    /* 3. Assurer que les liens restent centrés */
    #main-nav ul {
        justify-content: center; 
        width: 100%;
    }
    
    /* 4. Le Logo (si vous voulez qu'il soit centré sur mobile) */
    #site-description {
        float: none;
    width: auto;
    text-align: center; /* <--- C'est ICI qu'on centre le contenu textuel (y compris le logo s'il est inline ou inline-block) */
    }
    
    /* 5. La recherche (passer à la ligne et prendre toute la largeur) */
    #search-box {
        order: 3; /* S'assure qu'elle est en dernière position */
        margin-top: 5px; 
    }
    

}
.list-inner .head{
	display: flex;
}
.list-inner .head a {
    display: flex;
    justify-content: center;
    align-items: center;
	margin-left: 5px;
}


/* Pour faire disparaître spécifiquement l'icône de flux si elle persiste */
.feed-icon-forum {
    display: none !important;
}

.navbar {
	/*box-shadow: 3px 3px 0px 1px rgba(0, 0, 0, 0.3);
	-webkit-box-shadow: 3px 3px 0px 1px rgba(0, 0, 0, 0.3);
	*/
}
.panel {
	/* box-shadow: 3px 3px 0px 1px rgba(0, 0, 0, 0.3);
	-webkit-box-shadow: 3px 3px 0px 1px rgba(0, 0, 0, 0.3); */
}
.site_logo {
	background-image: url("./images/logo-club.png");
	width: 400px;
    height: 120px;
    background-size: contain;
}
/* Miscellaneous styles */
div.rules {
	/* box-shadow: 3px 3px 0px 1px rgba(0, 0, 0, 0.3);
	-webkit-box-shadow: 3px 3px 0px 1px rgba(0, 0, 0, 0.3); */
}
p.post-notice {
	background-image: none;
}
/* Colours and backgrounds for content.css */
ul.forums {
	background-image: none;
	filter: none;
}
.rtl ul.topiclist dd {
	border-left-color: transparent;
}
.rtl li.row:hover dd {
	border-left-color: transparent;
}
/* Colours and backgrounds for buttons.css */
.button {
	background-image: none;
	filter: none;
	/* box-shadow: 2px 2px 0px 1px rgba(0, 0, 0, 0.3);
	-webkit-box-shadow: 2px 2px 0px 1px rgba(0, 0, 0, 0.3); */
}
.button:hover,
.button:focus {
	background-image: none;
	filter: none;
	text-shadow: none;
}
/* Pagination */
.pagination li a {
	background-image: none;
	filter: none;
	box-shadow: none;
	-webkit-box-shadow: none;
}
.pagination li.ellipsis span {
	background: transparent;
}
.pagination li.active span {
	/* box-shadow: 2px 2px 0px 1px rgba(0, 0, 0, 0.3);
	-webkit-box-shadow: 2px 2px 0px 1px rgba(0, 0, 0, 0.3); */
}
.pagination li a:hover, .pagination li a:hover .icon, .pagination .dropdown-visible a.dropdown-trigger, .nojs .pagination .dropdown-container:hover a.dropdown-trigger {
	filter: none;
	text-shadow: none;
}
/* Search box */
.search-box .inputbox {
	/* box-shadow: 2px 2px 0px 1px rgba(0, 0, 0, 0.3);
	-webkit-box-shadow: 2px 2px 0px 1px rgba(0, 0, 0, 0.3); */
}
.search-header {
	/* box-shadow: 2px 2px 0px 1px rgba(0, 0, 0, 0.3);
	-webkit-box-shadow: 2px 2px 0px 1px rgba(0, 0, 0, 0.3); */
}
/* CP tabbed menu */
.tabs .activetab > a,
.tabs .activetab > a:hover {
	background-image: none;
	filter: none;
}
/* UCP navigation menu */
/* Link styles for the sub-section links */
.navigation a {
	background-image: none;
	box-shadow: 3px 3px 0px 1px rgba(0, 0, 0, 0.3);
	-webkit-box-shadow: 3px 3px 0px 1px rgba(0, 0, 0, 0.3);
	filter: none;
}
.rtl .navigation a {
	background-image: none;
	filter: none;
}
.navigation a:hover {
	filter: none;
}
.navigation .active-subsection a {
	filter: none;
}
/* Friends list */
.cp-mini {
	box-shadow: 3px 3px 0px 1px rgba(0, 0, 0, 0.3);
	-webkit-box-shadow: 3px 3px 0px 1px rgba(0, 0, 0, 0.3);
}
/* Form button styles */
a.button1, input.button1, input.button3, a.button2, input.button2 {
	background-image: none;
	filter: none;
	box-shadow: 2px 2px 0px 1px rgba(0, 0, 0, 0.3);
	-webkit-box-shadow: 2px 2px 0px 1px rgba(0, 0, 0, 0.3);
}
input.button3 {
	background-image: none;
}
/* Hover states */
a.button1:hover, input.button1:hover, a.button2:hover, input.button2:hover, input.button3:hover {
	background-image: none;
	filter: none;
	text-shadow: none;
}
/* jQuery popups */
.dropdown-extended .header {
	background-image: none;
	filter: none;
}
.dropdown .dropdown-contents {
	box-shadow: 2px 2px 0px 1px rgba(0, 0, 0, 0.3);
	-webkit-box-shadow: 2px 2px 0px 1px rgba(0, 0, 0, 0.3);
}
.dropdown-up .dropdown-contents {
	box-shadow: 2px -2px 0px 1px rgba(0, 0, 0, 0.3);
	-webkit-box-shadow: 2px -2px 0px 1px rgba(0, 0, 0, 0.3);
}

/**  responsive.css  --------------------------------------------  **/
@media (max-width: 700px) {
	/* Content wrappers */
	body {
		padding: 0;
	}
	.wrap {
		border-radius: 0;
		padding: 0 5px;
	}
	/* Common block wrappers */
	.headerbar, .navbar, .forabg, .forumbg, .post, .panel {
		border-radius: 0;
		margin-bottom: 4px;
	}
	.cp-main .forabg, .cp-main .forumdb, .cp-main .post, .cp-main .panel {
		border-radius: 3px;
	}

	.site_logo {
	width: 280px;
    background-size: contain;
	}


}

/**  fontawesome.css  -------------------------------------------  **/
.profile-contact .fa-commenting-o::before 	{ content: "\f27a"; }
.nav-main .fa-inbox::before 				{ content: "\f075"; }
.subforum .fa-file-o::before 				{ content: "\f15b"; }
.row-item .fa-file::before 					{ content: "\f15c"; }
.lastpost .fa-external-link-square::before	{ content: "\f15c"; }

/**  promaterial.css  -------------------------------------------  **/
/* flash button effect */
.button:hover, .button1:hover, .button2:hover, .button3:hover {
	opacity: 1;
	-webkit-animation: flash 1s;
	animation: flash 1s;
}
@-webkit-keyframes flash {
	0% {
		opacity: .1;
	}
	100% {
		opacity: 1;
	}
}
@keyframes flash {
	0% {
		opacity: .1;
	}
	100% {
		opacity: 1;
	}
}
/* Icons & Button icons */
.pagination span .fa-clone::before	{
	display: none;
}
/* Miscellaneous */
.cron img {
	display: none;
}
.post {
    background-color: #ccc;
	box-shadow: 3px 3px 0px 1px rgba(0, 0, 0, 0.3);
	-webkit-box-shadow: 3px 3px 0px 1px rgba(0, 0, 0, 0.3);
}
/* Pagination */
.pagination .button {
	box-shadow: 2px 2px 0px 1px rgba(0, 0, 0, 0.3);
	-webkit-box-shadow: 2px 2px 0px 1px rgba(0, 0, 0, 0.3);
}
/* Rotation icon effect */
i.icon {
  -webkit-transition: all 0.5s ease;
  transition: all 0.5s ease;
}
a:hover i.icon, .button:hover i.icon, i.icon:hover {
  -webkit-transform: rotate(35deg);
  transform: rotate(35deg);
}
/* Stats page layout */
.stat-block, .headerspace {
    border-radius: 3px;
/*	box-shadow: 3px 3px 0px 1px rgba(0, 0, 0, 0.3);
	-webkit-box-shadow: 3px 3px 0px 1px rgba(0, 0, 0, 0.3); */
	clear: both;
/*	margin-bottom: 12px; */
	padding: 5px;
}
.stat-block h3, .headerspace h3 {
	border-bottom: none;
	font-size: 1em;
	font-family: "Libre Franklin", Verdana, Arial, Helvetica;
	line-height: 1em;
	margin-bottom: 0;
	padding: 4px 0 6px 0;
	margin-top: 0;
	text-transform: uppercase;
}
.stat-block p, .headerspace fieldset {
	padding: 8px 0 6px 55px;
	margin-bottom: 0;
	position: relative;
	min-height: 30px;
}
.rtl .stat-block p, .rtl .headerspace fieldset {
	padding: 8px 55px 6px 0;
}
.stat-block p::before, .headerspace .quick-login::before {
	left: 10px;
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
}
.rtl .stat-block p::before, .rtl .headerspace .quick-login::before {
	right: 10px;
}
@media (max-width: 700px) {
	.stat-block {
		border-radius: 0;
		margin-bottom: 4px;
		margin-left: -5px;
		margin-right: -5px;
	}
	.stat-block h3 {
		text-align: center;
		text-transform: none;
		line-height: 1em;
		font-size: 1.2em;
	}
	.postprofile .no-avatar img {
		width: auto !important;
		height: auto !important;
		max-height: 35px;
	}
}
/* UCP jumpbox */
.cp-main .actions-jump {
	float: right;
}
.cp-main .jumpbox {
    margin: 0;
}
/* test bbcode */
.bbcode_test {
	background:#ffffff;
	border-radius: 3px;
	margin: 1em 0 1.2em;
	box-shadow: 2px 2px 0px 1px rgba(0, 0, 0, 0.3);
	-webkit-box-shadow: 2px 2px 0px 1px rgba(0, 0, 0, 0.3);
}
.bbcode_test_head {
	background: #99c2eb; 
    border-top: 1px solid #cce0f5;
	background: #0066cc;
	background: -moz-linear-gradient(25deg,  #0066cc 0%, #0066cc 30%, #4d94db 30%, #4d94db 50%, #99c2eb 50%, #99c2eb 70%, #cce0f5 70%, #cce0f5 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(25deg,  #0066cc 0%,#0066cc 30%,#4d94db 30%,#4d94db 50%,#99c2eb 50%,#99c2eb 70%,#cce0f5 70%,#cce0f5 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(25deg,  #0066cc 0%,#0066cc 30%,#4d94db 30%,#4d94db 50%,#99c2eb 50%,#99c2eb 70%,#cce0f5 70%,#cce0f5 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0066cc', endColorstr='#99c2eb',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
    border-radius: 3px 3px 0 0;
    color: #ffffff;
    font-size: 12px;
    font-weight: bold;
    padding: 5px 10px;
}
.bbcode_test_head .icon.icon-blue {
    color: #ffffff;
}
.bbcode_test_text {
	border-bottom: 1px solid #cce0f5;
	border-left: 1px solid #cce0f5;
	border-right: 1px solid #cce0f5;
	border-radius: 0 0 3px 3px;
    color: #2e63a8;
	padding:5px 10px;
}