/*
Theme Name: JhilkoPress
Theme URI: https://whitehillit.com/jhilkopress
Author: Roshan Kumar Thapa
Author URI: https://whitehillit.com
Description: Fully responsive and mobile-friendly Nepali news portal WordPress theme.
Version: 2.0
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: jhilkopress
Tags: news, portal, responsive, mobile-friendly, nepali

This theme is designed and developed by Roshan Kumar Thapa, Whitehill Solution.
*/


/* ==========================
   Header CSS
========================== */
* { margin:0; padding:0; box-sizing:border-box; }
body { font-family:'Mukta','Roboto',Arial,sans-serif;  }
a { text-decoration:none; color:inherit; }
a:hover { color:inherit; }

/* Header */
.site-header { width:100%; position:relative; z-index:1000; }

/* Social Links */
.header-social { background:#BAE4F0; padding:5px 20px; }
.header-social__inner {
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:10px;
  width:100%;
}
.header-social a {
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:36px;
  height:36px;
  font-size:18px;
  color:#004E9B;
  transition:color 0.3s;
}
.header-social a:hover { color:#FF6500; }

@media screen and (max-width:768px){
  .header-social {
    padding:5px 15px;
  }

  .header-social__inner {
    justify-content:flex-end;
  }
}

/* Top Header: Date, Logo, Weather */
.header-top { display:flex; justify-content:space-between; align-items:center; padding:10px 40px; background:#fff; flex-wrap:wrap; }
.header-date { font-size:1.5rem; font-weight:700; color:#0099cc; }
.site-logo { text-align:center; flex:1;  font-weight:700; }
.site-logo img { width:450px; max-width:450px; height:auto; }
.header-weather { display:flex; align-items:center; gap:5px; font-size:1.5rem; color:#004E9B; }
.header-weather .weather-icon { font-size:1.5rem; }
.header-weather .weather-temp { font-weight:700; font-family:'Mukta',sans-serif; }
@media screen and (max-width:768px){
  /* Stack the header-top elements vertically */
  .header-top {
    flex-direction: column;   /* stack in a column */
    align-items: center;      /* center-align all items */
    gap: 10px;                /* space between rows */
    padding: 10px 15px;       /* tighter padding for mobile */
  }

  .header-date,
  .site-logo,
  .header-weather {
    flex: none;               /* prevent shrinking/stretching */
    width: 100%;              /* take full width for center alignment */
    text-align: center;       /* center text and logo */
  }

  /* Make logo smaller for small screens */
  .site-logo img {
    max-width: 350px;
    width: 100%;
    height: auto;
  }

  /* Adjust font sizes for smaller viewports */
  .header-date,
  .header-weather {
    font-size: 1.2rem;
  }
  .header-weather .weather-icon {
    font-size: 1.2rem;
  }

  .header-date {
    white-space: nowrap;
  }

  .header-weather {
    display: none;
  }
}

/* ==========================
   Full-width Navigation Bar
========================== */
nav.main-navigation { width:100%; background:#0091B9; position:sticky; top:0; left:0; z-index:1100; }

nav.main-navigation .menu-container { 
    max-width:1200px; /* Optional: center content */
    margin:0 auto;
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding:0 20px;
}

nav.main-navigation .menu-items {
    display:flex;
    list-style:none;
    margin:0;
    padding:0;
}

nav.main-navigation .menu-items li { margin-left:20px; position:relative; }
nav.main-navigation .menu-items li:first-child { margin-left:0; }

/* Prevent menu text wrap */
nav.main-navigation .menu-items li a {
    display:block;
    padding:15px 20px;
    color:#fff;
    font-size:1.5rem;
    font-weight:700;
    transition:background 0.3s;
    white-space: nowrap;       /* Prevent wrapping */
    overflow: hidden;          /* Hide overflow */
    text-overflow: ellipsis;   /* Add "..." if too long */
}
nav.main-navigation .menu-items li a:hover { background:#004E9B; }

/* Submenu Desktop */
nav.main-navigation .menu-items li ul.sub-menu { display:none; position:absolute; top:100%; left:0; background:#004E9B; min-width:200px; list-style:none; padding:0; }
nav.main-navigation .menu-items li:hover > ul.sub-menu { display:block; }
nav.main-navigation .menu-items li ul.sub-menu li a { padding:10px 20px; display:block; color:#fff; border-bottom:1px solid #0091B9; }
nav.main-navigation .menu-items li ul.sub-menu li a:hover { background:#FF6500; color:#fff; }

/* Hamburger */
.menu-toggle {
  display:none;
  flex-direction:column;
  justify-content:space-between;
  width:46px;
  height:46px;
  padding:11px 10px;
  border:1px solid rgba(255,255,255,0.28);
  border-radius:12px;
  background:#0c5066;
  cursor:pointer;
  box-shadow:0 10px 22px rgba(0,0,0,0.16);
}
.menu-toggle span { display:block; height:3px; width:100%; background:#f3fbff; border-radius:999px; transition: all 0.3s ease; }
.menu-toggle.active span:nth-child(1) { transform:rotate(45deg) translate(5px,5px); }
.menu-toggle.active span:nth-child(2) { opacity:0; }
.menu-toggle.active span:nth-child(3) { transform:rotate(-45deg) translate(5px,-5px); }

/* Mobile Menu */
@media screen and (max-width:1024px){
    .menu-toggle { display:flex; }

    nav.main-navigation .menu-items { 
        display:none; 
        flex-direction:column; 
        width:100%; 
        background:#0091B9; 
        position:absolute; 
        top:100%; 
        left:0; 
    }
    nav.main-navigation.active .menu-items { display:flex; }

    nav.main-navigation .menu-items li a { text-align:center; border-top:1px solid #004E9B; margin-left:0; padding:12px 15px; }

    nav.main-navigation .menu-items li ul.sub-menu { display:none; flex-direction:column; position:relative; }
    nav.main-navigation .menu-items li.active-submenu > ul.sub-menu { display:flex; }
    nav.main-navigation .menu-items li ul.sub-menu li a { text-align:center; border-top:1px solid #0091B9; }
    nav.main-navigation .menu-items li.menu-item-has-children > a::after { content:"\f107"; font-family:"Font Awesome 5 Free"; font-weight:900; margin-left:10px; }
    .menu-toggle:hover,
    .menu-toggle:focus-visible {
        background:#0099cc;
        border-color:rgba(255,255,255,0.42);
        outline:none;
    }
}

@media screen and (min-width:1025px){ nav.main-navigation .menu-items li.menu-item-has-children > a::after { content:none; } }

/* Search Form */
.nav-search a { color:#fff; }
.header-search-form { display:none; position:absolute; top:100%; right:0; flex-direction:row; background:#fff; border:1px solid #004E9B; border-radius:5px; overflow:hidden; }
.header-search-form input { padding:8px; border:none; outline:none; }
.header-search-form button { padding:8px 10px; border:none; background:#004E9B; color:#fff; cursor:pointer; }



/* ===============================
   Search Results Page Styling
=============================== */
.search-results-page {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
    font-family: Arial, sans-serif;
}

.search-results-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
    gap: 30px;
}

.search-result-item {
    background-color: #fff;
    border: 1px solid #e0e0e0;
    border-radius: 10px;
    overflow: hidden;
    transition: box-shadow 0.3s ease;
}

.search-result-item:hover {
    box-shadow: 0 8px 20px rgba(0,0,0,0.1);
}

.search-result-thumbnail img {
    width: 100%;
    height: auto;
    display: block;
    border-bottom: 1px solid #e0e0e0;
}

.search-result-content {
    padding: 15px;
}

.search-result-title {
    font-size: 18px;
    margin-bottom: 10px;
}

.search-result-title a {
    color: #222;
    text-decoration: none;
    transition: color 0.3s ease;
}

.search-result-title a:hover {
    color: #0073e6;
}

.search-result-meta {
    display: flex;
    align-items: center;
    gap: 15px;
    font-size: 14px;
    color: #555;
}

.search-result-meta i {
    margin-right: 5px;
    color: #0073e6;
}

/* Author Avatar */
.search-result-author {
    display: flex;
    align-items: center;
    gap: 8px;
}

.search-result-author .author-avatar {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    object-fit: cover;
    border: 1px solid #ccc;
}

/* Date Styling */
.search-result-date {
    display: flex;
    align-items: center;
    gap: 5px;
}

/* Pagination */
.search-pagination {
    margin-top: 30px;
    text-align: center;
}

.search-pagination .page-numbers {
    display: inline-block;
    margin: 0 5px;
    padding: 6px 12px;
    border: 1px solid #e0e0e0;
    border-radius: 5px;
    color: #0073e6;
    text-decoration: none;
    transition: all 0.3s ease;
}

.search-pagination .page-numbers.current,
.search-pagination .page-numbers:hover {
    background-color: #0073e6;
    color: #fff;
    border-color: #0073e6;
}

/* No results section */
.no-results {
    text-align: center;
    padding: 50px 20px;
    font-size: 16px;
    color: #555;
}

.no-results h1 {
    font-size: 28px;
    margin-bottom: 20px;
}

/* Featured Post Meta */
.featured-meta {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-wrap: wrap;
    gap: 14px;
    text-align: center;
    margin-bottom: 14px;
}

.featured-date,
.featured-author {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 6px;
    color: #0099cc;
}

.featured-date,
.featured-author,
.featured-author *:not(.author-avatar) {
    color: #0099cc;
}

.featured-date i {
    color: #fe2d2d;
}

.featured-author .author-avatar {
    color: inherit;
    border: 0;
}