/*
Theme Name: GeneratePress Child
Theme URI: https://slangmaxxing.com
Description: Child theme for GeneratePress
Author: SlangMaxxing
Template: generatepress
Version: 1.0.0
*/

@import url("../generatepress/style.css");

/* =========================================================
   SlangMaxxing visual system
   Dark, editorial, typography-driven -- matches the approved
   design direction (see brands/slangmaxxing/VISUALS.md and the
   published mockup). Remaps GeneratePress's own color variables
   rather than fighting them, since nearly every component in
   this theme already reads from these six custom properties.
   This file intentionally contains ONLY SlangMaxxing rules --
   no inherited CalibratedCuisine recipe CSS.
   ========================================================= */
:root {
    --contrast:   #f5f3ee;                    /* primary text */
    --contrast-2: rgba(245,243,238,0.62);     /* secondary/meta text */
    --contrast-3: rgba(245,243,238,0.24);     /* hairlines, borders */
    --base:       #17181a;                    /* subtle raised surface */
    --base-2:     #0b0b0c;                    /* page background */
    --base-3:     #131315;                    /* card/header/nav surfaces */
    --accent:     #c8ff4d;                    /* single accent -- links, buttons, current-nav */
    --accent-ink: #0b0b0c;                    /* text color ON the accent */
}

body {
    font-family: Lora, Georgia, 'Times New Roman', serif;
}

.main-title a,
.entry-title a,
h1, h2, h3, h4,
.wp-block-heading,
.widget-title,
.copyright-bar {
    font-family: Nunito, -apple-system, 'Segoe UI', Helvetica, Arial, sans-serif;
    font-weight: 800;
    letter-spacing: -0.02em;
}

/* Buttons -- always dark text on the accent, never accent-on-accent */
button, html input[type="button"], input[type="reset"], input[type="submit"],
a.button, a.wp-block-button__link:not(.has-background),
a.read-more-btn {
    background-color: var(--accent) !important;
    color: var(--accent-ink) !important;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    font-size: 0.8em;
    border-radius: 4px;
    border: none;
}
button:hover, html input[type="button"]:hover, input[type="reset"]:hover,
input[type="submit"]:hover, a.button:hover, a.read-more-btn:hover {
    background-color: #b3e63f !important;
    color: var(--accent-ink) !important;
}

/* Category pills / entry meta -- accent, not CC's green */
.cat-links a, .entry-categories a {
    background: var(--accent) !important;
    color: var(--accent-ink) !important;
    border-radius: 100px;
    padding: 2px 10px;
    text-decoration: none !important;
    font-size: 0.8em;
    font-weight: 700;
}
.cat-links a:hover, .entry-categories a:hover {
    background: #b3e63f !important;
}
.entry-meta, .entry-meta a, footer.entry-meta a { color: var(--contrast-2) !important; }
.entry-meta .gp-icon svg, footer.entry-meta .gp-icon svg { fill: var(--contrast-2); }

/* Header / nav (GeneratePress's own default header is hidden below;
   this file's .sm-nav / .sm-hero, injected via functions.php, replace it) */
.site-header { display: none !important; }

.sm-nav {
    background: var(--base-3);
    border-bottom: 1px solid var(--contrast-3);
}
.sm-nav-inner {
    max-width: 900px;
    margin: 0 auto;
    padding: 24px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.sm-wordmark {
    font-family: Nunito, -apple-system, 'Segoe UI', Helvetica, Arial, sans-serif;
    font-weight: 800;
    font-size: 15px;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--contrast);
    text-decoration: none;
}
.sm-wordmark span { color: var(--accent); }
.sm-nav-links a {
    font-size: 13px;
    color: var(--contrast-2);
    text-decoration: none;
    letter-spacing: 0.5px;
}
.sm-hero {
    max-width: 900px;
    margin: 0 auto;
    padding: 64px 20px 40px;
    text-align: center;
}
.sm-eyebrow {
    font-family: Nunito, -apple-system, 'Segoe UI', Helvetica, Arial, sans-serif;
    font-size: 12px;
    letter-spacing: 3px;
    text-transform: uppercase;
    color: var(--contrast-2);
    margin-bottom: 20px;
    font-weight: 600;
}
.sm-term {
    font-family: Nunito, -apple-system, 'Segoe UI', Helvetica, Arial, sans-serif;
    font-weight: 800;
    font-size: clamp(48px, 12vw, 120px);
    letter-spacing: -0.03em;
    line-height: 0.9;
    margin: 0;
    text-transform: uppercase;
    color: var(--contrast);
}
.sm-rule {
    width: 56px;
    height: 3px;
    background: var(--accent);
    margin: 28px auto 0;
}
.sm-hero-link {
    display: inline-block;
    margin-top: 28px;
    font-size: 13px;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--contrast-2);
    text-decoration: none;
    border-bottom: 1px solid var(--contrast-3);
    padding-bottom: 2px;
}

