/*
 * Woltanic – połączenie projektu z Elementorem.
 * Wygląd elementów jest w woltanic.css; tu są: kolory/czcionki globalne, kontenery i siatki (Container / Grid)
 * oraz dodatki dla WordPressa. Wartości ustawione w panelu Elementora zawsze wygrywają z tymi domyślnymi
 * (selektory z :where() mają niską ważność).
 */

/* 1. Kolory i czcionki z Elementor → Ustawienia witryny (pozycje „Woltanic …”). Bez nich – kolory z projektu. */
body.woltanic {
  --wt-navy: var(--e-global-color-wtnavy, #1C3D77);
  --wt-navy-deep: var(--e-global-color-wtnavydeep, #0D2147);
  --wt-navy-ink: var(--e-global-color-wtnavyink, #081834);
  --wt-ink: var(--e-global-color-wtink, #0D1626);
  --wt-sun: var(--e-global-color-wtsun, #F8BE3B);
  --wt-sun-deep: var(--e-global-color-wtsundeep, #EAA816);
  --wt-sun-soft: var(--e-global-color-wtsunsoft, #FDEDC4);
  --wt-paper: var(--e-global-color-wtpaper, #F4F6FA);
  --wt-mist: var(--e-global-color-wtmist, #E8EEF7);
  --wt-line: var(--e-global-color-wtline, #D9E0EB);
  --wt-muted: var(--e-global-color-wtmuted, #536075);
  --wt-font-head: var(--e-global-typography-wthead-font-family, "Instrument Sans"), Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
  --wt-font-text: var(--e-global-typography-wttext-font-family, Inter), system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --wt-font-mono: var(--wt-font-text);
}

/* 2. Kontenery z jednym widżetem-sekcją (hero, usługi, formularze…) – pełna szerokość, bez odstępów. */
.woltanic .e-con.wt-wrap,
.woltanic .elementor-section.wt-wrap {
  --padding-top: 0px; --padding-right: 0px; --padding-bottom: 0px; --padding-left: 0px;
  --gap: 0px; --row-gap: 0px; --column-gap: 0px;
  --margin-top: 0px; --margin-bottom: 0px;
  --content-width: 100%; --container-max-width: 100%;
  padding: 0; margin: 0;
}
.woltanic .e-con.wt-wrap > .e-con-inner { max-width: none; padding: 0; gap: 0; }
.woltanic .elementor-section.wt-wrap > .elementor-container { max-width: none; }
.woltanic .elementor-section.wt-wrap .elementor-column > .elementor-widget-wrap { padding: 0; }
.woltanic .elementor-widget[class*="elementor-widget-wt-"] { width: 100%; max-width: 100%; margin: 0; }
.woltanic .elementor-widget[class*="elementor-widget-wt-"] > .elementor-widget-container { margin: 0; padding: 0; }

/*
 * 3. Sekcje zbudowane z kontenerów: kontener „wt-section” (pełna szerokość tła, treść w szerokości projektu)
 *    → elementy i siatki w środku. Odstępy sekcji: klasy wt-section--tight / --flush-top / --flush-bottom
 *    albo pola „Dopełnienie” w zakładce Zaawansowane kontenera.
 */
:where(.woltanic) .e-con.wt-section {
  --padding-top: var(--wt-pad); --padding-bottom: var(--wt-pad);
  --padding-left: var(--wt-gutter); --padding-right: var(--wt-gutter);
  --container-max-width: var(--wt-max);
  --gap: 0px; --row-gap: 0px; --column-gap: 0px;
}
:where(.woltanic) .e-con.wt-section--tight { --padding-top: clamp(56px, 7vw, 96px); --padding-bottom: clamp(56px, 7vw, 96px); }
:where(.woltanic) .e-con.wt-section--flush-top { --padding-top: 0px; }
:where(.woltanic) .e-con.wt-section--flush-bottom { --padding-bottom: 0px; }

/* Siatki i kontenery w sekcji – bez własnych odstępów (odstępy między elementami ustawia „Przerwy” siatki). */
:where(.woltanic) .e-con.wt-grid,
:where(.woltanic) .e-con.wt-box { --padding-top: 0px; --padding-right: 0px; --padding-bottom: 0px; --padding-left: 0px; }
:where(.woltanic) .e-con.wt-box { --gap: 0px; --row-gap: 0px; --column-gap: 0px; }
.woltanic .e-con.e-grid > .elementor-element { min-width: 0; }
/* Kafelki w siatce mają równą wysokość w rzędzie (element wypełnia komórkę siatki). */
.woltanic .e-con.e-grid > .elementor-widget[class*="elementor-widget-wt-"],
.woltanic .e-con.e-grid > .elementor-widget[class*="elementor-widget-wt-"] > .elementor-widget-container { display: flex; flex-direction: column; }
.woltanic .e-con.e-grid > .elementor-widget[class*="elementor-widget-wt-"] > .elementor-widget-container { flex: 1 1 auto; }
.woltanic .e-con.e-grid > .elementor-widget > :is(.wt-card, .wt-benefit, .wt-stat, .wt-step, .wt-logo-tile, .wt-stats__media),
.woltanic .e-con.e-grid > .elementor-widget > .elementor-widget-container > :is(.wt-card, .wt-benefit, .wt-stat, .wt-step, .wt-logo-tile, .wt-stats__media) { flex: 1 1 auto; }
/* Karta „Czym jest…” jako siatka: odstępy wewnątrz karty. */
:where(.woltanic) .e-con.wt-feature__card { --padding-top: clamp(28px, 5vw, 72px); --padding-bottom: clamp(28px, 5vw, 72px); --padding-left: clamp(28px, 5vw, 72px); --padding-right: clamp(28px, 5vw, 72px); }

/* Zwykłe widżety Elementora wstawione między sekcje Woltanic – w kontenerze o szerokości projektu. */
.woltanic .e-con:not(.wt-wrap) { --container-max-width: var(--wt-max); }

/* 4. Pasek administratora nie zasłania nagłówka. */
.woltanic.admin-bar .wt-header { top: 32px; }
@media (max-width: 782px) { .woltanic.admin-bar .wt-header { top: 46px; } }
@media (max-width: 600px) { .woltanic.admin-bar .wt-header { top: 0; } }

/* 5. Edycja szablonów nagłówka i stopki w Elementorze – nagłówek w normalnym przepływie, żeby łatwo go zaznaczyć. */
.single-elementor_library.woltanic .wt-header { position: relative; transform: none !important; }
.single-elementor_library.woltanic .wt-mbar { position: relative; display: flex; transform: none; left: auto; right: auto; bottom: auto; margin: 12px; max-width: 520px; }
.single-elementor_library.woltanic .wt-totop { display: none; }
.elementor-editor-active.woltanic .wt-header.is-hidden { transform: none; }
.elementor-editor-active.woltanic .wt-totop,
.elementor-editor-active.woltanic .wt-mbar { display: none; }

/* 6. Strony bez Elementora (wpisy, archiwa) – treść w typografii Woltanic. */
.woltanic .wt-main > .wt-article .wt-prose img { border-radius: 18px; height: auto; }
.woltanic .wt-prose .wp-block-image figcaption { font-size: 14px; color: var(--wt-muted); margin-top: 8px; }
.woltanic .wt-article__media img { height: auto; }