/*
Theme Name: Newsfy child
Theme URI: http://landing.rivaxstudio.com/newsfy/
Author: RivaxStudio
Author URI: https://themeforest.net/user/rivaxstudio/
Description: Modern and Powerful WordPress theme for news & magazine sites.
Version: 2.9.2
Requires PHP: 8.0
Tested up to: 6.8
Template:  newsfy
License: Themeforest.net
License URI: http://themeforest.net/licenses
Text Domain: newsfy
Tags: grid-layout, left-sidebar, right-sidebar, flexible-header, footer-widgets, featured-images, translation-ready
*/

.rivax-footer-site-links {
	list-style: none;
	margin: 0;
	padding: 0;
}
.rivax-footer-site-links li {
	margin-bottom: 8px;
}

/* Client request: article/page body text should be justified instead of the
   theme's default left alignment. Scoped to paragraphs/list items inside
   .single-content (article.php and page.php both wrap the_content() output
   in this class) rather than the class itself, so headings, buttons, embeds
   etc. inside the content aren't affected. */
.single-content p,
.single-content li {
	text-align: justify;
}

/* Client feedback: category archive header ("GRAPHICS" etc.) was rendering
   dark/unreadable text against the yellow accent -- force white regardless
   of light/dark scheme. */
.blog-archive-title .title,
.blog-archive-title .sub-title {
	color: #ffffff;
}

/* Бокові банери поза контейнером (client request 23.09.2026) — два
   Skyscraper 160x600 (zone 3) замість Site Skin (zone 9), розмітка —
   functions.php (wp_body_open). Кожен притиснутий до краю контенту
   (50% ± половина --site-width) з відступом --side-ad-gap.
   Фідбек 24.09.2026 ("не зверху і не на всю ширину"): спершу були
   `position: fixed` у натуральних 160px по центру вікна по вертикалі — на
   широких екранах лишали порожнє поле збоку й починались нижче хедера.
   Тепер починаються від верху сторінки (на рівні хедера) і заповнюють усе
   бокове поле по ширині, висота — пропорційно (Revive віддає звичайний
   <img width=160 height=600>, тож масштабується без спотворень).
   Sticky (фідбек 24.09.2026, друге коло): `position: fixed` з top = той
   самий відступ, що й від верху сторінки — при скролі 0 банер стоїть на
   рівні хедера, далі лишається на місці. Щоб при цьому низ не обрізався,
   ширина обмежена ще й висотою вікна: банер ніколи не вищий за
   100vh мінус відступи зверху/знизу (ширина = висота * 160 / 600).
   Ширина обмежена --side-ad-max-width (2x від натуральних 160px) — далі
   растрова картинка вже помітно розмита, а на 2560px-моніторах вийшла б
   ~590x2200; зайве місце лишається із зовнішнього боку.
   Місця на кожен бік треба щонайменше 160 + 2 * 20 = 200px, тобто
   1300 + 400 = 1700px viewport. На ноутбуках (1360-1699px) контент
   звужується саме настільки, щоб банери влізли в натуральному розмірі.
   Нижче 1360px контент вже був би надто вузьким (< 960px) — банери
   ховаються (і прибираються з DOM у functions.php). */
:root {
	--side-ad-width: 160px;
	--side-ad-max-width: 320px;
	--side-ad-gap: 20px;
	--side-ad-top: 20px;
}
.vortez-side-ad {
	display: none;
}
@media screen and (min-width: 1360px) {
	.vortez-side-ad {
		display: block;
		position: fixed;
		top: var(--side-ad-top);
		/* найменше з трьох: усе бокове поле мінус відступи / 2x натуральної
		   ширини / стільки, щоб уся висота влізла у вікно */
		width: min(
			var(--side-ad-max-width),
			calc((100% - var(--site-width)) / 2 - 2 * var(--side-ad-gap)),
			calc((100vh - var(--side-ad-top) - var(--side-ad-gap)) * 160 / 600)
		);
		z-index: 10;
	}
	/* адмін-бар WordPress (залогінені) — теж fixed, 32px зверху */
	body.admin-bar {
		--side-ad-top: 52px;
	}
	.vortez-side-ad-left {
		right: calc(50% + var(--site-width) / 2 + var(--side-ad-gap));
	}
	.vortez-side-ad-right {
		left: calc(50% + var(--site-width) / 2 + var(--side-ad-gap));
	}
	.vortez-side-ad ins,
	.vortez-side-ad ins > a {
		display: block;
		width: 100%;
	}
	/* лише сам креатив — не трекінг-піксель Revive (beacon <img> 0x0 поруч) */
	.vortez-side-ad ins > a > img {
		display: block;
		width: 100%;
		height: auto;
	}
}
/* `html:root` — вища специфічність за `:root { --site-width }`, який тема
   виводить inline з Redux (inc/custom-style.php) пізніше за цей файл.
   100vw включає скролбар (~17px), тому реальний відступ ≈ 191px — з
   запасом під 160px банер + відступ. */
