/*
Theme Name: BOTC Grimoire
Theme URI: https://example.com
Description: GeneratePress child theme establishing a shared ink, parchment and brass visual language for the games hosted on this site.
Author: Jamie
Template: generatepress
Version: 1.1.0
Text Domain: botc-grimoire
*/

/* ==========================================================================
   Design tokens — the shared palette/type system every game plugin on this
   site should reference (var(--gold), var(--parchment), etc.) rather than
   hardcoding its own hex values, so the whole site stays in sync.
   ========================================================================== */
:root {
    --ink: #17120d;
    --ink-2: #1f1811;
    --parchment: #ecdfc0;
    --parchment-2: #e0d0a8;
    --panel: #2b2118;
    --panel-2: #362a1e;
    --gold: #c9a227;
    --gold-dim: #8a6f22;
    --correct: #15803d;
    --correct-dark: #0d5c2c;
    --incorrect: #b91c1c;
    --incorrect-dark: #7f1414;
    --ink-text: #2c2214;

    --font-display: 'Cinzel', serif;
    --font-voice: 'Cormorant Garamond', serif;
    --font-body: 'Inter', sans-serif;
}

/* ==========================================================================
   Page canvas — dark ink background everywhere by default. A page with a
   featured image set gets that image as its background instead (see the
   .has-featured-bg rule below, applied via functions.php body_class filter).
   ========================================================================== */
html, body {
    background-color: var(--ink);
}

body {
    background-image: radial-gradient(ellipse 1200px 700px at 50% -10%, #2a1f14 0%, var(--ink) 55%);
    background-repeat: no-repeat;
    background-attachment: fixed;
    color: var(--parchment);
    font-family: var(--font-body);
}

body.has-featured-bg {
    background-size: cover;
    background-position: center top;
    background-attachment: fixed;
    position: relative;
}

/* Dark scrim over a featured-image background so text stays legible,
   regardless of how light or busy the chosen image is. */
body.has-featured-bg::before {
    content: '';
    position: fixed;
    inset: 0;
    background: linear-gradient(180deg, rgba(23,18,13,0.75) 0%, rgba(23,18,13,0.88) 60%, var(--ink) 100%);
    z-index: -1;
    pointer-events: none;
}

body.has-featured-bg {
    background-image: var(--featured-bg-image);
}

a {
    color: var(--gold);
}

a:hover {
    color: var(--parchment);
}

/* ==========================================================================
   Header / nav (GeneratePress structure, restyled)
   ========================================================================== */
.site-header,
.site-header .inside-header,
#site-navigation,
.main-navigation,
.main-navigation .inside-navigation,
.navigation-search {
    background-color: transparent !important;
}

.site-header,
.main-navigation .inside-navigation {
    border-bottom: 1px solid rgba(201, 162, 39, 0.25);
}

.site-header,
.site-header *,
.main-navigation,
.main-navigation * {
    font-family: var(--font-body);
}

.site-title,
.site-title a,
.site-branding .site-title,
.site-branding .site-title a {
    font-family: var(--font-display) !important;
    font-weight: 600;
    letter-spacing: 0.02em;
    color: var(--gold) !important;
}

.site-description {
    color: var(--parchment-2) !important;
}

.main-navigation a,
.main-navigation .menu-item a,
#site-navigation a {
    color: var(--parchment-2) !important;
    font-size: 14px;
}

.main-navigation a:hover,
.main-navigation .current-menu-item > a,
#site-navigation a:hover {
    color: var(--gold) !important;
}

/* ==========================================================================
   Footer
   ========================================================================== */
.site-footer,
.site-footer .inside-site-info,
.site-info,
footer.site-footer * {
    background-color: transparent !important;
    color: var(--parchment-2) !important;
    font-family: var(--font-body);
}

.site-footer {
    border-top: 1px solid rgba(201, 162, 39, 0.2);
}

.site-footer a,
.site-info a {
    color: var(--gold) !important;
}

/* ==========================================================================
   Ordinary content (non-game pages/posts) — keep it readable, still in
   the same voice, without needing every game's own card styling.
   GeneratePress wraps page content in its own white "inside-article" /
   "inside-page-content" panels — those need overriding directly, or the
   dark canvas shows through everywhere except where content actually is.
   ========================================================================== */
.content-area,
.site-main,
#primary,
#content,
.site-content {
    background-color: transparent !important;
}

.inside-article,
.inside-page-content,
article.page,
article.post {
    background-color: transparent !important;
}

.entry-title {
    font-family: var(--font-display);
    color: var(--gold);
}

body:not(.botc-game-page) .entry-content {
    font-family: var(--font-voice);
    font-size: 19px;
    line-height: 1.6;
    color: var(--parchment);
}

/* ==========================================================================
   Game page template — full-bleed canvas, no GP sidebar/boxed content,
   ready for a game plugin's shortcode to be dropped straight in.
   ========================================================================== */
.botc-game-page .site-content,
.botc-game-page .content-area,
.botc-game-page .site-main,
.botc-game-page #primary,
.botc-game-page #content,
.botc-game-page .inside-article,
.botc-game-page .inside-page-content,
.botc-game-page article.page {
    max-width: none;
    width: 100%;
    padding: 0;
    margin: 0;
    background: transparent !important;
    border: none;
    box-shadow: none;
}

.botc-game-page-inner {
    max-width: 980px;
    margin: 0 auto;
    padding: 48px 24px;
}

.botc-game-page .entry-title {
    font-size: 28px;
    margin-bottom: 4px;
}