/*
Theme Name: Broadcast Editorial Child
Template: generatepress
Description: Custom child theme for Broadcast Editorial.
Version: 1.0.2
Author: Osmond Technologies LLC
*/

/* ==========================================================================
   1. GLOBAL SYSTEM STYLES & LAYOUT
   ========================================================================== */

body {
    background-color: #f5f5f5 !important;
    color: #111 !important;
}

.site-content {
    background-color: #f5f5f5 !important;
}

/* ==========================================================================
   2. NAVIGATION & MENU CONTROLS (Forced Horizontal Alignment)
   ========================================================================== */

.main-navigation {
    width: 100% !important;
    background: transparent !important;
    clear: both;
}

.main-navigation .inside-navigation,
.main-navigation nav {
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    max-width: 1200px;
    margin: 0 auto;
    width: 100%;
}

.main-navigation ul,
.main-navigation .main-nav ul,
.inside-navigation ul {
    list-style: none !important;
    list-style-type: none !important;
    display: flex !important;
    flex-direction: row !important;
    justify-content: center !important;
    align-items: center !important;
    margin: 0 !important;
    padding: 0 !important;
    flex-wrap: wrap !important;
    float: none !important;
}

.main-navigation ul li,
.main-navigation .main-nav ul li,
.inside-navigation ul li {
    list-style: none !important;
    list-style-type: none !important;
    background: none !important;
    margin: 0 8px !important;
    padding: 0 !important;
    float: none !important;
    display: inline-block !important;
}

.main-navigation ul li a,
.main-navigation .main-nav ul li a {
    display: block !important;
    padding: 10px 18px !important;
    color: #111 !important;
    text-decoration: none !important;
    font-weight: 600;
    font-size: 0.95rem;
    background: transparent !important;
}

.main-navigation ul li a:hover {
    opacity: 0.7;
}

/* Hide the phantom home link permanently */
.main-navigation ul li.menu-item-home,
.main-navigation .main-nav ul li.menu-item-home {
    display: none !important;
}

/* ==========================================================================
   3. UNIVERSAL PILL & ACTION BUTTON STYLING
   ========================================================================== */

.broadcast-pill-btn,
.dispatch-action a,
.hero-action a,
.broadcast-action-buttons a,
a.broadcast-pill-btn,
.wp-block-button__link,
.gb-button {
    background-color: #111 !important;
    color: #fff !important;
    border: 1px solid #111 !important;
    text-decoration: none !important;
    border-radius: 50px !important;
    padding: 10px 24px !important;
    display: inline-block !important;
    font-weight: 600 !important;
    font-size: 0.9rem;
    transition: background-color 0.2s ease, opacity 0.2s ease !important;
}

.broadcast-pill-btn:hover,
.dispatch-action a:hover,
.hero-action a:hover,
.broadcast-action-buttons a:hover,
a.broadcast-pill-btn:hover,
.wp-block-button__link:hover,
.gb-button:hover {
    background-color: #333 !important;
    color: #fff !important;
    opacity: 0.9 !important;
}

/* ==========================================================================
   4. FOOTER STYLING & BADGE BUTTONS
   ========================================================================== */

.site-footer {
    background-color: #f5f5f5 !important;
    color: #111 !important;
    padding: 3rem 0;
    border-top: 1px solid #e0e0e0;
}

.inside-site-footer {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 1rem;
    display: flex;
    flex-direction: column;
    gap: 2rem;
}

.footer-social-strip {
    display: flex;
    justify-content: center;
    gap: 1rem;
    align-items: center;
    flex-wrap: wrap;
}

.footer-social-strip a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    background-color: #111 !important;
    color: #fff !important;
    border-radius: 50%;
    text-decoration: none !important;
    transition: opacity 0.2s ease;
}

.footer-social-strip a svg {
    width: 20px;
    height: 20px;
    fill: currentColor;
}

.site-info {
    text-align: center;
    font-size: 0.9rem;
    border-top: 1px solid #d0d0d0;
    padding-top: 1.5rem;
    background-color: #f5f5f5 !important;
}

