/**
 * PNC France : Espace adhérent.
 *
 * La page « compte » est un tableau de bord maison (PNC_Registre_Espace) :
 * accueil, trois vignettes, historique, liens. Les autres écrans PMPro
 * (profil, paiement, carte…) gardent les styles de pnc-membership.css.
 *
 * @package PNC_France
 */

.pnc-espace-adherent {
	margin: var(--pnc-space-8) 0 var(--pnc-space-12);
	min-width: 0;
}

.pnc-espace {
	display: grid;
	gap: var(--pnc-space-6);
	font-family: var(--pnc-font-family);
	color: var(--pnc-color-text);
}

.pnc-espace p {
	margin: 0;
}

.pnc-espace a {
	color: var(--pnc-color-brand-blue);
	font-weight: 600;
	text-decoration: none;
}

.pnc-espace a:hover {
	color: var(--pnc-color-primary-dark);
	text-decoration: underline;
}

.pnc-espace .pnc-btn,
.pnc-espace .pnc-btn:hover {
	color: var(--pnc-color-text-inverse);
	text-decoration: none;
}

/* Accueil ---------------------------------------------------------------- */

.pnc-espace__accueil {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: space-between;
	gap: var(--pnc-space-4) var(--pnc-space-6);
	padding: var(--pnc-space-6) var(--pnc-space-8);
	border-radius: var(--pnc-radius-lg);
	background: linear-gradient(135deg, var(--pnc-color-bg-subtle), #eef3e6);
}

.pnc-espace__bonjour {
	margin: 0 0 var(--pnc-space-2);
	font-size: var(--pnc-font-size-2xl);
	line-height: 1.2;
	color: var(--pnc-color-primary);
}

.pnc-espace__statut {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--pnc-space-2) var(--pnc-space-3);
	font-size: var(--pnc-font-size-sm);
	color: var(--pnc-color-text-muted);
}

.pnc-espace__badge {
	display: inline-block;
	padding: 0.3rem 0.85rem;
	border-radius: var(--pnc-radius-full);
	font-size: 13px;
	font-weight: 700;
	color: var(--pnc-color-text-muted);
	background: var(--pnc-color-bg-muted);
}

.pnc-espace__badge--ok {
	color: var(--pnc-color-secondary-dark);
	background: #e3f0cf;
}

.pnc-espace__badge--attente {
	color: #9a5b00;
	background: #fdebc8;
}

.pnc-espace__note {
	padding: var(--pnc-space-3) var(--pnc-space-4);
	border-radius: var(--pnc-radius-md);
	background: #fff8ea;
	font-size: var(--pnc-font-size-sm);
}

/* Vignettes -------------------------------------------------------------- */

.pnc-espace__grille {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--pnc-space-4);
}

.pnc-espace__tuile {
	display: flex;
	flex-direction: column;
	gap: var(--pnc-space-2);
	padding: var(--pnc-space-6);
	border: 1px solid var(--pnc-color-border-light);
	border-radius: var(--pnc-radius-lg);
	background: var(--pnc-color-white);
	box-shadow: var(--pnc-shadow-sm);
}

.pnc-espace__etiquette {
	font-size: 12px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: var(--pnc-color-secondary-dark);
}

.pnc-espace__chiffre {
	font-size: 2.1rem;
	font-weight: 800;
	line-height: 1.1;
	color: var(--pnc-color-primary);
}

.pnc-espace__chiffre--texte {
	font-size: var(--pnc-font-size-lg);
}

.pnc-espace__nom {
	font-size: var(--pnc-font-size-lg);
	font-weight: 700;
	color: var(--pnc-color-primary);
}

.pnc-espace__detail {
	font-size: var(--pnc-font-size-sm);
	line-height: 1.5;
	color: var(--pnc-color-text-muted);
	overflow-wrap: anywhere;
}

.pnc-espace__lien {
	margin-top: auto !important;
	padding-top: var(--pnc-space-2);
	font-size: var(--pnc-font-size-sm);
}

