/* =====================================================
   ARCHIVE PRODUITS WOOCOMMERCE — page « Nos formations »
   Le contenu est géré dans l'éditeur : élément GeneratePress « Content template - product archives »
   (encart, requête GenerateBlocks des formations, photo du bas). Ce fichier ne fait que la mise en forme,
   sur le même principe que le slider de l'accueil (requête GenerateBlocks + classes CSS).
   Réutilise : reusable-components.css (.has-inset-hero, .inset-hero-card, .section-inner, .photo-band--rounded)
   et training-card.css (la carte .training-card elle-même, définie une seule fois pour tout le site).
   ===================================================== */

/* -----------------------------------------------------
   Encart : espacements de la maquette
   ----------------------------------------------------- */
.archive-product-top .inset-hero-card h2.wp-block-heading {
	margin: 1.9rem 0 2.4rem;
}

.archive-product-top .inset-hero-card p {
	margin-bottom: 0;
}

.archive-product-top .inset-hero-card .wp-block-buttons {
	margin-top: 4.5rem;
}

/* -----------------------------------------------------
   Grille : 3 colonnes (2 sur tablette, 1 sur mobile)
   ----------------------------------------------------- */
body.post-type-archive-product .training-cards .gb-grid-column,
body.post-type-archive-product .training-cards .request-content-column {
	width: 100% !important;
}

@media (min-width: 641px) and (max-width: 1024px) {
	body.post-type-archive-product .training-cards .gb-grid-column {
		width: 50% !important;
	}
}

@media (min-width: 1025px) {
	body.post-type-archive-product .training-cards .gb-grid-column {
		width: 33.33% !important;
	}
}

/* le fond gris démarre en haut de la bannière (comme la maquette) : le groupe remonte sur la bannière, l'encart garde son chevauchement */
.archive-product-top {
	margin-top: calc((var(--inset-hero-height) + var(--spacing-lg)) * -1);
	padding-top: calc(var(--spacing-lg) + var(--inset-hero-height) / 2);
	position: relative;
	z-index: 0;
}

.archive-product-top .inset-hero-card {
	margin-top: 0 !important;
}

@media (max-width: 768px) {
	.archive-product-top {
		margin-top: calc((var(--inset-hero-height) + var(--spacing-lg)) * -1);
	}
}

/* -----------------------------------------------------
   Largeur de la grille alignée sur l'encart
   ----------------------------------------------------- */
body.post-type-archive-product .gb-container:has(> .gb-query-loop-wrapper) ,
body.post-type-archive-product .gb-container:has(.training-cards) {
	max-width: none;
}

body.post-type-archive-product .training-cards {
	width: calc(100% - var(--spacing-2xl) * 2 + 20px);
	max-width: 1350px;
	margin-left: auto !important;
	margin-right: auto !important;
	transform: translateX(-10px);
}

/* -----------------------------------------------------
   Pagination de la requête GenerateBlocks : style de la pagination ronde du site
   ----------------------------------------------------- */
body.post-type-archive-product .gb-query-loop-pagination {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	margin: 4.5rem 0 var(--spacing-xl) !important;
}

/* flèches : disque bleu nuit + chevron blanc */
body.post-type-archive-product .gb-query-loop-pagination a.gb-button-0956dab3,
body.post-type-archive-product .gb-query-loop-pagination a.gb-button-7666e2b7 {
	justify-content: center;
	width: 44px;
	height: 44px;
	padding: 0;
	border-radius: 50%;
	background-color: var(--contrast);
	color: var(--base);
}

body.post-type-archive-product .gb-query-loop-pagination a.gb-button-0956dab3 { margin-right: var(--spacing-lg); }
body.post-type-archive-product .gb-query-loop-pagination a.gb-button-7666e2b7 { margin-left: var(--spacing-lg); }

body.post-type-archive-product .gb-query-loop-pagination a.gb-button-0956dab3:hover,
body.post-type-archive-product .gb-query-loop-pagination a.gb-button-7666e2b7:hover {
	color: var(--base);
	transform: scale(1.08);
}

