/* ===================================================================
   Best10Betting — Redesign visuel (thème Mercury)
   Chargé après mercury-style.css et aces-style.css : toutes les règles
   ci-dessous gagnent en cascade (ordre de chargement + spécificité
   volontairement égale ou légèrement supérieure, jamais de guerre de
   !important sauf là où le thème lui-même en abuse déjà).
   =================================================================== */

/* -------------------------------------------------------------------
   1. Palette — remplace le "Flat UI" 2013 (rouge/violet daté) par une
   identité navy + vert (confiance/vérifié, cohérent avec le
   positionnement "revues indépendantes, licences vérifiées") + or
   (accent premium pour les classements #2/#3 et les étoiles).
   Ces variables pilotent automatiquement tout ce qui utilise déjà les
   classes has-mercury-*-color générées par le thème (boutons, textes).
   `html:root` a une spécificité légèrement supérieure à `:root` seul
   utilisé par le thème, donc ça gagne même si notre feuille était
   chargée avant la sienne.
   ------------------------------------------------------------------- */
html:root {
	--wp--preset--color--mercury-main: #5b6b82; /* texte secondaire */
	--wp--preset--color--mercury-second: #17c978; /* accent CTA principal (était #d63031) */
	--wp--preset--color--mercury-white: #fff;
	--wp--preset--color--mercury-gray: #101b33; /* titres / texte fort (était #263238) */
	--wp--preset--color--mercury-clouds: #f4f7fb; /* fond de section clair (était #ecf0f1) */
	--wp--preset--color--mercury-emerald: #17c978; /* vert (était #2edd6c) */
	--wp--preset--color--mercury-alizarin: #ff5a5f; /* rouge alerte, adouci (était #e74c3c) */
	--wp--preset--color--mercury-peter-river: #2f80ed; /* bleu info (était #3498db) */
	--wp--preset--color--mercury-wisteria: #ffb020; /* or accent (remplace le violet #8e44ad) */
}

body.wp-theme-mercury {
	color: #101b33;
}

/* -------------------------------------------------------------------
   2. Header — ombre plus nette au scroll (sticky), accents recolorés
   Ce site utilise le markup "Header #1" du thème (.space-header-wrap /
   .space-header-menu), pas la variante "Header #2" (.space-header-2-*)
   — corrigé le 2026-08-05, la v1 ciblait les mauvaises classes (jamais
   présentes dans le DOM ici, donc sans aucun effet).
   ------------------------------------------------------------------- */
.space-header-wrap {
	box-shadow: 0 2px 20px 0 rgba(16, 27, 51, 0.08);
}
.space-header-wrap.fixed {
	box-shadow: 0 4px 24px 0 rgba(16, 27, 51, 0.14);
}
.space-header-logo-ins a,
.space-header-menu ul.main-menu li,
.space-header-menu ul.main-menu li a {
	color: #101b33;
}
.space-header-menu ul.main-menu li a:hover,
.space-header-menu ul.main-menu li:hover a {
	color: #17c978 !important;
	border-bottom: 2px solid #17c978 !important;
}
.space-header-menu ul.main-menu li ul.sub-menu li a:hover {
	color: #17c978 !important;
}

/* -------------------------------------------------------------------
   3. Boutons — plus généreux, coins arrondis, légère élévation au survol
   ------------------------------------------------------------------- */
.wp-block-button__link,
.space-organizations-3-archive-item-button-ins a,
.space-organizations-4-archive-item-button-one-ins a,
.space-organizations-4-archive-item-button-two-ins a {
	border-radius: 8px !important;
	font-weight: 700 !important;
	letter-spacing: 0.02em;
	transition: transform 0.15s ease-in-out, box-shadow 0.15s ease-in-out, background-color 0.15s ease-in-out;
}
.wp-block-button__link {
	padding: 0.9em 1.6em !important;
}
.wp-block-button .wp-block-button__link:hover {
	background-color: #12a868 !important;
	box-shadow: 0 10px 24px 0 rgba(23, 201, 120, 0.35);
	transform: translateY(-2px);
}

