/*
 * EcoBoost – połączenie projektu z Elementorem.
 * Wygląd elementów jest w ecoboost.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 „EcoBoost …”). Bez nich – kolory z projektu. */
body.ecoboost {
  --eb-green: var(--e-global-color-ebgreen, #4C7F49);
  --eb-lime: var(--e-global-color-eblime, #ABC662);
  --eb-pine: var(--e-global-color-ebpine, #15291A);
  --eb-paper: var(--e-global-color-ebpaper, #F5F7F2);
  --eb-paper-2: var(--e-global-color-ebpaper2, #FFFFFF);
  --eb-sage: var(--e-global-color-ebsage, #ECF1E6);
  --eb-sand: var(--e-global-color-ebsand, #E3E8DE);
  --eb-ink: var(--e-global-color-ebink, #111A13);
  --eb-text: var(--e-global-color-ebtext, #3A423B);
  --eb-muted: var(--e-global-color-ebmuted, #6B736C);
  --eb-font: var(--e-global-typography-ebtext-font-family, "Poppins"), system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
}

/* 2. Kontenery z jednym widżetem-sekcją (hero, quiz, formularze…) – pełna szerokość, bez odstępów. */
.ecoboost .e-con.eb-wrap,
.ecoboost .elementor-section.eb-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;
}
.ecoboost .e-con.eb-wrap > .e-con-inner { max-width: none; padding: 0; gap: 0; }
.ecoboost .elementor-section.eb-wrap > .elementor-container { max-width: none; }
.ecoboost .elementor-section.eb-wrap .elementor-column > .elementor-widget-wrap { padding: 0; }
.ecoboost .elementor-widget[class*="elementor-widget-eb-"] { width: 100%; max-width: 100%; margin: 0; }
.ecoboost .elementor-widget[class*="elementor-widget-eb-"] > .elementor-widget-container { margin: 0; padding: 0; }
/* Odstęp między widżetami z „Ustawień witryny” (np. 24 px) nie rozsuwa elementów EcoBoost – odstępy ustawia siatka. */
.ecoboost .elementor-widget[class*="elementor-widget-eb-"]:not(:last-child) { margin-block-end: 0; }

/*
 * 3. Sekcje zbudowane z kontenerów: kontener „eb-section” (pełna szerokość tła, treść w szerokości projektu)
 *    → elementy i siatki w środku. Odstępy sekcji: klasy eb-section--tight / --flush-top / --flush-bottom
 *    albo pola „Dopełnienie” w zakładce Zaawansowane kontenera.
 */
:where(.ecoboost) .e-con.eb-section {
  --padding-top: var(--eb-pad); --padding-bottom: var(--eb-pad);
  --padding-left: var(--eb-gutter); --padding-right: var(--eb-gutter);
  --container-max-width: var(--eb-max);
  --gap: 0px; --row-gap: 0px; --column-gap: 0px;
}
:where(.ecoboost) .e-con.eb-section--tight { --padding-top: clamp(56px, 7vw, 100px); --padding-bottom: clamp(56px, 7vw, 100px); }
:where(.ecoboost) .e-con.eb-section--flush-top { --padding-top: 0px; }
:where(.ecoboost) .e-con.eb-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(.ecoboost) .e-con.eb-grid,
:where(.ecoboost) .e-con.eb-box { --padding-top: 0px; --padding-right: 0px; --padding-bottom: 0px; --padding-left: 0px; }
:where(.ecoboost) .e-con.eb-box { --gap: 0px; --row-gap: 0px; --column-gap: 0px; }
.ecoboost .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). */
.ecoboost .e-con.e-grid > .elementor-widget[class*="elementor-widget-eb-"],
.ecoboost .e-con.e-grid > .elementor-widget[class*="elementor-widget-eb-"] > .elementor-widget-container { display: flex; flex-direction: column; }
.ecoboost .e-con.e-grid > .elementor-widget[class*="elementor-widget-eb-"] > .elementor-widget-container { flex: 1 1 auto; }
.ecoboost .e-con.e-grid > .elementor-widget > :is(.eb-card, .eb-benefit, .eb-step, .eb-note, .eb-checklist-box),
.ecoboost .e-con.e-grid > .elementor-widget > .elementor-widget-container > :is(.eb-card, .eb-benefit, .eb-step, .eb-note, .eb-checklist-box) { flex: 1 1 auto; }

/* Przyciski pod siatką w sekcji (np. „Sprawdź możliwości” pod listą i informacją). */
.ecoboost .elementor-widget.eb-help__actions { margin-top: clamp(20px, 2.4vw, 32px); }
/* Nagłówek sekcji obok zdjęcia (siatka „Tekst i zdjęcie”) – bez dolnego odstępu. */
.ecoboost .eb-intro__grid .eb-head { margin-bottom: 0; }

/* Kolumna przyklejona podczas przewijania (np. nagłówek obok listy). */
.ecoboost .e-con.eb-sticky { position: sticky; top: calc(var(--eb-header) + 40px); align-self: start; }
@media (max-width: 1024px) { .ecoboost .e-con.eb-sticky { position: static; } }

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

/* 4. Pasek administratora nie zasłania nagłówka. */
.ecoboost.admin-bar .eb-header { top: 32px; }
@media (max-width: 782px) { .ecoboost.admin-bar .eb-header { top: 46px; } }
@media (max-width: 600px) { .ecoboost.admin-bar .eb-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.ecoboost .eb-header { position: relative; transform: none !important; }
.single-elementor_library.ecoboost .eb-mbar { position: relative; display: flex; transform: none; left: auto; right: auto; bottom: auto; margin: 12px; max-width: 520px; }
.single-elementor_library.ecoboost .eb-totop { display: none; }
.elementor-editor-active.ecoboost .eb-header.is-hidden { transform: none; }
.elementor-editor-active.ecoboost .eb-totop,
.elementor-editor-active.ecoboost .eb-mbar { display: none; }
/* W edytorze opinie są widoczne jedna pod drugą, a opowieść „Filary” nie jest przyklejona – łatwiej je edytować. */
.elementor-editor-active.ecoboost .eb-review { grid-area: auto !important; opacity: 1 !important; visibility: visible !important; }
.elementor-editor-active.ecoboost .eb-review blockquote { clip-path: none !important; transform: none !important; }
.elementor-editor-active.ecoboost .eb-reviews__list { gap: 40px !important; }
.elementor-editor-active.ecoboost .eb-story__step { opacity: 1; }

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