/* Theme Name: Hello Elementor Child
Theme URI: https://github.com/elementor/hello-theme-child/
Description: Hello Elementor Child is a child theme of Hello Elementor, created by Elementor team
Author: Elementor Team
Author URI: https://elementor.com/
Template: hello-elementor
Version: 2.0.1
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.gnu.org/licenses/gpl-3.0.html
Tags: flexible-header, custom-colors, custom-menu, custom-logo, editor-style, featured-images, rtl-language-support, threaded-comments, translation-ready
*/

/* ==========================================================================
   1. VARIABLES & SETUP
   ========================================================================== */

:root {
	--color-primary: #2563EB;
	--color-secondary: #6B7280;
	--color-text: #374151;
	--color-accent: #16A34A;
	--font-primary: 'Poppins', sans-serif;

	/* Variables pour la page de classement */
	--color-primary-star: #F59E0B;
	--color-separator: #f3f4f6;
}

/* ==========================================================================
   2. STYLES DE BASE (BODY, TYPOGRAPHIE, LIENS)
   ========================================================================== */

body {
	font-family: var(--font-primary);
	color: var(--color-text);
	font-size: 16px;
	line-height: 1.6;
	background-color: #fff;
	margin: 0;
	padding: 0;
}

/* Titres */
h1, h2, h3, h4, h5, h6 {
	font-family: var(--font-primary);
	font-weight: 600;
	color: var(--color-primary);
	margin: 1rem 0 0.5rem;
	line-height: 1.3;
}
h1 { font-size: 2rem; }
h2 { font-size: 1.75rem; }
h3 { font-size: 1.5rem; }
h4 { font-size: 1.25rem; }
h5 { font-size: 1rem; }
h6 { font-size: 0.875rem; }

/* Liens */
a {
	color: var(--color-primary);
	text-decoration: none;
	transition: color 0.2s ease-in-out;
}
a:hover {
	color: var(--color-accent);
}

/* ==========================================================================
   3. LAYOUT & STRUCTURE (HEADER, FOOTER, CONTAINERS)
   ========================================================================== */

.container {
	max-width: 1200px;
	margin: 0 auto;
}

section {
	padding: 3rem 1rem;
}

/* Header principal (Menu Sticky) */
.site-header {
	position: sticky;
	top: 0;
	left: 0;
	width: 100%;
	z-index: 9999;
	background: #fff;
	border-bottom: 1px solid #eee;
}

/* Pied de page */
footer {
	background: var(--color-secondary);
	color: #fff;
	padding: 2rem 1rem;
	text-align: center;
}
footer a {
	color: #fff;
	text-decoration: underline;
}

/* ==========================================================================
   4. FORMULAIRES & BOUTONS (STYLES GLOBAUX)
   ========================================================================== */

/* --- 4.1 Champs de formulaire --- */

/* Style de base pour tout le site */
input[type="text"],
input[type="email"],
input[type="password"],
input[type="search"],
input[type="url"],
input[type="tel"],
input[type="number"],
textarea,
select {
	font-family: var(--font-primary);
	padding: 0.5rem 0.75rem;
	border: 1px solid var(--color-secondary);
	border-radius: 6px;
	width: 100%;
	max-width: 100%;
	color: var(--color-text);
	box-sizing: border-box;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

/* Style SPÉCIFIQUE et plus FORT pour surcharger BuddyPress */
#buddypress input[type="text"],
#buddypress input[type="email"],
#buddypress input[type="password"],
#buddypress input[type="search"],
#buddypress input[type="url"],
#buddypress input[type="tel"],
#buddypress input[type="number"],
#buddypress textarea,
#buddypress select {
	font-family: var(--font-primary);
	padding: 0.5rem 0.75rem;
	border: 1px solid var(--color-secondary);
	border-radius: 6px;
	color: var(--color-text);
	box-sizing: border-box;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

/* Effet de focus pour TOUS les champs */
input:focus,
textarea:focus,
select:focus {
	border-color: var(--color-primary);
	outline: none;
}


/* --- 4.2 Boutons --- */

/* Style de base pour tout le site + BuddyPress */
button,
input[type="submit"],
input[type="button"],
input[type="reset"],
.wp-element-button,
.btn,
#buddypress .button,
#buddypress a.button {
	background-color: var(--color-primary);
	color: #fff;
	font-family: var(--font-primary);
	font-weight: 500;
	padding: 0.6rem 1.2rem;
	border: none;
	border-radius: 8px;
	cursor: pointer;
	transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out, border-color 0.2s ease-in-out;
	text-decoration: none;
	display: inline-block;
	line-height: 1.4;
	text-align: center;
}

