/*
Theme Name:   GeneratePress Child
Theme URI:    https://ufo-reports.com/
Description:  Dark UFO Theme for GeneratePress
Author:       SpaceCowboy
Template:     generatepress
Version:      1.0
*/

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

/* ====================== UFO DARK THEME ====================== */

:root {
    --ufodark-bg: #0a0a0a;           /* Main background */
    --ufodark-surface: #0a0a0a;      /* Content boxes, sidebars */
    --ufodark-text: #e0e0e0;         /* Main text */
    --ufodark-accent: #00f5ff;       /* New primary accent - Bright Cyan */
    --ufodark-accent-hover: #00b8c4; /* Hover version */
    --ufodark-border: #222222;       /* Borders */
    --ufodark-muted: #aaaaaa;        /* Meta text, secondary text */
}

/* Main Background */
body, .site {
    background-color: var(--ufodark-bg) !important;
    color: var(--ufodark-text) !important;
}

/* Header */
.site-header {
    background-color: #000000 !important;
    border-bottom: 3px solid var(--ufodark-accent);
}
/* Headings */
h1, h2, h3, .entry-title {
    color: #ffffff !important;
    text-shadow: 0 0 5px rgba(0, 255, 204, 0.5);
}

/* Links */
a {
    color: var(--ufodark-accent) !important;
}
a:hover {
    color: var(--ufodark-accent-hover) !important;
}
/* Sidebar */
#secondary .widget {
    background-color: var(--ufodark-surface) !important;
    border: 1px solid var(--ufodark-border) !important;
}
#secondary,
.is-left-sidebar,
.is-right-sidebar {
    width: 260px !important;        /* Change this number to adjust width */
    max-width: 260px !important;
    flex: 0 0 260px !important;
}

/* Footer */
.site-footer {
    background-color: #000000 !important;
    border-top: 2px solid var(--ufodark-accent);
}

/* Entry Meta */
.entry-meta {
    color: #aaaaaa !important;
}
.entry-meta a:hover {
    color: var(--ufodark-accent) !important;
}
/* ====================== CENTER PAGE TITLES ====================== */

.entry-title,
.page-title,
.ast-archive-title,
.hentry .entry-header .entry-title {
    text-align: center !important;
    width: 100% !important;
    color: var(--ufodark-accent-hover) !important;          
}
/* Optional: Make titles a bit larger and give more breathing room */
.entry-title {
    margin-bottom: 25px !important;
}
/* ====================== MOBILE RESPONSIVE - HIDE SIDEBARS ====================== */

@media (max-width: 768px) {

    /* Hide both sidebars on mobile */
    #secondary,
    .is-left-sidebar,
    .is-right-sidebar {
        display: none !important;
    }

    /* Make main content full width on mobile */
    .content-area,
    .ast-article-single,
    .ast-article-post,
    .entry-content {
        width: 100% !important;
        max-width: 100% !important;
        flex: none !important;
        padding: 25px 20px !important;
    }

    /* Reduce container padding on mobile */
    .ast-container,
    .site-content .ast-container {
        padding-left: 15px !important;
        padding-right: 15px !important;
    }

    /* Center titles on mobile too */
    .entry-title,
    .page-title {
        text-align: center !important;
    }
}
/* ====================== AGGRESSIVE SIDEBAR GAP REDUCTION ====================== */

#secondary .widget,
.widget-area .widget {
    margin-bottom: 5px !important;
    padding: 5px 5px !important;
}

#secondary .widget:last-of-type {
    margin-bottom: 0 !important;
}

/* Remove top margin from first widget */
#secondary .widget:first-of-type {
    margin-top: 0 !important;
}

/* Widget title spacing */
#secondary .widget-title {
    margin-bottom: 5px !important;
    margin-top: 0 !important;
}

/* Extra force for GeneratePress */
.ast-separate-container #secondary .widget {
    margin-bottom: 5px !important;
}

/* ====================== CENTER LEFT SIDEBAR + CONTENT ====================== */

/* Force proper centering when only using left sidebar */
.site-main {
    display: flex !important;
    justify-content: center !important;
    gap: 35px !important;
    max-width: 1280px !important;
    margin: 0 auto !important;
}

/* Left Sidebar */
#secondary {
    flex: 0 0 260px !important;
    max-width: 260px !important;
}

/* Main Content Area */
.content-area {
    flex: 1 !important;
    max-width: 1020px !important;     /* Adjust this if you want content wider */
}

/* Remove any forced right margin */
.ast-separate-container .site-main {
    margin-right: 0 !important;
}

/* =============================================
   FINAL FIX: Comments below post (Left Sidebar Only)
   ============================================= */

/* Force the entire site-main to behave normally */
.site-main {
    display: block !important;
}

/* Force comments to full width below everything */
.site-main .comments-area,
.site-main #comments,
.site-main .comment-respond {
    clear: both !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 60px 0 40px 0 !important;
    padding-top: 40px !important;
    border-top: 2px solid #00ffcc;
    float: none !important;
    order: 999 !important;
}

/* Make sure comments stay inside the main content column */
.content-area .comments-area,
.content-area #comments,
.content-area .comment-respond {
    flex: 0 0 100% !important;
    width: 100% !important;
    max-width: 100% !important;
}

/* Completely hide comments from any sidebar area */
#secondary .comments-area,
#secondary #comments,
.widget-area .comments-area,
.widget-area #comments,
.is-right-sidebar .comments-area {
    display: none !important;
}

/* Style the comment form to match your dark theme */
#respond {
    background-color: #111111;
    border: 1px solid #222222;
    padding: 30px;
    border-radius: 8px;
}
/* =============================================
   FORCE FEATURED IMAGE INSIDE CONTENT ON PAGES
   ============================================= */

/* Hide the header version completely */
.page .featured-image.page-header-image,
.page .page-header-image-single,
.page .entry-header .featured-image {
    display: none !important;
}

/* Show the image inside the actual content area */
.page .entry-content .wp-post-image,
.page .entry-content img[alt="Crop Circles"],
.page article.page .entry-content img.wp-post-image {
    display: block !important;
    margin: 0 0 40px 0 !important;
    width: 100% !important;
    max-width: 100% !important;
    border-radius: 8px;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.5);
}