/**
 * Clairnexa — composants Gutenberg (styles de blocs + classes des patterns).
 * Chargé uniquement si le contenu utilise un composant (inc/enqueue.php) et dans l'éditeur.
 * Toutes les règles ciblent des blocs natifs : si le thème change, le contenu reste lisible.
 */

/* ---------- Cartes ---------- */
.is-style-clairnexa-card,
.is-style-clairnexa-card-bank,
.is-style-clairnexa-card-crypto {
	background: var(--cx-white);
	border: 1px solid var(--cx-border);
	border-radius: var(--cx-radius);
	padding: var(--cx-s3);
	box-sizing: border-box;
	height: 100%;
}

.is-style-clairnexa-card-bank {
	border-top: 4px solid var(--cx-blue);
}

.is-style-clairnexa-card-crypto {
	border-top: 4px solid var(--cx-green);
}

/* GP (thème classique) enveloppe le contenu des groupes dans .wp-block-group__inner-container. */
/* Cartes en grille : colonne flexible pour caler le bouton d'action en bas. */
.is-layout-grid > :is(.is-style-clairnexa-card, .is-style-clairnexa-card-bank, .is-style-clairnexa-card-crypto),
.is-layout-grid > :is(.is-style-clairnexa-card, .is-style-clairnexa-card-bank, .is-style-clairnexa-card-crypto) > .wp-block-group__inner-container {
	display: flex;
	flex-direction: column;
}

.is-layout-grid > :is(.is-style-clairnexa-card, .is-style-clairnexa-card-bank, .is-style-clairnexa-card-crypto) > .wp-block-group__inner-container {
	flex: 1;
}

:is(.is-style-clairnexa-card, .is-style-clairnexa-card-bank, .is-style-clairnexa-card-crypto) > *,
:is(.is-style-clairnexa-card, .is-style-clairnexa-card-bank, .is-style-clairnexa-card-crypto) > .wp-block-group__inner-container > * {
	margin-block: 0;
}

:is(.is-style-clairnexa-card, .is-style-clairnexa-card-bank, .is-style-clairnexa-card-crypto) > * + *,
:is(.is-style-clairnexa-card, .is-style-clairnexa-card-bank, .is-style-clairnexa-card-crypto) > .wp-block-group__inner-container > * + * {
	margin-top: 12px;
}

/* Bouton d'action calé en bas : boutons alignés d'une carte à l'autre */
.is-layout-grid > :is(.is-style-clairnexa-card, .is-style-clairnexa-card-bank, .is-style-clairnexa-card-crypto) > .wp-block-buttons:last-child,
.is-layout-grid > :is(.is-style-clairnexa-card, .is-style-clairnexa-card-bank, .is-style-clairnexa-card-crypto) > .wp-block-group__inner-container > .wp-block-buttons:last-child {
	margin-top: auto;
	padding-top: 16px;
}

.entry-content :is(.is-style-clairnexa-card, .is-style-clairnexa-card-bank, .is-style-clairnexa-card-crypto) :where(h2, h3, h4) {
	margin-top: 0;
	font-size: var(--cx-fs-h4);
}

/* Fiche partenaire : statut, faits, méta */
.cx-partner__status {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 4px 10px;
	border-radius: 999px;
	font-size: 0.8125rem;
	font-weight: 700;
	background: var(--cx-bg);
	color: var(--cx-text);
	border: 1px solid var(--cx-border-strong);
	width: fit-content;
}

.cx-partner__facts {
	list-style: none;
	padding: 0 !important;
	margin-left: 0;
	font-size: 0.9375rem;
}

.cx-partner__facts li {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 4px 12px;
	padding-block: 8px;
	border-bottom: 1px solid var(--cx-border);
	margin: 0 !important;
}

.cx-partner__facts li:last-child {
	border-bottom: 0;
}

.cx-partner__meta {
	font-size: 0.8125rem;
	color: var(--cx-gray-text);
}

/* ---------- Alertes et encarts ---------- */
.is-style-clairnexa-alert-info,
.is-style-clairnexa-alert-warning,
.is-style-clairnexa-alert-risk,
.is-style-clairnexa-transparency {
	position: relative;
	border-radius: var(--cx-radius-sm);
	border-left: 4px solid;
	padding: var(--cx-s2) var(--cx-s3) var(--cx-s2) 56px;
	color: var(--cx-text);
	box-sizing: border-box;
}

