/*

Theme Name: CG 2Day News

Theme URI: https://chhattisgarh2day.com

Author: CG 2Day Team

Description: Fully Responsive Hindi News Portal Theme

Version: 1.5

*/



* {

    box-sizing: border-box;

    margin: 0;

    padding: 0;

}



/* 📱 ओवरफ्लो और स्क्रीन कटने की रोकथाम */

html, body {

    overflow-x: hidden !important;

    width: 100% !important;

    max-width: 100% !important;

}



body {

    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;

    background-color: #f4f6f9;

    color: #333;

    line-height: 1.6;

}



a {

    text-decoration: none;

    color: inherit;

}



.container {

    width: 92%;

    max-width: 1200px;

    margin: 0 auto;

    box-sizing: border-box;

}



/* Topbar */

.top-bar {

    background: #1e1e1e;

    color: #fff;

    padding: 4px 0 !important;

    font-size: 13px;

}

.top-bar-content {

    display: flex;

    justify-content: space-between;

    align-items: center;

    flex-wrap: wrap;

    gap: 8px;

}

.search-form {

    display: inline-flex;

    margin-right: 10px;

    max-width: 100%;

}

.search-field {

    padding: 3px 8px;

    border: none;

    border-radius: 3px 0 0 3px;

    max-width: 140px;

}

.search-submit {

    background: #e62117;

    border: none;

    color: #fff;

    padding: 3px 8px;

    border-radius: 0 3px 3px 0;

    cursor: pointer;

}

.btn-signin {

    background: #e62117;

    color: #fff;

    padding: 3px 10px;

    border-radius: 3px;

    font-weight: bold;

}



/* Header & Logo Area */

.header-brand {

    display: flex;

    justify-content: space-between;

    align-items: center;

    padding: 6px 0 !important;

    gap: 15px;

    background: #ffffff;

}



.brand-logo-link {

    text-decoration: none;

    display: inline-block;

}



.cg2day-modern-logo {

    display: flex;

    align-items: center;

    gap: 10px;

    padding: 2px 0;

}



