/* =========================================================
   Lok Jagat News Theme — Main Stylesheet
   ========================================================= */

:root{
	--lj-accent: #b91c28;
	--lj-accent-dark: #8f1520;
	--lj-dark: #161616;
	--lj-dark-2: #1f1f1f;
	--lj-text: #222222;
	--lj-muted: #6b6b6b;
	--lj-border: #ececec;
	--lj-bg: #ffffff;
	--font-hi: 'Noto Sans Devanagari', 'Hind', sans-serif;
}

*,*::before,*::after{ box-sizing: border-box; }
body{
	margin:0;
	font-family: var(--font-hi);
	color: var(--lj-text);
	background: var(--lj-bg);
	line-height: 1.6;
	font-size: 16px;
}
img{ max-width:100%; height:auto; display:block; }
a{ color: inherit; text-decoration: none; }
a:hover{ color: var(--lj-accent); }
ul{ margin:0; padding:0; list-style:none; }
h1,h2,h3,h4{ font-family: var(--font-hi); font-weight:700; margin:0 0 .5em; color:#111; }

.lj-container{ max-width: 1280px; margin: 0 auto; padding: 0 20px; }
.screen-reader-text{ position:absolute; left:-9999px; }

/* =========================== HEADER =========================== */
.site-header{ background:#fff; border-bottom: 1px solid var(--lj-border); }
.lj-header-row{
	display:flex; align-items:center; justify-content:space-between;
	gap: 30px; padding: 18px 20px;
}
.lj-logo img{ max-height: 80px; width:auto; }
.lj-logo-text{ font-size: 34px; font-weight:800; color:#111; letter-spacing:1px; }
.lj-header-ad{ flex: 1 1 auto; max-width: 728px; }
.lj-header-ad img{ width:100%; border-radius:2px; }
.lj-header-ad-placeholder{
	background: repeating-linear-gradient(45deg,#f4f4f4,#f4f4f4 10px,#eaeaea 10px,#eaeaea 20px);
	border:1px dashed #ccc; color:#999; text-align:center; padding: 34px 10px; font-size:13px;
}

/* =========================== NAV =========================== */
.lj-primary-nav{ background:#fff; border-bottom: 3px solid var(--lj-accent); position: sticky; top: 0; z-index: 200; }
.lj-primary-nav .lj-container{ display:flex; align-items:center; }
.primary-menu{ display:flex; flex-wrap:wrap; align-items:center; gap: 4px; flex:1; }
.primary-menu > li{ position:relative; }
.primary-menu > li > a{
	display:block; padding: 16px 14px; font-weight:700; font-size:15px;
	text-transform: uppercase; color:#1a1a1a; letter-spacing:.3px;
}
.primary-menu > li:first-child > a{ color: var(--lj-accent); }
.primary-menu > li > a:hover,
.primary-menu > li.current-menu-item > a{ color: var(--lj-accent); }
.primary-menu ul{
	display:none; position:absolute; top:100%; left:0; min-width:200px;
	background:#fff; border:1px solid var(--lj-border); box-shadow:0 8px 20px rgba(0,0,0,.08); z-index:50;
}
.primary-menu li:hover > ul{ display:block; }
.primary-menu ul li a{ padding:10px 16px; display:block; font-size:14px; font-weight:600; text-transform:none; border-bottom:1px solid var(--lj-border); }
.primary-menu li.menu-item-has-children > a::after{ content:'▾'; font-size:11px; margin-left:5px; }
.lj-menu-toggle{ display:none; background:none; border:none; padding:14px; cursor:pointer; }
.lj-menu-toggle span{ display:block; width:24px; height:3px; background:#111; margin:5px 0; }

/* Quick search toggle */
.lj-search-toggle{ background:none; border:none; cursor:pointer; padding:10px; color:#111; margin-left:8px; flex-shrink:0; }
.lj-search-toggle:hover{ color: var(--lj-accent); }
.lj-nav-search{ max-height:0; overflow:hidden; background:#f7f7f7; transition: max-height .25s ease; border-top: 0 solid var(--lj-border); }
.lj-nav-search.is-open{ max-height:80px; border-top-width:1px; }
.lj-nav-search .lj-container{ padding: 14px 20px; }
.lj-nav-search .lj-search-form{ max-width: 100%; }

/* =========================== BREADCRUMBS =========================== */
.lj-breadcrumbs{ font-size:13px; color: var(--lj-muted); margin: 18px 0 10px; }
.lj-breadcrumbs a{ color: var(--lj-muted); }
.lj-breadcrumbs a:hover{ color: var(--lj-accent); }
.lj-breadcrumbs span{ margin: 0 6px; }
.lj-breadcrumbs .current{ color: var(--lj-text); font-weight:600; }

/* =========================== AD PLACEMENTS =========================== */
.lj-in-content-ad{
	position:relative; margin: 26px 0; padding: 18px; text-align:center;
	background:#f7f7f7; border:1px dashed #ddd; border-radius:4px;
}
.lj-in-content-ad img{ margin: 0 auto; }
.lj-in-content-ad .lj-adv-label{ display:block; text-align:left; margin-bottom:10px; }

.lj-infeed-ad{
	margin: 10px 0 46px; padding: 16px; text-align:center;
	background:#f7f7f7; border:1px dashed #ddd; border-radius:4px;
}
.lj-infeed-ad img{ margin:0 auto; }
.lj-infeed-ad .lj-adv-label{ display:block; margin-bottom:8px; }

.lj-footer-ad{ padding: 20px 0; text-align:center; }
.lj-footer-ad img{ margin:0 auto; border-radius:4px; }
.lj-footer-ad .lj-adv-label{ color:#999; display:block; margin-bottom:8px; }

.lj-ad-widget{ text-align:center; }

/* =========================== BREAKING TICKER =========================== */
.lj-ticker{ display:flex; align-items:stretch; background: var(--lj-dark); overflow:hidden; }
.lj-ticker-label{
	flex: 0 0 auto; background: var(--lj-accent); color:#fff; font-weight:800;
	padding: 14px 24px; font-size:15px; display:flex; align-items:center; white-space:nowrap;
}
.lj-ticker-track-wrap{ flex:1 1 auto; overflow:hidden; position:relative; }
.lj-ticker-track{ display:flex; align-items:center; width:max-content; animation: lj-ticker-scroll 40s linear infinite; }
.lj-ticker-track:hover{ animation-play-state: paused; }
.lj-ticker-item{ display:flex; align-items:center; gap:10px; color:#eee; padding: 10px 30px; white-space:nowrap; font-size:14px; }
.lj-ticker-item img{ width:34px; height:26px; object-fit:cover; border-radius:2px; }
.lj-ticker-item:hover{ color:#fff; }
@keyframes lj-ticker-scroll{ from{ transform: translateX(0); } to{ transform: translateX(-50%); } }

/* =========================== BADGES / DATE =========================== */
.lj-badge{
	position:absolute; top:10px; left:10px; background: var(--lj-accent); color:#fff;
	font-size:12px; font-weight:700; padding:4px 10px; border-radius:2px; z-index:2;
}
.lj-date{ display:inline-flex; align-items:center; gap:5px; font-size:13px; color: var(--lj-muted); margin: 8px 0 4px; }
.lj-date-icon{ opacity:.7; }

/* =========================== MAIN LAYOUT =========================== */
.lj-main-wrap{ display:grid; grid-template-columns: 2fr 1fr; gap: 34px; padding: 30px 20px 60px; }
.lj-main-col{ min-width:0; }

/* =========================== HERO =========================== */
.lj-hero{ display:grid; grid-template-columns: 1.6fr 1fr; gap: 20px; margin-bottom: 40px; }
.lj-hero-media{ position:relative; display:block; overflow:hidden; border-radius:4px; background:#eee; }
.lj-hero-media img{ width:100%; aspect-ratio: 16/10; object-fit:cover; }
.lj-hero-body h2{ font-size: 24px; margin-top: 4px; }
.lj-hero-side{ display:flex; flex-direction:column; gap:16px; }

/* Thumb card (sidebar-style stacked cards) */
.lj-thumb-card{ display:flex; flex-direction:column; border:1px solid var(--lj-border); border-radius:4px; overflow:hidden; }
.lj-thumb-card-media{ position:relative; }
.lj-thumb-card-media img{ width:100%; aspect-ratio:16/9; object-fit:cover; }
.lj-thumb-card-body{ padding:10px 14px 14px; }
.lj-thumb-card-body h3{ font-size:16px; margin:2px 0 0; }

/* =========================== SECTION HEADINGS =========================== */
.lj-section{ margin-bottom: 46px; }
.lj-section-heading{ display:flex; align-items:flex-end; justify-content:space-between; margin-bottom:18px; position:relative; }
.lj-section-heading h1, .lj-section-heading h2{
	font-size: 26px; margin:0; padding-bottom:10px; position:relative; display:inline-block;
}
.lj-section-heading h1::after, .lj-section-heading h2::after{
	content:''; position:absolute; left:0; bottom:0; width:60px; height:3px; background: var(--lj-accent);
}
.lj-viewmore{ font-size:14px; font-weight:700; color:#333; white-space:nowrap; }
.lj-viewmore:hover{ color: var(--lj-accent); }

/* =========================== DARK FEATURED CARD =========================== */
.lj-dark-card{ background: var(--lj-dark); color:#fff; border-radius:4px; overflow:hidden; display:grid; grid-template-columns: 1.1fr 1fr; }
.lj-dark-card-media{ position:relative; min-height:260px; background:#000; }
.lj-dark-card-media img{ width:100%; height:100%; object-fit:cover; opacity:.85; min-height:260px; }
.lj-dark-card-tag{ display:none; }
.lj-dark-card-body{ padding: 28px 30px; display:flex; flex-direction:column; justify-content:center; }
.lj-dark-card-body .lj-date{ color:#bbb; }
.lj-dark-card-body h3{ color:#fff; font-size:24px; margin:6px 0 14px; line-height:1.35; }
.lj-dark-card-body p{ color:#ccc; font-size:15px; margin:0 0 20px; }
.lj-readmore{
	display:inline-block; background:#fff; color:#111; font-weight:700; font-size:14px;
	padding:10px 26px; border-radius:2px; width:fit-content;
}
.lj-readmore:hover{ background: var(--lj-accent); color:#fff; }

/* Featured section w/ aside (first homepage block) */
.lj-featured-grid{ display:grid; grid-template-columns: 2fr 1fr; gap:20px; align-items:start; }
.lj-featured-aside{ display:flex; flex-direction:column; gap:16px; }
.lj-adv-label{ color: var(--lj-accent); font-weight:800; font-size:13px; letter-spacing:1px; }
.lj-recently-title{ font-size:18px; border-top:1px solid var(--lj-border); padding-top:16px; }

/* List rows under dark card */
.lj-list-grid{ display:grid; grid-template-columns: repeat(3, 1fr); gap:20px; margin-top:20px; }
.lj-list-row h4{ font-size:15px; margin:0 0 6px; line-height:1.4; }
.lj-list-row h4 a:hover{ color: var(--lj-accent); }

/* Horizontal rows (recently viewed) */
.lj-horizontal-row{ display:flex; gap:12px; padding:12px 0; border-bottom:1px solid var(--lj-border); }
.lj-horizontal-row-media img{ width:76px; height:56px; object-fit:cover; border-radius:3px; }
.lj-horizontal-row-body h4{ font-size:14px; margin:0 0 6px; line-height:1.35; }

/* Video */
.lj-video-grid{ display:grid; grid-template-columns: repeat(3,1fr); gap:20px; }
.lj-video-card a{ position:relative; display:block; border-radius:4px; overflow:hidden; background:#000; }
.lj-video-card img{ aspect-ratio:16/9; object-fit:cover; opacity:.8; }
.lj-play{ position:absolute; inset:0; display:flex; align-items:center; justify-content:center; color:#fff; font-size:30px; }
.lj-video-card h4{ font-size:15px; margin-top:10px; }

/* =========================== SIDEBAR =========================== */
.lj-sidebar{ display:flex; flex-direction:column; gap:22px; }
.lj-widget{ }
.lj-widget img{ border-radius:4px; }
.lj-widget-title{
	font-size:18px; padding-bottom:10px; margin-bottom:14px; position:relative; color: var(--lj-accent);
}
.lj-widget-title::after{ content:''; position:absolute; left:0; bottom:0; width:50px; height:3px; background: var(--lj-accent); }
.lj-widget ul li{ padding:10px 0; border-bottom:1px solid var(--lj-border); font-size:14px; font-weight:600; }
.lj-widget ul li:hover a{ color: var(--lj-accent); }

/* =========================== ARCHIVE / SINGLE / SEARCH grids =========================== */
.lj-archive-grid{ display:grid; grid-template-columns: repeat(2,1fr); gap:24px; }
.lj-archive-card{ border:1px solid var(--lj-border); border-radius:4px; overflow:hidden; }
.lj-archive-media{ position:relative; display:block; }
.lj-archive-media img{ width:100%; aspect-ratio:16/10; object-fit:cover; }
.lj-archive-body{ padding:14px 16px 18px; }
.lj-archive-body h2{ font-size:18px; margin:2px 0 8px; }
.lj-archive-body p{ font-size:14px; color:var(--lj-muted); margin:0; }

/* =========================== SINGLE ARTICLE =========================== */
.lj-single-meta{ display:flex; align-items:center; gap:14px; }
.lj-single-title{ font-size:30px; margin: 12px 0; line-height:1.35; }
.lj-single-media{ margin-bottom:20px; border-radius:4px; overflow:hidden; }
.lj-single-content{ font-size:17px; }
.lj-single-content p{ margin: 0 0 1.2em; }
.lj-single-content img{ border-radius:4px; margin: 10px 0; }
.lj-single-tags{ margin-top:26px; padding-top:16px; border-top:1px solid var(--lj-border); font-size:14px; }
.lj-tags-label{ font-weight:700; margin-right:6px; }

/* =========================== COMMENTS =========================== */
.lj-comments{ margin-top:40px; padding-top:24px; border-top:1px solid var(--lj-border); }
.lj-comment-list{ margin:20px 0; }
.lj-comment-list li{ margin-bottom:16px; }
.comment-form input, .comment-form textarea{
	width:100%; padding:10px 14px; border:1px solid var(--lj-border); border-radius:3px; margin-bottom:12px; font-family: var(--font-hi);
}

/* =========================== SEARCH FORM =========================== */
.lj-search-form{ display:flex; border:1px solid var(--lj-border); border-radius:3px; overflow:hidden; max-width:400px; }
.lj-search-field{ flex:1; border:none; padding:10px 14px; font-family: var(--font-hi); }
.lj-search-submit{ background: var(--lj-accent); border:none; color:#fff; padding:0 16px; cursor:pointer; }

/* =========================== FOOTER (new, easy navigation) =========================== */
.site-footer{ background: var(--lj-dark); color:#ccc; margin-top: 20px; padding: 50px 0 0; }

.lj-footer-grid{
	display:grid; grid-template-columns: 1.4fr 1fr 1fr 1.2fr; gap: 34px;
	padding-bottom: 34px; border-bottom: 1px solid rgba(255,255,255,.1);
}
.lj-footer-logo img{ max-height:56px; width:auto; }
.lj-footer-logo-text{ font-size:24px; font-weight:800; color:#fff; }
.lj-footer-tagline{ font-size:14px; color:#999; margin: 12px 0 16px; line-height:1.6; }

.lj-social-icons{ display:flex; gap:10px; }
.lj-social-icons a{
	width:34px; height:34px; border-radius:50%; background: rgba(255,255,255,.08);
	display:flex; align-items:center; justify-content:center; color:#ccc;
}
.lj-social-icons a:hover{ background: var(--lj-accent); color:#fff; }

.lj-footer-col-title{ color:#fff; font-size:16px; margin-bottom:16px; position:relative; padding-bottom:10px; }
.lj-footer-col-title::after{ content:''; position:absolute; left:0; bottom:0; width:34px; height:2px; background: var(--lj-accent); }

.lj-footer-list li{ margin-bottom:10px; }
.lj-footer-list a{ color:#bbb; font-size:14px; }
.lj-footer-list a:hover{ color: var(--lj-accent); padding-left:3px; }

.lj-footer-contact-list li{ margin-bottom:10px; font-size:14px; color:#bbb; line-height:1.5; }
.lj-footer-contact-list span{ color:#888; }
.lj-footer-contact-list a{ color:#bbb; }
.lj-footer-contact-list a:hover{ color: var(--lj-accent); }

.lj-footer-widgets{ display:flex; gap:30px; justify-content:center; flex-wrap:wrap; padding: 24px 0; }
.footer-widget-title{ color:#fff; font-size:16px; }

.lj-footer-bottom{
	display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:10px;
	padding: 20px 0; font-size:13px; color:#888;
}
.lj-footer-bottom-links{ display:flex; gap:20px; flex-wrap:wrap; }
.lj-footer-bottom-links a{ color:#999; }
.lj-footer-bottom-links a:hover{ color:#fff; }
.lj-copyright{ margin:0; }

.lj-back-to-top{
	position:fixed; right:22px; bottom:22px; width:44px; height:44px; border-radius:50%;
	background: var(--lj-accent); color:#fff; display:flex; align-items:center; justify-content:center;
	font-size:20px; box-shadow:0 4px 14px rgba(0,0,0,.25); z-index: 999;
}
.lj-back-to-top:hover{ color:#fff; background: var(--lj-accent-dark); }

.lj-404{ text-align:center; padding: 80px 0; }
.lj-404 h1{ font-size:80px; color: var(--lj-accent); margin:0; }

/* =========================== RESPONSIVE =========================== */
@media (max-width: 1024px){
	.lj-main-wrap{ grid-template-columns: 1fr; }
	.lj-hero{ grid-template-columns: 1fr; }
	.lj-featured-grid{ grid-template-columns: 1fr; }
	.lj-dark-card{ grid-template-columns: 1fr; }
	.lj-list-grid{ grid-template-columns: 1fr 1fr; }
	.lj-footer-grid{ grid-template-columns: 1fr 1fr; }
}
@media (max-width: 782px){
	.lj-header-row{ flex-wrap:wrap; }
	.lj-header-ad{ order:3; width:100%; max-width:none; }
	.lj-menu-toggle{ display:block; margin-left:auto; }
	.primary-menu{ display:none; flex-direction:column; width:100%; }
	.primary-menu.is-open{ display:flex; }
	.primary-menu > li{ width:100%; }
	.primary-menu ul{ position:static; box-shadow:none; }
	.lj-archive-grid{ grid-template-columns: 1fr; }
	.lj-list-grid{ grid-template-columns: 1fr; }
	.lj-video-grid{ grid-template-columns: 1fr; }
	.lj-ticker{ flex-direction:row; }
	.lj-ticker-label{ padding:12px 14px; font-size:13px; }
	.lj-footer-grid{ grid-template-columns: 1fr; }
	.lj-footer-bottom{ flex-direction:column; text-align:center; }
	.lj-primary-nav{ position: static; }
}