.broadcast-category-footer-notice {
    margin-top: 2rem;
    padding: 1.5rem;
    background-color: #f5f5f5;
    border-left: 3px solid #111;
    font-size: 0.9rem;
    color: #333;
}

/* ==========================================================================
   5. HEADER MENU PILL BUTTON STYLING
   ========================================================================== */

.main-navigation ul li a,
.main-navigation .main-nav ul li a {
    background-color: transparent !important;
    color: #111 !important;
    border: 1px solid #111 !important;
    text-decoration: none !important;
    border-radius: 50px !important;
    padding: 8px 20px !important;
    display: inline-block !important;
    font-weight: 600 !important;
    font-size: 0.9rem !important;
    transition: background-color 0.2s ease, color 0.2s ease, opacity 0.2s ease !important;
}

.main-navigation ul li a:hover,
.main-navigation .main-nav ul li a:hover {
    background-color: #111 !important;
    color: #fff !important;
    opacity: 1 !important;
}

/* ==========================================================================
   6. ARTICLE CARD IMAGE & LAYOUT LOCKS
   ========================================================================== */

.inside-article .post-image img,
.gb-container .gb-image img,
article img {
    max-height: 200px !important;
    width: 100% !important;
    object-fit: cover !important;
}

.blog.home #primary,
.archive #primary {
    float: left;
    width: 68%;
}

.blog.home .site-main,
.archive .site-main {
    display: flex !important;
    flex-wrap: wrap !important;
    gap: 1.5rem !important;
}

.blog.home .site-main > article,
.archive .site-main > article {
    flex: 0 0 calc(50% - 0.75rem) !important;
    box-sizing: border-box !important;
    background: #fff !important;
    border: 1px solid #e0e0e0 !important;
    border-radius: 8px !important;
    padding: 1.25rem !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    margin-bottom: 0 !important;
}

.blog.home .page-header,
.archive .page-header,
.blog.home .navigation.pagination,
.archive .navigation.pagination {
    width: 100% !important;
    flex-basis: 100% !important;
}

.blog.home article.post .post-image img,
.archive article.post .post-image img {
    width: 100% !important;
    max-width: 150px !important;
    height: auto !important;
    border-radius: 4px !important;
    display: block !important;
    margin: 0 auto 1rem auto !important;
}

/* ==========================================================================
   7. SIDEBAR WIDGETS & PILL BUTTONS
   ========================================================================== */

.site-sidebar a,
.widget-area a,
.widget a {
    color: #111 !important;
    text-decoration: none !important;
}

.site-sidebar a:hover,
.widget-area a:hover,
.widget a:hover {
    opacity: 0.7 !important;
}

.widget_categories ul li a,
.widget_archive ul li a,
.widget_pages ul li a,
.widget_meta ul li a,
.widget_recent_entries ul li a,
.widget_tag_cloud a,
.sidebar .widget a {
    display: inline-block;
    background: #f4f4f4;
    color: #111;
    padding: 6px 16px;
    margin-bottom: 6px;
    border-radius: 50px;
    text-decoration: none;
    transition: background 0.2s ease, color 0.2s ease;
}

.sidebar .widget a:hover {
    background: #111;
    color: #fff;
}

/* ==========================================================================
   8. SIGNAL DRIFT SHORTCODE & QUERY GRID
   ========================================================================== */

.signal-drift-custom-nav ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.75rem;
    list-style: none;
    padding: 0;
    margin: 0 0 2.5rem 0;
}

.signal-drift-custom-nav li a {
    display: inline-block;
    padding: 8px 18px;
    background-color: #fff;
    color: #111;
    border: 1px solid #ddd;
    border-radius: 50px;
    text-decoration: none;
    font-size: 0.9rem;
    font-weight: 600;
    transition: all 0.2s ease;
}

.signal-drift-custom-nav li a:hover {
    background-color: #111;
    color: #fff;
    border-color: #111;
}