/* CTA "miser / bonus" des cards bookmakers (vert) */
.space-organizations-4-archive-item-button-two-ins a {
	background-color: #17c978 !important;
}
.space-organizations-4-archive-item-button-two-ins a:hover {
	background-color: #12a868 !important;
	transform: translateY(-2px);
	box-shadow: 0 8px 18px 0 rgba(23, 201, 120, 0.35);
}
/* CTA secondaire "avis / conditions" (navy plutôt que gris terne) */
.space-organizations-4-archive-item-button-one-ins a {
	background-color: #eef2f8 !important;
	color: #101b33 !important;
}
.space-organizations-4-archive-item-button-one-ins a:hover {
	background-color: #101b33 !important;
	color: #fff !important;
	transform: translateY(-2px);
}

/* -------------------------------------------------------------------
   4. Étoiles de notation — or plutôt que rose vif, plus lisible/premium
   ------------------------------------------------------------------- */
.star-rating .star,
.space-organization-content-logo-stars i {
	color: #ffb020 !important;
}

/* -------------------------------------------------------------------
   5. Cards bookmakers — widget "Top classement" (space-organizations-3)
   Ombre teintée navy (plus premium que le bleu-gris par défaut),
   coins plus arrondis, élévation au survol plus marquée.
   ------------------------------------------------------------------- */
.space-organizations-3-archive-item-ins {
	border-radius: 12px !important;
	box-shadow: 0 8px 30px 0 rgba(16, 27, 51, 0.1) !important;
	transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out !important;
}
.space-organizations-3-archive-item-ins:hover {
	box-shadow: 0 16px 40px 0 rgba(16, 27, 51, 0.18) !important;
	transform: translateY(-4px);
}
.space-organizations-3-title-box a {
	color: #101b33 !important;
}
.space-organizations-3-title-box a:hover {
	color: #17c978 !important;
}
.space-organizations-3-archive-item-terms-ins a {
	color: #17c978 !important;
}
.space-organizations-3-archive-item-terms-ins strong {
	color: #101b33 !important;
}
/* Badge de classement — #1 en vert (repère "meilleur choix"), les
   suivants en or plutôt que le violet par défaut du thème */
.space-organizations-3-archive-item-count,
.space-organizations-3-archive-item-count-2 {
	background-color: #ffb020 !important;
}
.space-organizations-3-archive-item:first-child .space-organizations-3-archive-item-count,
.space-organizations-3-archive-item:first-child .space-organizations-3-archive-item-count-2 {
	background-color: #17c978 !important;
}

/* -------------------------------------------------------------------
   6. Cards bookmakers — widget alternatif (space-organizations-4)
   ------------------------------------------------------------------- */
.space-organizations-4-archive-item-ins {
	border-radius: 12px !important;
	background-color: #f4f7fb !important;
	transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out !important;
}
.space-organizations-4-archive-item-ins:hover {
	box-shadow: 0 16px 40px 0 rgba(16, 27, 51, 0.16) !important;
	transform: translateY(-4px);
}
.space-footer .space-organizations-4-archive-item-ins {
	background-color: #fff !important;
}
.space-organizations-4-archive-item-title a {
	color: #101b33 !important;
}
.space-organizations-4-archive-item-title a:hover {
	color: #17c978 !important;
}
.space-organizations-4-archive-item-desc,
.space-organizations-4-archive-item-desc a {
	color: #5b6b82 !important;
}

/* -------------------------------------------------------------------
   7. Cards actualités (space-news-1)
   ------------------------------------------------------------------- */
.space-news-1-item img {
	border-radius: 8px;
	transition: transform 0.25s ease-in-out;
}
.space-news-1-item:hover img {
	transform: scale(1.04);
}
.space-news-1-item-title a {
	color: #101b33 !important;
}
.space-news-1-item-title a:hover {
	color: #17c978 !important;
}
.space-news-1-item-meta {
	color: #5b6b82 !important;
}

/* -------------------------------------------------------------------
   8. Rythme des sections — un peu plus d'air entre les blocs
   ------------------------------------------------------------------- */
.wp-block-group.has-mercury-clouds-background-color {
	padding-top: 3.5em !important;
	padding-bottom: 3.5em !important;
}

