/*!
 * Saransh Dainik — Professional News Portal Header
 * Multi-row news header: utility bar / brand+search / dark category nav / breaking ticker.
 * Brand tones: navy #07152f, gold #f5b301 / #ffc107, red #c8102e, teal #0494b1.
 * Class names below are unique to this redesign (no theme collisions).
 */

/* ------------------------------------------------------------------ ROW 1: UTILITY BAR */
.news-header .header-utility {
	background: #f5f6f8;
	border-bottom: 1px solid #e6e8eb;
	font-size: 13px;
	line-height: 32px;               /* compact ~32px */
	color: #444;
}
.news-header .header-utility .container { padding-left: 15px; padding-right: 15px; }
.news-header .header-utility-row {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: space-between;
	min-height: 32px;
}
.news-header .header-utility-left {
	display: flex;
	align-items: center;
	gap: 8px;
	white-space: nowrap;
	color: #555;
}
.news-header .header-utility-left i { color: #0494b1; }
.news-header .h-util-sep { width: 1px; height: 14px; background: #d5d8dc; }
/* JOB PORTAL is pinned to the exact horizontal center of the FULL utility bar,
 * independent of the widths of the left (date/time) and right (social/radio) zones. */
.news-header .header-utility-center {
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	z-index: 2;
}
/* JOB PORTAL — clean text link matching the date/time typography (no pill,
 * no background, no border), with inward-pointing animated hands. */
.news-header .h-util-jobs {
	display: inline-flex;
	align-items: center;
	gap: 9px;
	color: #555;                 /* same dark tone as the date/time text */
	font-size: 13px;             /* same base size as the utility bar */
	font-weight: 600;
	letter-spacing: .3px;
	line-height: 1;
	text-decoration: none;
	white-space: nowrap;
	vertical-align: middle;
}
.news-header .h-util-jobs:hover,
.news-header .h-util-jobs:focus-visible {
	color: #c8102e;
	text-decoration: underline;
	text-underline-offset: 3px;
}
.news-header .h-util-jobs:focus-visible { outline: 2px solid #0494b1; outline-offset: 2px; border-radius: 4px; }
.news-header .h-util-jobs.is-active { color: #c8102e; text-decoration: underline; text-underline-offset: 3px; }
/* hands — point inward toward the label, gentle continuous motion (text stays still) */
.news-header .ja-hand {
	display: inline-block;
	font-size: 14px;
	line-height: 1;
	flex: 0 0 auto;
}
.news-header .ja-hand-left { animation: jaHandLeft 1.1s ease-in-out infinite; }
.news-header .ja-hand-right { animation: jaHandRight 1.1s ease-in-out infinite; }
@keyframes jaHandLeft {
	0%, 100% { transform: translateX(0); }
	50% { transform: translateX(5px); }
}
@keyframes jaHandRight {
	0%, 100% { transform: translateX(0); }
	50% { transform: translateX(-5px); }
}
@media (prefers-reduced-motion: reduce) {
	.news-header .ja-hand,
	.sdw-util .ja-hand { animation: none !important; }
}
.news-header .header-social-list {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	align-items: center;
	gap: 2px;
}
.news-header .header-social-list li a {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 26px;
	height: 26px;
	border-radius: 50%;
	color: #fff;
	font-size: 13px;
	background: #aab0b8;
	transition: background-color .15s ease;
}
.news-header .header-social-list li a.facebook { background: #3b5998; }
.news-header .header-social-list li a.twitter { background: #000; }
.news-header .header-social-list li a.pinterest { background: #bd081c; }
.news-header .header-social-list li a.instgram, .news-header .header-social-list li a.instagram { background: #c13584; }
.news-header .header-social-list li a.linkedin { background: #0077b5; }
.news-header .header-social-list li a.vk { background: #4a76a8; }
.news-header .header-social-list li a.rss { background: #f26522; }
.news-header .header-social-list li a:hover { opacity: .85; }
.news-header .header-utility-right {
	display: flex;
	align-items: center;
	gap: 14px;
	white-space: nowrap;
}
.news-header .h-util-link {
	color: #555;
	text-decoration: none;
	font-weight: 500;
}
.news-header .h-util-link:hover, .news-header .h-util-link:focus-visible { color: #c8102e; outline: none; }
.news-header .h-util-login { color: #c8102e; }

/* ------------------------------------------------------------------ ROW 2: BRAND / SEARCH */
.news-header .header-brandbar {
	background: #ffffff;
	border-bottom: 1px solid #ececec;
	padding: 14px 0;                 /* compact ~80px total */
}
.news-header .header-brandbar-row {
	display: flex;
	align-items: center;
	gap: 24px;
}
.news-header .hb-logo { flex: 0 0 auto; }
.news-header .header-logo {
	display: block;
	max-height: 56px;
	max-width: 240px;
	width: auto;
	object-fit: contain;             /* never stretch the logo */
}
.news-header .hb-search { flex: 1 1 auto; }
.news-header .header-search-form {
	display: flex;
	align-items: center;
	max-width: 640px;
	margin: 0 auto;
	border: 2px solid #e2e5e9;
	border-radius: 40px;
	background: #f7f8fa;
	overflow: hidden;
	transition: border-color .15s ease;
}
.news-header .header-search-form:focus-within { border-color: #0494b1; }
.news-header .header-search-submit {
	border: 0;
	background: transparent;
	color: #666;
	font-size: 16px;
	padding: 10px 6px 10px 16px;
	cursor: pointer;
}
.news-header .header-search-input {
	flex: 1;
	border: 0;
	background: transparent;
	padding: 10px 16px 10px 4px;
	font-size: 15px;
	outline: none;
	color: #222;
	min-width: 0;
}
.news-header .hb-actions {
	display: flex;
	align-items: center;
	gap: 10px;
	flex: 0 0 auto;
}
.news-header .hb-action-btn,
.news-header .hb-lang-btn {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	height: 40px;
	padding: 0 14px;
	border-radius: 20px;
	border: 1px solid #e0e3e7;
	background: #fff;
	color: #333;
	font-size: 13px;
	cursor: pointer;
	text-decoration: none;
	transition: border-color .15s ease, color .15s ease;
}
.news-header .hb-action-btn:hover, .news-header .hb-lang-btn:hover,
.news-header .hb-action-btn:focus-visible, .news-header .hb-lang-btn:focus-visible { border-color: #0494b1; color: #0494b1; outline: none; }

/* compact header weather (populated by existing weather.js — one request) */
.news-header .hb-weather {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	height: 40px;
	padding: 0 12px;
	border-radius: 20px;
	border: 1px solid #e0e3e7;
	background: #fff;
	color: #333;
	font-size: 13px;
	text-decoration: none;
}
.news-header .hb-weather:hover, .news-header .hb-weather:focus-visible { border-color: #0494b1; color: #0494b1; outline: none; }
.news-header .hb-weather .hw-ico { font-size: 18px; }
.news-header .hb-weather .hw-txt { display: flex; flex-direction: column; line-height: 1.15; }
.news-header .hb-weather .hw-temp { font-weight: 700; }
.news-header .hb-weather .hw-name { font-size: 11px; color: #777; }

.news-header .hb-lang .dropdown-menu { min-width: 150px; }
/* mobile-only login (desktop already has it in the utility bar) */
.news-header .hb-mobile-login { display: none; }

/* ------------------------------------------------------------------ ROW 3: CATEGORY NAV */
/* Rendered as a direct body child (after #header) so sticky pins for the whole page */
.header-navbar {
	background: #07152f;             /* dark navy */
	position: sticky;
	top: 0;
	z-index: 990;
	box-shadow: 0 2px 6px rgba(0, 0, 0, .18);
}
.header-navbar .nav-desktop { display: block; }
.header-navbar .collapse.navbar-collapse { padding: 0; display: flex !important; align-items: stretch; width: 100%; min-width: 0; }
.header-navbar .navbar-nav { margin: 0; list-style: none; display: flex; flex-wrap: nowrap; align-items: stretch; }
.header-navbar .navbar-nav > li { position: relative; }
.header-navbar .navbar-nav > li > a {
	display: inline-flex;
	align-items: center;
	height: 46px;                    /* compact ~46px */
	padding: 0 16px;
	color: #fff;
	font-size: 14px;
	font-weight: 500;
	text-decoration: none;
	white-space: nowrap;
	transition: background-color .15s ease, color .15s ease;
}
.header-navbar .navbar-nav > li > a:hover,
.header-navbar .navbar-nav > li > a:focus-visible { background: rgba(255, 255, 255, .08); color: #ffd34d; outline: none; }
/* Home / active item: gold highlight */
.header-navbar .navbar-nav > li.active > a {
	background: #f5b301;
	color: #07152f;
	border-radius: 4px;
	margin: 7px 4px;
	height: 32px;
	font-weight: 700;
}
.header-navbar .navbar-nav > li.active > a:hover { background: #ffc107; color: #07152f; }
.header-navbar .navbar-nav .caret { border-top-color: currentColor; margin-left: 5px; }
/* dropdowns */
.header-navbar .dropdown-menu {
	background: #fff;
	border-radius: 0 0 6px 6px;
	box-shadow: 0 8px 20px rgba(0, 0, 0, .18);
	margin-top: 0;
	border: 1px solid #e6e8eb;
}
.header-navbar .dropdown-menu > li > a { padding: 9px 16px; font-size: 13px; color: #333; }
.header-navbar .dropdown-menu > li > a:hover { background: #f5b301; color: #07152f; }
/* overflow handling: the left (category) nav is its own scroll container (hidden scrollbar).
   This guarantees the right account/actions area NEVER overlaps or shrinks. */
.header-navbar .navbar-left .navbar-nav {
	width: auto;
	flex: 1 1 auto;
	min-width: 0;
	overflow-x: auto;
	overflow-y: hidden;
	scrollbar-width: none;           /* Firefox */
	-ms-overflow-style: none;        /* IE/Edge */
}
.header-navbar .navbar-left .navbar-nav::-webkit-scrollbar { display: none; }
/* right-hand auth/search area: in-flow, fixed, white-space protected */
.header-navbar .navbar-nav.nav-right {
	flex: 0 0 auto;
	white-space: nowrap;
	margin-left: 0;
	position: static !important;     /* override theme's absolute positioning */
	right: auto !important;
}
.header-navbar .navbar-nav.nav-right > li > a { padding: 0 14px; }
/* More (…) overflow control sits right before the right actions */
.header-navbar .navbar-nav > li > a.dropdown-more { height: 46px; padding: 0 12px; font-size: 16px; }
/* overflow category items moved into More by the JS manager */
.header-navbar .js-nav-hidden { display: none !important; }
/* Yellow Pages nav icon — subtle, on-brand differentiation */
.header-navbar .navbar-nav > li > a .yp-nav-icon { color: #ffd34d; font-size: 13px; }

/* ------------------------------------------------------------------ ROW 4: BREAKING NEWS */
.header-breaking {
	background: #ffffff;
	border-bottom: 1px solid #e6e8eb;
}
.header-breaking-inner {
	display: flex;
	align-items: stretch;
	min-height: 40px;                /* compact ~40px */
}
.breaking-label {
	flex: 0 0 auto;
	display: flex;
	align-items: center;
	background: #c8102e;             /* red CTA */
	color: #fff;
	font-weight: 700;
	font-size: 13px;
	padding: 0 16px;
	letter-spacing: .4px;
	white-space: nowrap;
}
.breaking-track {
	flex: 1 1 auto;
	overflow: hidden;
	position: relative;
	display: flex;
	align-items: center;
}
.breaking-track-inner {
	display: flex;
	align-items: center;
	white-space: nowrap;
	will-change: transform;
}
.breaking-item {
	display: inline-flex;
	align-items: center;
	color: #333;
	font-size: 14px;
	padding: 0 22px;
	text-decoration: none;
	white-space: nowrap;
}
.breaking-item::before { content: "●"; color: #c8102e; font-size: 8px; margin-right: 8px; }
.breaking-item:hover, .breaking-item:focus-visible { color: #0494b1; outline: none; }

/* seamless ticker (content is duplicated once; -50% == one full set) */
@keyframes news-header-ticker {
	from { transform: translateX(0); }
	to { transform: translateX(-50%); }
}
@media (prefers-reduced-motion: reduce) {
	.breaking-track-inner { animation: none !important; }
}

/* ------------------------------------------------------------------ MOBILE */
/* theme's #header chrome is replaced by the new rows */
#header.news-header { border-bottom: 0; box-shadow: none; }
.news-header .mobile-nav-container { display: none; }
@media (max-width: 991px) {
	.news-header .header-utility { display: none; }
	.news-header .hb-logo { display: none; }
	.news-header .hb-search { display: none; }
	.header-navbar { display: none; }
	.news-header .header-brandbar { padding: 8px 0; }
	.news-header .header-brandbar-row { gap: 8px; justify-content: center; }
	.news-header .hb-actions { flex-wrap: wrap; justify-content: center; }
	.news-header .hb-mobile-login { display: inline-flex; }
	.news-header .mobile-nav-container { display: block; }
	/* mobile weather name hidden to stay compact */
	.news-header .hb-weather .hw-name { display: none; }
	.news-header .hb-weather { height: 36px; padding: 0 10px; }
	.breaking-label { padding: 0 12px; font-size: 12px; }
	.breaking-item { font-size: 13px; padding: 0 16px; }
}