/* Additional block to paste after the existing </style> of sloveco-fullwidth Custom Code.
   Do not change [data-fv-calc] or .fvc-* calculator styles. */

/* 1) Stack raw HTML grids on phones.
   The existing full-width CSS already does this inside .entry-content, but most
   product/landing pages put these grids in Elementor HTML widgets, so they never
   stacked and text was squeezed to ~110px beside images/tables. */
@media (max-width: 600px) {
	.elementor div[style*="grid-template-columns"],
	.entry-content div[style*="grid-template-columns"],
	article div[style*="grid-template-columns"],
	.wp-block-post-content div[style*="grid-template-columns"] {
		grid-template-columns: 1fr !important;
		gap: 24px !important;
	}
	.elementor div[style*="grid-template-columns"] > *,
	.entry-content div[style*="grid-template-columns"] > *,
	article div[style*="grid-template-columns"] > *,
	.wp-block-post-content div[style*="grid-template-columns"] > * {
		min-width: 0 !important;
		max-width: 100% !important;
		width: 100% !important;
		box-sizing: border-box !important;
	}
}

/* 2) Contact Form 7: meno + priezvisko stay in one unwrapped flex row (inline
   flex-direction:row) and overflow the viewport on phones. */
@media (max-width: 600px) {
	.wpcf7-form div[style*="flex-direction: row"],
	.wpcf7-form div[style*="flex-direction:row"] {
		flex-direction: column !important;
		align-items: stretch !important;
		justify-content: flex-start !important;
	}
	.cf7-input-meno,
	.cf7-input-priezvisko {
		width: 100% !important;
		max-width: 100% !important;
	}
}
.wpcf7-form input,
.wpcf7-form textarea,
.elementor-form input,
.elementor-form textarea,
.elementor-form select {
	max-width: 100% !important;
	box-sizing: border-box !important;
}

/* 3) Default theme header on pages that are not Elementor full-width
   (Fotovoltaika, older product pages). Logo + site title stack, and the
   2-bar menu icon is a tiny faint "=" in the center. Keep the WP overlay
   menu (it works); just make the bar usable. */
@media (max-width: 600px) {
	header.wp-block-template-part .wp-block-group.is-vertical {
		flex-direction: row !important;
		flex-wrap: nowrap !important;
		justify-content: space-between !important;
		align-items: center !important;
		width: 100% !important;
		padding: 8px 16px !important;
		gap: 8px !important;
	}
	header.wp-block-template-part .wp-block-site-title {
		display: none !important;
	}
	header.wp-block-template-part .wp-block-site-logo,
	header.wp-block-template-part .wp-block-site-logo a {
		margin: 0 !important;
	}
	header.wp-block-template-part .custom-logo {
		max-height: 52px !important;
		width: auto !important;
		max-width: 180px !important;
	}
	header.wp-block-template-part .wp-block-navigation {
		margin-left: auto !important;
	}
	header.wp-block-template-part .wp-block-navigation__responsive-container-open {
		display: flex !important;
		align-items: center !important;
		justify-content: center !important;
		width: 44px !important;
		height: 44px !important;
		padding: 8px !important;
		background: #6b7db3 !important;
		color: #fff !important;
		border: 0 !important;
		border-radius: 6px !important;
		box-sizing: border-box !important;
	}
	header.wp-block-template-part .wp-block-navigation__responsive-container-open svg {
		width: 24px !important;
		height: 24px !important;
		fill: currentColor !important;
	}
}

/* 4) Classic "alignright" e-shop badges sit inline in paragraphs/lists on
   theme-template product pages (float styles are missing), so the cart icon
   splits the sentence. Restore float:right so text wraps around the badge
   instead of breaking in the middle of the line. */
img.alignright,
img[src*="Eshop_button"] {
	float: right;
	margin: 0 0 12px 16px;
	height: auto;
}
img.alignleft {
	float: left;
	margin: 0 16px 12px 0;
	height: auto;
}
img[src*="Eshop_button"] {
	max-width: 110px;
}
@media (max-width: 600px) {
	article img.alignright,
	.entry-content img.alignright,
	img[src*="Eshop_button"] {
		float: right !important;
		max-width: 88px !important;
		margin: 4px 0 12px 12px !important;
		height: auto !important;
	}
	article img.alignleft,
	.entry-content img.alignleft {
		float: left !important;
		max-width: 88px !important;
		margin: 4px 12px 12px 0 !important;
		height: auto !important;
	}
}