/* -------------------------------------------------------------------
   9bis. Filet de sécurité menu mobile — cause réelle trouvée le
   2026-08-05 : le mu-plugin wordpress-snippets/center-menu.php forçait
   `.space-header-menu ul.main-menu { display:flex }` sans media query,
   ce qui écrasait le `display:none` mobile de mercury-media.css (menu
   desktop et bouton hamburger visibles ensemble). Corrigé à la source
   dans center-menu.php (règle restreinte à >=1200px) — cette règle-ci
   n'est qu'un filet de sécurité pour ne plus dépendre de l'ordre entre
   mercury-media.css et cette feuille.
   ------------------------------------------------------------------- */
@media screen and (max-width: 1199px) {
	.space-header-menu ul.main-menu {
		display: none !important;
	}
	.space-mobile-menu-icon {
		display: block !important;
	}
}
@media screen and (min-width: 1200px) {
	.space-mobile-menu-icon {
		display: none !important;
	}
}

/* -------------------------------------------------------------------
   9. Mobile — CTA pleine largeur pour un tap plus facile
   ------------------------------------------------------------------- */
@media screen and (max-width: 480px) {
	.wp-block-buttons .wp-block-button {
		width: 100%;
	}
	.wp-block-button__link {
		display: block;
		text-align: center;
	}
}

/* ===================================================================
   PASSE 2 — la home page réelle n'est PAS construite avec les widgets
   space-organizations-3/4 ci-dessus (ceux-là ne servent qu'aux
   shortcodes [aces-casinos-4]/[aces-casinos-5] plus bas dans la page).
   Le haut de la home est du Gutenberg pur (paragraphes/colonnes/groupes
   avec bordure #e4e4e4 en style inline) — jamais ciblé par la passe 1,
   ce qui explique le "je ne vois pas de changement". Cette passe cible
   la structure réelle : liens du corps de texte, titres de section,
   cards de bookmakers faites à la main, FAQ, hero, footer.
   =================================================================== */

/* -------------------------------------------------------------------
   10. Liens du corps de texte — c'était le rose vif du thème (#ff2453)
   partout dans les paragraphes (jamais couvert par la passe 1), un des
   éléments les plus visibles sur une page aussi longue que la home.
   ------------------------------------------------------------------- */
.space-page-content a {
	color: #12a868;
	text-decoration-color: rgba(18, 168, 104, 0.35);
	text-underline-offset: 2px;
	font-weight: 600;
}
.space-page-content a:hover {
	color: #101b33;
	text-decoration-color: currentColor;
}

/* -------------------------------------------------------------------
   11. Titres de section — repère éditorial (barre d'accent + tracking),
   au lieu du Roboto Bold plat par défaut. Cible directement les H2/H3
   de la home, pas seulement les classes has-mercury-*.
   ------------------------------------------------------------------- */
.space-page-content h1,
.space-page-content h2,
.space-page-content h3 {
	color: #101b33;
	font-weight: 900;
	letter-spacing: -0.01em;
}
.space-page-content > h2.has-text-align-center,
.space-page-content > h2 {
	position: relative;
	margin-top: 1.3em !important;
	padding-top: 0.2em;
}
.space-page-content > h2.has-text-align-center::before {
	content: "";
	display: block;
	width: 56px;
	height: 4px;
	margin: 0 auto 0.6em;
	background-color: #17c978;
	border-radius: 2px;
}
.space-page-content > h2:not(.has-text-align-center)::before {
	content: "";
	display: block;
	width: 40px;
	height: 4px;
	margin-bottom: 0.6em;
	background-color: #17c978;
	border-radius: 2px;
}

/* -------------------------------------------------------------------
   12. Hero (bandeau plein écran, remplace l'image bannière retirée)
   ------------------------------------------------------------------- */