/* Icône décorative (masque SVG, couleur = bordure) */
.is-style-clairnexa-alert-info::before,
.is-style-clairnexa-alert-warning::before,
.is-style-clairnexa-alert-risk::before,
.is-style-clairnexa-transparency::before {
	content: "";
	position: absolute;
	left: 18px;
	top: 18px;
	width: 22px;
	height: 22px;
	background-color: currentColor;
	-webkit-mask: var(--cx-alert-icon) center / contain no-repeat;
	mask: var(--cx-alert-icon) center / contain no-repeat;
}

.is-style-clairnexa-alert-info {
	--cx-alert-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a10 10 0 1 0 0 20 10 10 0 0 0 0-20Zm1 15h-2v-6h2v6Zm0-8h-2V7h2v2Z'/%3E%3C/svg%3E");
	background: var(--cx-info-bg);
	border-color: var(--cx-blue);
}

.is-style-clairnexa-alert-info::before { background-color: var(--cx-blue); }

.is-style-clairnexa-alert-warning {
	--cx-alert-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M1 21h22L12 2 1 21Zm12-3h-2v-2h2v2Zm0-4h-2v-4h2v4Z'/%3E%3C/svg%3E");
	background: var(--cx-warn-bg);
	border-color: var(--cx-warn);
}

.is-style-clairnexa-alert-warning::before { background-color: var(--cx-warn); }

.is-style-clairnexa-alert-risk {
	--cx-alert-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2 2 6v6c0 5.5 3.8 10.7 10 12 6.2-1.3 10-6.5 10-12V6L12 2Zm1 15h-2v-2h2v2Zm0-4h-2V7h2v6Z'/%3E%3C/svg%3E");
	background: var(--cx-alert-bg);
	border-color: var(--cx-alert);
}

.is-style-clairnexa-alert-risk::before { background-color: var(--cx-alert); }

.is-style-clairnexa-alert-risk :where(h2, h3, h4, strong) {
	color: var(--cx-alert);
}

.is-style-clairnexa-transparency {
	--cx-alert-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m9 16.2-4.2-4.2-1.4 1.4L9 19 21 7l-1.4-1.4L9 16.2Z'/%3E%3C/svg%3E");
	background: var(--cx-green-bg);
	border-color: var(--cx-green-text);
}

.is-style-clairnexa-transparency::before { background-color: var(--cx-green-text); }

:where(.is-style-clairnexa-alert-info, .is-style-clairnexa-alert-warning, .is-style-clairnexa-alert-risk, .is-style-clairnexa-transparency) > * {
	margin-block: 0;
}

:where(.is-style-clairnexa-alert-info, .is-style-clairnexa-alert-warning, .is-style-clairnexa-alert-risk, .is-style-clairnexa-transparency) > * + * {
	margin-top: 8px;
}

:where(.is-style-clairnexa-alert-info, .is-style-clairnexa-alert-warning, .is-style-clairnexa-alert-risk, .is-style-clairnexa-transparency) :where(h2, h3, h4) {
	font-size: 1.0625rem;
	margin-top: 0;
}

:where(.is-style-clairnexa-alert-info, .is-style-clairnexa-alert-warning, .is-style-clairnexa-alert-risk, .is-style-clairnexa-transparency) a {
	color: var(--cx-blue);
	font-weight: 600;
}

@media (max-width: 480px) {
	.is-style-clairnexa-alert-info,
	.is-style-clairnexa-alert-warning,
	.is-style-clairnexa-alert-risk,
	.is-style-clairnexa-transparency {
		padding-left: var(--cx-s2);
		padding-top: 52px;
	}
}

/* ---------- Panneau sombre (hero, bandeaux) ---------- */
.is-style-clairnexa-panel-dark {
	background: var(--cx-navy);
	color: var(--cx-footer-text);
	border-radius: var(--cx-radius);
	padding: var(--cx-s5) var(--cx-s3);
	box-sizing: border-box;
}

@media (min-width: 768px) {
	.is-style-clairnexa-panel-dark {
		padding: var(--cx-s8) var(--cx-s6);
	}
}

.is-style-clairnexa-panel-dark :where(h1, h2, h3, h4) {
	color: var(--cx-white);
}

.is-style-clairnexa-panel-dark a:not(.wp-block-button__link) {
	color: var(--cx-green-light);
}

.is-style-clairnexa-panel-dark :where(a, button, summary):focus-visible {
	outline-color: var(--cx-focus-color-dark);
}

.is-style-clairnexa-panel-dark .wp-block-button__link:not(.has-background) {
	background: var(--cx-green-light);
	color: var(--cx-navy);
}

