/*
 Theme Name:   Woodmart Child
 Description:  Woodmart Child Theme
 Author:       XTemos
 Author URI:   http://xtemos.com
 Template:     woodmart
 Version:      1.0.0
 Text Domain:  woodmart
*/

/* ==========================================================================
   Mirox — style globalne przeniesione z Kitu Elementora (Kit ID 10).
   Źródło wartości: /var/www/mirox/krok2-style.md
   Ten plik ładuje się PRZED CSS z Theme Settings Woodmarta, dlatego
   nadpisania zmiennych mają podwyższoną specyficzność (:root:root).
   ========================================================================== */

/* --- Font -------------------------------------------------------------------
   KumbhSansLocal.woff2 to font zmienny (100–900). Woodmart rejestruje go tylko
   jako 400 i z adresem //www.mirox.pl (CORS na pozostałych domenach), więc
   rejestrujemy go ponownie pod własną nazwą: pełny zakres wag + ścieżka
   względna działająca na każdej domenie językowej. */
@font-face {
	font-family: "Mirox Kumbh Sans";
	src: url("/wp-content/uploads/2026/10/KumbhSansLocal.woff2") format("woff2-variations"),
	     url("/wp-content/uploads/2026/10/KumbhSansLocal.woff2") format("woff2");
	font-weight: 100 900;
	font-style: normal;
	font-display: swap;
}

:root:root {
	--mx-font: "Mirox Kumbh Sans", "KumbhSansLocal", Arial, Helvetica, sans-serif;
	--wd-text-font: var(--mx-font);
	--wd-title-font: var(--mx-font);
	--wd-entities-title-font: var(--mx-font);
	--wd-widget-title-font: var(--mx-font);
	--wd-header-el-font: var(--mx-font);
	--wd-alternative-font: var(--mx-font);
	--btn-default-font-family: var(--mx-font);
	/* Przyciski „akcentowane” Woodmarta (m.in. submit formularzy) = jak domyślne z Kitu */
	--btn-accented-font-family: var(--mx-font);
	--btn-accented-font-weight: 500;
	--btn-accented-bgcolor: #0B191B;
	--btn-accented-bgcolor-hover: #D71922;
	--btn-accented-color: #FFFFFF;
	--btn-accented-color-hover: #FFFFFF;
	--btn-accented-brd-radius: 0;
	--btn-accented-box-shadow: none;
	--btn-accented-box-shadow-hover: none;

	/* Paleta z Kitu — do użycia w treści (WPBakery: Custom CSS / klasy) */
	--mx-primary: #0B191B;
	--mx-red: #D71922;
	--mx-accent: #7D8CA3;
	--mx-white: #FFFFFF;
	--mx-dark-grey: #DDDDDD;
	--mx-grey-bg: #F6F6F6;
	--mx-soft-grey: #EEF7ED;
	--mx-soft-light: #FBFBFB;
	--mx-white-trans: #FFFFFFD1;
	--mx-black-trans: #22283170;
	--mx-blue: #40B4E4;
}

/* --- Tekst ----------------------------------------------------------------- */
body {
	line-height: 24px;
	letter-spacing: 0.5px;
}

p {
	margin-bottom: 17px;
}

/* --- Nagłówki (efektywne ustawienia Kitu: H1 = preset H2) ------------------ */
h1, h2, h3, h4, h5, h6 {
	font-weight: 500;
	text-transform: uppercase;
	color: var(--mx-primary);
}

h1, h2 { font-size: 40px; line-height: 50px; letter-spacing: 0; }
h3     { font-size: 20px; line-height: 40px; letter-spacing: 0.25px; }
h4     { font-size: 24px; line-height: 30px; letter-spacing: 0.1px; }
h5     { font-size: 20px; line-height: 28px; letter-spacing: 0; }
h6     { font-size: 14px; line-height: 22px; letter-spacing: 0.15px; }

@media (max-width: 1024px) {
	h1, h2 { font-size: 35px; }
}

/* --- Presety typografii Elementora jako klasy ------------------------------
   Używane przy konwersji treści: widget z presetem X dostaje klasę .mx-typo-X */
.mx-typo-large,
.mx-typo-h1,
.mx-typo-h2,
.mx-typo-h3,
.mx-typo-h4,
.mx-typo-h5,
.mx-typo-h6,
.mx-typo-accent {
	font-family: var(--mx-font);
	font-weight: 500;
	text-transform: uppercase;
}