/* 5) YouTube iframes with a fixed width="700" and videos in grids */
iframe[src*="youtube"],
iframe[src*="youtu.be"] {
	max-width: 100% !important;
	width: 100% !important;
	height: auto !important;
	aspect-ratio: 16 / 9;
}
video {
	max-width: 100% !important;
	height: auto !important;
}

/* 6) Spec tables inside those HTML grids */
@media (max-width: 600px) {
	.elementor table,
	.entry-content table,
	article table {
		width: 100% !important;
		max-width: 100% !important;
		display: block;
		overflow-x: auto;
		box-sizing: border-box;
	}
}

/* 7) Header social/icon list uses margin: 0 -15px and peeks 5px off the left */
.elementor-location-header .elementor-icon-list-items.elementor-inline-items {
	margin-left: 0 !important;
	margin-right: 0 !important;
}

/* ============================================================================
   v2 — Gutenberg / Spectra pages switched to the Elementor Full Width template.

   After the template change, block content is a direct sibling of <header>
   (no .entry-content), so the sloveco-fullwidth rules scoped to
   body.page:not(.elementor-template-full-width) .entry-content no longer apply.
   Text sits flush to the edges; inline grids stay 2/3-column on a 390px
   viewport and the right-hand columns are painted off-screen, then hidden
   by html,body { overflow-x: clip }. Inline margin-right:10% plus
   minmax(280px, 1fr) grids and unsized images/tables can also overflow.

   Scope: Elementor Full Width pages that do NOT have an Elementor document
   canvas as a direct body child. This leaves the header/footer alone and
   does not match real Elementor-built pages (homepage 9675, kontakt 14,
   o-nas 7, referencie 12, izolacie-strechy 9720, atď.).
   /clanky/ (page-id-7607) is excluded because it will revert to the old
   template. [data-fv-calc] / .fvc-* calculator styles are not changed.
   ============================================================================ */

/* Marker also includes the known page-id list so a later wrapper around
   Gutenberg content cannot silently drop the rules. */
body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607),
body.elementor-template-full-width:is(
	.page-id-7314, .page-id-913, .page-id-299, .page-id-31, .page-id-2659,
	.page-id-158, .page-id-5966, .page-id-6110, .page-id-6094, .page-id-6078,
	.page-id-6086, .page-id-6036, .page-id-6089, .page-id-6106, .page-id-6656,
	.page-id-6004, .page-id-6360, .page-id-6568, .page-id-6228, .page-id-6008,
	.page-id-6108, .page-id-6619, .page-id-6668, .page-id-6471, .page-id-6029,
	.page-id-6022, .page-id-6587, .page-id-6632, .page-id-6234, .page-id-6112,
	.page-id-5999, .page-id-6053, .page-id-6041, .page-id-6581, .page-id-6636,
	.page-id-6014, .page-id-5980, .page-id-6059, .page-id-5987, .page-id-6104,
	.page-id-6387, .page-id-5969, .page-id-6047, .page-id-5958, .page-id-6117,
	.page-id-6239, .page-id-6063, .page-id-6067, .page-id-6099, .page-id-6074,
	.page-id-5993, .page-id-2724, .page-id-205, .page-id-247, .page-id-278,
	.page-id-1237, .page-id-1254, .page-id-1269, .page-id-1257, .page-id-1250,
	.page-id-1263, .page-id-1260, .page-id-1245, .page-id-1516, .page-id-1266,
	.page-id-1240, .page-id-1308, .page-id-10273, .page-id-1212, .page-id-644,
	.page-id-357, .page-id-6424, .page-id-6411, .page-id-5976, .page-id-3039,
	.page-id-3041, .page-id-7175
):not(:has(> div.elementor)):not(.page-id-7607) {
	--sloveco-gutenberg-pad: 40px;
}