.is-style-clairnexa-panel-dark .wp-block-button__link:hover {
	background: var(--cx-white);
	color: var(--cx-navy);
}

/* !important requis : le style Secondaire force navy sur fond clair */
.is-style-clairnexa-panel-dark .is-style-clairnexa-secondary .wp-block-button__link {
	background: transparent !important;
	color: var(--cx-white) !important;
	border-color: var(--cx-white);
}

.is-style-clairnexa-panel-dark .is-style-clairnexa-secondary .wp-block-button__link:hover {
	background: var(--cx-white) !important;
	color: var(--cx-navy) !important;
}

/* Sélecteur de besoins (liste de liens en pastilles) */
.cx-need-list {
	list-style: none;
	padding: 0 !important;
	margin-left: 0;
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
}

.cx-need-list li {
	margin: 0 !important;
}

.cx-need-list a {
	display: inline-flex;
	align-items: center;
	min-height: var(--cx-btn-h);
	padding: 8px 18px;
	border-radius: 22px; /* reste lisible si le libellé passe sur deux lignes */
	border: 1px solid var(--cx-border-strong);
	background: var(--cx-white);
	color: var(--cx-navy);
	font-weight: 600;
	line-height: 1.3;
	text-decoration: none;
	box-sizing: border-box;
}

.cx-need-list a:hover {
	border-color: var(--cx-navy);
	text-decoration: underline;
}

.is-style-clairnexa-panel-dark .cx-need-list a {
	background: transparent;
	border-color: rgba(255, 255, 255, 0.55);
	color: var(--cx-white);
}

.is-style-clairnexa-panel-dark .cx-need-list a:hover {
	border-color: var(--cx-green-light);
}

/* ---------- Tableaux ---------- */
.wp-block-table table {
	border-collapse: collapse;
	width: 100%;
}

.wp-block-table caption {
	caption-side: top;
	text-align: left;
	font-weight: 700;
	color: var(--cx-navy);
	padding: 0 0 12px;
}

.wp-block-table :where(th, td) {
	padding: 12px 16px;
	border: 0;
	border-bottom: 1px solid var(--cx-border);
	text-align: left;
	vertical-align: top;
}

/* Comparatif : conteneur défilant au clavier, 1re colonne figée */
.wp-block-table.is-style-clairnexa-comparatif {
	overflow-x: auto;
	background: var(--cx-white);
	border: 1px solid var(--cx-border);
	border-radius: var(--cx-radius);
	padding: var(--cx-s2);
	box-sizing: border-box;
	-webkit-overflow-scrolling: touch;
}

.wp-block-table.is-style-clairnexa-comparatif:focus-visible {
	outline: var(--cx-focus);
	outline-offset: 2px;
}

.is-style-clairnexa-comparatif table {
	min-width: 640px;
	font-size: 0.9375rem;
}

.is-style-clairnexa-comparatif thead th {
	background: var(--cx-navy);
	color: var(--cx-white);
	font-weight: 700;
	white-space: nowrap;
}

.is-style-clairnexa-comparatif thead th:first-child {
	border-top-left-radius: var(--cx-radius-sm);
}

.is-style-clairnexa-comparatif thead th:last-child {
	border-top-right-radius: var(--cx-radius-sm);
}

/* Rayures translucides : laissent voir l'ombre de bord ajoutée par comparatif.js */
.is-style-clairnexa-comparatif tbody tr:nth-child(even) :where(td, th) {
	background: rgba(16, 29, 50, 0.04);
}

/* 1re colonne figée : fond opaque obligatoire */
.is-style-clairnexa-comparatif tbody :where(td, th):first-child {
	font-weight: 700;
	color: var(--cx-navy);
	position: sticky;
	left: 0;
	z-index: 1;
	background: var(--cx-white);
	box-shadow: 1px 0 0 var(--cx-border);
}

.is-style-clairnexa-comparatif tbody tr:nth-child(even) :where(td, th):first-child {
	background: #f3f5f7;
}

.is-style-clairnexa-comparatif tfoot :where(td, th) {
	font-size: 0.8125rem;
	color: var(--cx-gray-text);
	border-bottom: 0;
}

/* Ombre de bord ajoutée par comparatif.js (aucun impact sur la mise en page) */
.wp-block-table.is-style-clairnexa-comparatif.is-scrollable:not(.is-at-end) {
	box-shadow: inset -24px 0 16px -16px rgba(16, 29, 50, 0.22);
}

/* Indication textuelle, utile seulement quand le tableau (≥ 640 px) dépasse l'écran */
.cx-scroll-hint {
	display: none;
	margin: 8px 0 0;
	font-size: 0.8125rem;
	color: var(--cx-gray-text);
}

