/************************************************

Stylesheet: RWD
Ładowany w footer.php po jagmar.css (i eco.css) – nadpisuje ich reguły.

*************************************************/

/* h1 na stronie produktu (offer.php, offer-eco.php) – widoczne tylko do 768px */
.offer-title-mobile { display: none; }

/* X modala zakładek produktu (dodawany przez scripts.js) – widoczny tylko do 768px przy otwartym modalu */
.tabs-modal-close { display: none; }

/*********************
< 769px
*********************/
@media screen and (max-width: 768px) {

	/* body – jednolite białe tło bez obrazka bg.jpg */
	body { background: #fff; }

	/* header – mobilny wariant (#mobile_up) do 768px zamiast do 639px (breakpoint Foundation) */
	#top-bar-menu .hide-for-small-only { display: none !important; }
	#top-bar-menu #mobile_up.show-for-small-only { display: block !important; }

	/* header – kontener mobilny: 16px od góry i po bokach */
	#mobile_up { padding: 16px 16px 0; }

	/* header – logo na samej górze, wyśrodkowane, rozmiar bez zmian */
	#mobile_up .logo { text-align: center; padding-top: 0; padding-left: 0; padding-right: 0; }
	#mobile_up .logo img { margin-top: 0 !important; margin-bottom: 0 !important; } /* nadpisuje inline style */
	#mobile_up .logo a { display: inline-block; }

	/* header – Call us (lewo) / Write to us (prawo), białe tło jak logo */
	#mobile_up .numeros {
		display: flex;
		justify-content: space-between;
		align-items: center;
		background: #fff;
		line-height: normal;
		padding: 0 0 10px;
	}
	#mobile_up .numeros > div {
		width: auto;
		float: none !important;
		padding: 0;
		letter-spacing: normal;
	}
	#mobile_up .numeros > div a {
		display: inline-block;
		font-size: 16px;
		color: #000;
		border: 1px solid #f36f21;
		padding: 8px 20px;
	}

	/* header – pomarańczowy pasek: hamburger + flagi */
	#mobile_up .menu { padding: 12px 16px; }
	#mobile_up .menu a.rmenu {
		display: block;
		width: 24px;
		height: 20px;
		padding: 0;
		font-size: 0;
		line-height: 0;
		overflow: hidden;
		cursor: pointer;
		background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='20' viewBox='0 0 24 20'%3E%3Cpath fill='white' d='M24 17v2c0 .55-.45 1-1 1H1c-.55 0-1-.45-1-1v-2c0-.55.45-1 1-1h22c.55 0 1 .45 1 1zm0-8v2c0 .55-.45 1-1 1H1c-.55 0-1-.45-1-1V9c0-.55.45-1 1-1h22c.55 0 1 .45 1 1zm0-8v2c0 .55-.45 1-1 1H1c-.55 0-1-.45-1-1V1c0-.55.45-1 1-1h22c.55 0 1 .45 1 1z'/%3E%3C/svg%3E") no-repeat center / 24px 20px;
	}
	#mobile_up .menu a.rmenu::before { display: none; }

	#mobile_up .menu > li:last-child { flex: 1 1 auto; margin-left: 16px; }
	#mobile_up .wpml-ls-legacy-list-horizontal > ul {
		display: flex;
		max-width: 360px;
		justify-content: space-between;
		align-items: center;
		margin-left: auto !important;
	}

	/* content – boczny odstęp jak w headerze */
	#content { padding-left: 16px; padding-right: 16px; }

	/* slider – bez karuzeli, slajdy jeden pod drugim (nadpisuje inline style z Orbit JS i Motion UI) */
	#slider,
	.page-child #slider { padding: 0; max-height: none; overflow: visible; }
	#slider .orbit-container { height: auto !important; overflow: visible; }
	#slider .orbit-slide {
		display: block !important;
		position: relative !important;
		top: auto !important;
		max-height: none !important;
		opacity: 1 !important;
		visibility: visible !important;
		transform: none !important;
		transition: none !important;
	}
	#slider .orbit-slide img { margin-top: 0 !important; }
	#slider .orbit-slide:first-child img { margin-top: 8px !important; }
	#slider .slide_container2 { display: none; }

	/* slider – tekst pod obrazkiem, wyśrodkowany, w jednej linii */
	#slider .orbit-slide > .clearfix,
	#slider .orbit-slide > .clearfix > a { display: flex; flex-direction: column; }
	#slider .orbit-slide > .clearfix::before,
	#slider .orbit-slide > .clearfix::after { display: none; }
	#slider .orbit-slide img { float: none !important; display: block; }
	#slider .slide_container {
		order: 2;
		position: static;
		transform: none;
		padding: 8px 0 20px;
	}
	#slider .slide_container .row { margin: 0; max-width: none; }
	#slider .slider_desc { display: block !important; text-align: center; font-size: 16px; line-height: 1.4; }
	#slider .slider_desc .big,
	#slider .slider_desc .small,
	#slider .slider_desc .content,
	#slider .slider_desc .content p { display: inline; font-size: 16px; font-weight: normal; line-height: inherit; margin: 0; }

	/* wszystkie strony – bez sekcji #manufacturer (razem z kontenerem .max_container) */
	#manufacturer,
	.max_container:has(> #manufacturer) { display: none !important; }

	/* nagłówek podstron: .bgbg (z ikoną) oraz listy ofert (np. /products/ i jej podkategorie)
	   – bez obrazka w tle, tytuł na środku u góry, pod nim breadcrumbs */
	#content { min-height: 0; }
	#content.bgbg #image-top { display: none; }
	#content.bgbg > .row.p45,
	.page-template-oferta-lista #content > .row.p45,
	.page-template-oferta-lista-eco #content > .row.p45 { padding: 8px 0; }
	#content.bgbg #breadcrumbs,
	.page-template-oferta-lista #content #breadcrumbs,
	.page-template-oferta-lista-eco #content #breadcrumbs { position: static; bottom: auto; margin: 0; }
	#content.bgbg #breadcrumbs ul li,
	.page-template-oferta-lista #content #breadcrumbs ul li,
	.page-template-oferta-lista-eco #content #breadcrumbs ul li { font-size: 11px; }
	#breadcrumbs ul li:last-child { color: #231f20; }
	#content .offer-desc { text-align: center; margin-bottom: 8px; }
	#breadcrumbs ul li { margin-right: 16px; }
	#breadcrumbs ul li:not(.home) { padding-left: 16px; }
	#content.bgbg .offer-title p,
	.page-template-oferta-lista #content .offer-title p,
	.page-template-oferta-lista-eco #content .offer-title p { font-size: 16px; font-weight: 400; }
	#content.bgbg .center-h,
	.page-template-oferta-lista #content .center-h,
	.page-template-oferta-lista-eco #content .center-h { position: static; transform: none; padding: 0; }
	#content.bgbg .offer-title,
	.page-template-oferta-lista #content .offer-title,
	.page-template-oferta-lista-eco #content .offer-title {
		text-align: center;
		font-size: 28px;
		font-weight: 600;
		margin: 0;
	}

	/* strona produktu – h1 + breadcrumbs pod menu, nad sliderem (jak na /products/) */
	.page-template-offer #content,
	.page-template-offer-eco #content { display: flex; flex-direction: column; margin-bottom: 16px; }
	.page-template-offer #content > .row.p45,
	.page-template-offer-eco #content > .row.p45 {
		order: -1;
		margin-top: 0 !important; /* nadpisuje inline -6rem */
		padding: 8px 0;
		width: 100%;
	}
	.page-template-offer #content #breadcrumbs,
	.page-template-offer-eco #content #breadcrumbs { position: static; bottom: auto; margin: 0; }
	.page-template-offer #content #breadcrumbs ul li,
	.page-template-offer-eco #content #breadcrumbs ul li { font-size: 11px; }
	.page-template-offer #content #slider,
	.page-template-offer-eco #content #slider { display: none; }
	/* strona produktu – najpierw treść zakładek, potem lista zakładek */
	#page_content { padding-left: 16px; padding-right: 16px; }
	:is(.page-template-offer, .page-template-offer-eco) #page_content > .columns { display: flex; flex-direction: column; }
	:is(.page-template-offer, .page-template-offer-eco) #page_content .tabs-content { order: -1; border: 0; }
	:is(.page-template-offer, .page-template-offer-eco) #page_content .tabs-panel { padding: 0; }

	/* strona produktu – lista zakładek: grid 2 kolumny, kafelki z tekstem na środku i strzałką po prawej */
	:is(.page-template-offer, .page-template-offer-eco) #collapsing-tabs {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 8px;
		border: 0;
		background: none;
	}
	:is(.page-template-offer, .page-template-offer-eco) #collapsing-tabs::before,
	:is(.page-template-offer, .page-template-offer-eco) #collapsing-tabs::after { display: none; }
	:is(.page-template-offer, .page-template-offer-eco) #collapsing-tabs .tabs-title {
		float: none;
		width: auto;
		background: #EFF0F6;
	}
	:is(.page-template-offer, .page-template-offer-eco) #collapsing-tabs .tabs-title > a {
		display: grid;
		grid-template-columns: 18px minmax(0, 1fr) 18px; /* pusta kolumna po lewej = tekst dokładnie na środku */
		gap: 8px;
		align-items: center;
		height: 100%;
		padding: 12px 16px;
		font-size: 12px;
		font-weight: 400;
		text-transform: none;
		text-align: center;
		background: #EFF0F6;
	}
	:is(.page-template-offer, .page-template-offer-eco) #collapsing-tabs .tabs-title > a[aria-selected="true"] { background: #ddd; }

	/* strona produktu – panel zakładki jako pełnoekranowy modal (klasy dodaje scripts.js) */
	body.tabs-modal-open {
		position: fixed; /* top ustawia scripts.js = -scrollY, żeby strona nie skakała */
		left: 0;
		right: 0;
		width: 100%;
		overflow: hidden;
	}
	body.tabs-modal-open .max_container.z3 { z-index: 1000; } /* wyżej niż header (z-index: 5) */
	body.tabs-modal-open #page_content #panel1c { display: block; } /* "About" zostaje pod modalem – tło nie zmienia wysokości */
	:is(.page-template-offer, .page-template-offer-eco) #page_content .tabs-panel.is-modal {
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		height: 100%;
		z-index: 1000;
		overflow-y: auto;
		-webkit-overflow-scrolling: touch;
		overscroll-behavior: contain;
		background: #fff;
		padding: 56px 16px 16px;
		float: none;
	}
	body.tabs-modal-open .tabs-modal-close {
		display: flex;
		align-items: center;
		justify-content: center;
		position: fixed;
		top: 8px;
		right: 8px;
		z-index: 1001;
		width: 40px;
		height: 40px;
		padding: 0;
		border: 0;
		background: #fff;
		color: #000;
		font-size: 32px;
		line-height: 1;
		cursor: pointer;
	}
	:is(.page-template-offer, .page-template-offer-eco) #collapsing-tabs .tabs-title > a::before { content: ""; }
	:is(.page-template-offer, .page-template-offer-eco) #collapsing-tabs .tabs-title > a::after {
		content: "";
		width: 18px;
		height: 18px;
		background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' viewBox='0 0 18 18' fill='none'%3E%3Cpath d='M9 3.75L14.25 9L9 14.25M14.25 9H3.75' stroke='%23999999' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat center / 18px 18px;
	}

	/* strona produktu – galerie WP w zakładkach: 1 kolumna, zdjęcia 100% z ramką
	   (!important – nadpisuje inline <style> generowany przez WP dla #gallery-N oraz reguły z jagmar.css) */
	:is(.page-template-offer, .page-template-offer-eco) .tabs-panel .gallery {
		display: grid !important;
		grid-template-columns: minmax(0, 1fr);
		gap: 16px;
		float: none !important;
		max-width: none !important;
		margin: 0;
	}
	:is(.page-template-offer, .page-template-offer-eco) .tabs-panel .gallery > br { display: none; }
	:is(.page-template-offer, .page-template-offer-eco) .tabs-panel .gallery .gallery-item {
		display: block !important;
		width: 100% !important;
		float: none !important;
		margin: 0 !important;
		padding: 0 !important;
	}
	:is(.page-template-offer, .page-template-offer-eco) .tabs-panel .gallery img {
		display: block;
		width: 100%;
		height: auto;
		border: 1px solid #EFF0F6 !important;
	}
	:is(.page-template-offer, .page-template-offer-eco) .tabs-panel .gallery .gallery-item:hover img { transform: none; }
	:is(.page-template-offer, .page-template-offer-eco) .tabs-panel .gallery a { pointer-events: none; } /* bez otwierania fancyboxa */
	:is(.page-template-offer, .page-template-offer-eco) .tabs-panel .gallery,
	:is(.page-template-offer, .page-template-offer-eco) .tabs-panel .gallery * { cursor: default !important; }

	/* zwykła strona (page.php) – kontener treści: tylko boczny odstęp jak w #content */
	.page-template-default .row.z3.whitebg.p45 { padding: 0 16px; }

	/* zwykła strona (page.php) – tabele układowe w treści (np. obrazek | tekst): komórki jedna pod drugą
	   (!important – nadpisuje inline width z edytora) */
	.page-template-default .row.z3.whitebg.p45 table,
	.page-template-default .row.z3.whitebg.p45 tbody,
	.page-template-default .row.z3.whitebg.p45 tr,
	.page-template-default .row.z3.whitebg.p45 td { display: block; width: 100% !important; background: #fff; }
	.page-template-default .row.z3.whitebg.p45 tbody { border: 0; }
	.page-template-default .row.z3.whitebg.p45 td .wp-caption { max-width: 100%; margin: 0 auto; background: #fff; }
	.page-template-default .row.z3.whitebg.p45 td img { max-width: 100%; height: auto; }

	/* zwykła strona (page.php) – galerie WP w treści: grid 2 kolumny, podpis 12px
	   (!important – nadpisuje inline <style> generowany przez WP dla #gallery-N oraz reguły z jagmar.css) */
	.page-template-default .gallery {
		display: grid !important;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 16px;
		margin: 0;
	}
	.page-template-default .gallery > br { display: none; }
	.page-template-default .gallery .gallery-item {
		display: flex !important;
		flex-direction: column;
		gap: 8px;
		width: auto !important;
		float: none !important;
		margin: 0 !important;
		padding: 0 !important;
	}
	.page-template-default .gallery .gallery-icon { padding: 0 16px; }
	.page-template-default .gallery img { display: block; width: 100%; height: auto; border: 1px solid #EFF0F6 !important; }
	.page-template-default .gallery .gallery-caption { font-size: 12px; margin: 0 !important; }
	.page-template-default .gallery .gallery-item:hover img { transform: none; }

	#content .offer-title-mobile {
		display: block;
		text-align: center;
		font-size: 28px;
		font-weight: 600;
		margin: 0 0 16px;
	}

	/* lista produktów (#full-second-menu) – grid 2 kolumny, kafelek jako flex column */
	#full-second-menu > .whitebg {
		display: grid;
		grid-template-columns: repeat(2, minmax(0, 1fr));
		gap: 0;
	}
	#full-second-menu > .whitebg::before,
	#full-second-menu > .whitebg::after { display: none; }
	#full-second-menu .palet-offer {
		width: auto !important;
		float: none !important;
		border: 0;
		padding-left: 0;
		padding-right: 0;
	}
	#full-second-menu .palet-offer > a {
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: 8px;
	}
	#full-second-menu .palet-offer .palet-offer-miniature { min-height: 0; }
	#full-second-menu .palet-offer img {
		width: 238px;
		max-width: 100%;
		height: auto;
		min-height: 0;
		max-height: none;
	}
	#full-second-menu .palet-offer:hover img { transform: none; }
	#full-second-menu .palet-offer .title {
		font-size: 16px;
		text-transform: none;
		padding-bottom: 0;
	}
	#full-second-menu .palet-offer .title p { margin-bottom: 0; padding-bottom: 0; }
	#full-second-menu .palet-offer .button {
		text-transform: none;
		font-weight: 400;
	}
	#full-second-menu .extra_desc { grid-column: 1 / -1; padding: 0; } /* bez 15px z jagmar.css */

	/* stopka – mobilny wariant (#mobile_footer) do 768px */
	.footer #inner-footer.hide-for-small-only { display: none !important; }
	.footer #mobile_footer.show-for-small-only { display: flex !important; }
	#mobile_footer {
		flex-direction: column;
		align-items: center;
		gap: 12px;
		margin: 0;
		padding: 12px 16px;
		text-align: center;
	}
	#mobile_footer::before {
		content: "";
		align-self: stretch;
		height: 1px;
		background: #999;
	}
	#mobile_footer > p { margin: 0; padding: 0; font-size: 12px; }
	#mobile_footer > p a { color: inherit; }
	#mobile_footer > p a:hover { color: inherit; text-decoration: underline; }

	/* stopka – bez listy flag pod stopką (flagi zostają w headerze) */
	body > .wpml-ls-statics-footer { display: none !important; }

}