.mx-typo-large     { font-size: 70px; line-height: 80px; letter-spacing: -1.5px; }
.mx-typo-h1        { font-size: 50px; line-height: 60px; letter-spacing: -0.5px; }
.mx-typo-h2        { font-size: 40px; line-height: 50px; letter-spacing: 0; }
.mx-typo-h3        { font-size: 20px; line-height: 40px; letter-spacing: 0.25px; }
.mx-typo-h4        { font-size: 24px; line-height: 30px; letter-spacing: 0.1px; }
.mx-typo-h5        { font-size: 20px; line-height: 28px; letter-spacing: 0; }
.mx-typo-h6        { font-size: 14px; line-height: 22px; letter-spacing: 0.15px; }
.mx-typo-accent    { font-size: 16px; line-height: 24px; letter-spacing: 0.15px; }

.mx-typo-secondary { font-family: var(--mx-font); font-weight: 400; font-size: 24px; line-height: 36px; letter-spacing: 0.15px; }
.mx-typo-text      { font-family: var(--mx-font); font-weight: 400; font-size: 16px; line-height: 24px; letter-spacing: 0.5px; }
.mx-typo-form      { font-family: var(--mx-font); font-weight: 400; font-size: 15px; line-height: 25px; }

@media (max-width: 1024px) {
	.mx-typo-large     { letter-spacing: -1px; }
	.mx-typo-h1        { font-size: 44px; line-height: 53px; }
	.mx-typo-h2        { font-size: 35px; }
	.mx-typo-secondary { font-size: 20px; line-height: 30px; }
}

@media (max-width: 767px) {
	.mx-typo-large     { font-size: 40px; line-height: 50px; letter-spacing: 0; }
	.mx-typo-h1        { font-size: 40px; line-height: 50px; letter-spacing: 0; }
	.mx-typo-secondary { font-size: 18px; line-height: 28px; }
}

/* --- Przyciski (Kit: 16px/500/uppercase, padding 20/40, ramka 2px) -------- */
:is(.btn.btn-color-default, [type="submit"]:not(.searchsubmit)) {
	--btn-font-size: 16px;
	--btn-transform: uppercase;
	--btn-padding: 20px 40px;
	--btn-height: auto;
	--btn-brd-width: 2px;
	--btn-brd-style: solid;
	--btn-brd-color: var(--mx-primary);
	--btn-brd-color-hover: var(--mx-primary);
	line-height: 16px;
	letter-spacing: 0.15px;
}

@media (max-width: 1024px) {
	:is(.btn.btn-color-default, [type="submit"]:not(.searchsubmit)) {
		--btn-padding: 17px 34px;
	}
}

/* --- Formularze ------------------------------------------------------------ */
form label {
	font-weight: 500;
	font-size: 16px;
	line-height: 24px;
	letter-spacing: 0.15px;
	text-transform: uppercase;
}

:is(input:not([type="submit"]):not([type="checkbox"]):not([type="radio"]), select, textarea) {
	font-size: 15px;
	line-height: 25px;
}

/* ==========================================================================
   Stopka (HTML Block „Stopka (XX)”, źródło: Elementor #228)
   ========================================================================== */
/* font jawnie w headerze i stopce (Woodmart ustawia własne fonty elementów) */
.wd-footer, .whb-header { font-family: var(--mx-font); }
.wd-footer { background-color: var(--mx-dark-grey); }
.wd-footer .main-footer { padding: 0; }
.mx-hidden-row { display: none !important; }

/* CTA: zdjęcie + formularz */
.mx-footer-cta { background-color: var(--mx-grey-bg); padding: 70px 0; }
/* zdjęcie wypełnia całą wysokość kolumny (jak w Elementorze) */
.mx-footer-cta__image > .vc_column-inner { position: relative; min-height: 320px; height: 100%; padding: 0 !important; }
.mx-footer-cta__image .wpb_wrapper,
.mx-footer-cta__img { position: absolute !important; inset: 0; margin: 0 !important; }
/* wysokość zdjęcia jak w Elementorze (920px), nie więcej niż kolumna */
.mx-footer-cta__image .wpb_wrapper { bottom: auto; height: min(920px, 100%); }
.mx-footer-cta__img *, .mx-footer-cta__img img { width: 100%; height: 100%; }
.mx-footer-cta__img img { object-fit: cover; display: block; }
.mx-footer-cta .mx-footer-cta__form > .vc_column-inner { padding: 50px 80px !important; }
.mx-footer-cta__form .wpb_wrapper { max-width: 560px; }
.mx-footer-cta__title .woodmart-title-container { font-size: 40px; line-height: 50px; font-weight: 500; text-transform: uppercase; }
.mx-footer-cta__text { margin: 20px 0; }