@media (max-width: 760px) {
	.cx-scroll-hint {
		display: block;
	}
}

/* ---------- Boutons ---------- */
.is-style-clairnexa-secondary .wp-block-button__link {
	background: transparent !important;
	color: var(--cx-navy) !important;
	border: 2px solid var(--cx-navy);
}

.is-style-clairnexa-secondary .wp-block-button__link:hover {
	background: var(--cx-navy) !important;
	color: var(--cx-white) !important;
}

.is-style-clairnexa-commercial .wp-block-button__link {
	background: var(--cx-green-text);
	color: var(--cx-white);
	flex-wrap: wrap;
}

.is-style-clairnexa-commercial .wp-block-button__link:hover {
	background: var(--cx-navy);
}

.cx-commercial-tag {
	display: inline-block;
	font-size: 0.75rem;
	font-weight: 600;
	line-height: 1.2;
	padding: 2px 6px;
	border: 1px solid currentColor;
	border-radius: 4px;
	text-transform: uppercase;
	letter-spacing: 0.03em;
}

.cx-offer-off__text {
	display: inline-flex;
	align-items: center;
	min-height: var(--cx-btn-h);
	margin: 0;
	padding: 8px 16px;
	border: 1px dashed var(--cx-border-strong);
	border-radius: var(--cx-radius-sm);
	background: var(--cx-bg);
	color: var(--cx-gray-text);
	font-size: 0.9375rem;
	font-weight: 600;
}

/* ---------- Listes ---------- */
.is-style-clairnexa-check {
	list-style: none;
	padding-left: 0 !important;
}

.is-style-clairnexa-check li {
	position: relative;
	padding-left: 32px;
}

.is-style-clairnexa-check li::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0.2em;
	width: 20px;
	height: 20px;
	background-color: var(--cx-green-text);
	-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m9 16.2-4.2-4.2-1.4 1.4L9 19 21 7l-1.4-1.4L9 16.2Z'/%3E%3C/svg%3E") center / contain no-repeat;
	mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='m9 16.2-4.2-4.2-1.4 1.4L9 19 21 7l-1.4-1.4L9 16.2Z'/%3E%3C/svg%3E") center / contain no-repeat;
}

.is-style-clairnexa-sources {
	font-size: var(--cx-fs-sm);
	color: var(--cx-gray-text);
}

.is-style-clairnexa-sources a {
	color: var(--cx-blue);
	overflow-wrap: anywhere;
}

/* ---------- FAQ (bloc Détails natif : clavier et lecteurs d'écran gérés par le navigateur) ---------- */
.wp-block-details.is-style-clairnexa-faq {
	border-bottom: 1px solid var(--cx-border);
	padding-block: 4px;
}

.is-style-clairnexa-faq summary {
	min-height: var(--cx-btn-h);
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	font-weight: 700;
	color: var(--cx-navy);
	cursor: pointer;
	list-style: none;
}

.is-style-clairnexa-faq summary::-webkit-details-marker {
	display: none;
}

.is-style-clairnexa-faq summary::after {
	content: "+" / "";
	font-size: 1.5rem;
	line-height: 1;
	color: var(--cx-green-text);
	flex-shrink: 0;
}

.is-style-clairnexa-faq[open] summary::after {
	content: "−" / "";
}

.is-style-clairnexa-faq > :not(summary) {
	margin: 0 0 12px;
}

/* ---------- Paragraphes ---------- */
.is-style-clairnexa-disclosure {
	font-size: var(--cx-fs-sm);
	color: var(--cx-gray-text);
	line-height: 1.5;
}

.is-style-clairnexa-kicker {
	font-size: 0.8125rem;
	font-weight: 700;
	letter-spacing: 0.06em;
	text-transform: uppercase;
	color: var(--cx-green-text);
	margin-bottom: 0 !important;
}

.is-style-clairnexa-panel-dark .is-style-clairnexa-kicker {
	color: var(--cx-green-light);
}

.is-style-clairnexa-panel-dark .is-style-clairnexa-disclosure {
	color: var(--cx-footer-muted);
}

/* Contraste forcé */
@media (forced-colors: active) {
	.is-style-clairnexa-alert-info::before,
	.is-style-clairnexa-alert-warning::before,
	.is-style-clairnexa-alert-risk::before,
	.is-style-clairnexa-transparency::before,
	.is-style-clairnexa-check li::before {
		background-color: CanvasText;
	}
}