.logo-badge-3d {

    background: linear-gradient(135deg, #d32f2f 0%, #880e4f 100%);

    border: 2px solid #ffeb3b;

    border-radius: 8px;

    padding: 3px 8px !important;

    display: flex;

    flex-direction: column;

    align-items: center;

    justify-content: center;

    box-shadow: 0 3px 8px rgba(211, 47, 47, 0.35);

}



.logo-badge-3d .cg-text {

    font-family: 'Arial Black', sans-serif;

    font-size: 16px !important;

    font-weight: 900;

    color: #ffffff;

    line-height: 1;

}



.logo-badge-3d .day-tag {

    background: #ffeb3b;

    color: #b71c1c;

    font-size: 8px !important;

    font-weight: 900;

    padding: 1px 4px !important;

    border-radius: 3px;

    margin-top: 2px;

}



.logo-text-group {

    display: flex;

    flex-direction: column;

}



.main-title-wrap {

    display: flex;

    align-items: center;

    gap: 6px;

    line-height: 1.1;

}



.title-cg {

    font-size: 22px !important;

    font-weight: 900;

    color: #b71c1c;

}



.title-2day {

    font-size: 20px !important;

    font-weight: 900;

    background: linear-gradient(180deg, #d32f2f 0%, #7b1fa2 100%);

    -webkit-background-clip: text;

    -webkit-text-fill-color: transparent;

}



.tagline-wrap {

    display: flex;

    align-items: center;

    gap: 6px;

    margin-top: 2px;

}



.pulse-dot {

    width: 6px;

    height: 6px;

    background-color: #d32f2f;

    border-radius: 50%;

    display: inline-block;

    animation: pulse 1.5s infinite;

}



@keyframes pulse {

    0% { box-shadow: 0 0 0 0 rgba(211, 47, 47, 0.7); }

    70% { box-shadow: 0 0 0 5px rgba(211, 47, 47, 0); }

    100% { box-shadow: 0 0 0 0 rgba(211, 47, 47, 0); }

}



.tagline-text {

    font-size: 11px !important;

    color: #424242;

    font-weight: 600;

}



/* ==========================================

   ✂️ Ultra Compact Navigation Menu (नेविगेशन बार)

   ========================================== */



.main-nav { 

    background: #b71c1c !important; 

    padding: 0 !important;

    margin: 0 !important;

    min-height: unset !important;

    height: auto !important;

}



.nav-menu { 

    display: flex !important; 

    list-style: none !important; 

    flex-wrap: wrap !important; 

    align-items: center !important;

    margin: 0 !important;

    padding: 0 !important;

}



.nav-menu li {

    margin: 0 !important;

    padding: 0 !important;

}



.nav-menu li a { 

    display: block !important; 

    padding: 4px 10px !important;

    color: #fff !important; 

    font-weight: bold !important; 

    font-size: 13px !important; 

    line-height: 1.2 !important;

}



.nav-menu li a:hover { 

    background: #8e0000 !important; 

}



.live-tv { 

    background: #ffeb3b !important; 

    color: #000 !important; 

    padding: 2px 6px !important; 

    border-radius: 3px !important; 

    font-weight: bold !important; 

    margin-left: 6px !important; 

    font-size: 11px !important;

    line-height: 1 !important;

}



/* ==========================================

   ⚡ Single Line Breaking News Ticker (बड़ी खबर फिक्स)

   ========================================== */



.breaking-news { 

    display: flex !important; 

    flex-direction: row !important;

    flex-wrap: nowrap !important;

    align-items: center !important;

    background: #212121 !important; 

    color: #fff !important; 

    margin: 6px auto !important; 

    border-radius: 4px !important; 

    overflow: hidden !important; 

    height: 32px !important; 

    min-height: 32px !important;

    max-height: 32px !important;

    width: 100% !important;

}



.breaking-news .badge { 

    background: #d32f2f !important; 

    color: #ffffff !important;

    padding: 0 10px !important; 

    font-weight: bold !important; 

    white-space: nowrap !important; 

    font-size: 12px !important;

    display: inline-flex !important;

    align-items: center !important;

    justify-content: center !important;

    height: 100% !important;

    line-height: 32px !important;

    flex-shrink: 0 !important;

    width: auto !important;

}



.ticker-text { 

    padding: 0 8px !important; 

    flex-grow: 1 !important;

    font-size: 13px !important; 

    overflow: hidden !important; 

    white-space: nowrap !important;

    display: flex !important;

    align-items: center !important;

    height: 100% !important;

    line-height: 32px !important;

}



.ticker-text a { 

    color: #fff !important; 

    margin: 0 8px !important; 

    white-space: nowrap !important;

}



/* Main Layout */

.main-layout { display: flex; gap: 20px; margin-bottom: 25px; width: 100%; }

.content-area { flex: 2; min-width: 0; width: 100%; max-width: 100%; }

.sidebar-area { flex: 1; min-width: 0; width: 100%; max-width: 100%; }



/* Article Card */

.news-article-card, .single-news-article { background: #fff; padding: 16px; border-radius: 6px; box-shadow: 0 2px 5px rgba(0,0,0,0.05); margin-bottom: 20px; width: 100%; max-width: 100%; word-break: break-word; overflow-wrap: break-word; }

.category-badge a { background: #d32f2f; color: #fff; padding: 3px 8px; font-size: 12px; border-radius: 3px; font-weight: bold; }

.entry-title { font-size: 22px; margin: 8px 0; color: #111; word-wrap: break-word; overflow-wrap: break-word; word-break: break-word; }

.entry-title a:hover { color: #d32f2f; }

.post-meta { font-size: 12px; color: #777; margin-bottom: 10px; }

.post-thumbnail img { width: 100%; height: auto; border-radius: 5px; margin: 12px 0; }

.entry-content { width: 100%; max-width: 100%; overflow-x: hidden; word-wrap: break-word; word-break: break-word; }

.entry-content img, .entry-content iframe, .entry-content table { max-width: 100% !important; height: auto !important; }

.entry-excerpt { font-size: 15px; color: #444; margin-bottom: 15px; word-wrap: break-word; }



.post-footer { display: flex; justify-content: space-between; align-items: center; border-top: 1px solid #eee; padding-top: 10px; flex-wrap: wrap; gap: 10px;}

.read-more-btn { background: #d32f2f; color: #fff; padding: 5px 12px; border-radius: 4px; font-size: 13px; }

.share-buttons .fb-btn { background: #1877f2; color: #fff; padding: 4px 8px; border-radius: 3px; font-size: 12px; }

.share-buttons .wa-btn { background: #25d366; color: #fff; padding: 4px 8px; border-radius: 3px; font-size: 12px; }



/* Sidebar Widgets */

.sidebar-widget { background: #fff; padding: 14px; border-radius: 6px; box-shadow: 0 2px 5px rgba(0,0,0,0.05); margin-bottom: 20px; max-width: 100%; overflow: hidden; }



.ad-box-image {

    background: #ffffff;

    padding: 8px;

    border-radius: 6px;

    box-shadow: 0 2px 5px rgba(0,0,0,0.05);

    margin-bottom: 20px;

    text-align: center;

    width: 100%;

    max-width: 100%;

    box-sizing: border-box;

    overflow: hidden;

}



.ad-box-image .ad-tag {

    display: block;

    font-size: 10px;

    color: #888888;

    letter-spacing: 1px;

    margin-bottom: 4px;

    text-transform: uppercase;

}



.metaslider, .metaslider img, .ad-banner-img {

    width: 100% !important;

    max-width: 100% !important;

    height: auto !important;

    display: block;

    border-radius: 4px;

    object-fit: contain;

}



.widget-header { display: flex; justify-content: space-between; align-items: center; border-bottom: 2px solid #d32f2f; padding-bottom: 4px; margin-bottom: 12px; }

.widget-header h3 { color: #d32f2f; font-size: 17px; }

.view-all { font-size: 12px; color: #666; }



.mini-post-card { display: flex; gap: 10px; margin-bottom: 10px; border-bottom: 1px solid #f0f0f0; padding-bottom: 8px; }

.mini-thumb img { width: 70px; height: 50px; object-fit: cover; border-radius: 4px; }

.mini-content h4 { font-size: 13px; font-weight: 600; line-height: 1.3; }



.site-footer { background: #111; color: #aaa; text-align: center; padding: 12px 0; font-size: 13px; }



/* ==========================================

   📱 Mobile Responsive Settings (Fix Included)

   ========================================== */

@media screen and (max-width: 768px) {

    /* 1. स्क्रीन से बाहर कटने से बचाने के लिए ग्लोबल रिसेट */

    html, body {

        overflow-x: hidden !important;

        width: 100% !important;

        max-width: 100% !important;

    }



    body {

        padding-left: 6px !important;

        padding-right: 6px !important;

    }



    /* 2. मुख्य कंटेनर और लेआउट फिक्स */

    .container, .main-layout, .content-area, .sidebar-area {

        display: block !important;

        width: 100% !important;

        max-width: 100% !important;

        box-sizing: border-box !important;

        padding-left: 4px !important;

        padding-right: 4px !important;

        margin-left: 0 !important;

        margin-right: 0 !important;

        float: none !important;

        clear: both !important;

        overflow: hidden !important;

    }



    /* 3. हेडर और टॉप बार */

    .site-header {

        position: sticky;

        top: 0;

        z-index: 9999;

        background: #ffffff;

        box-shadow: 0 2px 8px rgba(0,0,0,0.12);

        width: 100%;

    }



    .top-bar {

        display: none !important;

    }



    .header-brand {

        flex-direction: column;

        text-align: center;

        padding: 5px 8px !important;

        background: #fff;

    }



    .title-cg { font-size: 18px !important; }

    .title-2day { font-size: 16px !important; }

    .tagline-text { font-size: 10px !important; }



    /* 4. नेविगेशन बार और टिकर */

    .nav-menu {

        justify-content: center !important;

    }



    .nav-menu li a {

        padding: 3px 6px !important;

        font-size: 12px !important;

    }



    .live-tv {

        padding: 1px 4px !important;

        font-size: 10px !important;

        margin-left: 3px !important;

    }



    .breaking-news {

        margin: 4px auto !important;

        height: 28px !important;

        min-height: 28px !important;

        max-height: 28px !important;

    }



    .breaking-news .badge {

        padding: 0 8px !important;

        font-size: 11px !important;

        line-height: 28px !important;

        flex-shrink: 0 !important;

        width: auto !important;

    }



    .ticker-text {

        padding: 0 6px !important;

        font-size: 11px !important;

        line-height: 28px !important;

    }



    /* 5. आर्टिकल्स और टेक्स्ट कटने की रोकथाम */

    .news-article-card, .single-news-article, .entry-content {

        padding: 10px !important;

        width: 100% !important;

        max-width: 100% !important;

        box-sizing: border-box !important;

        word-wrap: break-word !important;

        overflow-wrap: break-word !important;

    }



    .entry-title {

        font-size: 17px !important;

        line-height: 1.35 !important;

        word-wrap: break-word !important;

        overflow-wrap: break-word !important;

    }



    p, span, div, h1, h2, h3, h4 {

        max-width: 100% !important;

        word-wrap: break-word !important;

        overflow-wrap: break-word !important;

    }



    img, iframe, video {

        max-width: 100% !important;

        height: auto !important;

    }

}



/* ==========================================

   🚨 ALL PAGES GLOBAL RESPONSIVE FIX

   ========================================== */



/* 1. हर पेज पर स्क्रीन चौड़ाई को लॉक करें */

html, body, #page, #content, .site {

    overflow-x: hidden !important;

    width: 100% !important;

    max-width: 100vw !important;

    margin: 0 !important;

    box-sizing: border-box !important;

}



@media screen and (max-width: 768px) {

    /* 2. सभी पेजों पर मोबाइल में टॉप-बार छिपाएं ताकि लेआउट न बिगड़े */

    .top-bar, #top-bar, .top-bar-content {

        display: none !important;

        height: 0 !important;

        padding: 0 !important;

        margin: 0 !important;

        overflow: hidden !important;

    }



    /* 3. मेनू और ब्रेकिंग बार को हर पेज पर स्लिम रखें */

    .main-nav {

        padding: 0 !important;

    }

    .nav-menu li a {

        padding: 3px 6px !important;

        font-size: 12px !important;

    }

    .breaking-news {

        height: 28px !important;

        min-height: 28px !important;

        max-height: 28px !important;

        margin: 4px auto !important;

    }

    .breaking-news .badge {

        padding: 0 6px !important;

        font-size: 11px !important;

        line-height: 28px !important;

        flex-shrink: 0 !important;

        width: auto !important;

    }

    .ticker-text {

        padding: 0 5px !important;

        font-size: 11px !important;

        line-height: 28px !important;

    }



    /* 4. पेजों और आर्टिकल्स की साइड पैडिंग - जिससे टेक्स्ट न कटे */

    body {

        padding-left: 8px !important;

        padding-right: 8px !important;

    }

    

    .container, .main-layout, .content-area, .sidebar-area, 

    .site-main, .archive, .category, .single {

        width: 100% !important;

        max-width: 100% !important;

        padding-left: 2px !important;

        padding-right: 2px !important;

        margin-left: 0 !important;

        margin-right: 0 !important;

        box-sizing: border-box !important;

    }



    /* 5. टेक्स्ट ब्रेक रूल्स */

    p, span, h1, h2, h3, h4, .entry-title, .entry-content {

        max-width: 100% !important;

        word-wrap: break-word !important;

        overflow-wrap: break-word !important;

    }



    /* 6. इमेजेस स्क्रीन से बाहर न जाएं */

    img, iframe, video, figure {

        max-width: 100% !important;

        height: auto !important;

    }

}



/* ==========================================

   Author Profile & Related Posts Styling

   ========================================== */

.author-box {

    display: flex;

    align-items: center;

    gap: 15px;

    background: #f9f9f9;

    border: 1px solid #e0e0e0;

    border-left: 4px solid #d32f2f;

    padding: 12px 15px;

    border-radius: 6px;

    margin-top: 20px;

}



.author-avatar img {

    border-radius: 50%;

    display: block;

}



.author-info h4 {

    margin: 0 0 4px 0;

    font-size: 15px;

    color: #111;

}



.author-info p {

    margin: 0;

    font-size: 13px;

    color: #555;

    line-height: 1.4;

}



.related-posts-section {

    margin-top: 30px;

    border-top: 2px solid #d32f2f;

    padding-top: 15px;

}



.related-posts-section h3 {

    font-size: 18px;

    color: #111;

    margin-bottom: 15px;

}



.related-grid {

    display: grid;

    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));

    gap: 15px;

}



.related-card {

    background: #fff;

    border: 1px solid #eee;

    border-radius: 5px;

    overflow: hidden;

}



.related-card img {

    width: 100%;

    height: 120px;

    object-fit: cover;

    display: block;

}



.related-card h4 {

    font-size: 14px;

    padding: 8px 10px;

    margin: 0;

    line-height: 1.3;

}



.related-card h4 a:hover {

    color: #d32f2f;

}



/* ==========================================

   Breaking News Ticker (Desktop & Mobile Ready)

   ========================================== */

.breaking-news {

    height: 38px !important;              /* डेस्कटॉप पर पट्टी की मोटाई */

    min-height: 38px !important;

    max-height: 38px !important;

    display: flex !important;

    align-items: center !important;        /* वर्टिकली सेंटर में करने के लिए */

    justify-content: flex-start !important;

    background: #212121 !important;

    color: #fff !important;

    margin: 10px auto !important;

    border-radius: 4px !important;

    overflow: hidden !important;

    padding: 0 !important;

}



.breaking-news .badge {

    background: #d32f2f !important;

    color: #ffffff !important;

    height: 100% !important;

    display: inline-flex !important;

    align-items: center !important;        /* बड़ी खबर बैज को सेंटर किया गया */

    justify-content: center !important;

    padding: 0 14px !important;

    font-weight: bold !important;

    font-size: 14px !important;

    white-space: nowrap !important;

    flex-shrink: 0 !important;

    margin: 0 !important;

    line-height: 1 !important;

}



.breaking-news .ticker-text {

    flex-grow: 1 !important;

    display: flex !important;

    align-items: center !important;        /* स्क्रॉल टेक्स्ट वर्टिकल सेंटर */

    height: 100% !important;

    padding: 0 10px !important;

    overflow: hidden !important;

}



.breaking-news .ticker-text marquee {

    display: flex !important;

    align-items: center !important;

    height: 100% !important;

    margin: 0 !important;

    line-height: 38px !important;          /* सेंटर एलाइनमेंट के लिए */

    font-size: 14px !important;

    font-weight: 500 !important;

    color: #ffffff !important;

}



.breaking-news .ticker-text marquee a {

    color: #ffffff !important;

    text-decoration: none !important;

}



.breaking-news .ticker-text marquee a:hover {

    color: #ffeb3b !important;

}



/* ==========================================

   Mobile Responsive Adjustments (768px से नीचे)

   ========================================== */

@media screen and (max-width: 768px) {

    .breaking-news {

        height: 34px !important;           /* मोबाइल में पट्टी थोड़ी और स्लिम रहेगी */

        min-height: 34px !important;

        margin: 6px auto !important;

    }



    .breaking-news .badge {

        font-size: 12px !important;        /* मोबाइल स्क्रीन के लिए छोटा फ़ॉन्ट */

        padding: 0 8px !important;

    }



    .breaking-news .ticker-text marquee {

        line-height: 34px !important;

        font-size: 12px !important;        /* स्क्रॉल टेक्स्ट मोबाइल में एकदम साफ़ दिखेगा */

    }

}



/* ==========================================

   Category & Archive Pages Breaking News Center Fix

   ========================================== */

.archive .breaking-news,

.category .breaking-news,

.single .breaking-news,

.breaking-news {

    display: flex !important;

    align-items: center !important;        /* वर्टिकली सेंटर में रखने के लिए */

    justify-content: flex-start !important;

    height: 38px !important;

    min-height: 38px !important;

    max-height: 38px !important;

    margin: 10px auto !important;

    padding: 0 !important;

    position: relative !important;

    top: 0 !important;

    transform: none !important;

}



.archive .breaking-news .ticker-text marquee,

.category .breaking-news .ticker-text marquee,

.single .breaking-news .ticker-text marquee,

.breaking-news .ticker-text marquee {

    display: flex !important;

    align-items: center !important;

    height: 100% !important;

    line-height: 38px !important;          /* टेक्स्ट का वर्टिकल अलाइनमेंट */

    margin: 0 !important;

    padding: 0 !important;

}



.archive .breaking-news .badge,

.category .breaking-news .badge,

.single .breaking-news .badge,

.breaking-news .badge {

    height: 100% !important;

    display: inline-flex !important;

    align-items: center !important;

    margin: 0 !important;

    line-height: 1 !important;

}



/* मोबाइल स्क्रीन (768px से नीचे) के लिए विशेष फ़िक्स */

@media screen and (max-width: 768px) {

    .archive .breaking-news,

    .category .breaking-news,

    .single .breaking-news,

    .breaking-news {

        height: 34px !important;

        min-height: 34px !important;

        margin: 6px auto !important;

    }



    .archive .breaking-news .ticker-text marquee,

    .category .breaking-news .ticker-text marquee,

    .single .breaking-news .ticker-text marquee,

    .breaking-news .ticker-text marquee {

        line-height: 34px !important;

    }

}