/* Formularz CF7 */
.mx-cf7 { display: grid; gap: 10px; }
.mx-cf7 p { margin: 0; }
.mx-cf7 br { display: none; }
.mx-cf7-label { margin-bottom: -2px; }
.mx-cf7-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.mx-cf7 .wpcf7-form-control-wrap { display: block; }
.mx-cf7 :is(input:not([type="submit"]):not([type="checkbox"]):not([type="file"]), select, textarea) { width: 100%; background-color: var(--mx-white); }
.mx-cf7 textarea { height: 140px; }
.mx-cf7-file { text-transform: none; font-weight: 400; font-size: 15px; }
.mx-cf7-file input { display: block; margin-top: 5px; }
.mx-cf7 .wpcf7-acceptance label { display: flex; gap: 10px; align-items: flex-start; text-transform: none; font-weight: 400; letter-spacing: 0.5px; }
.mx-cf7 .wpcf7-acceptance input { margin-top: 5px; }
.mx-cf7 .wpcf7-list-item { margin: 0; }
.mx-cf7 [type="submit"] { justify-self: start; margin-top: 10px; }

/* Część główna: dane firmy + kolumny */
.mx-footer-main { background-color: var(--mx-dark-grey); }
.mx-footer-company { padding-top: 70px; margin-bottom: 20px; font-size: 16px; font-weight: 600; letter-spacing: 0.5px; }
.mx-footer-address p { margin-bottom: 10px; }
.mx-footer-address a { text-decoration: underline; }
.mx-footer-heading { margin-bottom: 0; font-size: 14px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15px; }
.mx-footer-col > .vc_column-inner { padding-right: 50px; }
.mx-footer-links .wd-list-content,
.mx-footer-links a { color: var(--mx-primary); font-size: 16px; line-height: 24px; }
.mx-footer-links { gap: 2px !important; row-gap: 2px !important; --li-mb: 0; }
.mx-footer-links li { margin-bottom: 0; }
.mx-footer-links--headings .wd-list-content,
.mx-footer-links--headings a { font-size: 14px; font-weight: 700; text-transform: uppercase; letter-spacing: 0.15px; line-height: 28px; }
.mx-footer-links a:hover { color: var(--mx-red); }

/* Ikony social: ciemne kwadraty, białe ikony */
.mx-footer-social .wd-social-icon { background-color: var(--mx-primary) !important; color: var(--mx-white) !important; border-radius: 0; }
.mx-footer-social .wd-social-icon:hover { background-color: var(--mx-red) !important; }

/* Pasek dolny */
.mx-footer-bottom { padding: 20px 0 70px; }
.mx-footer-bottom > .wpb_column { border-top: 1px solid var(--mx-soft-grey); padding-top: 20px; }
.mx-footer-bottom__credits { text-align: right; }

@media (max-width: 1024px) {
	.mx-footer-cta .mx-footer-cta__form > .vc_column-inner { padding: 40px !important; }
	.mx-footer-cta__title .woodmart-title-container { font-size: 35px; line-height: 45px; }
	.mx-footer-col { margin-bottom: 30px; }
}

@media (max-width: 767px) {
	.mx-footer-cta { padding: 0 0 40px; }
	.mx-footer-cta .mx-footer-cta__form > .vc_column-inner { padding: 30px 15px 0 !important; }
	.mx-cf7-cols { grid-template-columns: 1fr; }
	.mx-footer-col > .vc_column-inner { padding-right: 15px; }
	.mx-footer-bottom > .wpb_column { border-top: 0; padding-top: 0; }
	.mx-footer-bottom { border-top: 1px solid var(--mx-soft-grey); padding-top: 20px; }
	.mx-footer-bottom__credits { text-align: left; }
}

/* ==========================================================================
   Header (Header Builder: „mirox_podstrony”, „mirox_glowna”; źródło: Elementor #376/#100)
   ========================================================================== */