body.post-type-archive-product .gb-query-loop-pagination a.gb-button-0956dab3 .gb-icon svg,
body.post-type-archive-product .gb-query-loop-pagination a.gb-button-7666e2b7 .gb-icon svg {
	width: 24px;
	height: 24px;
}

/* numéros : gras, page courante sur fond blanc (le fond de la page est déjà gris clair) */
body.post-type-archive-product .gb-query-loop-pagination .page-numbers {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	height: 44px;
	padding: 0;
	border-radius: 50%;
	color: var(--contrast) !important;
	font-family: Nunito, sans-serif;
	font-size: 1.1rem;
	font-weight: 800;
	text-decoration: none;
}

body.post-type-archive-product .gb-query-loop-pagination .page-numbers.current,
body.post-type-archive-product .gb-query-loop-pagination a.page-numbers:hover {
	background-color: var(--base);
}

/* pagination : page courante (classe GenerateBlocks) + numéros */
body.post-type-archive-product .gb-query-loop-pagination .gb-block-is-current,
body.post-type-archive-product .gb-query-loop-pagination a.page-numbers:hover {
	background-color: var(--base) !important;
	color: var(--contrast) !important;
}

body.post-type-archive-product .gb-query-loop-pagination .gb-button-786b613d {
	padding: 0 !important;
}

/* grille : même largeur que l'encart à toutes les tailles d'écran ; l'écart entre cartes vient du padding des colonnes */
body.post-type-archive-product .gb-container-c8a24131 {
	width: calc(100% - var(--spacing-2xl) * 2);
	max-width: 1330px;
	margin: 0 auto !important;
	padding: 40px 0 !important;
	box-sizing: border-box;
}

body.post-type-archive-product .training-cards {
	width: auto !important;
	max-width: none !important;
	transform: none !important;
	margin-left: -20px !important;
	margin-right: 0 !important;
}

body.post-type-archive-product .training-cards .gb-grid-column {
	padding-left: 20px !important;
	box-sizing: border-box;
}

@media (min-width: 769px) and (max-width: 1024px) {
	body.post-type-archive-product .gb-container-c8a24131 { width: calc(100% - var(--spacing-lg) * 2); }
}

@media (max-width: 768px) {
	body.post-type-archive-product .gb-container-c8a24131 { width: calc(100% - var(--spacing-lg) * 2); }
	body.post-type-archive-product .training-cards { margin-left: 0 !important; max-width: 30em !important; margin: 0 auto !important; }
	body.post-type-archive-product .training-cards .gb-grid-column { padding-left: 0 !important; width: 100% !important; }
}

body.post-type-archive-product .gb-container-c8a24131 { max-width: 1330px !important; }

/* -----------------------------------------------------
   Pagination : pastille blanche arrondie (maquette), mêmes flèches et page active que le blog
   ----------------------------------------------------- */
body.post-type-archive-product .gb-query-loop-pagination {
	width: fit-content;
	margin: 4.5rem auto var(--spacing-xl) !important;
	padding: 0.5rem 0.6rem;
	background-color: var(--base);
	border-radius: 60px;
}

/* page active : disque gris clair (comme le blog) sur la pastille blanche */
body.post-type-archive-product .gb-query-loop-pagination .gb-block-is-current,
body.post-type-archive-product .gb-query-loop-pagination a.page-numbers:hover {
	background-color: var(--base-3) !important;
}

/* flèches : disque bleu nuit + chevron blanc épais, dessinés en CSS (mêmes tracés que le blog) */
body.post-type-archive-product .gb-query-loop-pagination a.gb-button-0956dab3 .gb-icon,
body.post-type-archive-product .gb-query-loop-pagination a.gb-button-7666e2b7 .gb-icon {
	display: none;
}