/* Guess-before-reveal card (functions.php homepage hero) */
.sm-card {
    max-width: 640px;
    margin: 40px auto 0;
    border: 1px solid var(--contrast-3);
    background: var(--base-3);
    border-radius: 6px;
    overflow: hidden;
    text-align: left;
}
.sm-card-head {
    padding: 18px 28px;
    border-bottom: 1px solid var(--contrast-3);
}
.sm-card-head-label {
    font-family: Nunito, -apple-system, 'Segoe UI', Helvetica, Arial, sans-serif;
    font-size: 12px;
    letter-spacing: 2px;
    text-transform: uppercase;
    color: var(--contrast-2);
}
.sm-guess-state { padding: 48px 28px; text-align: center; }
.sm-guess-q { font-style: italic; color: var(--contrast-2); font-size: 20px; margin: 0 0 24px; }
.sm-reveal-btn {
    appearance: none;
    border: none;
    background: var(--accent);
    color: var(--accent-ink);
    font-family: Nunito, -apple-system, 'Segoe UI', Helvetica, Arial, sans-serif;
    font-weight: 700;
    font-size: 13px;
    letter-spacing: 1px;
    text-transform: uppercase;
    padding: 14px 28px;
    border-radius: 4px;
    cursor: pointer;
}
.sm-reveal-btn:hover { background: #b3e63f; }
.sm-reveal-state { display: none; padding: 28px; }
.sm-reveal-state.on { display: block; }

/* Term-entry content structure (used inside post_content) */
.sm-def { font-size: 20px; line-height: 1.5; margin: 0 0 18px; color: var(--contrast); }
.sm-def b, .sm-def strong { color: var(--accent); }
.sm-example {
    font-style: italic;
    color: var(--contrast-2);
    font-size: 15px;
    border-left: 2px solid var(--contrast-3);
    padding-left: 14px;
    margin: 0 0 20px;
}
.sm-origin { font-size: 13px; color: var(--contrast-2); line-height: 1.6; margin: 0 0 22px; }
.sm-origin b, .sm-origin strong { color: var(--contrast); font-weight: 600; }
.sm-meta-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    flex-wrap: wrap;
    gap: 8px;
    padding-top: 16px;
    border-top: 1px solid var(--contrast-3);
    font-size: 13px;
    color: var(--contrast-2);
}
.sm-tag {
    font-size: 11px;
    letter-spacing: 1.5px;
    text-transform: uppercase;
    color: var(--contrast-2);
    border: 1px solid var(--contrast-3);
    padding: 5px 11px;
    border-radius: 100px;
}

/* Single-column, centered, editorial width -- this brand doesn't use a sidebar */
.widget-area.sidebar { display: none !important; }
.site-content .content-area,
body:not(.no-sidebar) .site-content .content-area { width: 100% !important; }
.site.grid-container { max-width: 900px; }

/* Cards for post entries */
.separate-containers .inside-article,
.separate-containers .comments-area,
.separate-containers .page-header {
    background-color: var(--base-3) !important;
    border: 1px solid var(--contrast-3);
    border-radius: 6px;
}

/* Related posts (functions.php generate_after_entry_content) */
.sm-related h3 {
    font-size: 14px;
    letter-spacing: 1px;
    text-transform: uppercase;
    color: var(--contrast-2);
}
.sm-related-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
    gap: 16px;
}
.sm-related-item img {
    width: 100%;
    border-radius: 4px;
    margin-bottom: 6px;
}
.sm-related-item a {
    color: var(--contrast);
    text-decoration: none;
    font-size: 0.9em;
}

/* Reading progress bar (functions.php wp_footer) */
#sm-progress {
    position: fixed;
    top: 0; left: 0;
    width: 0%;
    height: 3px;
    background-color: var(--accent);
    z-index: 9999;
}

.sm-read-time {
    color: var(--contrast-2);
    font-size: 0.85em;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.site-footer, .site-info {
    background-color: var(--base-2) !important;
    border-top: 1px solid var(--contrast-3);
}
.copyright-bar {
    color: var(--contrast-2);
    font-size: 0.85em;
    text-transform: none;
    letter-spacing: normal;
}

/* Comments -- keep readable on dark background, no CC-specific color */
.comment-author, .comment-meta, .comment-meta a { color: var(--contrast-2); }
.comment-content { color: var(--contrast); }
.must-log-in a { color: var(--accent); }