@media (max-width: 781px) {
	body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607),
	body.elementor-template-full-width:is(
		.page-id-7314, .page-id-913, .page-id-299, .page-id-31, .page-id-2659,
		.page-id-158, .page-id-5966, .page-id-6110, .page-id-6094, .page-id-6078,
		.page-id-6086, .page-id-6036, .page-id-6089, .page-id-6106, .page-id-6656,
		.page-id-6004, .page-id-6360, .page-id-6568, .page-id-6228, .page-id-6008,
		.page-id-6108, .page-id-6619, .page-id-6668, .page-id-6471, .page-id-6029,
		.page-id-6022, .page-id-6587, .page-id-6632, .page-id-6234, .page-id-6112,
		.page-id-5999, .page-id-6053, .page-id-6041, .page-id-6581, .page-id-6636,
		.page-id-6014, .page-id-5980, .page-id-6059, .page-id-5987, .page-id-6104,
		.page-id-6387, .page-id-5969, .page-id-6047, .page-id-5958, .page-id-6117,
		.page-id-6239, .page-id-6063, .page-id-6067, .page-id-6099, .page-id-6074,
		.page-id-5993, .page-id-2724, .page-id-205, .page-id-247, .page-id-278,
		.page-id-1237, .page-id-1254, .page-id-1269, .page-id-1257, .page-id-1250,
		.page-id-1263, .page-id-1260, .page-id-1245, .page-id-1516, .page-id-1266,
		.page-id-1240, .page-id-1308, .page-id-10273, .page-id-1212, .page-id-644,
		.page-id-357, .page-id-6424, .page-id-6411, .page-id-5976, .page-id-3039,
		.page-id-3041, .page-id-7175
	):not(:has(> div.elementor)):not(.page-id-7607) {
		--sloveco-gutenberg-pad: 20px;
	}
}

/* Side padding on the Gutenberg root (direct body children). Header, footer,
   cookie banner, chat and the PV calculator host are left untouched. */
body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) > :not(header, footer, script, style, noscript, link, svg, .fb-customerchat, [id^="cmplz"], [id*="cmplz"], .elementor-screen-only, .elementor-location-header, .elementor-location-footer, [data-fv-calc]),
body.elementor-template-full-width:is(.page-id-7314, .page-id-913, .page-id-299, .page-id-31, .page-id-2659, .page-id-158, .page-id-5966, .page-id-6110, .page-id-6094, .page-id-6078, .page-id-6086, .page-id-6036, .page-id-6089, .page-id-6106, .page-id-6656, .page-id-6004, .page-id-6360, .page-id-6568, .page-id-6228, .page-id-6008, .page-id-6108, .page-id-6619, .page-id-6668, .page-id-6471, .page-id-6029, .page-id-6022, .page-id-6587, .page-id-6632, .page-id-6234, .page-id-6112, .page-id-5999, .page-id-6053, .page-id-6041, .page-id-6581, .page-id-6636, .page-id-6014, .page-id-5980, .page-id-6059, .page-id-5987, .page-id-6104, .page-id-6387, .page-id-5969, .page-id-6047, .page-id-5958, .page-id-6117, .page-id-6239, .page-id-6063, .page-id-6067, .page-id-6099, .page-id-6074, .page-id-5993, .page-id-2724, .page-id-205, .page-id-247, .page-id-278, .page-id-1237, .page-id-1254, .page-id-1269, .page-id-1257, .page-id-1250, .page-id-1263, .page-id-1260, .page-id-1245, .page-id-1516, .page-id-1266, .page-id-1240, .page-id-1308, .page-id-10273, .page-id-1212, .page-id-644, .page-id-357, .page-id-6424, .page-id-6411, .page-id-5976, .page-id-3039, .page-id-3041, .page-id-7175):not(:has(> div.elementor)):not(.page-id-7607) > :not(header, footer, script, style, noscript, link, svg, .fb-customerchat, [id^="cmplz"], [id*="cmplz"], .elementor-screen-only, .elementor-location-header, .elementor-location-footer, [data-fv-calc]) {
	padding-left: var(--sloveco-gutenberg-pad, 40px) !important;
	padding-right: var(--sloveco-gutenberg-pad, 40px) !important;
	box-sizing: border-box !important;
	max-width: 100% !important;
	width: 100% !important;
	margin-left: 0 !important;
	min-width: 0 !important;
}

/* The inline margin-right:10% wrapper is 110% wide when it also has width:100%
   (or sits in a flex/grid item). Always drop it and keep content aligned. */
body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) div[style*="margin-right: 10%"],
body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) div[style*="margin-right:10%"] {
	margin-right: 0 !important;
	max-width: 100% !important;
	box-sizing: border-box !important;
}

/* Inner "max-width:1320px" boxes already carry their own 25–30px padding.
   Zero the horizontal padding when they sit inside a root we just padded,
   so we do not double-indent. Keep it when the box itself is the root. */