.is-grid-two-column ul.wp-block-post-template {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 1.5rem !important;
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.is-grid-two-column ul.wp-block-post-template > li {
    margin: 0 !important;
    background: #fff !important;
    border: 1px solid #e0e0e0 !important;
    border-radius: 8px !important;
    padding: 1.25rem !important;
    box-sizing: border-box !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
}

/* ==========================================================================
   9. ABSOLUTE FORCE OVERRIDE: CATEGORIES & TAGS AS BADGES
   ========================================================================== */

body article .entry-meta a,
body .inside-article .cat-links a,
body .inside-article .tags-links a,
body span.cat-links a,
body span.tags-links a,
body .cat-links a,
body .tags-links a {
    background-color: #e2e8f0 !important;
    color: #111 !important;
    background: #e2e8f0 !important;
    border: none !important;
    border-radius: 4px !important;
    padding: 3px 10px !important;
    font-size: 0.75rem !important;
    font-weight: 600 !important;
    display: inline-block !important;
    text-decoration: none !important;
    box-shadow: none !important;
}

body article .entry-meta a:hover,
body .inside-article .cat-links a:hover,
body .inside-article .tags-links a:hover,
body span.cat-links a:hover,
body span.tags-links a:hover,
body .cat-links a:hover,
body .tags-links a:hover {
    background-color: #111 !important;
    color: #fff !important;
    background: #111 !important;
}

/* ==========================================================================
   ATOMIC BADGE OVERRIDE (Categories & Tags)
   ========================================================================== */
.entry-meta .cat-links a,
.entry-meta .tags-links a,
.cat-links a,
.tags-links a,
.post-taxonomies a {
    display: inline-block !important;
    background-color: #e2e8f0 !important;
    color: #111 !important;
    background: #e2e8f0 !important;
    border: none !important;
    border-radius: 4px !important;
    padding: 3px 10px !important;
    font-size: 0.75rem !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    box-shadow: none !important;
}

.entry-meta .cat-links a:hover,
.entry-meta .tags-links a:hover,
.cat-links a:hover,
.tags-links a:hover,
.post-taxonomies a:hover {
    background-color: #111 !important;
    color: #fff !important;
    background: #111 !important;
}

/* ==========================================================================
   BROADCAST BADGE OVERRIDE
   ========================================================================== */
a.broadcast-badge {
    background-color: #e2e8f0 !important;
    color: #111 !important;
    padding: 3px 10px !important;
    border-radius: 4px !important;
    font-size: 0.75rem !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    display: inline-block !important;
}

a.broadcast-badge:hover {
    background-color: #111 !important;
    color: #fff !important;
}

/* ==========================================================================
   BROADCAST BADGE OVERRIDE (Categories & Tags)
   ========================================================================== */
a.broadcast-badge,
.tags-links a,
.tag-cloud-link {
    background-color: #e2e8f0 !important;
    color: #111 !important;
    padding: 3px 10px !important;
    border-radius: 4px !important;
    font-size: 0.75rem !important;
    font-weight: 600 !important;
    text-decoration: none !important;
    display: inline-block !important;
}

a.broadcast-badge:hover,
.tags-links a:hover,
.tag-cloud-link:hover {
    background-color: #111 !important;
    color: #fff !important;
}

/* ==========================================================================
   SINGLE POST FEATURED IMAGE FLOAT & TEXT WRAP (NATIVE GP CONTAINER)
   ========================================================================== */
.single-post .inside-article .post-image {
    float: left !important;
    margin: 0 25px 15px 0 !important;
    max-width: 45% !important;
    width: 100% !important;
}

.single-post .inside-article .post-image img {
    max-height: none !important;
    width: 100% !important;
    height: auto !important;
    border-radius: 6px !important;
    display: block !important;
}

/* Clear the float so elements below the article stay aligned */
.single-post .inside-article::after {
    content: "" !important;
    display: table !important;
    clear: both !important;
}

/* Responsive fallback: stack image on mobile screens */
@media (max-width: 768px) {
    .single-post .inside-article .post-image {
        float: none !important;
        max-width: 100% !important;
        margin: 0 auto 1.5rem auto !important;
    }
}

/* ==========================================================================
   SIDEBAR WIDGET CONTRAST & PAGINATION BUTTON FIX
   ========================================================================== */
.site-sidebar .widget a,
.widget-area .widget a,
.sidebar .widget a {
    color: #111 !important;
    background-color: #f4f4f4 !important;
    opacity: 1 !important;
}

.site-sidebar .widget a:hover,
.widget-area .widget a:hover,
.sidebar .widget a:hover {
    color: #fff !important;
    background-color: #111 !important;
    opacity: 1 !important;
}

/* Force Pagination Links to Match Broadcast Pill Styling */
.archive-pagination .page-numbers,
.pagination .page-numbers {
    background-color: #fff !important;
    color: #111 !important;
    border: 1px solid #111 !important;
    padding: 8px 16px !important;
    border-radius: 50px !important;
    text-decoration: none !important;
    font-weight: 600 !important;
    font-size: 0.85rem !important;
    display: inline-block !important;
    transition: all 0.2s ease !important;
}

.archive-pagination .page-numbers.current,
.pagination .page-numbers.current,
.archive-pagination .page-numbers:hover,
.pagination .page-numbers:hover {
    background-color: #111 !important;
    color: #fff !important;
}

.site-content {
    max-width: 100% !important;
    padding: 0 !important;
}

.inside-article {
    padding: 0 !important;
}

/* ==========================================================================
   10. STATIC PAGE TITLE ALIGNMENT
   ========================================================================== */
.page .entry-header {
    text-align: center;
}

/* ==========================================================================
   11. CHARACTER DOSSIER CARD STYLING
   ========================================================================== */
.wp-block-columns, .wp-block-media-text {
    background: #ffffff;
    border: 1px solid #e0e0e0;
    border-radius: 8px;
    padding: 2rem;
    margin-bottom: 2rem !important;
}
/* ==========================================================================
   13. ABSOLUTE CHARACTER IMAGE FORCE
   ========================================================================== */
.page-id-123 img, 
.entry-content .wp-block-image img,
.entry-content img {
    max-height: none !important;
    object-fit: initial !important;
}
/* ==========================================================================
   14. NATIVE LIGHTBOX MODAL OVERLAY STYLING
   ========================================================================== */
#rws-lightbox-overlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, 0.9);
    display: none;
    align-items: center;
    justify-content: center;
    z-index: 99999;
    cursor: pointer;
}
#rws-lightbox-overlay img {
    max-width: 90%;
    max-height: 90%;
    box-shadow: 0 0 25px rgba(0, 0, 0, 0.7);
    border-radius: 4px;
    object-fit: contain;
}
@media (max-width: 768px) {
    .blog.home #primary,
    .archive #primary {
        float: none !important;
        width: 100% !important;
        padding: 0 1rem !important;
        box-sizing: border-box !important;
    }

    .blog.home .site-main,
    .archive .site-main {
        display: flex !important;
        flex-direction: column !important;
        gap: 1rem !important;
    }

    .blog.home .site-main > article,
    .archive .site-main > article {
        flex: 0 0 100% !important;
        width: 100% !important;
        margin: 0 auto !important;
        box-sizing: border-box !important;
    }
}
@media (max-width: 768px) {
    body.blog .site-content,
    body.archive .site-content {
        display: block !important;
        padding: 0 1rem !important;
        box-sizing: border-box !important;
    }
    
    body.blog #primary,
    body.archive #primary {
        width: 100% !important;
        margin: 0 !important;
        float: none !important;
    }
}

/* ==========================================================================
   15. POST BODY LINK CONTROLS (Active Link Color Override)
   ========================================================================== */
.entry-content a,
.inside-article a:not(.broadcast-pill-btn):not(.wp-block-button__link):not(.gb-button):not(.broadcast-badge):not(.tag-cloud-link):not(.page-numbers) {
    color: #111 !important;
    text-decoration: underline !important;
    text-underline-offset: 3px !important;
    transition: opacity 0.2s ease !important;
}

.entry-content a:hover,
.inside-article a:not(.broadcast-pill-btn):not(.wp-block-button__link):not(.gb-button):not(.broadcast-badge):not(.tag-cloud-link):not(.page-numbers):hover {
    opacity: 0.7 !important;
}