/* Style de survol (hover) pour TOUS les boutons */
button:hover,
input[type="submit"]:hover,
input[type="button"]:hover,
input[type="reset"]:hover,
.wp-element-button:hover,
.btn:hover,
#buddypress .button:hover,
#buddypress a.button:hover {
	background-color: var(--color-accent);
	color: #fff;
}


/* ==========================================================================
   5. COMPOSANTS SPÉCIFIQUES
   ========================================================================== */

/* --- Menu Utilisateur (Avatar) --- */
.menu-item.menu-profil {
	position: relative;
}
.edelev-avatar-menu img {
	border-radius: 50%;
	vertical-align: middle;
	width: 36px;
	height: 36px;
	object-fit: cover;
}
@media (max-width: 768px) {
	.menu-item.menu-profil {
		position: static;
	}
	.edelev-avatar-menu img {
		width: 32px;
		height: 32px;
	}
}

/* --- Titre spécifique page d'accueil --- */
.repons-akey {
	color: var(--color-accent) !important;
	-webkit-text-fill-color: var(--color-accent) !important;
	background-image: none !important;
	-webkit-background-clip: initial !important;
	background-clip: initial !important;
}

/* --- Cartes de statistiques (Accueil) --- */
.stats-ed {
	font-family: "Poppins", Sans-serif;
	font-weight: 700;
	color: #000000;
	font-size: 1.5rem;
	line-height: 1.2;
	text-align: center;
}

/* --- Page de Classement (Paj Klasman) --- */

/* Cartes du Top 3 (cliquables) */
.edelev-profile-link {
	display: block;
	text-decoration: none;
	color: inherit;
	border-radius: 16px; /* Doit correspondre au design de la carte */
	transition: background-color 0.2s ease-in-out, transform 0.2s ease-in-out;
}

.edelev-profile-link:hover {
	background-color: rgba(15, 23, 42, 0.02);
	transform: translateY(-2px);
	cursor: pointer;
}

.edelev-klas-card {
	width: 100%;
	max-width: 360px;
	margin: 0 auto;
	box-sizing: border-box;
	text-align: center;
}

.edelev-card-avatar { margin: 4px 0 8px; }
.edelev-card-avatar img { width: 96px; height: 96px; border-radius: 50%; object-fit: cover; display: block; margin: 0 auto; }
.edelev-card-name { font-size: 1.05rem; font-weight: 700; color: var(--color-text); margin-top: 10px; }
.edelev-card-role { font-size: 0.9rem; color: var(--color-secondary); margin-top: 4px; margin-bottom: 10px; }
.edelev-card-row { display: flex; justify-content: space-between; align-items: center; padding: 8px 6px; border-top: 1px solid rgba(15,23,42,0.03); gap: 10px; }
.edelev-card-row-left { text-align: left; font-size: 0.9rem; color: var(--color-secondary); }
.edelev-card-row-right { display: flex; align-items: center; font-weight: 700; color: var(--color-text); }
.edelev-card-row-right:first-of-type { color: var(--color-primary-star); }
.edelev-klas-card .edelev-star-icon { width: 18px; height: 18px; color: var(--color-primary-star); margin-right: 4px; }

/* Liste complète du classement (lignes cliquables) */
.edelev-leader-row {
    /* Propriétés Flexbox pour l'alignement (LA CORRECTION EST ICI) */
	display: flex;
	align-items: center;
	
    /* Styles généraux */
	gap: 12px;
	padding: 14px 10px;
	border-bottom: 1px solid var(--color-separator);
    border-radius: 12px;

    /* Styles pour l'état "lien" */
    text-decoration: none;
    color: inherit;
    transition: background-color 0.2s ease-in-out, transform 0.2s ease-in-out;
}

.edelev-leader-row:last-child { border-bottom: none; }

.edelev-leader-row:hover {
	background-color: rgba(15, 23, 42, 0.02);
	transform: translateY(-2px);
	cursor: pointer;
}

