/* Гарт — оверрайди Elementor/Jet-класів на токени ДС.
   Наповнюється у фазі 4 (рестайл внутрішніх сторінок). */

/* Elementor kit (.elementor-kit-4105 h1…h6 / a — сірі кольори старої ДС)
   друкується інлайном ПІСЛЯ theme.css і перебиває компоненти «Гарт».
   Повертаємо кольори ДС підвищеною специфічністю (0,2,1 > 0,1,1). */
.hero h1.t-display { color: #fff; }
.section-head h2.t-h2 { color: var(--foreground); }
.lead-form__content h2.t-h2 { color: #fff; }
.about-col__body h3.t-h4,
.proof-card h3.t-h4,
.step h3.t-h4 { color: var(--foreground); }
.card-dir__body h3.t-h4 { color: #fff; }

/* Elementor reset `.elementor img { height: auto }` ламає cover-заповнення
   фото-контейнерів (0,1,1 проти 0,1,1, друкується пізніше) — повертаємо. */
.dir-grid .card-dir__photo img,
.hero .hero__media img,
.lead-form .lead-form__media img { height: 100%; }

/* лід-форма: .elementor-widget { position:relative } робить html-віджет
   containing block-ом для absolute .lead-form__media/__scrim — фон вкривав
   лише голову секції. Повертаємо static, щоб фон розтягнувся на всю .lead-form. */
.lead-form .elementor-widget-html { position: static; }
a.btn.btn-primary { color: var(--foreground); }
a.btn.btn-primary:hover { color: var(--steel-foreground); }
a.btn.btn-outline { color: var(--foreground); }
.on-dark a.btn.btn-outline { color: #fff; }
.on-dark a.btn.btn-outline:hover { color: #fff; }

/* ============================================================================
   ФАЗА 4 — ГЛОБАЛЬНИЙ РЕСТАЙЛ ВНУТРІШНІХ СТОРІНОК (restyle-css)
   ----------------------------------------------------------------------------
   Стара ДС (kit elementor-kit-4105 + інлайн-правила Elementor):
     primary #E3461B, accent #E23809 (червоно-помаранч), text #7A7A7A,
     secondary #54595F, кастомні #000000 / #222931; заголовки #292929/#222931,
     основний текст #5f656d, світлі секції #f5f6f6, шрифти Roboto/Roboto Slab
     + похардкоджені Hind і Open Sans на кожному елементі.
   Стратегія:
   1) Ремап глобальних змінних кіта на токени «Гарт» (body.elementor-kit-4105
      б'є інлайновий .elementor-kit-4105 специфічністю 0,1,1 > 0,1,0) —
      закриває всі right-hand var(--e-global-*) вживання одним махом.
   2) Похардкоджені інлайн-правила (0,4,0, друкуються після цього файла)
      перебиваємо widget-type-селекторами з !important. Головна (4860)
      складається лише з html/shortcode-віджетів і цих класів не має —
      селектори природно її не чіпають; найширші правила додатково
      огороджені body:not(.home).
   ========================================================================== */

/* --- 1. Ремап змінних кіта → токени «Гарт» ------------------------------- */
body.elementor-kit-4105 {
  --e-global-color-primary: var(--heat);
  --e-global-color-secondary: var(--secondary-foreground);
  --e-global-color-text: var(--foreground);
  --e-global-color-accent: var(--heat);
  --e-global-color-4019dc9: var(--foreground);   /* був #000000 */
  --e-global-color-9dfb963: var(--steel-900);    /* був #222931 */
  --e-global-typography-primary-font-family: "e-Ukraine";
  --e-global-typography-primary-font-weight: 500;
  --e-global-typography-secondary-font-family: "e-Ukraine";
  --e-global-typography-secondary-font-weight: 500;
  --e-global-typography-text-font-family: "e-Ukraine";
  --e-global-typography-text-font-weight: 400;
  --e-global-typography-accent-font-family: "e-Ukraine";
  --e-global-typography-accent-font-weight: 500;
}

/* --- 2. Типографіка: шрифт ДС замість Hind/Open Sans/Roboto --------------- */
.elementor-widget-heading .elementor-heading-title,
.elementor-widget-text-editor,
.elementor-widget-icon-box .elementor-icon-box-title,
.elementor-widget-icon-box .elementor-icon-box-description,
.elementor-widget-image-box .elementor-image-box-title,
.elementor-widget-image-box .elementor-image-box-description,
.elementor-widget-button .elementor-button,
.elementor-widget-icon-list .elementor-icon-list-text,
.elementor-widget-contact-form-7 .wpcf7 {
  font-family: var(--font-sans) !important;
}
/* великі заголовки — вага 500 (інваріант ДС №3), малі — 700 */
h1.elementor-heading-title, h2.elementor-heading-title {
  font-weight: 500 !important; letter-spacing: -0.005em !important;
}
h3.elementor-heading-title, h4.elementor-heading-title,
h5.elementor-heading-title, h6.elementor-heading-title,
.elementor-icon-box-title, .elementor-image-box-title {
  font-weight: 700 !important;
}
/* стара ДС мала хаки line-height:0/1em під вузькі Hind/Open Sans —
   з ширшим e-Ukraine рядки злипаються; нормалізуємо міжряддя */
.elementor-widget-icon-box .elementor-icon-box-title,
.elementor-widget-image-box .elementor-image-box-title { line-height: 1.3 !important; }
.elementor-widget-icon-box .elementor-icon-box-description,
.elementor-widget-image-box .elementor-image-box-description { line-height: var(--text-body-line) !important; }

/* --- 3. Кольори тексту: чорнило замість сірих #292929/#222931/#5f656d ----- */
.elementor-widget-heading .elementor-heading-title { color: var(--foreground) !important; }
.elementor-widget-text-editor { color: var(--secondary-foreground) !important; }
.elementor-widget-icon-box .elementor-icon-box-title,
.elementor-widget-image-box .elementor-image-box-title { color: var(--foreground) !important; }
.elementor-widget-icon-box .elementor-icon-box-description,
.elementor-widget-image-box .elementor-image-box-description { color: var(--secondary-foreground) !important; }

/* лінки в контенті → гарячий акцент (дрібний помаранч на білому = heat-text) */
.elementor-widget-text-editor a,
.elementor-widget-icon-box a:not(.elementor-button),
.elementor-widget-image-box a:not(.elementor-button) { color: var(--heat-text) !important; }
.elementor-widget-text-editor a:hover,
.elementor-widget-icon-box a:not(.elementor-button):hover,
.elementor-widget-image-box a:not(.elementor-button):hover { color: var(--heat-600) !important; }

/* --- 4. Кнопки .elementor-button → вигляд btn-primary «Гарт» -------------- */
.elementor-widget-button .elementor-button {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  min-height: var(--control-h-s);
  padding: 10px var(--space-6) !important;
  background-color: var(--heat) !important;
  color: var(--foreground) !important;            /* чорнило на помаранчі, AA ✓ */
  font-size: var(--text-small-size) !important;
  font-weight: 700 !important;
  letter-spacing: .05em !important;
  text-transform: uppercase;
  border: 2px solid transparent !important;
  border-radius: var(--radius-xs) !important;
  box-shadow: none !important;
  transition: background var(--dur) var(--ease), color var(--dur) var(--ease);
}
.elementor-widget-button .elementor-button:hover,
.elementor-widget-button .elementor-button:focus {
  background-color: var(--steel-900) !important;
  color: var(--steel-foreground) !important;
}
.elementor-widget-button .elementor-button:focus-visible {
  outline: var(--ring-w) solid var(--focus); outline-offset: var(--ring-offset);
}

/* --- 5. CF7-форми (ф.5 «Контакти» + ф.4802 SweetAlert-попап) → поля ДС ----- */
/* Базове поле (текст/тел/емейл/селект/текстерія): висота --control-h,
   папір, гострий кут --radius-xs, чорнило. Спільні правила і для попапа. */
.elementor-widget-contact-form-7 .wpcf7 .wpcf7-form-control:not(.wpcf7-submit),
.swal2-popup .wpcf7 .wpcf7-form-control:not(.wpcf7-submit) {
  display: block; width: 100%;
  min-height: var(--control-h);
  padding: 0 var(--space-4);
  background-color: var(--background) !important;
  border: 1px solid var(--border-strong) !important;
  border-radius: var(--radius-xs) !important;
  color: var(--foreground) !important;
  font-family: var(--font-sans) !important;
  font-size: var(--text-body-size);
  transition: border-color var(--dur) var(--ease);
}
.elementor-widget-contact-form-7 .wpcf7 .wpcf7-form-control:not(.wpcf7-submit)::placeholder,
.swal2-popup .wpcf7 .wpcf7-form-control:not(.wpcf7-submit)::placeholder {
  color: var(--muted-foreground);
}
.elementor-widget-contact-form-7 .wpcf7 .wpcf7-form-control:not(.wpcf7-submit):hover,
.swal2-popup .wpcf7 .wpcf7-form-control:not(.wpcf7-submit):hover {
  border-color: var(--steel-400) !important;
}
.elementor-widget-contact-form-7 .wpcf7 .wpcf7-form-control:not(.wpcf7-submit):focus,
.swal2-popup .wpcf7 .wpcf7-form-control:not(.wpcf7-submit):focus {
  background-color: var(--background) !important;
  border-color: var(--heat-600) !important;
  outline: var(--ring-w) solid var(--focus); outline-offset: 1px;
}
/* Текстерія: багаторядкова — власні вертикальні відступи й розумна висота */
.elementor-widget-contact-form-7 .wpcf7 textarea.wpcf7-form-control:not(.wpcf7-submit),
.swal2-popup .wpcf7 textarea.wpcf7-form-control:not(.wpcf7-submit) {
  height: 160px; min-height: 120px;
  padding: var(--space-3) var(--space-4);
  line-height: var(--text-body-line);
  resize: vertical;
}
/* Селект: гасимо OS-хром, свій шеврон (інлайн-SVG у --muted-foreground #67737F).
   background-image не конфліктує з background-color базового правила;
   безпечно для Firefox (appearance:none + фонове зображення). */
.elementor-widget-contact-form-7 .wpcf7 select.wpcf7-form-control:not(.wpcf7-submit),
.swal2-popup .wpcf7 select.wpcf7-form-control:not(.wpcf7-submit) {
  appearance: none; -webkit-appearance: none; -moz-appearance: none;
  padding-right: calc(var(--space-4) + var(--icon-s) + var(--space-3));
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2367737F' stroke-width='1.75' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right var(--space-4) center;
  background-size: var(--icon-s) var(--icon-s);
  cursor: pointer;
  text-overflow: ellipsis;
}
.elementor-widget-contact-form-7 .wpcf7 select.wpcf7-form-control::-ms-expand { display: none; }
.elementor-widget-contact-form-7 .wpcf7 select.wpcf7-form-control option {
  color: var(--foreground); background-color: var(--background); font-weight: 400;
}
/* Лейбли: <br> зі старої розмітки геть; підпис — small/700, зірочка — danger */
.elementor-widget-contact-form-7 .wpcf7 label br { display: none; }
.elementor-widget-contact-form-7 .wpcf7 .label-text {
  display: block;
  font-size: var(--text-small-size); font-weight: 700; line-height: var(--text-small-line);
  color: var(--foreground);
  margin-bottom: var(--space-2);
}
.elementor-widget-contact-form-7 .wpcf7 .reqired_icon { color: var(--danger-text); }
.elementor-widget-contact-form-7 .wpcf7 .wpcf7-form-control-wrap { display: block; }
/* Ритм рядів: рівний вертикальний відступ між полями */
.elementor-widget-contact-form-7 .wpcf7 .row p { margin: 0 0 var(--space-4); }
/* Валідація: поле + текст помилки в семантиці ДС */
.elementor-widget-contact-form-7 .wpcf7 .wpcf7-form-control.wpcf7-not-valid,
.swal2-popup .wpcf7 .wpcf7-form-control.wpcf7-not-valid {
  border-color: var(--danger) !important;
  background-color: var(--danger-soft) !important;
}
.elementor-widget-contact-form-7 .wpcf7 .wpcf7-not-valid-tip,
.swal2-popup .wpcf7 .wpcf7-not-valid-tip {
  font-size: var(--text-caption-size); line-height: var(--text-caption-line);
  color: var(--danger-text);
  margin-top: var(--space-2);
}
.elementor-widget-contact-form-7 .wpcf7 .wpcf7-response-output {
  margin: var(--space-4) 0 0;
  padding: var(--space-3) var(--space-4);
  border: 1px solid var(--border-strong); border-radius: var(--radius-xs);
  font-size: var(--text-small-size);
}
.elementor-widget-contact-form-7 .wpcf7 form.invalid .wpcf7-response-output,
.elementor-widget-contact-form-7 .wpcf7 form.failed .wpcf7-response-output {
  border-color: var(--danger); background-color: var(--danger-soft); color: var(--danger-text);
}
.elementor-widget-contact-form-7 .wpcf7 form.sent .wpcf7-response-output {
  border-color: var(--success); background-color: var(--success-soft); color: var(--success-text);
}
.elementor-widget-contact-form-7 .wpcf7 input.wpcf7-submit {
  background-color: var(--heat) !important;
  color: var(--foreground) !important;
  font-family: var(--font-sans) !important;
  font-size: var(--text-small-size) !important;
  font-weight: 700 !important;
  letter-spacing: .05em !important; text-transform: uppercase;
  border: 2px solid transparent !important;
  border-radius: var(--radius-xs) !important;
  min-height: var(--control-h);
  cursor: pointer;
  transition: background-color var(--dur) var(--ease), color var(--dur) var(--ease);
}
.elementor-widget-contact-form-7 .wpcf7 input.wpcf7-submit:hover,
.elementor-widget-contact-form-7 .wpcf7 input.wpcf7-submit:focus {
  background-color: var(--steel-900) !important;
  color: var(--steel-foreground) !important;
}
.elementor-widget-contact-form-7 .wpcf7 input.wpcf7-submit:focus-visible {
  outline: var(--ring-w) solid var(--focus); outline-offset: var(--ring-offset);
}

/* --- 6. Точкові фони старої ДС → поверхні «Гарт» --------------------------- */
/* «Про нас»: світло-сірі секції #f5f6f6 → --surface */
body:not(.home) .elementor-element.elementor-element-7331fdb:not(.elementor-motion-effects-element-type-background),
body:not(.home) .elementor-element.elementor-element-fb9477e:not(.elementor-motion-effects-element-type-background) {
  background-color: var(--surface) !important;
}
/* «Про нас», темна CTA-секція: чорна лесіровка rgba(0,0,0,.91) → відтінок steel-950 */
body:not(.home) .elementor-element.elementor-element-e558817 > .elementor-background-overlay {
  background-color: color-mix(in srgb, var(--steel-950) 92%, transparent) !important;
}
/* заголовки в темній CTA: дефолтний (був kit-primary) → heat-on-dark, AAA на темному */
body:not(.home) .elementor-element.elementor-element-e558817 .elementor-heading-title {
  color: var(--heat-on-dark) !important;
}
/* оверлайн CTA лишається білим, текст — світлий приглушений */
body:not(.home) .elementor-element.elementor-element-47158aa .elementor-heading-title {
  color: var(--steel-foreground) !important;
}
body:not(.home) .elementor-widget-text-editor.elementor-element-b8d840e {
  color: var(--steel-muted-foreground) !important;
}
/* «Контакти»: сірі кола іконок #cecfd0 → воронована сталь */
body:not(.home) .elementor-element.elementor-element-4b74f95.elementor-view-stacked .elementor-icon,
body:not(.home) .elementor-element.elementor-element-ea7c158.elementor-view-stacked .elementor-icon,
body:not(.home) .elementor-element.elementor-element-5680a3e.elementor-view-stacked .elementor-icon {
  background-color: var(--steel-900) !important;
}
/* «Чорний метал»: двотонна декоративна плашка під заголовком —
   друга половина була var(--e-global-color-text) (#7A7A7A), після ремапу
   стала б чорнилом; повертаємо світлу нейтраль, щоб чорнильний заголовок читався */
body:not(.home) .elementor-element.elementor-element-6561e58 > .elementor-widget-container {
  background-image: linear-gradient(107deg, var(--background) 34%, var(--muted-2) 0%) !important;
}

/* Сторінки продуктів (діти «Каталогу» 4071): контент починався впритул до
   хедера і закінчувався впритул до футера — старі секції без вертикальних падінгів */
body.parent-pageid-4071 .elementor {
  padding-top: var(--space-12);
  padding-bottom: var(--space-16);
}

/* --- 7. Обгортки: карта і таблиці ----------------------------------------- */
.elementor-widget-google_maps iframe { display: block; filter: grayscale(.15); }
.elementor-widget-wp-widget-block { overflow-x: auto; } /* широкі TablePress-прайси */
