/* NERVOSYS Blog Theme Overrides
   Matches the nervosys.ai main site aesthetic:
   - Always dark mode with soft contrast (not pure black/white)
   - Geist Sans / Geist Mono fonts
   - Monochromatic grayscale — no accent colors
   - Professional defense industry aesthetic
*/

/* ============================================
   0. Font Import — Geist Sans & Geist Mono
   ============================================ */
@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800&display=swap');

/* Geist is not on Google Fonts, so we use Inter as the closest match
   and load Geist via CDN in default.hbs for the real deal */

/* ============================================
   1. CSS Variable Overrides
   ============================================ */
:root {
    /* Nervosys dark mode palette (matching oklch values) */
    --color-darkgrey: #141414;       /* oklch(0.08 0 0) — background */
    --color-midgrey: #999999;         /* oklch(0.65 0 0) — muted text */
    --color-lightgrey: #1e1e1e;      /* oklch(0.12 0 0) — card bg */
    --color-secondary-text: #a3a3a3;  /* oklch(0.67 0 0) */
    --color-border: #3d3d3d;          /* oklch(0.25 0 0) */
    --color-wash: #e5eff5;
    --color-darkmode: #141414;        /* oklch(0.08 0 0) */

    /* Nervosys logo gradient: #ff008a (hot pink) → #8f00ff (purple) */
    --ghost-accent-color: #cc00a0;    /* midpoint of logo gradient */
    --nervosys-gradient: linear-gradient(135deg, #ff008a 0%, #8f00ff 100%);

    /* Fonts — Geist Sans as primary, fallback to Inter/system */
    --font-sans: 'Geist', 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Helvetica Neue", sans-serif;
    --font-serif: 'Geist', 'Inter', -apple-system, BlinkMacSystemFont, "Segoe UI", "Roboto", "Helvetica Neue", sans-serif;
    --font-mono: 'Geist Mono', 'JetBrains Mono', 'Fira Code', Menlo, Courier, monospace;
}

/* ============================================
   2. Base / Body — Always Dark
   ============================================ */
body {
    color: #e8e8e8;                   /* oklch(0.95 0 0) — off-white */
    background: #141414;              /* oklch(0.08 0 0) */
    font-family: var(--font-sans);
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

::selection {
    background: rgba(255, 255, 255, 0.15);
    text-shadow: none;
}

a {
    color: #e0e0e0;
}

/* ============================================
   3. Navigation / Header
   ============================================ */
.gh-head {
    background: #141414;
    color: #e8e8e8;
    border-bottom: 1px solid #2a2a2a;
}

.has-cover:not(.home-template) .gh-head {
    background: #141414;
    color: #e8e8e8;
}

.home-template.has-cover .gh-head {
    background: transparent;
    border-bottom: none;
}

.gh-head-logo {
    color: #e8e8e8;
    font-weight: 800;
    letter-spacing: 0.15em;
    text-transform: uppercase;
    font-size: 2rem;
}

.gh-head-logo.no-image {
    color: #e8e8e8;
}

.has-cover .gh-head-logo {
    color: #e8e8e8;
}

.gh-head-menu .nav a {
    color: #e8e8e8;
    font-weight: 500;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    font-size: 1.3rem;
    transition: opacity 0.2s ease;
}

.gh-head-menu .nav a:hover {
    opacity: 0.7;
}

/* Subscribe / CTA button in nav — Nervosys logo gradient */
.gh-head-button {
    color: #fff;
    background: var(--nervosys-gradient);
    font-weight: 600;
    letter-spacing: 0.02em;
    text-transform: uppercase;
    font-size: 1.3rem;
    border-radius: 4px;
    transition: opacity 0.2s ease;
    border: none;
}

.gh-head-button:hover {
    opacity: 0.85;
    color: #fff;
}

.has-cover .gh-head-button {
    color: #fff;
    background: var(--nervosys-gradient);
}

/* Social links */
.gh-social-link {
    color: #e8e8e8;
}

/* Burger menu */
.gh-burger-box {
    color: #e8e8e8;
}

.has-cover .gh-burger-box {
    color: #e8e8e8;
}

/* Mobile menu open state */
.has-cover.gh-head-open .gh-head {
    background: #141414;
}

@media (max-width: 991px) {
    #gh-head .gh-head-menu {
        font-weight: 400;
    }
}

/* ============================================
   4. Site Header / Cover
   ============================================ */
.site-header {
    background: #141414;
    color: #e8e8e8;
}

.site-header-content {
    color: #e8e8e8;
}

.has-cover .site-header-content {
    background-color: rgba(20, 20, 20, 0.85);
    color: #e8e8e8;
}

.site-title {
    color: #e8e8e8;
    font-weight: 800;
    letter-spacing: 0.1em;
    text-transform: uppercase;
}

.has-cover .site-title {
    color: #e8e8e8;
}

.site-description {
    color: #a3a3a3;
}

.has-cover .site-description {
    color: rgba(255, 255, 255, 0.7);
}

.site-title + .site-description {
    color: #a3a3a3;
}

/* ============================================
   5. Post Cards / Feed
   ============================================ */
.post-card-image {
    background: #1e1e1e;
    border-radius: 4px;
}

.post-card-image-link::after {
    border-radius: 4px;
}

.post-card-content-link {
    color: #e8e8e8;
}

.post-card-title {
    color: #e8e8e8;
    font-weight: 700;
    letter-spacing: -0.01em;
}

.post-card-excerpt {
    color: #a3a3a3;
}

.post-card-tags,
.post-card-meta {
    color: #777777;
}

.post-card-featured {
    color: #cc00a0;
}

/* ============================================
   6. Article / Post Content
   ============================================ */
.article-title {
    color: #e8e8e8;
    font-weight: 800;
    letter-spacing: -0.02em;
}

.article-excerpt {
    color: #a3a3a3;
}

.article-tag a {
    color: #777777;
}

.gh-content > [id] {
    color: rgba(255, 255, 255, 0.9);
}

.gh-content > blockquote:not([class]),
.gh-content > ol,
.gh-content > ul,
.gh-content > dl,
.gh-content > p {
    font-family: var(--font-sans);
    color: rgba(255, 255, 255, 0.75);
}

.gh-content .kg-callout-card .kg-callout-text,
.gh-content .kg-toggle-card .kg-toggle-content > ol,
.gh-content .kg-toggle-card .kg-toggle-content > ul,
.gh-content .kg-toggle-card .kg-toggle-content > p {
    font-family: var(--font-sans);
}

.gh-content a:not(.kg-btn):not(.kg-nft-card-container):not(.kg-product-card-button):not(.kg-header-card-button) {
    color: #d966c2;
    text-decoration-color: rgba(204, 0, 160, 0.4);
}

.gh-content a:not(.kg-btn):hover {
    text-decoration-color: #cc00a0;
}

.gh-content strong {
    color: #ffffff;
}

.gh-content em {
    color: #e8e8e8;
}

/* Code blocks — terminal style matching main site */
.gh-content pre {
    background: #1a1a1a;
    color: #e8e8e8;
    border: 1px solid #2a2a2a;
    border-radius: 6px;
    box-shadow: none;
    font-family: var(--font-mono);
}

.gh-content :not(pre) > code {
    background: #1e1e1e;
    color: #e0e0e0;
    border: 1px solid #333;
    border-radius: 4px;
    font-family: var(--font-mono);
}

.gh-content code {
    color: #e0e0e0;
    background: #1a1a1a;
    font-family: var(--font-mono);
}

/* Blockquote accent — logo gradient */
.gh-content > blockquote:not([class])::before {
    background: var(--nervosys-gradient);
}

/* HR */
hr {
    border-top-color: #2a2a2a;
}

.gh-content hr:after {
    background: #2a2a2a;
    box-shadow: #141414 0 0 0 5px;
}

/* Tables */
.gh-content table th {
    color: rgba(255, 255, 255, 0.85);
    background-color: #1e1e1e;
}

.gh-content table th,
.gh-content table td {
    border-color: #2a2a2a;
    color: rgba(255, 255, 255, 0.75);
}

.gh-content table td:first-child {
    background-image: linear-gradient(to right, #141414 50%, rgba(20, 20, 20, 0) 100%);
}

.gh-content table td:last-child {
    background-image: linear-gradient(to left, #141414 50%, rgba(20, 20, 20, 0) 100%);
}

/* Images */
img {
    opacity: 0.95;
}

/* Figures / Captions */
figcaption {
    color: rgba(255, 255, 255, 0.5);
}

figcaption strong {
    color: rgba(255, 255, 255, 0.7);
}

/* ============================================
   7. Author / Byline
   ============================================ */
.article-byline-meta {
    color: #777777;
}

.article-byline-meta .author-name {
    color: #e8e8e8;
}

.article-byline-meta .author-name a {
    color: #e8e8e8;
}

.author-avatar {
    border-color: #141414;
    background-color: #1e1e1e;
}

.no-image .author-social-link a {
    color: rgba(255, 255, 255, 0.75);
}

.author-profile-image {
    background: #1e1e1e;
}

.author-profile-image path {
    fill: #141414;
}

/* ============================================
   8. Subscribe CTA
   ============================================ */
.footer-cta-title {
    color: #e8e8e8;
}

.footer-cta-button {
    color: #a3a3a3;
    background: #1e1e1e;
    border-color: #3d3d3d;
}

.footer-cta-button:hover {
    border-color: #555;
}

.footer-cta-button span {
    color: #fff;
    background: var(--nervosys-gradient);
}

/* ============================================
   9. Footer
   ============================================ */
.site-footer {
    background: #0a0a0a;
    border-top: 1px solid #2a2a2a;
    color: rgba(255, 255, 255, 0.7);
}

.site-footer .inner {
    color: rgba(255, 255, 255, 0.5);
}

.site-footer .copyright a {
    color: #e0e0e0;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    font-weight: 600;
}

.site-footer a {
    color: rgba(255, 255, 255, 0.5);
}

.site-footer a:hover {
    color: rgba(255, 255, 255, 0.9);
}

/* ============================================
   10. Error Pages
   ============================================ */
.error-code {
    color: #e8e8e8;
}

.error-description {
    color: #a3a3a3;
}

.error-link {
    color: #e0e0e0;
}

/* ============================================
   11. Keyboard / KBD
   ============================================ */
kbd {
    background: #1e1e1e;
    border-color: #3d3d3d;
    color: #e0e0e0;
    box-shadow: inset 0 -1px 0 #2a2a2a;
}

/* ============================================
   12. Archive Header
   ============================================ */
.site-archive-header .no-image {
    color: rgba(255, 255, 255, 0.9);
    background: #141414;
}

/* ============================================
   13. Ghost Cards — Dark overrides
   ============================================ */
.kg-header-card.kg-style-dark {
    background: #0a0a0a;
}

.kg-header-card.kg-style-light {
    background: #1e1e1e;
}

.kg-header-card h2.kg-header-card-header,
.kg-header-card h3.kg-header-card-subheader {
    color: #e8e8e8;
}

/* ============================================
   14. Input fields
   ============================================ */
.gh-content input {
    color: #e8e8e8;
    background: #1e1e1e;
    border-color: #3d3d3d;
}

.gh-content input::placeholder {
    color: #666;
}

/* ============================================
   15. Post full-width image background
   ============================================ */
.post-full-image {
    background-color: #1e1e1e;
}

/* ============================================
   16. Tag / Author pages
   ============================================ */
.author-profile-social-link {
    color: #777777;
}

.author-profile-social-link:hover {
    color: #e8e8e8;
}

/* ============================================
   17. Portal / Members overrides
   ============================================ */
.gh-portal-btn {
    background: var(--nervosys-gradient) !important;
    color: #fff !important;
}

/* ============================================
   18. Mark / Highlighting
   ============================================ */
mark {
    background-color: rgba(255, 255, 255, 0.15);
    color: #e8e8e8;
}

/* ============================================
   19. Scrollbar (subtle dark)
   ============================================ */
::-webkit-scrollbar {
    width: 8px;
    height: 8px;
}

::-webkit-scrollbar-track {
    background: #141414;
}

::-webkit-scrollbar-thumb {
    background: #333;
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: #444;
}

/* ============================================
   20. Animations / Transitions
   ============================================ */
.post-card {
    transition: transform 0.2s ease;
}

.post-card:hover {
    transform: translateY(-2px);
}

.post-card-title {
    transition: opacity 0.2s ease;
}

.post-card:hover .post-card-title {
    opacity: 0.85;
}
