/* ==========================================================================
   Fox Poker — dark theme for static content pages
   (regles, tournoi-poker, variantes-poker, webcam-poker).
   Reuses the same markup/class names as blog.css (.blogHeader, .postArticle,
   #content, .faqAccordion) but with a dark palette. Only loaded by these
   four pages — does not affect /blog/ or any other page.
   ========================================================================== */

:root{
	--cd-red:#e21b2e;
	--cd-red-deep:#7a0d14;
	--cd-gold:#f0c667;
	--cd-bg:#0a0b10;
	--cd-card:#151824;
	--cd-border:rgba(255,255,255,.08);
	--cd-border-strong:rgba(255,255,255,.16);
	--cd-ink:#f4f5fa;
	--cd-dim:#b7bacb;
	--cd-faint:#7d8299;
}
*{box-sizing:border-box}
body{background:var(--cd-bg);margin:0;color:var(--cd-ink)}

.blogHeader{
	background:
		radial-gradient(900px 400px at 15% -20%,rgba(226,27,46,.28),transparent 60%),
		linear-gradient(135deg,var(--cd-red-deep) 0%,#2a0a0d 100%);
	padding:26px 24px;display:flex;align-items:center;gap:16px;
	border-bottom:1px solid var(--cd-border);
}
.blogHeader__inner{max-width:820px;margin:0 auto;width:100%;display:flex;align-items:center;gap:16px}
.blogHeader img.logo{width:52px;height:auto;flex-shrink:0;filter:drop-shadow(0 4px 10px rgba(0,0,0,.5))}
.blogHeader .titles{flex:1;min-width:0}
.blogHeader a.back{
	flex-shrink:0;color:#fff;text-decoration:none;font-size:13px;font-weight:700;
	background:rgba(255,255,255,.08);border:1px solid var(--cd-border-strong);
	padding:8px 14px;border-radius:999px;white-space:nowrap;
}
.blogHeader a.back:hover{background:rgba(255,255,255,.16)}

#content{max-width:820px;margin:0 auto;padding:36px 20px 60px}

.postArticle h1{
	font-size:clamp(24px,3.4vw,32px);line-height:1.25;color:#fff;
	margin:0 0 22px;font-weight:800;letter-spacing:-.3px;
}
.postArticle .body{font-size:16px;line-height:1.75;color:var(--cd-dim)}
.postArticle .body p{margin:0 0 18px}
.postArticle .body img{max-width:100%;height:auto;border-radius:12px;margin:8px 0;border:1px solid var(--cd-border)}
.postArticle .body h2{font-size:22px;margin:36px 0 14px;color:#fff;font-weight:700}
.postArticle .body h3{font-size:18px;margin:26px 0 12px;color:#fff;font-weight:700}
.postArticle .body em{color:var(--cd-faint)}
.postArticle .body a{color:var(--cd-gold);text-decoration:none;border-bottom:1px solid rgba(240,198,103,.35)}
.postArticle .body a:hover{border-color:var(--cd-gold)}
.postArticle .body strong{color:var(--cd-ink)}
.postArticle .body ul{margin:0 0 18px;padding-left:22px}
.postArticle .body ul li{margin-bottom:10px}
.postArticle .body ul li strong{color:var(--cd-ink)}

.faqAccordion{margin-top:10px}
.faqAccordion details{
	background:var(--cd-card);border:1px solid var(--cd-border);border-radius:12px;
	padding:16px 18px;margin-bottom:10px;
}
.faqAccordion summary{
	cursor:pointer;font-weight:700;color:#fff;font-size:15px;list-style:none;
	display:flex;align-items:center;justify-content:space-between;gap:12px;
}
.faqAccordion summary::-webkit-details-marker{display:none}
.faqAccordion summary::after{content:"+";font-size:20px;color:var(--cd-gold);flex-shrink:0;transition:transform .15s}
.faqAccordion details[open] summary::after{transform:rotate(45deg)}
.faqAccordion p{margin:12px 0 0;color:var(--cd-dim);font-size:14.5px;line-height:1.6}

@media (max-width:600px){
	.blogHeader__inner{flex-wrap:wrap}
	.blogHeader a.back{order:3;width:100%;text-align:center}
}

/* ---------- Game thumbnail grid (jeux.php) ---------- */
.gameGrid{
	list-style:none;margin:0;padding:0;display:grid;
	grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px;
}
.gameGrid li{margin:0}
.gameGrid a{
	display:block;background:var(--cd-card);border:1px solid var(--cd-border);border-radius:12px;
	overflow:hidden;transition:border-color .15s,transform .15s;
}
.gameGrid a:hover{border-color:var(--cd-border-strong);transform:translateY(-2px)}
.gameGrid img{width:100%;height:auto;aspect-ratio:4/3;object-fit:cover;display:block}

@media (max-width:600px){
	.gameGrid{grid-template-columns:repeat(2,1fr);gap:10px}
}