/*
 * Vytrolma (site_lt) — additions on top of the podcasta CSS (template.css + presets/preset1.css).
 * Only Joomla 6 / Helix Ultimate 2.2.1 / SP Page Builder 6 adjustments and owner-approved fixes live here.
 */

/* ---------------------------------------------------------------------------
 * Font Awesome 5 glyphs for the podcasta CSS pseudo-elements (menu chevrons, pager arrows…).
 * template.css uses font-family "Font Awesome 5 Free"; SPPB 6 maps that family to its FA6 files,
 * whose glyphs are wider. Point it back to the FA 5.15.2 files the old site used (same files).
 * ------------------------------------------------------------------------- */
@font-face {
	font-family: "Font Awesome 5 Free";
	font-style: normal;
	font-weight: 900;
	font-display: block;
	src: url(../fonts/fa-solid-900.woff2) format("woff2"), url(../fonts/fa-solid-900.woff) format("woff");
}
@font-face {
	font-family: "Font Awesome 5 Free";
	font-style: normal;
	font-weight: 400;
	font-display: block;
	src: url(../fonts/fa-regular-400.woff2) format("woff2"), url(../fonts/fa-regular-400.woff) format("woff");
}
@font-face {
	font-family: "Font Awesome 5 Brands";
	font-style: normal;
	font-weight: 400;
	font-display: block;
	src: url(../fonts/fa-brands-400.woff2) format("woff2"), url(../fonts/fa-brands-400.woff) format("woff");
}

/* ---------------------------------------------------------------------------
 * FIX (owner-approved): the top bar (row "sp-top-bar": top2 address, top3 phone/e-mail/social)
 * uses the same content width as the header on desktop. The left edge of the top-bar content
 * lines up with the logo, the right edge with the end of the header content (language flags).
 * The header (#sp-header) has side padding 45px, 25px at <=1450px (template.css); every inner
 * offset of the top bar (Bootstrap row/col gutters, SPPB row container) is neutralised so the
 * content box of the container is the content box of the header.
 * ------------------------------------------------------------------------- */
@media (min-width: 992px) {
	#sp-sp-top-bar > .container {
		max-width: none;
		padding-left: 45px;
		padding-right: 45px;
	}
	#sp-sp-top-bar > .container > .container-inner > .row {
		--bs-gutter-x: 0;
		margin-left: 0;
		margin-right: 0;
	}
	#sp-sp-top-bar > .container > .container-inner > .row > [class*="col-"] {
		padding-left: 0;
		padding-right: 0;
	}
	#sp-sp-top-bar .sppb-row-container {
		padding-left: 0;
		padding-right: 0;
		max-width: none;
	}
}
@media (min-width: 992px) and (max-width: 1450px) {
	#sp-sp-top-bar > .container {
		padding-left: 25px;
		padding-right: 25px;
	}
}

/* ---------------------------------------------------------------------------
 * PARITY (06-parity-log.md): SP Page Builder 3 -> 6 rendering differences that are pure CSS.
 * ------------------------------------------------------------------------- */
/* SPPB 6 core CSS makes addon titles inline-block; SPPB 3 left them block. Inline-block inside the
 * 25.6px body line box made e.g. the footer link headings (h6 14px inside <a>) 9px taller each. */
.sp-page-builder .sppb-addon-title {
	display: block;
}
/* SPPB 6 core CSS widens .sppb-container to 1320px at >=1400px; SPPB 3 stopped at 1140px
 * (home slideshow text box sat ~30px lower/90px more left, its % margins depend on this width). */
@media (min-width: 1400px) {
	.sp-page-builder .sppb-container {
		max-width: 1140px;
	}
}
/* Article pager: Joomla 3 had no icon font for .icon-chevron-* (empty spans, the arrows are the
 * podcasta li::after glyphs); Joomla 6 maps them to Font Awesome -> second, larger arrow. */
.pager.pagenav .icon-chevron-left,
.pager.pagenav .icon-chevron-right {
	display: none;
}
/* Smart Search (replaces com_search): Helix puts the component name on <body>, so the core finder.css
 * rule ".com-finder > * + *" (margin-top 1.5em) pushed the whole page wrapper down on /paieska. */
body.com-finder > * + * {
	margin-top: 0;
}
/* Pager arrows (podcasta li::after "‹" / "›" in "Font Awesome 5 Free"): the FA 5 font has no such
 * glyph, so the old site fell back to the default font (thin small arrow). SPPB 6 also maps
 * "Font Awesome 5 Free" to FA 6 files, which DO have U+2039/U+203A (big angle icon). Use a family
 * that resolves only to the FA 5 file -> same fallback as before. */
@font-face {
	font-family: "Vytrolma FA5 Solid";
	font-style: normal;
	font-weight: 900;
	font-display: block;
	src: url(../fonts/fa-solid-900.woff2) format("woff2"), url(../fonts/fa-solid-900.woff) format("woff");
}
.pager>li:after {
	font-family: "Vytrolma FA5 Solid";
}
/* form_builder "field gutter": SPPB 3 gave the form a NEGATIVE margin (-gutter, like a row), SPPB 6
 * a positive one -> fields 30px narrower and indented. Both contact forms use gutter 15px. */
