/* =============================================
   PUBLIC CSS — Extension Adhésion Mouvement
   ============================================= */

:root {
	--am-primary:      #1F45C7;
	--am-primary-dark: #1737a3;
	--am-success:      #00a32a;
	--am-danger:       #d63638;
	--am-warning:      #dba617;
	--am-text:         #1d2327;
	--am-text-light:   #646970;
	--am-border:       #dcdcde;
	--am-bg:           #f6f7f7;
	--am-card-bg:      #ffffff;
	--am-radius:       10px;
	--am-radius-sm:    6px;
	--am-shadow:       0 2px 12px rgba(0,0,0,.08);
	--am-shadow-hover: 0 4px 20px rgba(0,0,0,.14);
}

/* Reset de base */
.am *, .am *::before, .am *::after { box-sizing: border-box; }
.am { font-family: inherit; color: var(--am-text); max-width: 860px; margin-left: auto; margin-right: auto; overflow-x: hidden; }

/* =============================================
   MESSAGES
   ============================================= */
.am-message {
	padding: 12px 18px;
	border-radius: var(--am-radius-sm);
	margin-bottom: 20px;
	font-size: .95rem;
}
.am-success { background: #d4edda; color: #155724; border: 1px solid #c3e6cb; }
.am-error   { background: #f8d7da; color: #721c24; border: 1px solid #f5c6cb; }
.am-info    { background: #d1ecf1; color: #0c5460; border: 1px solid #bee5eb; }
.am-warning { background: #fff3cd; color: #856404; border: 1px solid #ffeeba; }

/* =============================================
   BOUTONS
   ============================================= */
.am-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	padding: 10px 24px;
	border-radius: var(--am-radius-sm);
	font-size: .95rem;
	font-weight: 600;
	text-decoration: none;
	cursor: pointer;
	border: 2px solid transparent;
	transition: all .2s ease;
	line-height: 1.4;
}
.am-btn-primary {
	background: #1F45C7 !important;
	border-color: #1F45C7 !important;
	color: #fff !important;
	font-weight: 700 !important;
}
.am-btn-primary:hover {
	background: var(--am-primary-dark) !important;
	border-color: var(--am-primary-dark) !important;
	color: #fff !important;
}
.am-btn-outline {
	background: transparent;
	border-color: var(--am-primary);
	color: var(--am-primary);
}
.am-btn-outline:hover {
	background: var(--am-primary);
	color: #fff;
}
.am-btn-large { padding: 14px 32px; font-size: 1.05rem; font-weight: 700 !important; }

/* =============================================
   CARD
   ============================================= */
.am-card {
	background: #fff !important;
	border: 1px solid var(--am-border) !important;
	border-radius: var(--am-radius) !important;
	padding: 28px !important;
	box-shadow: var(--am-shadow) !important;
	margin-bottom: 20px;
}
.am-card h2.am-card-title {
	color: var(--am-primary);
	text-align: center;
	font-size: 1.2rem;
	margin-top: 0;
	margin-bottom: 20px;
	padding-bottom: 16px;
	border-bottom: 2px solid var(--am-bg);
}

/* =============================================
   FORMULAIRE
   ============================================= */
.am-form-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 16px;
}
@media (max-width: 640px) { .am-form-grid { grid-template-columns: 1fr; } }

.am-form-field { display: flex; flex-direction: column; gap: 6px; }
.am-full { grid-column: 1 / -1; }

.am-form-field label {
	font-weight: 600;
	font-size: .9rem;
	color: var(--am-text);
}
.am-form-field input,
.am-form-field select,
.am-form-field textarea {
	width: 100% !important;
	padding: 10px 14px !important;
	border: 1.5px solid var(--am-border) !important;
	border-radius: var(--am-radius-sm) !important;
	font-size: .95rem !important;
	font-family: inherit !important;
	color: var(--am-text) !important;
	transition: border-color .2s;
	background: #fff !important;
	box-shadow: none !important;
}
.am-form-field input:focus,
.am-form-field select:focus {
	border-color: var(--am-primary);
	outline: none;
	box-shadow: 0 0 0 3px rgba(0,115,170,.15);
}
.am-form-field input.am-error,
.am-form-field select.am-error { border-color: var(--am-danger); }
.am-checkbox-field.am-error { background: #fff5f5; border-radius: 4px; padding: 4px 8px; margin: -4px -8px; }

.am-form-section {
	margin-bottom: 24px;
	padding-bottom: 24px;
	border-bottom: 1px solid var(--am-bg);
}
.am-form-section h3 {
	margin: 0 0 16px;
	font-size: 1rem;
	color: var(--am-primary);
}
.am-form-section:last-of-type { border-bottom: none; }

.am-form-submit { text-align: center; margin-top: 8px; }
.am-submit-notice { font-size: .85rem; color: var(--am-text-light); margin-top: 8px; }

/* Radio civilité */
.am-field-civilite { grid-column: 1 / -1; }
.am-radio-group { display: flex; gap: 20px; align-items: center; flex-wrap: wrap; }
.am-radio-label { display: flex; align-items: center; gap: 6px; cursor: pointer; font-weight: 500; }
.am-radio-label input[type="radio"] { width: 18px !important; height: 18px !important; min-width: 18px; cursor: pointer; accent-color: var(--am-primary); flex-shrink: 0; margin: 0 !important; padding: 0 !important; vertical-align: middle; }

/* Checkboxes consentements */
.am-checkbox-field { grid-column: 1 / -1; }
.am-checkbox-label {
	display: flex !important;
	align-items: flex-start !important;
	gap: 10px !important;
	cursor: pointer;
	font-size: .9rem;
	line-height: 1.5;
}
.am-checkbox-label input[type="checkbox"] {
	width: 18px !important;
	height: 18px !important;
	flex-shrink: 0 !important;
	margin-top: 2px !important;
	cursor: pointer;
	accent-color: var(--am-primary);
}

/* =============================================
   NIVEAUX D'ADHÉSION
   ============================================= */
.am-niveaux-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 20px;
	margin-bottom: 20px;
}
@media (max-width: 640px) { .am-niveaux-grid { grid-template-columns: 1fr; } }

.am-niveau-card {
	background: var(--am-card-bg);
	border: 2px solid var(--am-border);
	border-radius: var(--am-radius);
	padding: 28px 20px;
	text-align: center;
	transition: all .2s ease;
	box-shadow: var(--am-shadow);
}
.am-niveau-card:hover {
	border-color: var(--am-primary);
	box-shadow: var(--am-shadow-hover);
	transform: translateY(-2px);
}
.am-niveau-montant {
	font-size: 2.5rem;
	font-weight: 800;
	color: var(--am-primary);
	line-height: 1;
	margin-bottom: 8px;
}
.am-niveau-montant::after { content: '€'; font-size: 1.5rem; }
.am-niveau-label { font-size: 1.1rem; font-weight: 600; margin: 8px 0 20px; }

/* Badge niveau dans formulaire */
.am-niveau-header {
	display: flex;
	align-items: center;
	gap: 12px;
	margin-bottom: 24px;
	padding-bottom: 16px;
	border-bottom: 2px solid var(--am-bg);
}
.am-niveau-badge {
	background: var(--am-primary);
	color: #fff;
	padding: 4px 14px;
	border-radius: 20px;
	font-weight: 600;
	font-size: .9rem;
}
.am-montant-badge {
	background: var(--am-bg);
	padding: 4px 14px;
	border-radius: 20px;
	font-weight: 700;
	font-size: 1.1rem;
	color: var(--am-text);
}

/* =============================================
   MODES DE PAIEMENT
   ============================================= */
.am-paiement-modes {
	display: flex;
	gap: 12px;
	flex-wrap: wrap;
	margin-bottom: 20px;
}
.am-paiement-mode {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 12px 20px;
	border: 2px solid var(--am-border);
	border-radius: var(--am-radius-sm);
	cursor: pointer;
	transition: all .2s;
	font-weight: 500;
	flex: 1;
	min-width: 180px;
}
.am-paiement-mode input[type="radio"] { display: none; }
.am-paiement-mode:hover,
.am-mode-active {
	border-color: var(--am-primary);
	background: rgba(0,115,170,.05);
}
.am-mode-icon { font-size: 1.4rem; }
.am-mode-label { font-size: .95rem; }

/* =============================================
   ESPACE MEMBRE
   ============================================= */
.am-membre-grid {
	display: grid;
	grid-template-columns: 1fr 2fr;
	gap: 20px;
	margin-bottom: 20px;
}
@media (max-width: 768px) { .am-membre-grid { grid-template-columns: 1fr; } }

.am-adhesion-status {
	display: flex;
	align-items: center;
	gap: 14px;
	padding: 16px;
	border-radius: var(--am-radius-sm);
	margin-bottom: 20px;
}
.am-status-actif   { background: #d4edda; }
.am-status-inactif { background: #f8d7da; }
.am-status-icon { font-size: 2rem; }
.am-status-info { display: flex; flex-direction: column; }
.am-status-info strong { font-size: 1rem; }
.am-status-info span { font-size: .875rem; color: var(--am-text-light); }

.am-email-notice { font-size: .825rem; color: var(--am-text-light); margin: 4px 0 0; }

.am-rgpd-notice {
	margin-top: 16px;
	padding-top: 16px;
	border-top: 1px solid var(--am-bg);
	font-size: .85rem;
	color: var(--am-text-light);
}

/* =============================================
   HISTORIQUE
   ============================================= */
.am-table {
	width: 100%;
	border-collapse: collapse;
	font-size: .9rem;
}
.am-table th {
	background: var(--am-bg);
	padding: 10px 12px;
	text-align: left;
	font-weight: 600;
	border-bottom: 2px solid var(--am-border);
}
.am-table td {
	padding: 10px 12px;
	border-bottom: 1px solid var(--am-bg);
}
.am-table tr:hover td { background: rgba(0,115,170,.03); }
.am-historique { grid-column: 1 / -1; }
.am-historique .am-table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; }
@media (max-width: 640px) {
	.am-historique .am-table { min-width: 480px; }
}

/* =============================================
   CONNEXION
   ============================================= */
.am-connexion .am-card { max-width: 480px; margin: 0 auto; background: #fff !important; border: 1px solid #dcdcde !important; border-radius: 8px !important; padding: 28px !important; box-shadow: 0 1px 3px rgba(0,0,0,.08) !important; }
.am-connexion h2 { text-align: center; }
#am-login-form { margin-top: 0; }
#am-login-form p { margin-bottom: 12px; }
#am-login-form .input { width: 100%; padding: 10px 14px; border: 1.5px solid var(--am-border); border-radius: var(--am-radius-sm); font-size: .95rem; }
#am-login-form .button { display: block; width: auto; margin: 0 auto; padding: 12px 32px; background: var(--am-primary); border-color: var(--am-primary); color: #fff; font-weight: 700; font-size: 1rem; border-radius: var(--am-radius-sm); }
#am-login-form .forgetmenot { text-align: left; }
.am-mdp-oublie-submit,
.am-nouveau-mdp-submit { text-align: center; margin-top: 16px; }
.am-login-links { text-align: center; margin-top: 12px; font-size: .875rem; }

/* =============================================
   PAGE MERCI
   ============================================= */
.am-merci-card { text-align: center; max-width: 560px; margin: 0 auto; padding: 48px 40px; }
.am-merci-icon { font-size: 4rem; margin-bottom: 16px; }
.am-merci-card h2 { font-size: 1.8rem; border: none; }
.am-merci-card p { color: var(--am-text-light); font-size: 1rem; margin-bottom: 12px; }

/* =============================================
   RENOUVELLEMENT
   ============================================= */
.am-niveaux-small { grid-template-columns: repeat(3, 1fr); gap: 12px; }
.am-niveau-option { display: block; cursor: pointer; }
.am-niveau-option input[type="radio"] { display: none; }
.am-niveau-card-small {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 16px;
	border: 2px solid var(--am-border);
	border-radius: var(--am-radius-sm);
	transition: all .2s;
}
.am-niveau-option input:checked + .am-niveau-card-small {
	border-color: var(--am-primary);
	background: rgba(0,115,170,.06);
}
.am-logout { text-align: center; margin-top: 16px; }

/* Message adhésion déjà renouvelée */
.am-renouvele-notice {
	background: #d4edda;
	color: #155724;
	padding: 10px 16px;
	border-radius: var(--am-radius-sm);
	font-weight: 500;
	font-size: .95rem;
	margin-top: 12px;
}

/* Statut adhésion — style neutre */
.am-status-neutre {
	background: var(--am-bg);
	border-radius: var(--am-radius-sm);
	padding: 14px 16px;
	margin-bottom: 16px;
}
.am-status-neutre .am-status-info {
	display: flex;
	flex-direction: column;
	gap: 2px;
}
.am-status-neutre .am-status-info strong {
	font-size: 1rem;
	color: var(--am-text);
}
.am-status-neutre .am-status-info span {
	font-size: .875rem;
	color: var(--am-text-light);
}

/* Message email existant */
.am-deja-adherent { font-size: .9rem; color: var(--am-muted); margin: -4px 0 16px; }
.am-deja-adherent a { color: var(--am-primary); text-decoration: none; font-weight: 500; }
.am-deja-adherent a:hover { text-decoration: underline; }

/* Champs verrouillés */
.am-readonly {
	background: var(--am-bg) !important;
	color: var(--am-text-light) !important;
	cursor: not-allowed !important;
	border-color: var(--am-border) !important;
}

/* Espacement cases à cocher */
.am-consentements .am-checkbox-field + .am-checkbox-field {
	margin-top: 16px;
}
.am-checkbox-label {
	align-items: flex-start;
	gap: 12px;
	line-height: 1.6;
}

/* =============================================
   FORMULAIRE CONNEXION (wp_login_form)
   ============================================= */
.am-connexion .am-field-group,
.am-connexion .login-username,
.am-connexion .login-password,
.am-connexion .login-remember,
.am-connexion .login-submit {
	margin-bottom: 16px !important;
}
.am-connexion .am-field-group label,
.am-connexion .login-username label,
.am-connexion .login-password label {
	display: block !important;
	margin-bottom: 6px !important;
	font-weight: 600 !important;
	font-size: .9rem !important;
}
.am-connexion .login-username input,
.am-connexion .login-password input,
.am-connexion input[type="text"],
.am-connexion input[type="password"] {
	width: 100% !important;
	padding: 10px 14px !important;
	border: 1.5px solid #dcdcde !important;
	border-radius: 4px !important;
	font-size: .95rem !important;
	font-family: inherit !important;
	color: #1e1e1e !important;
	background: #fff !important;
	box-shadow: none !important;
}
.am-connexion input[type="submit"],
.am-connexion .button-primary,
.am.am-connexion input[type="submit"],
.am.am-connexion .wp-submit,
body .am-connexion input[type="submit"],
body .am-connexion .button-primary {
	background: #1F45C7 !important;
	border-color: #1F45C7 !important;
	color: #fff !important;
	font-weight: 700 !important;
	padding: 10px 24px !important;
	border-radius: 4px !important;
	font-size: .95rem !important;
	cursor: pointer !important;
	box-shadow: none !important;
	text-shadow: none !important;
	width: auto !important;
}

/* Toggle mot de passe */
.am-toggle-mdp {
	position: absolute !important;
	right: 12px !important;
	top: 50% !important;
	transform: translateY(-50%) !important;
	background: none !important;
	border: none !important;
	cursor: pointer !important;
	color: #DCDCDC !important;
	padding: 4px !important;
	line-height: 0 !important;
	transition: color .2s;
}
.am-toggle-mdp:hover { color: #999 !important; }

/* Masquer l'œil natif du navigateur sur les champs password */
#user_pass::-ms-reveal,
#user_pass::-ms-clear,
#am_mdp::-ms-reveal,
#am_mdp::-ms-clear,
#am_mdp_confirm::-ms-reveal,
#am_mdp_confirm::-ms-clear { display: none !important; }
input[type="password"]::-webkit-credentials-auto-fill-button { visibility: hidden; }