/*********************
< 481px
*********************/
@media screen and (max-width: 480px) {

	/* header i content – boczny odstęp 8px zamiast 16px */
	#mobile_up { padding-left: 8px; padding-right: 8px; }
	#content { padding-left: 8px; padding-right: 8px; }
	#page_content { padding-left: 8px; padding-right: 8px; }
	.page-template-default .row.z3.whitebg.p45 { padding-left: 8px; padding-right: 8px; }
	.page-template-default .gallery .gallery-caption { font-size: 11px; }
	:is(.page-template-offer, .page-template-offer-eco) #collapsing-tabs .tabs-title > a { padding: 8px 16px; }
	:is(.page-template-offer, .page-template-offer-eco) #page_content .tabs-panel.is-modal { padding-left: 8px; padding-right: 8px; }

	/* mniejsze fonty: przyciski w headerze, tekst slidera, stopka */
	#mobile_up .numeros > div a { font-size: 14px; }
	#slider .slider_desc,
	#slider .slider_desc .big,
	#slider .slider_desc .small,
	#slider .slider_desc .content,
	#slider .slider_desc .content p { font-size: 14px; }
	#mobile_footer > p { font-size: 11px; }

	/* lista produktów – 1 kolumna */
	#full-second-menu > .whitebg { grid-template-columns: minmax(0, 1fr); gap: 16px; }
	#full-second-menu .palet-offer { border-bottom: 1px solid #EFF0F6; }
	#full-second-menu .palet-offer .title { font-size: 14px; }
	#full-second-menu { margin-bottom: 16px; }
	#full-second-menu.second-menu { padding-left: 8px; padding-right: 8px; } /* zamiast 30px z jagmar.css */

	/* breadcrumbs – mniejsze odstępy */
	#breadcrumbs ul li { margin-right: 8px; }
	#breadcrumbs ul li:not(.home) { padding-left: 16px; }

}