.sp-page-builder .sppb-addon-form-builder .sppb-addon-form-builder-form {
	margin-left: -15px !important;
	margin-right: -15px !important;
}
/* Icons (fa-* classes of SP Page Builder addons, Joomla icons): SPPB 6 / Joomla 6 render them with
 * Font Awesome 6 ("Font Awesome 6 Free/Brands"); the old site used Font Awesome 5.15 designs
 * (e.g. the phone, envelope, social icons look different). Same codepoints -> serve the FA 5 files
 * first; glyphs that only exist in FA 6 still fall back to the FA 6 faces declared earlier. */
@font-face {
	font-family: "Font Awesome 6 Free";
	font-style: normal;
	font-weight: 900;
	font-display: block;
	src: url(../fonts/fa-solid-900.woff2) format("woff2"), url(../fonts/fa-solid-900.woff) format("woff");
}
@font-face {
	font-family: "Font Awesome 6 Free";
	font-style: normal;
	font-weight: 400;
	font-display: block;
	src: url(../fonts/fa-regular-400.woff2) format("woff2"), url(../fonts/fa-regular-400.woff) format("woff");
}
@font-face {
	font-family: "Font Awesome 6 Brands";
	font-style: normal;
	font-weight: 400;
	font-display: block;
	src: url(../fonts/fa-brands-400.woff2) format("woff2"), url(../fonts/fa-brands-400.woff) format("woff");
}
/* icons_group: SPPB 3 put the item spacing ("margin") on the links only; SPPB 6 adds the same margin
 * to the <li> as well -> icons twice as far apart and pushed down. */
.sp-page-builder .sppb-addon-icons-group .sppb-icons-group-list li {
	margin: 0 !important;
}
/* Error page: the old (prefix-stripped) podcasta CSS had display:-webkit-box without -webkit-box-align,
 * so the content box stretched and the 404 text sat at the top; the restored prefix centred it. */
html.error-page body {
	-webkit-box-align: stretch;
}
/* SPPB 3 removed the top margin of EVERY first section incl. nested rows (div.sppb-section) on page
 * views; SPPB 6 limits it to :not(div.sppb-section) -> nested rows with a margin moved 20px down. */
#sp-page-builder .page-content .sppb-section:first-child {
	margin-top: 0;
}
/* SPPB 3 core rules that SPPB 6 dropped (classes still in the migrated markup). */
.sppb-addon-animated-number .sppb-addon-content .sppb-animated-number-title {
	margin-top: 10px;
}
@media (min-width: 1380px) {
	.sppb-row-container {
		max-width: 1320px;
	}
}
@media (max-width: 767px) {
	.sppb-section-content-center .sppb-row-container {
		width: 100%;
	}
}
.slider-content-vercally-center .sppb-row div[class*=sppb-col],
.slider-content-vercally-center .sppb-row div[class^=sppb-col] {
	display: flex;
	align-items: center;
}
/* SPPB 6 adds tabular digits to animated numbers (wider "16 mln."); SPPB 3 used proportional digits. */
.sppb-addon-animated-number .sppb-animated-number {
	font-variant-numeric: normal;
}

/* Owner-approved fix: at 992–1199px and 1653–1700px (EN) the menu wrapped to a second line and search/flags dropped
   below the header (the old site had the same defect). Logo / menu / right column become flex items so the menu takes
   the free space and the search box and menu paddings are narrowed; at 1653–1759px the menu font steps down to 15px. */
@media (min-width: 992px) and (max-width: 1399.98px) {
	#sp-header .row {
		flex-wrap: nowrap;
	}
	#sp-header #sp-menu {
		flex: 1 1 auto;
		width: auto;
		min-width: 0;
	}
	#sp-header #sp-menu-right {
		flex: 0 0 auto;
		width: auto;
	}
}
@media (min-width: 992px) and (max-width: 1399.98px) {
	#sp-header #sp-menu {
		padding-left: 8px;
		padding-right: 8px;
	}
	#sp-header #sp-menu-right .search,
	#sp-header #sp-menu-right .js-finder-search-query {
		width: 150px;
	}
	body #sp-header .sp-megamenu-parent > li > a,
	body #sp-header .sp-megamenu-parent > li > span {
		padding: 0 5px;
	}
}
@media (min-width: 992px) and (max-width: 1199.98px) {
	#sp-header #sp-logo {
		flex: 0 0 175px;
		width: 175px;
		max-width: 175px;
	}
	#sp-header #sp-logo img {
		max-width: 100%;
		height: auto;
	}
	#sp-header #sp-menu-right .search,
	#sp-header #sp-menu-right .js-finder-search-query {
		width: 105px;
	}
	body #sp-header .sp-megamenu-parent > li > a,
	body #sp-header .sp-megamenu-parent > li > span {
		padding: 0 4px;
		font-size: 12.5px;
	}
}
@media (min-width: 992px) and (max-width: 1079.98px) {
	body #sp-header .sp-megamenu-parent > li > a,
	body #sp-header .sp-megamenu-parent > li > span {
		padding: 0 3px;
		font-size: 12px;
	}
}
@media (min-width: 1653px) and (max-width: 1759.98px) {
	body #sp-header .sp-megamenu-parent > li > a,
	body #sp-header .sp-megamenu-parent > li > span {
		font-size: 15px;
	}
}
/* 404 page: the decorative "Oooooopss" (309px) made the page 1679px wide at 1440 and 1147px at 375 (old site too).
 * Keep it inside the viewport and scale it down on small screens. */
html.error-page {
	overflow-x: hidden;
}
html.error-page body:before {
	left: 0;
	right: 0;
	overflow: hidden;
	white-space: nowrap;
	font-size: min(309px, 20vw);
}