/*
Theme Name:    Dailynews24
Theme URI:     https://dailynews24.in/
Description:   Google Discover News Theme - All in One Premium Light Weight Design & Discover Optimized.
Author:        Dailynews24
Author URI:    https://www.dailynews24.in/
Template:      generatepress
Version:       1.0
Requires at least: 5.2
Tested up to: 6.4
Requires PHP: 7.4
Tags: Ekchokho Solutions, Google News Discover Theme, News Website, Discover Ready, Social Share, Fixed Sticky Menu, Bottom Join, Author Bos, Category Page, Discover and Adsense Optimize News Templete
EK News, Copyright 2024 Ekchokho Solutions
GeneratePress is distributed under the terms of the GNU GPL
*/

.menu-button{cursor:pointer;font-size:14px}
.popup-container{position:fixed;bottom:-100%;left:0;width:100%;background-color:#fff;box-shadow:0 -2px 10px rgba(0,0,0,.2);border-radius:15px 15px 0 0;transition:bottom .3s ease-in-out;padding:20px;text-align:center;z-index:9999}
.popup-container.show{bottom:0}
.popup-title{font-size:18px;font-weight:700;margin-bottom:10px}
.language-options{display:flex;justify-content:space-around;flex-wrap:wrap;gap:10px}
.language,.overlay.show{display:block}
.language{width:40%;padding:10px;text-align:center;font-size:16px;font-weight:600;border:2px solid #007bff;border-radius:8px;cursor:pointer;color:#007bff;text-decoration:none}
.language:hover{background-color:#f5f6ff}
.overlay{position:fixed;top:0;left:0;width:100%;height:100%;background:rgba(0,0,0,.2);display:none}
.language span{font-size:14px;color:#8a8a8a;font-weight:400}
.english{color:#007bff;border:2px solid #007bff}
.hindi{color:#ff9800;border:2px solid #ff9800}
.marathi{color:#8e44ad;border:2px solid #8e44ad}
.bangla{color:#27ae60;border:2px solid #27ae60}
.bangla:hover,.english:hover,.hindi:hover,.marathi:hover{opacity:.8}

/*Image Round*/
img {border-radius: 8px;}

/* Font */
.navigation-branding img, .site-logo.mobile-header-logo img {
	padding:3px;}
.site-content {padding-top: 30px;}

/*Top-Notification*/
.gp-icon svg {height: 1.6em; width: 1.6em;top: 0.5em;}
.notification {color: white;padding:5px;position: relative;display: inline-block;margin-top:5px;}
.notification .badge {position: absolute;font-size:10px; padding: 0px 5px 0px 5px; border-radius: 50%; background-color:#009bf5; color: white;}
.notf{ left:15px; top: 5px; }

/*Alignment*/
.dynamic-entry-content{text-align: justify;}

/*Off-canvas-Slider*/
.offcanvaslogo {margin: 10px auto; margin-bottom: 20px;margin-top: 20px;width: 120px;}
.main-navigation.has-branding .menu-toggle, .main-navigation.has-sticky-branding.navigation-stick .menu-toggle {padding-right: 10px;}
#generate-slideout-menu .slideout-menu li {border-bottom: 1px solid #afafafb3;}
.offside-js--is-open .slideout-overlay{background: rgba(0,0,0,.2);-webkit-backdrop-filter: saturate(180%) blur(10px);
backdrop-filter:saturate(180%) blur(10px);}

/*Top Scroll Menu*/
#ScrollMenu{background: linear-gradient(to right, #e70000, #c10000) !important;;display:block!important;width: 100%;height: 30px;overflow-x: scroll;overflow-y:hidden;z-index: 1;}
div#smul{width: max-content; margin-left:1%;}
ul#menu-sticky-header-custom {text-align: right; margin: 0px;}
ul#menu-sticky-header-custom li {list-style: none;display: inline-block;padding: 1px; margin-top:-10px;}
ul#menu-sticky-header-custom li a {text-decoration: none;padding: 0px 6px ; color:#fff;font-size:16px;font-weight:600;}
ul#menu-sticky-header-custom li a:hover {color:#f3eded;}

.avatar{border-radius:50%;}
@media (min-width: 769px){
.inside-right-sidebar{position: sticky;top: 85px;}}

/*App Banner by Dailynews24.in*/
.signup-banner .main-heading{font-size:15px;letter-spacing:.5px;margin-bottom:18px}
.signup-banner .sub-heading{font-size:15px;margin-bottom:8px;font-weight:500;animation:shake 4.3s infinite;}
.signup-banner .users-count{right:30px;padding:6px;border-radius:4px;backdrop-filter:blur(14px);font-size:12px;margin-top:10px;background:0 0;position:initial;}
.users-count .highlight{font-size:15px;font-weight:600}
.signup-banner .users-count svg{vertical-align:sub;margin-right:3px}
.signup-banner{color:#fff;padding:15px 40px 20px;position:relative;overflow:hidden;margin:0;border-radius:4px;background:linear-gradient(135deg,red,white);background-blend-mode:soft-light}

/*custom Dailynews24.in*/
* .mode2Way,.modernWay,nav.rank-math-breadcrumb p{display:-webkit-box;-webkit-box-orient:vertical;overflow:hidden}
.mode2Way,.modernWay{text-overflow:ellipsis}
.modernWay{-webkit-line-clamp:3;line-clamp:3}
::-webkit-scrollbar{width:5px;height:0;-webkit-appearance:none}
::-webkit-scrollbar-track{background:#d1d8eb}
::-webkit-scrollbar-thumb{background-color:#8b0000;border-radius:20px}
.gp-icon svg{height:1.5em;width:1.5em;top:.4em}
.hDrBTN{background:#fff;margin-right:7px;gap:8px;display:flex;flex-direction:row-reverse;align-content:center;align-items:center;padding:1px 5px;border-radius:8px;border:2px solid #00d049;text-transform:capitalize}
.notification,.social-sharing svg{position:relative;display:inline-block}
.notification{color:#00f;padding:7px 10px 0 8px}
.notification .badge{position:absolute;font-size:10px;padding:0 5px;border-radius:50%;background-color:red;color:#fff}
.notf{left:18px;top:5px}
.trend{right:20px;top:10px}
.nav-next,.nav-previous{font-weight:600;color:#5d0000;font-size:16px;padding:8px;text-align:left;margin-bottom:15px;border-radius:10px}
.nav-next{background:#e6f7ff;border-left:6px solid #0c4ca4}
.nav-previous{background:#e6fff6;border-left:6px solid #02a569}
.social-wrapper{margin:10px 0;font-size:0;text-align:center;display:flex;flex-wrap:wrap}
.social-sharing{padding:8px;margin:4px;border-radius:10px;flex:1}
.social-sharing-text{padding:8px 10px 0 0;margin:4px}
.social-sharing svg{top:.15em}
.social-facebook{fill:#fff;background-color:#005fdb}
.social-twitter{fill:#fff;background-color:#00014f}
.social-whatsapp{fill:#fff;background-color:#06ab00}
.social-telegram{fill:#fff;background-color:#009ceb}

#BottomMenu{background:#fff;display:block!important;width:100%;height:65px;overflow-x:scroll;overflow-y:hidden;position:fixed;bottom:0;z-index:1;box-shadow:0 -10px 10px -10px rgba(115,115,115,.45);border-radius:20px 20px 0 0}
ul#bmul{margin-top:12px;margin-left:0!important}
li a{color:#747474;font-size:15px;font-weight:600}
.bml{float:left;color:#fff;font-size:16px;list-style:none;text-align:center;width:20%}
#BottomMenu{margin-top:0}
#BottomMenu .svg-icon{display:block;color:#d4005f;margin:auto;height:25px;width:25px;padding-bottom:2px}
nav.rank-math-breadcrumb{margin-bottom:10px;color:#c9c5c5!important;border-bottom:1px solid #c9c5c5!important}
nav.rank-math-breadcrumb p{margin-bottom:5px;padding:0;font-size:15px;color:#838383;-webkit-line-clamp:1}

/*Minify CSS Ekchokho.com*/
.float-social-wrapper{position:fixed;top:50%;transform:translateY(-50%);width:100%;z-index:1000;display:flex;justify-content:space-between;pointer-events:none}
.float-social-wrapper .float-social-sharing{width:45px;height:60px;background:rgba(0,0,0,.7);color:#fff;font-size:24px;display:flex;align-items:center;justify-content:center;border-radius:6px;transition:.3s;pointer-events:auto}
.float-social-wrapper .ek-pre{position:absolute;left:-10px;border-top-right-radius:8px;border-bottom-right-radius:8px}
.float-social-wrapper .ek-next{position:absolute;right:-10px;border-top-left-radius:8px;border-bottom-left-radius:8px}
.float-social-wrapper .float-social-sharing a{color:#fff;text-decoration:none;width:100%;height:100%;display:flex;align-items:center;justify-content:center}
.float-social-wrapper .float-social-sharing:hover{background:rgba(255,255,255,.5)}
@media (max-width:768px){.float-social-wrapper .float-social-sharing{width:40px;height:50px;font-size:20px}}

/* --- Start: NEW Related Posts Card & Slider CSS (Added by Gemini) --- */
/* Common wrapper for "ये भी पढ़ें" heading */
.related-posts-section {
    margin-top: 40px;
    margin-bottom: 40px;
    padding: 0px; /* Removed padding to match screenshot layout closer */
    background-color: transparent; /* Removed background color */
    border: none; /* Removed border */
    border-radius: 0px; /* Removed border-radius */
    box-shadow: none; /* Removed box-shadow */
}

/* Updated heading for "ये भी पढ़ें" */
.related-posts-section .related-posts-title-text {
    font-size: 14px; /* Fixed font size as per request */
    font-weight: bold;
    color: #333;
    display: block; /* Ensures it acts like a block element for text-align */
    text-align: center;
    margin-bottom: 25px;
    padding-bottom: 10px;
    border-bottom: 2px solid #0073aa;
    width: auto;
    display: table; /* To make the border-bottom apply only to the text width */
    margin-left: auto;
    margin-right: auto;
}


/* Updated 3-column grid for related posts (Desktop default) */
.related-posts-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* Default to 3 columns on larger screens */
    gap: 20px; /* Space between cards */
    justify-content: center;
    margin-bottom: 40px;
    padding: 0;
    list-style: none;
    margin-left: 0;
}

.related-post-card {
    background-color: #fff;
    border: none; /* Removed border */
    border-radius: 8px;
    overflow: hidden;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
    transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out;
    display: flex; /* Use flex for internal stacking of image/title */
    flex-direction: column; /* Default: image on top, title below */
}

.related-post-card:hover {
    transform: translateY(-5px);
    box-shadow: 0 4px 10px rgba(0,0,0,0.15);
}

.related-post-card a {
    text-decoration: none;
    color: inherit;
    display: flex;
    flex-direction: column; /* Link content stacks vertically by default */
    height: 100%;
}

.related-post-card .post-thumbnail-wrapper {
    width: 100%;
    padding-bottom: 56.25%; /* Approx 16:9 aspect ratio */
    position: relative;
    overflow: hidden;
    background-color: #e0e0e0; /* Placeholder background */
}

.related-post-card .related-post-thumbnail {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
    transition: transform 0.3s ease-in-out;
    border-radius: 0;
    box-shadow: none;
    border: none;
}

.related-post-card:hover .related-post-thumbnail {
    transform: scale(1.05);
}

.related-post-card .post-title {
    font-size: 16px; /* Fixed to 16px for larger screens */
    font-weight: bold; /* Bold for desktop */
    color: #333;
    margin: 10px; /* Adjusted margin */
    line-height: 1.4;
    flex-grow: 1;
    display: -webkit-box;
    -webkit-line-clamp: 3; /* Limit title to 3 lines */
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
}
/* Placeholder thumbnail style, if used */
.related-post-card .placeholder-thumbnail {
    background-color: #e0e0e0;
    color: #888;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 1.2em;
    text-align: center;
}

/* Slider Section Styling (Kept in case you want to use it later) */
.related-posts-slider-wrapper {
    margin-top: 30px;
    padding-top: 20px;
    border-top: 1px dashed #ddd;
    position: relative;
}

.related-posts-slider-wrapper .slider-title {
    font-size: 1.5em;
    font-weight: bold;
    color: #333;
    text-align: center;
    margin-bottom: 25px;
}

/* Swiper specific styles */
.related-posts-swiper {
    width: 100%;
    padding: 10px 0;
}

.related-posts-swiper .swiper-slide {
    height: auto;
    display: flex;
}

/* Navigation buttons (next/prev) */
.related-posts-swiper .swiper-button-next,
.related-posts-swiper .swiper-button-prev {
    color: #0073aa;
    background-color: rgba(255, 255, 255, 0.8);
    border-radius: 50%;
    width: 40px;
    height: 40px;
    font-size: 1.2em;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
    transition: background-color 0.3s ease;
}

.related-posts-swiper .swiper-button-next:hover,
.related-posts-swiper .swiper-button-prev:hover {
    background-color: #0073aa;
    color: #fff;
}

.related-posts-swiper .swiper-button-prev {
    left: -20px;
}

.related-posts-swiper .swiper-button-next {
    right: -20px;
}

/* Pagination dots */
.related-posts-swiper .swiper-pagination-bullet {
    background: #bbb;
    opacity: 0.8;
}

.related-posts-swiper .swiper-pagination-bullet-active {
    background: #0073aa;
    opacity: 1;
}

/* Hide mobile-specific header by default (desktop) */
.mobile-related-stories-header {
    display: none;
}

/* Responsive adjustments for Related Posts (Grid & Slider) */
@media (max-width: 1200px) {
    .related-posts-swiper .swiper-button-next,
    .related-posts-swiper .swiper-button-prev {
        width: 35px;
        height: 35px;
        font-size: 1em;
        top: 50%;
        transform: translateY(-50%);
    }
    .related-posts-swiper .swiper-button-prev {
        left: 5px;
    }
    .related-posts-swiper .swiper-button-next {
        right: 5px;
    }
}

/* Mobile-specific styles (<= 768px) */
@media (max-width: 768px) {
    .related-posts-grid {
        /* Override grid for mobile to use flexbox for stacked list */
        display: flex;
        flex-direction: column; /* Stack items vertically */
        gap: 15px; /* Space between cards */
        padding: 0; /* Remove padding */
    }

    .related-post-card {
        flex-direction: row; /* Image and title side-by-side on mobile */
        align-items: center; /* Vertically align items in the middle */
        padding: 10px; /* Add some padding inside the card */
        border-radius: 8px; /* Maintain rounded corners */
        width: 100%; /* Ensure card takes full width */
        box-shadow: 0 1px 3px rgba(0,0,0,0.1); /* Lighter shadow for mobile */
    }

    .related-post-card a {
        flex-direction: row; /* Link content also aligns image and text side-by-side */
        align-items: center;
    }

    .related-post-card .post-thumbnail-wrapper {
        width: 90px; /* Fixed width for thumbnail on mobile */
        height: 65px; /* Fixed height for thumbnail (approx 4:3) */
        padding-bottom: 0; /* Remove aspect ratio padding */
        flex-shrink: 0; /* Don't shrink the thumbnail */
        border-radius: 4px; /* Slightly smaller border radius for thumbnail */
        margin-right: 15px; /* Space between thumbnail and text */
        overflow: hidden;
    }

    .related-post-card .related-post-thumbnail {
        border-radius: 4px; /* Make image corners rounded on mobile */
        width: 100%;
        height: 100%;
        object-fit: cover;
    }

    .related-post-card .post-title {
        font-size: 12px; /* Changed to 12px for mobile */
        font-weight: bold; /* Ensure it's bold on mobile */
        margin: 0; /* Remove margin as padding is on card */
        text-align: left; /* Ensure left alignment */
        -webkit-line-clamp: 3; /* Still limit to 3 lines */
    }

    .related-posts-swiper .swiper-button-next,
    .related-posts-swiper .swiper-button-prev {
        display: none; /* Hide slider navigation on mobile */
    }

    /* Hide desktop title and show mobile-specific title */
    .related-posts-section .related-posts-title-text {
        display: none;
    }
    .mobile-related-stories-header {
        display: block; /* Show on mobile */
        font-size: 1.6em; /* Adjust font size as needed */
        font-weight: bold;
        color: #d63638; /* Red color as in the example */
        margin-bottom: 20px;
        text-align: left;
        padding-left: 10px; /* Some padding from the left edge */
        border-bottom: 1px solid #eee; /* Light line below it */
        padding-bottom: 10px;
    }

    .mobile-related-stories-header span.dashicons {
        color: #d63638; /* Icon color */
        margin-right: 8px;
        vertical-align: middle;
    }
}

/* Adjustments for smaller mobile screens (<= 480px) */
@media (max-width: 480px) {
    .related-post-card .post-thumbnail-wrapper {
        width: 80px; /* Slightly smaller thumbnail for very small screens */
        height: 60px;
        margin-right: 10px;
    }
    .related-post-card .post-title {
        font-size: 12px; /* Keep 12px for very small screens */
    }
    .mobile-related-stories-header {
        font-size: 1.4em;
    }
}
/* --- End: NEW Related Posts Card & Slider CSS (Added by Gemini) --- */