body.post-type-archive-product .gb-query-loop-pagination a.gb-button-0956dab3::before,
body.post-type-archive-product .gb-query-loop-pagination a.gb-button-7666e2b7::before,
body.post-type-archive-product .gb-query-loop-pagination:not(:has(.gb-button-0956dab3))::before {
	content: "";
	width: 30px;
	height: 30px;
	background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M8 3.5L16.5 12 8 20.5' stroke='white' stroke-width='4.5'/%3E%3C/svg%3E") center / contain no-repeat;
}

body.post-type-archive-product .gb-query-loop-pagination a.gb-button-0956dab3::before,
body.post-type-archive-product .gb-query-loop-pagination:not(:has(.gb-button-0956dab3))::before {
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none'%3E%3Cpath d='M16 3.5L7.5 12 16 20.5' stroke='white' stroke-width='4.5'/%3E%3C/svg%3E");
}

/* flèche « précédent » inactive (page 1) : contour bleu nuit, fond transparent */
body.post-type-archive-product .gb-query-loop-pagination:not(:has(.gb-button-0956dab3))::before {
	order: -1;
	box-sizing: border-box;
	flex: none;
	width: 44px;
	height: 44px;
	margin-right: var(--spacing-lg);
	border: 2px solid var(--contrast);
	border-radius: 50%;
	background-size: 30px;
	background-repeat: no-repeat;
	background-position: center;
	filter: invert(1) brightness(0.1);
}

/* image du bas : même largeur que l'encart et la grille */
body.post-type-archive-product .archive-product-page .section-inner--wide,
body.post-type-archive-product .entry-content > .section-inner--wide,
body.post-type-archive-product .section-inner--wide:has(> .wp-block-image) {
	width: calc(100% - var(--spacing-2xl) * 2);
	max-width: 1330px !important;
	margin-left: auto;
	margin-right: auto;
	padding-left: 0;
	padding-right: 0;
	box-sizing: border-box;
}

@media (max-width: 1024px) {
	body.post-type-archive-product .section-inner--wide:has(> .wp-block-image) { width: calc(100% - var(--spacing-lg) * 2); }
}

/* une seule page : pas de pagination */
body.post-type-archive-product .gb-query-loop-pagination:not(:has(.page-numbers)) {
	display: none;
}

/* image du bas : le bloc Image est dans un conteneur interne */
body.post-type-archive-product .section-inner--wide:has(.wp-block-image) {
	width: calc(100% - var(--spacing-2xl) * 2);
	max-width: 1330px !important;
	margin-left: auto;
	margin-right: auto;
	padding-left: 0 !important;
	padding-right: 0 !important;
	box-sizing: border-box;
}

@media (max-width: 1024px) {
	body.post-type-archive-product .section-inner--wide:has(.wp-block-image) { width: calc(100% - var(--spacing-lg) * 2); }
}

/* l'image est dans la section de la grille : elle en prend simplement toute la largeur */
body.post-type-archive-product .gb-container-c8a24131 .section-inner--wide:has(.wp-block-image) {
	width: 100% !important;
	max-width: none !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
}

/* flèches : le span de texte vide + column-gap décalaient le chevron ; on centre le pseudo-élément */
body.post-type-archive-product .gb-query-loop-pagination a.gb-button-0956dab3,
body.post-type-archive-product .gb-query-loop-pagination a.gb-button-7666e2b7 {
	column-gap: 0 !important;
	justify-content: center !important;
	align-items: center !important;
}

body.post-type-archive-product .gb-query-loop-pagination a.gb-button-0956dab3 .gb-button-text,
body.post-type-archive-product .gb-query-loop-pagination a.gb-button-7666e2b7 .gb-button-text {
	display: none;
}

/* sans pagination : espace entre la dernière rangée de cartes et la photo */
body.post-type-archive-product .gb-query-loop-pagination:not(:has(.page-numbers)) + .section-inner--wide {
	margin-top: 4.5rem !important;
}

/* encart : espace paragraphe → bouton égal à l'espace titre → paragraphe (le bloc Bouton ajoute déjà 24px) */
body.post-type-archive-product .archive-product-top .inset-hero-card .wp-block-buttons {
	margin-top: 1.1rem !important;
}