.b10-hero {
	text-align: center;
	background-image: radial-gradient(circle at 15% 20%, rgba(23, 201, 120, 0.18), transparent 45%),
		radial-gradient(circle at 85% 0%, rgba(255, 176, 32, 0.12), transparent 40%);
}
.b10-hero h1 {
	font-size: 2.6em !important;
	font-weight: 900 !important;
	letter-spacing: -0.02em;
	max-width: 16em;
	margin-left: auto !important;
	margin-right: auto !important;
}
.b10-eyebrow {
	display: inline-block;
	margin-bottom: 1em !important;
	padding: 0.4em 1em;
	border: 1px solid rgba(255, 255, 255, 0.25);
	border-radius: 999px;
	font-size: 0.8em;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-transform: uppercase;
	color: #fff;
	opacity: 0.9;
}
.b10-hero-sub {
	max-width: 34em;
	margin: 1em auto 1.6em !important;
	font-size: 1.15em;
	color: rgba(255, 255, 255, 0.8) !important;
}
.b10-hero .wp-block-buttons {
	margin-top: 0.5em;
}
.b10-hero .wp-block-button.is-style-outline .wp-block-button__link {
	border: 2px solid rgba(255, 255, 255, 0.6);
	color: #fff;
	padding: 0.75em 1.8em !important;
	text-transform: uppercase;
	font-size: 0.85em;
	letter-spacing: 0.06em;
}
.b10-hero .wp-block-button.is-style-outline .wp-block-button__link:hover {
	background-color: #fff !important;
	color: #101b33 !important;
	border-color: #fff !important;
	box-shadow: none !important;
	transform: none;
}

/* -------------------------------------------------------------------
   13. Cards de bookmakers faites à la main (les 4 "top picks" juste
   sous le hero) — wp-block-group avec bordure #e4e4e4 inline et
   border-radius 10px. Numérotées automatiquement en CSS (01/02/03/04)
   pour un vrai effet "classement", sans toucher au contenu.
   ------------------------------------------------------------------- */
.wp-block-columns:has(> .wp-block-column [style*="radius:10px"]) {
	counter-reset: b10-rank;
}
.wp-block-column [style*="border-color:#e4e4e4"][style*="radius:10px"] {
	position: relative;
	counter-increment: b10-rank;
	border: none !important;
	border-radius: 16px !important;
	background-color: #fff;
	box-shadow: 0 10px 30px 0 rgba(16, 27, 51, 0.1);
	transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
}
.wp-block-column [style*="border-color:#e4e4e4"][style*="radius:10px"]:hover {
	transform: translateY(-6px);
	box-shadow: 0 20px 40px 0 rgba(16, 27, 51, 0.18);
}
.wp-block-column [style*="border-color:#e4e4e4"][style*="radius:10px"]::before {
	counter-increment: none;
	content: "#" counter(b10-rank);
	position: absolute;
	top: -14px;
	left: 18px;
	min-width: 34px;
	padding: 0.25em 0.6em;
	background-color: #101b33;
	color: #fff;
	font-size: 0.8em;
	font-weight: 800;
	border-radius: 999px;
	box-shadow: 0 4px 10px 0 rgba(16, 27, 51, 0.3);
}
.wp-block-columns:has(> .wp-block-column:first-child [style*="radius:10px"]) .wp-block-column:first-child [style*="radius:10px"]::before {
	background-color: #17c978;
}
.wp-block-column [style*="border-color:#e4e4e4"][style*="radius:10px"] h3 {
	font-size: 1.15em !important;
	margin-top: 0.4em !important;
}
/* la note "★ 4.3 / 5" est en style inline (couleur #00a651) : ciblée par
   substring sur le style, boostée en or et agrandie */
.wp-block-column p[style*="00a651"] {
	color: #ffb020 !important;
	font-size: 1.05em !important;
	letter-spacing: 0.02em;
}

/* -------------------------------------------------------------------
   14. FAQ / blocs "accordéon visuel" (même bordure #e4e4e4, radius 6px)
   ------------------------------------------------------------------- */
.wp-block-group[style*="border-color:#e4e4e4"][style*="radius:6px"] {
	border: none !important;
	border-left: 4px solid #17c978 !important;
	border-radius: 8px !important;
	background-color: #f4f7fb;
	box-shadow: none !important;
	transition: background-color 0.15s ease-in-out;
}
.wp-block-group[style*="border-color:#e4e4e4"][style*="radius:6px"]:hover {
	background-color: #eef2f8;
}
.wp-block-group[style*="border-color:#e4e4e4"][style*="radius:6px"] h3 {
	color: #101b33;
	font-size: 1.05em !important;
}

/* -------------------------------------------------------------------
   15. Nettoyage — icônes de démo du thème jamais remplacées (30x30px,
   fichiers "demo5-icon-*.webp"), un des signes les plus visibles d'un
   thème WordPress pas fini. On les masque plutôt que de les recolorer.
   ------------------------------------------------------------------- */