body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) :not(body) > div[style*="max-width: 1320px"],
body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) :not(body) > div[style*="max-width:1320px"] {
	max-width: 100% !important;
	width: 100% !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
	box-sizing: border-box !important;
}
body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) > div[style*="max-width: 1320px"],
body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) > div[style*="max-width:1320px"] {
	max-width: 100% !important;
	width: 100% !important;
	box-sizing: border-box !important;
}

/* alignfull roots used 100vw / negative margins in some WP layouts — keep
   them inside the viewport now that they are body children. */
body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) > .alignfull,
body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) > .uagb-is-root-container,
body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) .uagb-is-root-container.alignfull {
	margin-left: 0 !important;
	margin-right: 0 !important;
	max-width: 100% !important;
}

/* Readable text: justified copy + a floated badge on a narrow column leaves
   huge word gaps. Breadcrumbs and long words must wrap, not clip. */
body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) > :not(header, footer) {
	overflow-wrap: break-word;
}
@media (max-width: 781px) {
	body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) div[style*="text-align: justify"],
	body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) div[style*="text-align:justify"] {
		text-align: left !important;
	}
	body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) h1[style] {
		font-size: 30px !important;
		line-height: 1.25 !important;
	}
}

body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) .aioseo-breadcrumbs,
body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) .wp-block-aioseo-breadcrumbs {
	overflow-wrap: anywhere;
	word-break: break-word;
	max-width: 100%;
}

/* Media, figures, embeds */
body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) > :not(header, footer) img,
body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) > :not(header, footer) video,
body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) > :not(header, footer) iframe,
body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) > :not(header, footer) figure,
body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) > :not(header, footer) .wp-block-embed,
body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) > :not(header, footer) .wp-block-embed__wrapper {
	max-width: 100% !important;
	box-sizing: border-box !important;
}
body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) > :not(header, footer) img,
body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) > :not(header, footer) video {
	height: auto !important;
}

/* E-shop badges and classic alignright/alignleft photos */
body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) img.alignright,
body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) img[src*="Eshop_button"] {
	float: right !important;
	margin: 0 0 12px 16px !important;
	height: auto !important;
	max-width: 110px;
}
body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) img.alignleft {
	float: left !important;
	margin: 0 16px 12px 0 !important;
	height: auto !important;
}
@media (max-width: 781px) {
	body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) img.alignright,
	body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) img[src*="Eshop_button"] {
		max-width: 88px !important;
		margin: 4px 0 12px 12px !important;
	}
	body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) img.alignleft {
		max-width: 88px !important;
		margin: 4px 12px 12px 0 !important;
	}
}

/* Gutenberg columns, inline CSS grids, Spectra/uagb rows — stack on tablet/phone.
   Do not target [data-fv-calc] / .fvc-*. */
@media (max-width: 781px) {
	body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) .wp-block-columns {
		flex-wrap: wrap !important;
		flex-direction: column !important;
	}
	body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) .wp-block-column {
		flex-basis: 100% !important;
		width: 100% !important;
		max-width: 100% !important;
		min-width: 0 !important;
	}
	body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) .wp-block-columns div[style*="grid-template-columns"],
	body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) .uagb-container-inner-blocks-wrap div[style*="grid-template-columns"],
	body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) > div[style*="grid-template-columns"] {
		grid-template-columns: 1fr !important;
		gap: 24px !important;
	}
	body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) .uagb-container-inner-blocks-wrap {
		flex-direction: column !important;
		flex-wrap: wrap !important;
		min-width: 0 !important;
		max-width: 100% !important;
	}
	body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) .wp-block-uagb-container {
		min-width: 0 !important;
		max-width: 100% !important;
	}
	body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) .wpcf7-form div[style*="flex-direction: row"],
	body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) .wpcf7-form div[style*="flex-direction:row"] {
		flex-direction: column !important;
		align-items: stretch !important;
		justify-content: flex-start !important;
	}
	body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) .cf7-input-meno,
	body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) .cf7-input-priezvisko {
		width: 100% !important;
		max-width: 100% !important;
	}
	body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) table {
		max-width: 100% !important;
		box-sizing: border-box;
	}
	body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) .page,
	body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) .layoutArea,
	body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) .column {
		max-width: 100%;
		overflow-x: auto;
	}
	body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) > ul,
	body.elementor-template-full-width:not(:has(> div.elementor)):not(.page-id-7607) > ol {
		padding-left: calc(var(--sloveco-gutenberg-pad, 40px) + 1.25em) !important;
	}
}