/* kontakty w górnym pasku (HTML Block „Header – kontakt (XX)”) */
.mx-hb-contacts { display: flex; align-items: center; gap: 25px; font-size: 18px; line-height: 1.2; letter-spacing: 0.5px; white-space: nowrap; }
.mx-hb-contacts a { display: inline-flex; align-items: center; gap: 8px; color: inherit; }
.mx-hb-contacts a:hover { color: var(--mx-red); }
.mx-hb-icon { flex: none; opacity: 0.8; }
.whb-color-dark .mx-hb-contacts { color: var(--mx-primary); }
.whb-color-light .mx-hb-contacts { color: #FFFFFF; }

/* menu główne: 16px / 400 / bez wersalików (jak w Elementorze) */
.whb-header .wd-nav-main > li > a {
	font-size: 16px;
	font-weight: 400;
	text-transform: none;
	letter-spacing: 0.5px;
}
.whb-header .wd-nav-main > li > a .nav-link-text { text-transform: none; }
.whb-header .wd-nav-main .wd-dropdown { font-size: 13px; }

/* logo w czerwonym boksie na wysokość obu wierszy (górny pasek 40px + menu 62px) */
@media (min-width: 1025px) {
	.whb-general-header .wd-header-main-logo,
	.whb-general-header .site-logo { position: relative; z-index: 3; }
	.whb-general-header .site-logo img { transform: translateY(-45px); max-height: none; }
}

/* mobile: kontakty pod sobą obok logo */
@media (max-width: 1024px) {
	.whb-general-header .mx-hb-contacts { flex-direction: column; align-items: flex-start; gap: 6px; font-size: 14px; }
	.whb-general-header .mx-hb-icon { width: 14px; height: 14px; }
}

/* treść zaczyna się tuż pod headerem (jak w Hello Elementor) — bez górnego/dolnego odstępu Woodmarta */
.wd-content-layout { padding-block: 0; }

/* ==========================================================================
   Treść skonwertowana z Elementora (wiersze .mx-conv) — zachowanie jak w Elementorze
   ========================================================================== */
/* odstępy kolumn (Elementor „Columns Gap”: default 10px, no 0, narrow 5, extended 15, wide 20, wider 30) */
.mx-conv { --mx-gap: 10px; }
.mx-conv.mx-gap-no { --mx-gap: 0px; }
.mx-conv.mx-gap-narrow { --mx-gap: 5px; }
.mx-conv.mx-gap-extended { --mx-gap: 15px; }
.mx-conv.mx-gap-wide { --mx-gap: 20px; }
.mx-conv.mx-gap-wider { --mx-gap: 30px; }
.mx-conv.vc_row,
.mx-conv .vc_row.vc_inner { margin-left: calc(-1 * var(--mx-gap)); margin-right: calc(-1 * var(--mx-gap)); }
.mx-conv.vc_row[data-vc-full-width],
.mx-conv.vc_row.vc_row-no-padding { margin-left: 0; margin-right: 0; }
.mx-conv .wpb_column > .vc_column-inner { padding-left: var(--mx-gap); padding-right: var(--mx-gap); padding-top: 0; }
.mx-conv .vc_row.vc_inner { --mx-gap: 10px; }

/* odstęp między widgetami: 20px (Elementor), ostatni bez odstępu */
.mx-conv .wpb_wrapper > * { margin-bottom: 20px; }
.mx-conv .wpb_wrapper > :last-child { margin-bottom: 0; }
.mx-conv .wpb_content_element,
.mx-conv .wd-wpb { margin-bottom: 20px; }

/* nagłówki z widgetu Heading: bez marginesów motywu */
.mx-conv .mx-w-heading .mx-heading { margin: 0; }
.mx-conv .mx-w-heading a { color: inherit; }
.mx-conv .mx-w-text p:last-child { margin-bottom: 0; }
.mx-conv .mx-todo { outline: 2px dashed #D71922; padding: 10px; }

/* karty „zobacz także” (karuzela stron; woodmart_nested_carousel nie przyjmuje el_class) */
.mx-card { margin: 0; height: 100%; }
.mx-card__link { display: flex; flex-direction: column; height: 100%; background: #FFFFFF; color: var(--mx-primary); box-shadow: 0 10px 30px rgba(0,0,0,.08); }
.mx-card__img { width: 100%; height: 220px; object-fit: cover; display: block; }
.mx-card__title { padding: 40px 30px 30px; font-size: 20px; line-height: 28px; font-weight: 500; text-transform: uppercase; }
.mx-card__link:hover .mx-card__title { color: var(--mx-red); }

/* przyciski w treści skonwertowanej = przycisk z Kitu Elementora (nadpisywane per element) */
.mx-conv .btn {
	--btn-bgcolor: #0B191B;
	--btn-color: #FFFFFF;
	--btn-bgcolor-hover: #D71922;
	--btn-color-hover: #FFFFFF;
	--btn-brd-width: 2px;
	--btn-brd-style: solid;
	--btn-brd-color: #0B191B;
	--btn-brd-color-hover: #0B191B;
	--btn-padding: 20px 40px;
	--btn-height: auto;
	--btn-font-size: 16px;
	--btn-transform: uppercase;
	--btn-font-weight: 500;
	--btn-brd-radius: 0;
	line-height: 16px;
	letter-spacing: 0.15px;
	gap: 10px;
}
.mx-conv .btn { color: var(--btn-color); background-color: var(--btn-bgcolor); border: var(--btn-brd-width) var(--btn-brd-style) var(--btn-brd-color); }
.mx-conv .btn:hover { color: var(--btn-color-hover); background-color: var(--btn-bgcolor-hover); border-color: var(--btn-brd-color-hover); }
@media (max-width: 1024px) {
	.mx-conv .btn { --btn-padding: 17px 34px; }
}

/* karta produktu z szablonów kart Elementora #396, #3657, #17001, #17211 (produkty w kategorii: zdjęcie, tytuł na szarym pasku, opis, „zobacz”) */
.mx-card-product .wd-post { text-align: left; }
.mx-card-product .wd-post-inner { height: 100%; display: flex; flex-direction: column; background: #FFFFFF; box-shadow: none; border-bottom: 5px solid var(--mx-grey-bg); }
.mx-card-product .wd-post-thumb { margin: 0; }
.mx-card-product .wd-post-img img { width: 100%; height: 274px; object-fit: contain; }
.mx-card-fit-cover .wd-post-img img { object-fit: cover; }
.mx-card-product .wd-post-content { flex: 1; display: flex; flex-direction: column; align-items: stretch; padding: 0 !important; text-align: left; }
.mx-card-product .wd-post.wd-add-shadow .wd-post-inner, .mx-card-product .wd-post { box-shadow: none !important; }
.mx-card-product .wd-post-read-more { align-self: flex-start; }
.mx-card-product .wd-post-title { margin: 0; padding: 10px 20px; background: var(--mx-grey-bg); font-size: 20px; line-height: 1.5; font-weight: 400; text-transform: uppercase; }
.mx-card-product .wd-post-title a { color: var(--mx-primary); }
.mx-card-product .wd-post-excerpt { padding: 20px; margin: 0; font-size: 16px; line-height: 24px; color: var(--mx-primary); }
.mx-card-product .wd-post-read-more { margin: auto 20px 20px; }
.mx-card-product .wd-post-read-more a {
	display: inline-flex; align-items: center; padding: 20px 40px; border: 2px solid var(--mx-primary);
	color: var(--mx-primary); font-size: 16px; line-height: 16px; font-weight: 500; text-transform: uppercase; letter-spacing: 0.15px;
}
.mx-card-product .wd-post-read-more a::after { display: none; }
.mx-card-product .wd-post-read-more a:hover { background: var(--mx-dark-grey); border-color: var(--mx-dark-grey); }
@media (max-width: 767px) {
	.mx-card-product .wd-post-title { font-size: 16px; }
}

/* tło-pokaz slajdów kolumny (Elementor „Slideshow”) = galeria WPBakery flexslider fade na całe tło */
.mx-conv .mx-bg-slideshow { position: absolute !important; inset: 0; margin: 0 !important; z-index: 0; }
.mx-conv .mx-bg-slideshow .wpb_wrapper,
.mx-conv .mx-bg-slideshow .wpb_gallery_slides,
.mx-conv .mx-bg-slideshow .flexslider,
.mx-conv .mx-bg-slideshow .flex-viewport,
.mx-conv .mx-bg-slideshow .slides,
.mx-conv .mx-bg-slideshow .slides > li { height: 100% !important; margin: 0; padding: 0; border: 0; box-shadow: none; background: none; }
.mx-conv .mx-bg-slideshow .slides img { width: 100%; height: 100%; object-fit: cover; }
.mx-conv .mx-bg-slideshow .flex-control-nav,
.mx-conv .mx-bg-slideshow .flex-direction-nav { display: none; }
.mx-conv .mx-bg-slideshow ~ * { position: relative; z-index: 1; }

/* formularze CF7 wygenerowane z Piotnet (zgłoszenie serwisowe, wycena online, …) */
.mx-cf7-generic .mx-cf7-field .wpcf7-form-control-wrap { display: block; }
.mx-cf7-generic .wpcf7-checkbox,
.mx-cf7-generic .wpcf7-radio { display: flex; flex-wrap: wrap; gap: 6px 20px; }
.mx-cf7-generic .wpcf7-list-item { margin: 0; }
.mx-cf7-generic .wpcf7-list-item label { display: flex; gap: 8px; align-items: center; text-transform: none; font-weight: 400; letter-spacing: 0.5px; }
.mx-cf7-generic .mx-cf7-upload input { display: block; }
/* wybór obrazkiem */
.mx-cf7-image-select .wpcf7-radio { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 15px; }
.mx-cf7-image-select .wpcf7-list-item label { flex-direction: column; align-items: center; padding: 10px; border: 2px solid var(--mx-dark-grey); cursor: pointer; text-align: center; }
.mx-cf7-image-select .wpcf7-list-item label:has(input:checked) { border-color: var(--mx-primary); }
.mx-cf7-image-select .wpcf7-list-item img { width: 100%; height: auto; }
.mx-cf7-image-select input[type="radio"] { position: absolute; opacity: 0; }

/* karta-kafel z szablonu Elementora #1875 (zdjęcie + tytuł na białym tle; „Inspiracje”, „Zobacz także”) */
.mx-card-tile .wd-post { text-align: left; }
.mx-card-tile .wd-post-inner { height: 100%; display: flex; flex-direction: column; background: #FFFFFF; box-shadow: 0 10px 30px rgba(0,0,0,.08) !important; }
.mx-card-tile .wd-post-thumb { margin: 0; }
.mx-card-tile .wd-post-img img { width: 100%; height: 220px; object-fit: cover; }
.mx-card-tile .wd-post-content { padding: 40px 30px 30px !important; text-align: left; align-items: stretch; }
.mx-card-tile .wd-post-title { margin: 0; font-size: 20px; line-height: 28px; font-weight: 500; text-transform: uppercase; }
.mx-card-tile .wd-post-title a { color: var(--mx-primary); }
.mx-card-tile .wd-post-excerpt,
.mx-card-tile .wd-post-read-more,
.mx-card-tile .wd-post-meta,
.mx-card-tile .wd-post-cat { display: none; }

/* opinie klientów (Elementor Testimonial Carousel → testimonials Woodmart) */
.mx-testimonials .testimonial-inner { background: #FFFFFF; padding: 40px 50px; }
.mx-testimonials .testimonial-content { text-align: center; font-style: italic; font-size: 20px; line-height: 30px; color: var(--mx-primary); }
.mx-testimonials .testimonial-content footer { margin-top: 20px; font-style: normal; font-size: 14px; line-height: 20px; font-weight: 500; text-transform: uppercase; color: var(--mx-red); }
.mx-testimonials .testimonial-content footer span { display: block; text-transform: none; font-weight: 400; color: var(--mx-red); }
.mx-testimonials .testimonial-content footer span::before { content: none; display: none; }

/* formularze zapytania (stopka i treść): przycisk „Wyślij” obrysowany, na całą szerokość (jak na produkcji) */
.mx-cf7:not(.mx-cf7-generic) [type="submit"] {
	--btn-accented-bgcolor: transparent;
	--btn-accented-color: #0B191B;
	--btn-accented-bgcolor-hover: #0B191B;
	--btn-accented-color-hover: #FFFFFF;
	justify-self: stretch; width: 100%; border: 2px solid #0B191B; min-height: 48px;
}

/* pole pliku bez etykiety (w Piotnet etykieta była ukryta) */
.mx-cf7 .mx-cf7-file { font-size: 0; }
.mx-cf7 .mx-cf7-file input { font-size: 15px; }

/* flip box (Elementor) — karta z obrotem przy najechaniu / fokusie */
.mx-flipbox { position: relative; perspective: 1000px; }
.mx-flipbox__front,
.mx-flipbox__back { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: flex-start; align-items: center; text-align: center; backface-visibility: hidden; transition: transform .6s ease, opacity .6s ease; background: var(--mx-grey-bg); padding: 30px; }
.mx-flipbox__back { transform: rotateY(180deg); align-items: flex-start; justify-content: center; }
.mx-flipbox:hover .mx-flipbox__front, .mx-flipbox:focus-within .mx-flipbox__front { transform: rotateY(-180deg); }
.mx-flipbox:hover .mx-flipbox__back, .mx-flipbox:focus-within .mx-flipbox__back { transform: rotateY(0); }
.mx-flip-zoom-in .mx-flipbox__back, .mx-flip-zoom-out .mx-flipbox__back, .mx-flip-fade .mx-flipbox__back { transform: none; opacity: 0; }
.mx-flip-zoom-in:hover .mx-flipbox__front, .mx-flip-zoom-out:hover .mx-flipbox__front, .mx-flip-fade:hover .mx-flipbox__front { transform: scale(.9); opacity: 0; }
.mx-flip-zoom-in:hover .mx-flipbox__back, .mx-flip-zoom-out:hover .mx-flipbox__back, .mx-flip-fade:hover .mx-flipbox__back { opacity: 1; }
.mx-flipbox__title { margin: 20px 0 10px; }
/* tabela z Jet Table */
.mx-table table { width: 100%; border-collapse: collapse; margin: 0; }
.mx-table th { font-weight: 500; text-transform: uppercase; }

/* lista z ikonami (Elementor Icon List z ikonami) */
.mx-il { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.mx-il--inline { flex-direction: row; flex-wrap: wrap; gap: 10px 25px; }
.mx-il__item { display: flex; align-items: center; gap: 10px; margin: 0; }
.mx-il__item > a { display: flex; align-items: center; gap: inherit; color: inherit; }
.mx-il__icon { flex: none; display: inline-flex; align-items: center; justify-content: center; font-size: 14px; color: var(--mx-red); }
.mx-il__icon img { width: 14px; height: 14px; object-fit: contain; }

/* oś czasu (Jet Timeline → Woodmart): rok przy linii jak w Elementorze */
.mx-timeline .woodmart-timeline-breakpoint-title { background: #FFFFFF !important; color: var(--mx-primary) !important; font-size: 25px; line-height: 1.2; font-weight: 500; padding: 6px 14px !important; border: 2px solid var(--mx-dark-grey); }
.mx-timeline .timeline-col-primary { box-shadow: 0 10px 30px rgba(0,0,0,.08); padding: 20px; }
.mx-timeline .timeline-col-secondary { background: transparent !important; box-shadow: none; padding: 0; }
.mx-timeline .timeline-col-secondary .timeline-arrow { display: none; }
.mx-timeline .wd-timeline-title { text-transform: uppercase; font-size: 16px; }

/* formularze wygenerowane: nagłówki grup i rzędy pól (kolumny z Elementora) */
.mx-cf7-group { display: flex; align-items: center; gap: 5px; margin: 20px 0 0; font-size: 24px; line-height: 30px; font-weight: 500; text-transform: uppercase; letter-spacing: .1px; }
.mx-cf7-group::after { content: ""; flex: 1; border-top: 2px solid var(--mx-red); }
.mx-cf7-row { display: grid; grid-template-columns: repeat(var(--mx-cols, 1), minmax(0, 1fr)); gap: 10px; }
@media (max-width: 767px) { .mx-cf7-row { grid-template-columns: 1fr; } }

/* kolumny w wierszu o równej wysokości rozciągają się (Elementor: kolumny zawsze równej wysokości) */
.mx-conv.vc_row-flex { align-items: stretch; }
.mx-conv.vc_row-flex > .wpb_column { display: flex; align-self: stretch; }
.mx-conv.vc_row-flex > .wpb_column > .vc_column-inner { flex: 1 1 auto; width: 100%; }
/* rok przy linii obok pozycji (jak w Jet Timeline), bez osobnego wiersza; mniejsze odstępy */
.mx-timeline .wd-timeline-breakpoint { height: 0; margin: 0 !important; padding: 0; position: relative; z-index: 2; overflow: visible; }
.mx-timeline .wd-timeline-breakpoint .woodmart-timeline-breakpoint-title { position: absolute; top: 0; left: 50%; transform: translate(-50%, -100%); white-space: nowrap; }
.mx-timeline .wd-timeline-item { margin-bottom: 0 !important; padding-bottom: 30px; }
.mx-timeline .timeline-col-primary { align-self: flex-start; }
.mx-timeline .timeline-col-primary,
.mx-timeline .timeline-col-primary .wd-timeline-title { text-align: left !important; }

/* Woodmart 8.6+ dodaje do kart kategorie — w pętlach z Elementora ich nie było */
.mx-loop .wd-post-cat { display: none !important; }

/* „Ostatnie artykuły” w artykule Wiedzy (Jet Posts → woodmart_blog, 1 kolumna) */
.mx-recent-posts :is(.wd-post, .wd-post-inner) { background: transparent !important; box-shadow: none !important; }
.mx-recent-posts .wd-post-content { padding: 15px 0 30px !important; margin: 0 !important; text-align: left; }
.mx-recent-posts .wd-entities-title { font-size: 18px; line-height: 1.3; font-weight: 500; text-transform: uppercase; }
.mx-recent-posts .wd-entities-title a { color: var(--mx-primary); }

/* Popupy Woodmarta (promocje, krok 5.7) — wygląd jak popup Elementora:
   jasne tło, sama grafika bez ramki, czerwony kwadrat „X” w rogu grafiki */
.mfp-bg[class*="wd-mfp-popup-bg-"] { background-color: rgba(255, 255, 255, .7); }
.wd-popup-builder-wrap .wd-popup { background-color: transparent; }
.wd-popup-builder-wrap .wd-popup-inner { padding: 0; }
.wd-popup-builder-wrap .mx-popup-row { margin: 0 !important; }
.wd-popup-builder-wrap .mx-popup-col > .vc_column-inner { padding: 0 !important; }
.wd-popup-builder-wrap .mx-popup-col .wpb_wrapper > * { margin-bottom: 0; }
.wd-popup-builder-wrap .mx-popup-col img { display: block; width: 100%; height: auto; }
.wd-popup-builder-wrap .wd-popup-close { top: 20px; inset-inline-end: 20px; --wd-action-color: #FFFFFF; --wd-action-color-hover: #FFFFFF; }
.wd-popup-builder-wrap .wd-popup-close a { width: 40px; height: 40px; padding: 0; justify-content: center; align-items: center; background-color: var(--mx-red); }
.wd-popup-builder-wrap .wd-popup-close a:hover { opacity: .85; }
@media (max-width: 767px) {
	.wd-popup-builder-wrap .wd-popup-close { top: 5px; inset-inline-end: 5px; }
}

/* Zwykłe strony (Gutenberg: polityki, regulaminy) — tytuł H1 (functions.php) i szerokość treści jak w poprzednim motywie */
.wd-content-area > .entry-content:has(> .mx-page-title) { max-width: 1140px; margin-inline: auto; padding-top: 30px; padding-bottom: 60px; }
.mx-page-title { margin-bottom: 20px; }

/* Osadzenia (iframe) z widgetów HTML Elementora bez atrybutu width (np. wirtualny spacer spacer360.pl):
   Elementor rozciągał je na całą szerokość — bez tego przeglądarka daje domyślne 300 px */
.mx-conv .wpb_raw_html iframe:not([width]) { width: 100%; max-width: 100%; display: block; }

/* Dymek z nazwą koloru (zakładka „Kolorystyka”; zamiast Jet Tricks): na górze próbka bez zmian kolorów,
   pod nią biały pasek z nazwą (do 3 linii). Domyślnie pod próbką; .mx-tip--up (JS, gdy brak miejsca) — do góry. */
.mx-tip { position: relative; cursor: pointer; }
.mx-tip::after {
	content: attr(data-mx-tip);
	position: absolute; top: calc(100% + 8px); left: 50%; z-index: 50;
	width: 250px; height: 234px; padding: 0 12px 0; box-sizing: border-box;
	display: flex; align-items: center; justify-content: center;
	padding-top: 170px; /* 170 px próbki, reszta (64 px) to pasek z nazwą */
	transform: translateX(-50%) scale(.9); opacity: 0; visibility: hidden; pointer-events: none;
	background:
		linear-gradient(#FFFFFF, #FFFFFF) bottom / 100% 64px no-repeat,
		var(--mx-tip-img) center top / auto 170px repeat-x,
		#FFFFFF;
	border: 1px solid #DDDDDD; border-radius: 4px; box-shadow: 0 8px 24px rgba(0,0,0,.18);
	font-size: 14px; line-height: 18px; font-weight: 500; text-transform: uppercase; text-align: center;
	color: var(--mx-primary); overflow-wrap: anywhere;
	transition: opacity .2s ease, transform .2s ease, visibility .2s;
}
.mx-tip.mx-tip--up::after { top: auto; bottom: calc(100% + 8px); }
.mx-tip.mx-tip--left::after { left: 0; transform: scale(.9); transform-origin: left top; }
.mx-tip.mx-tip--right::after { left: auto; right: 0; transform: scale(.9); transform-origin: right top; }
.mx-tip.mx-tip--left:is(:hover, :focus, :focus-within)::after,
.mx-tip.mx-tip--right:is(:hover, :focus, :focus-within)::after { transform: scale(1); }
.mx-tip:hover::after, .mx-tip:focus::after, .mx-tip:focus-within::after { opacity: 1; visibility: visible; transform: translateX(-50%) scale(1); }
/* wiersz z próbkami nie przycina dymków w pionie (overflow: hidden zostaje tylko w poziomie) */
.vc_row.mx-conv:has(.mx-tip) { overflow-x: clip; overflow-y: visible; }
.vc_row.mx-conv:has(.mx-tip) :is(.vc_row, .vc_column-inner, .wpb_wrapper, .wd-tabs-content-wrapper, .wd-tab-content) { overflow: visible; }