.wp-block-image:has(> img[class*="wp-image-374"]),
.wp-block-image:has(> img[class*="wp-image-376"]) {
	display: none;
}

/* -------------------------------------------------------------------
   16. Footer — navy plutôt que noir/gris plat, cohérent avec le hero
   ------------------------------------------------------------------- */
.space-footer-top {
	background-color: #f4f7fb;
}
.space-footer-copy {
	background-color: #101b33;
}
.space-footer-top-age span.age-limit {
	background-color: #17c978;
}
.space-footer-top-soc a:hover {
	border-color: #17c978 !important;
	background-color: #17c978 !important;
	color: #fff !important;
}

/* -------------------------------------------------------------------
   17. Listes numérotées de la section méthodologie — puces carrées
   vertes plutôt que les chiffres noirs par défaut du navigateur
   ------------------------------------------------------------------- */
.space-page-content ol {
	counter-reset: b10-list;
	list-style: none;
	padding-left: 0.2em;
}
.space-page-content ol li {
	counter-increment: b10-list;
	position: relative;
	padding-left: 2.2em !important;
	margin-bottom: 1em;
}
.space-page-content ol li::before {
	content: counter(b10-list);
	position: absolute;
	left: 0;
	top: 0.1em;
	width: 1.6em;
	height: 1.6em;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: #17c978;
	color: #fff;
	font-weight: 800;
	font-size: 0.85em;
	border-radius: 6px;
}

/* -------------------------------------------------------------------
   18. Densité — trop de blancs entre les blocs : les wp:spacer du
   contenu (15/20/45/60px selon l'endroit) sont plafonnés, et les
   paragraphes resserrés. On ne change pas le contenu (fragile à
   maintenir bloc par bloc), on plafonne au niveau CSS.
   ------------------------------------------------------------------- */
.space-page-content .wp-block-spacer {
	max-height: 22px !important;
}
.b10-hero + .wp-block-spacer {
	max-height: 10px !important;
}
.space-page-content p {
	padding-bottom: 1em;
}

/* -------------------------------------------------------------------
   19. Hero — moins épais (padding réduit directement dans le contenu
   de la page, cf REST) + taille de titre légèrement réduite pour
   rester proportionné à la nouvelle hauteur.
   ------------------------------------------------------------------- */
.b10-hero h1 {
	font-size: 2.2em !important;
}
.b10-eyebrow {
	margin-bottom: 0.7em !important;
}
.b10-hero-sub {
	margin: 0.7em auto 1.2em !important;
}

/* -------------------------------------------------------------------
   20. Derniers articles (bas de page, façon "Latest" ruedesjoueurs.com)
   — bloc core wp:latest-posts en grille, habillé en cards.
   ------------------------------------------------------------------- */
.b10-latest-posts.wp-block-latest-posts {
	gap: 0;
}
.b10-latest-posts li {
	background-color: #fff;
	border-radius: 12px;
	box-shadow: 0 6px 20px 0 rgba(16, 27, 51, 0.08);
	overflow: hidden;
	transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
	padding-bottom: 1em !important;
}
.b10-latest-posts li:hover {
	transform: translateY(-4px);
	box-shadow: 0 14px 30px 0 rgba(16, 27, 51, 0.16);
}
.b10-latest-posts .wp-block-latest-posts__featured-image {
	margin: 0 0 0.8em !important;
}
.b10-latest-posts .wp-block-latest-posts__featured-image img {
	width: 100%;
	aspect-ratio: 16 / 10;
	object-fit: cover;
	border-radius: 0;
	transition: transform 0.3s ease-in-out;
}
.b10-latest-posts li:hover .wp-block-latest-posts__featured-image img {
	transform: scale(1.05);
}
.b10-latest-posts .wp-block-latest-posts__post-title {
	display: block;
	padding: 0 1.1em;
	color: #101b33;
	font-weight: 800;
	font-size: 1.05em;
	text-decoration: none !important;
	line-height: 1.35em;
}
.b10-latest-posts .wp-block-latest-posts__post-title:hover {
	color: #17c978;
}
.b10-latest-posts .wp-block-latest-posts__post-date {
	display: block;
	padding: 0.4em 1.1em 0;
	color: #94a3b8;
	font-size: 0.8em;
	text-transform: uppercase;
	letter-spacing: 0.04em;
}