.pnc-espace__liens {
	display: grid;
	gap: 0.35rem;
	margin: auto 0 0;
	padding: var(--pnc-space-2) 0 0;
	list-style: none;
	font-size: var(--pnc-font-size-sm);
}

.pnc-espace .pnc-espace__deconnexion {
	color: #b42318;
}

/* Blocs ------------------------------------------------------------------ */

.pnc-espace__bloc {
	padding: var(--pnc-space-6) var(--pnc-space-8);
	border: 1px solid var(--pnc-color-border-light);
	border-radius: var(--pnc-radius-lg);
	background: var(--pnc-color-white);
	box-shadow: var(--pnc-shadow-sm);
}

.pnc-espace__bloc > p + p {
	margin-top: var(--pnc-space-3);
}

.pnc-espace__titre {
	margin: 0 0 var(--pnc-space-4);
	font-size: var(--pnc-font-size-xl);
	line-height: 1.25;
	color: var(--pnc-color-primary);
}

.pnc-espace__sous-titre {
	margin: var(--pnc-space-6) 0 var(--pnc-space-3);
	font-size: var(--pnc-font-size-lg);
	color: var(--pnc-color-primary);
}

.pnc-historique__annees {
	margin: 0;
	padding: 0;
	list-style: none;
}

.pnc-historique__annee {
	display: grid;
	grid-template-columns: 5rem 1fr;
	gap: var(--pnc-space-4);
	padding: var(--pnc-space-4) 0;
	border-top: 1px solid var(--pnc-color-border-light);
}

.pnc-historique__annee:first-child {
	padding-top: 0;
	border-top: 0;
}

.pnc-historique__an {
	font-size: 1.5rem;
	font-weight: 800;
	line-height: 1.15;
	color: var(--pnc-color-primary);
}

.pnc-historique__total {
	margin-bottom: 0.2rem !important;
}

.pnc-historique__versements {
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 13px;
	line-height: 1.6;
	color: var(--pnc-color-text-muted);
}

.pnc-espace__recus {
	display: grid;
	gap: var(--pnc-space-2);
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: var(--pnc-font-size-sm);
}

.pnc-espace__recus li {
	display: flex;
	justify-content: space-between;
	gap: var(--pnc-space-4);
	padding: var(--pnc-space-2) var(--pnc-space-3);
	border-radius: var(--pnc-radius-sm);
	background: var(--pnc-color-bg-subtle);
}

.pnc-espace__discret {
	color: var(--pnc-color-text-muted);
}

.pnc-espace__source {
	margin-top: var(--pnc-space-6) !important;
	padding-top: var(--pnc-space-4);
	border-top: 1px solid var(--pnc-color-border-light);
	font-size: 13px;
	line-height: 1.6;
	color: var(--pnc-color-text-muted);
}

/* Rester informé ----------------------------------------------------------- */

.pnc-espace__raccourcis {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--pnc-space-3);
	margin: 0;
	padding: 0;
	list-style: none;
}

.pnc-espace .pnc-espace__raccourcis a {
	display: flex;
	flex-direction: column;
	gap: 0.2rem;
	padding: var(--pnc-space-4);
	border-radius: var(--pnc-radius-md);
	background: var(--pnc-color-bg-subtle);
	transition: background var(--pnc-transition, 0.2s);
}

.pnc-espace .pnc-espace__raccourcis a:hover {
	background: var(--pnc-color-bg-muted);
	text-decoration: none;
}

.pnc-espace__raccourcis span {
	font-size: 13px;
	font-weight: 400;
	color: var(--pnc-color-text-muted);
}

@media (max-width: 860px) {
	.pnc-espace__grille,
	.pnc-espace__raccourcis {
		grid-template-columns: 1fr;
	}
}

@media (max-width: 560px) {
	.pnc-espace__accueil,
	.pnc-espace__bloc {
		padding: var(--pnc-space-5, 1.25rem);
	}

	.pnc-historique__annee {
		grid-template-columns: 1fr;
		gap: 0.2rem;
	}
}