/*
Theme Name: ArcanePlayer
Theme URI: https://arcaneplayer.com
Description: Astra child theme for ArcanePlayer — a multi-genre gaming blog covering gacha RPGs, MMO strategy, military shooters, and more, with reviews, guides, and tier lists. Built on the Astra parent theme.
Author: ArcanePlayer
Author URI: https://arcaneplayer.com
Template: astra
Version: 1.2.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: summongamers-child
*/

/*
 * This file intentionally stays minimal — it exists mainly to satisfy the
 * WordPress child theme header requirements above and to hold the site-wide
 * design tokens as CSS custom properties. All layout/component styling for
 * the homepage lives in assets/css/homepage.css so it can be conditionally
 * enqueued and kept organized. Non-homepage overrides can be added below
 * as the rest of the site is built out.
 */

:root {
	--sg-color-bg: #0A0F0A;
	--sg-color-bg-alt: #0D130D;
	--sg-color-card-bg: #121812;
	--sg-color-card-notch: #1A231A;
	--sg-color-border: #2A332A;
	--sg-color-accent-start: #39FF14;
	--sg-color-accent-end: #00B140;
	--sg-color-text-title: #FFFFFF;
	--sg-color-text-body: #A9B8A9;
	--sg-color-text-meta: #7C8A7C;
	--sg-color-dash: #4A5A4A;
	--sg-font-display: 'Rajdhani', sans-serif;
	--sg-font-body: 'Manrope', sans-serif;
	--sg-card-notch-size: 24px;
	--sg-radius-none: 0;
}

body {
	background-color: var(--sg-color-bg);
	color: var(--sg-color-text-body);
	font-family: var(--sg-font-body);
}

a {
	color: inherit;
}

/*
 * Force the dark background across every Astra wrapper element.
 *
 * Astra ships its own dynamic CSS (inc/dynamic-css/content-background.php)
 * that sets a background-color on body layout classes it adds itself via
 * body_class() — e.g. `.ast-plain-container{background-color:#fff}` — plus
 * the parent stylesheet's own `body{background-color:#fff}` rule. The
 * body-class selector has higher specificity than a plain `body` rule, so
 * it wins regardless of load order. Rather than chase every selector
 * Astra might use per page/layout setting, force the dark background on
 * `html`, `body`, and every common Astra content wrapper as a defensive
 * baseline so no white background can show through anywhere.
 *
 * `.ast-article-single` is the confirmed live culprit for the white
 * background on single.php (and, defensively, page.php): Astra's
 * `post_class()` filter adds this class to every singular post/page
 * regardless of which template calls post_class(), and Astra's own dynamic
 * CSS paints it via `.ast-separate-container .ast-article-single{...}`.
 * Verified directly on https://arcaneplayer.com/test-article/, where the
 * live `<article class="… ast-article-single">` computed to
 * `background-color: rgb(255, 255, 255)`. Static pages currently render
 * with `ast-plain-container` instead (which this rule doesn't target, so
 * they were already fine), but a page can be switched to "Separate
 * Containers" per-page in Astra, so this covers that case too rather than
 * being single.php-only.
 */
html,
body,
body.ast-plain-container,
body.ast-page-builder-template,
#page,
#content,
.site-content,
.ast-container,
.ast-separate-container,
.site-main,
main,
.ast-article-single {
	background-color: var(--sg-color-bg) !important;
}

/*
 * Root cause of the nav-to-hero gap (confirmed by inspecting the live site's
 * computed styles, not guessed): this site's Astra "Container Layout" is
 * set to "Separate Containers" (body carries the `ast-separate-container`
 * class), and Astra's own compiled CSS contains two rules of IDENTICAL
 * specificity targeting `.ast-separate-container #primary` —
 *
 *   .ast-separate-container #primary { margin: 0; padding: 4em 0; border: 0; }
 *   .ast-separate-container #primary, …other selectors… { margin: 4em 0; padding: 0; }
 *
 * — and because the second one appears later in Astra's stylesheet, it wins
 * the cascade tie-break and re-applies a 4em (64px) top+bottom margin to
 * #primary. That's the actual gap between the nav bar and the hero (and
 * between the content and the footer) — it was never a missing background
 * color, which is why the earlier background-color fix alone didn't close
 * it. `#page #primary` (id+id specificity) reliably outranks Astra's
 * class+id rule regardless of Astra's internal rule order, so this is a
 * real fix rather than another guess.
 */
#page #primary {
	margin: 0;
	padding: 0;
}

/*
 * Footer — links row (About / Privacy Policy / Terms of Use / Disclaimer /
 * Help, whichever pages actually exist) above the copyright line. Lives
 * here rather than nav.css since it's site chrome but not part of the nav
 * bar itself, and there's no dedicated footer stylesheet yet.
 */
.sg-footer {
	background-color: var(--sg-color-bg-alt, #0D130D);
	border-top: 1px solid var(--sg-color-border, #2A332A);
	padding: 32px 6vw;
}

.sg-footer__inner {
	max-width: 1280px;
	margin: 0 auto;
	text-align: center;
}

.sg-footer__links {
	margin-bottom: 16px;
	font-family: var(--sg-font-body, 'Manrope', sans-serif);
	font-size: 14px;
}

.sg-footer__links a {
	color: var(--sg-color-text-body, #A9B8A9);
	text-decoration: none;
	transition: color 0.2s ease;
}

.sg-footer__links a:hover,
.sg-footer__links a:focus-visible {
	color: var(--sg-color-accent-start, #39FF14);
}

.sg-footer__links-sep {
	color: var(--sg-color-border, #2A332A);
	margin: 0 10px;
}

.sg-footer__copy {
	margin: 0;
	font-family: var(--sg-font-body, 'Manrope', sans-serif);
	font-size: 13px;
	color: var(--sg-color-text-meta, #7C8A7C);
}