@media screen and (min-width: 1360px) and (max-width: 1699px) {
	html:root {
		--site-width: calc(100vw - 2 * (var(--side-ad-width) + 2 * var(--side-ad-gap)));
	}
}

/* Client feedback: on Header 02 (Home 02), now that logo+leaderboard share
   a row pinned to the left (hdrrow1, see migration/fix_header_row*.php),
   the logo widget's own "center" text-align setting was still centering the
   logo image inside its own box, undercutting the flex-start alignment. */
.elementor-738 .elementor-element.elementor-element-b3fcc97 {
	text-align: left;
}

/* Client feedback 20.08.2026: the 1.5x zoom below (an earlier client
   request) made this banner a different size than the "correct" one below
   the carousel (hometopadw) -- client compared them side by side and
   confirmed the unscaled one is the reference size. Reverted to no zoom so
   ad1w001 renders at its native size, same as hometopadw and same as
   `.header .banner { width:728px; height:90px }` on the live vortez.net
   reference site (verified 20.08.2026). Rule kept (commented) rather than
   deleted in case a future creative genuinely needs rescaling again. */
.elementor-738 .elementor-element.elementor-element-ad1w001 {
	/* zoom: 1.5; -- removed, see comment above */
}

/* Client feedback 20.08.2026 (follow-up): after wrapping logo+banner in
   their own flex row (hdrrow1) the banner rendered too SMALL -- the logo
   widget has `_flex_size: grow` (flex-grow), so it soaks up any free space
   in the row, and with no size of its own to resist, the banner (a bare
   <ins> with no intrinsic box) gets squeezed into whatever's left instead
   of showing at the reference site's fixed `.header .banner` box
   (728x90, see above). `flex-shrink: 0` makes it immune to the row's
   flex-grow/shrink math on desktop, matching the reference exactly
   regardless of what the logo does.
   Client feedback 21.08.2026, attempt 1 (aspect-ratio + flex-shrink:1 +
   width:min(728px,100%)): meant to let it shrink gracefully on narrow
   viewports, but the `100%` in that formula resolves against the flex
   container's own width, not "space left after the logo" -- so on
   anything narrower than the row's own content box it started shrinking
   even on ordinary desktop widths, going small again. Reverted.
   Fixed properly with an explicit breakpoint instead of relying on
   flexbox auto-shrink to guess right: `flex-shrink: 0` below keeps it
   pinned to the reference's exact 728x90 on desktop (screen wider than
   1499px, see the @media block below), and
   the separate @media block further down is the ONLY place it's allowed
   to scale down, using `aspect-ratio` there so it shrinks in proportion
   instead of distorting. */
.elementor-738 .elementor-element.elementor-element-ad1w001 {
	width: 728px;
	height: 90px;
	flex-shrink: 0;
	flex-grow: 0;
	overflow: hidden;
}
.elementor-738 .elementor-element.elementor-element-ad1w001 ins,
.elementor-738 .elementor-element.elementor-element-ad1w001 ins img,
.elementor-738 .elementor-element.elementor-element-ad1w001 ins iframe {
	display: block;
	width: 100%;
	height: 100%;
}

/* Below ~1500px viewport there's no longer room for a fixed 728px banner
   next to the logo (was the theme's 1024px tablet breakpoint; raised
   23.09.2026 because side ads now narrow the content column to
   100vw - 400px on 1360-1699px laptops, see .vortez-side-ad) -- switch it to
   scaling with the row instead of overflowing or getting clipped.
   `aspect-ratio` keeps the 728:90 shape while it shrinks, `min-width: 0`
   overrides the flex-item default (`min-width: auto`) that would
   otherwise stop it from shrinking below its own content size. */
@media screen and (max-width: 1499px) {
	.elementor-738 .elementor-element.elementor-element-ad1w001 {
		width: 100%;
		max-width: 728px;
		height: auto;
		aspect-ratio: 728 / 90;
		flex-shrink: 1;
		min-width: 0;
	}
}

/* Client feedback 18.08.2026 (annotated screenshot): the earlier fix below
   forced this banner to stretch to the full 1300px content column, which
   visibly distorted the creative (client: "dimensions for the banner have
   been stretched? please retain original dimensions"). Reverted to letting
   the ad render at whatever size Revive/the creative actually is, just
   centered in the column instead of stretched to fill it.
   Client also asked for support of "either 1 or 2 leaderboard banners next
   to one another if 2" -- flex row + centered + gap covers both: a single
   <ins> just sits centered at its native size, and a second <ins> added
   alongside it (a second zone/creative, not yet provided) would lay out
   side by side with a gap instead of stacking or stretching. */
.elementor-element-hometopadw {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	gap: 20px;
}