.edelev-rank-badge { display: flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 10px; background: rgba(0,0,0,0.02); flex-shrink: 0; }
.edelev-rank-badge svg { width: 24px; height: 24px; display: block; }
.edelev-rank-number { width: 44px; text-align: center; color: var(--color-secondary); font-weight: 700; flex-shrink: 0; }
.edelev-leader-left { display: flex; align-items: center; gap: 12px; flex: 1; }
.edelev-leader-left img { width: 48px; height: 48px; border-radius: 50%; object-fit: cover; }
.edelev-leader-name { font-weight: 600; color: var(--color-text); }
.edelev-leader-role { font-size: 0.85rem; color: var(--color-secondary); }
.edelev-leader-stats { display: flex; gap: 24px; align-items: center; margin-left: auto; }
.edelev-stat-col { text-align: right; min-width: 80px; }
.edelev-stat-col .stat-value { font-weight: 700; line-height: 1; }
.edelev-stat-col .stat-label { display: block; font-size: 0.75rem; color: #9CA3AF; margin-top: 4px; }
.edelev-stat-col.points { display: block; text-align: right; color: var(--color-primary-star); }
.points-value-wrap { display: flex; align-items: center; justify-content: flex-end; font-weight: 700; color: var(--color-text); line-height: 1; }
.edelev-leader-row .edelev-star-icon { width: 16px; height: 16px; color: var(--color-primary-star); margin-right: 4px; flex-shrink: 0; }

/* Responsive du classement */
@media (max-width: 900px) {
	.edelev-leader-stats { gap: 12px; }
	.edelev-stat-col { min-width: 60px; }
}
@media (max-width: 640px) {
	/* Cartes Top 3 */
	.edelev-klas-card { padding: 14px; max-width: 320px; }
	.edelev-card-avatar img { width: 72px; height: 72px; }
	.edelev-card-name { font-size: 1rem; }
	.edelev-card-row { padding: 8px 4px; }

	/* Liste complète */
	.edelev-leader-row { flex-wrap: wrap; padding: 10px 8px; align-items: center; }
	.edelev-stat-col:not(.points) { display: none; }
	.edelev-rank-badge, .edelev-rank-number { width: 30px; height: 30px; margin-right: 0; }
	.edelev-rank-badge svg { width: 18px; height: 18px; }
	.edelev-leader-left { flex: 1; gap: 8px; min-width: 0; }
	.edelev-leader-left img { width: 36px; height: 36px; }
	.edelev-leader-name { font-size: 0.95rem; }
	.edelev-leader-stats { width: auto; gap: 0; margin-left: auto; }
	.edelev-stat-col.points { min-width: 0; padding: 0; }
	.edelev-stat-col.points .stat-label { display: none; }
	.points-value-wrap { font-size: 1rem; }
}

/* ==========================================================================
   6. SURCHARGES DE PLUGINS (PLUGIN OVERRIDES)
   ========================================================================== */

/* --- AnsPress --- */
.anspress {
	font-size: 16px;
	line-height: 1.6;
	font-family: var(--font-primary);
}
.ap-field-desc {
	font-size: 80%;
	margin-top: 6px;
}
.ap-form-label {
	display: block;
	font-weight: bold;
	margin-bottom: 10px;
	font-size: 16px;
}
/* Boutons spécifiques AnsPress */
#anspress [type="submit"], #anspress button {
	background-color: transparent;
	border: 1px solid var(--color-primary);
	color: var(--color-primary);
	line-height: 1;
}
#anspress [type="submit"]:hover, #anspress button:hover {
	background-color: var(--color-primary);
	color: #fff;
}
#anspress .ap-list-head .ap-btn-ask {
	background: var(--color-accent);
	color: #fff;
	float: right;
	font-size: 14px;
	height: 36px;
	margin-left: 15px;
	padding: 7px 20px;
}
#anspress .ap-list-head .ap-btn-ask:hover {
	background: var(--color-primary);
}
#anspress .ap-filter-toggle {
	color: var(--color-accent);
	font-weight: 400;
}
#anspress .ap-questions-count.ap-questions-acount {
	border-color: var(--color-accent);
}

/* --- BuddyPress --- */
@media (max-width: 768px) {
	/* Corrige le débordement sur mobile */
	#buddypress.alignwide,
	#buddypress.alignfull {
		margin-left: 0 !important;
		margin-right: 0 !important;
		width: 100% !important;
		max-width: 100% !important;
		overflow-x: hidden !important;
		padding-left: 15px !important;
		padding-right: 15px !important;
		box-sizing: border-box;
	}
}

/* --- Elementor & Addons (UAEL, Essential Addons) --- */
.eael-lr-form-loader-wrapper {
	width: 100%;
}
/* Neutraliser la "ligne" sous les boutons et liens de widget */
.uael-button,
.uael-button a,
.uael-btn,
.uael-btn a,
.elementor-button,
.elementor-button a,
.widget a,
.sidebar a,
.elementor-widget a {
	text-decoration: none !important;
}
.uael-button::after, .uael-button::before,
.uael-button a::after, .uael-button a::before,
.uael-btn::after, .uael-btn::before,
.elementor-button::after, .elementor-button::before,
.elementor-button a::after, .elementor-button a::before {
	display: none !important;
}