/*
Theme Name: Transmax Child
Author: WebGeniusLab
Author URI: http://webgeniuslab.net
Description: -
Version: 1.1
Template: transmax
Text Domain: transmax-child
*/

/* new */
body .primary-nav>ul>li>a{
padding: 0 20px;
}

#main{
	padding: 40px 0 0!important;
}
.page-id-9685 #main{
	padding: 40px 0 0!important;
}

figcaption.wp-caption-text.gallery-caption{
    display: none;
}

h1{
    font-size: 36px;
}
h2{
    font-size: 30px;
}
h3{
    font-size: 24px;
}
h4{
    font-size: 20px;
}
h5{
    font-size: 18px;
    font-weight: 500;
}
h6{
    font-size: 18px;
    font-weight: 500;
}

body,p{
	font-size: 18px;
}

.height-100{
	height: 100%;
}
.height-100 .elementor-widget-container{
	height: 100%;
	display: flex;
	align-items: flex-end;
}
.height-100 .elementor-widget-container .wgl-service_description{
	min-height: 270px;
}
.height-100 .elementor-widget-container .wgl-service-1 .wgl-service_title{
	min-height: 85px;
}

.acceptance-fild label{
	font-size: 12px;
	line-height: 18px;
}

.elementor-kit-5665 .site-main h2 {
    font-size: 36px;
    line-height: 40px;
    margin-bottom: 16px;
}

.elementor-kit-5665 .site-main h3 {
    font-size: 30px;
    line-height: 34px;
    margin-bottom: 12px;
}

/* header in woocommerce shop */
.wgl-theme-header .header_search-field, .primary-nav ul li ul, .primary-nav ul li div.mega-menu-container, .wgl-theme-header .woo_mini_cart, .wpml-ls-legacy-dropdown .wpml-ls-current-language .wpml-ls-sub-menu{
	color: 020202;
}

.theme-transmax.woocommerce.woocommerce-page .page-header{
	min-height: 0 !important;
    margin-bottom: 40px !important;
    padding-top: 100px !important;
    padding-bottom: 0 !important;
    background: #222328;
}

.theme-transmax.woocommerce.woocommerce-page .page-header_content .page-header_title{
		display: none;
}

.theme-transmax.woocommerce.woocommerce-page .page-header.breadcrumbs_inline .page-header_content .page-header_breadcrumbs{
	position: relative;
  top: 60px;
}
.theme-transmax.woocommerce.woocommerce-page .page-header.breadcrumbs_inline .page-header_content .page-header_breadcrumbs .breadcrumbs>a{
	color: #202020;
}

.theme-transmax.woocommerce.woocommerce-page .page-header.breadcrumbs_inline .page-header_content .page-header_breadcrumbs .divider:not(:last-child){
	color: #202020;
}


@media only screen and (max-width: 1200px) {
    .theme-transmax.woocommerce.woocommerce-page .page-header {
        padding-top: 30px !important;
				background: #ffffff !important;
		    margin-bottom: 0 !important;
    }
		.theme-transmax.woocommerce.woocommerce-page .page-header:before{
				background: #ffffff;
		}
		.theme-transmax.woocommerce.woocommerce-page .page-header.breadcrumbs_inline .page-header_content .page-header_breadcrumbs{
		  top: 0;
		}

        .page-id-9685 #main{
	       padding: 0!important;
        }
}

/* woocommerce page shop */
.woocommerce .woocommerce-ordering, .woocommerce-page .woocommerce-ordering,
.woocommerce .woocommerce-result-count, .woocommerce-page .woocommerce-result-count{
	display: none;
}

div.wgl-products div.product .picture img.attachment-shop_catalog{
	display: none;
}

/* woocommerce page product */
.woocommerce .summary .product_meta,
.woocommerce.single div.product .woocommerce-tabs ul.tabs li.reviews_tab{
	display: none;
}
.woocommerce div.product .button.button-link-anfragen{
	margin-left: 10px;
	text-transform: uppercase;
}
.woocommerce div.product .button.button-link-not-by{
	margin-left: 0;
	width: 210px;
}
.woocommerce div.product .button.button-link-anfragen::before{
	content: none;
}
.woocommerce div.product .button.button-link-anfragen:hover{
	background-color: var(--transmax-button-bg-color-hover);
  border-color: var(--transmax-button-bg-color-hover);
}

/* woocommerce page thankyou-order */
.woocommerce ul.order_details.woocommerce-thankyou-order-details {
        background-color: #ffffff!important;
    }

@media (min-width: 600px) {
    .woocommerce ul.order_details.woocommerce-thankyou-order-details {
        padding-left: 230px!important;
    }
	.woocommerce ul.order_details.woocommerce-thankyou-order-details li.woocommerce-order-overview__order {
        width: 188px!important;
    }
}

/* paypal-banner */
.paypal-banner {
  display: flex;
  align-items: center;
  gap: 14px;

  padding: 10px 14px;
  border: 1px solid #59b7d6;     /* блакитна рамка як на прикладі */
  background: #fff;

  font-family: Arial, Helvetica, sans-serif;
  line-height: 1.2;
}

.paypal-banner__logo {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
}

.paypal-banner__logo img {
  height: 26px;
  width: auto;
  display: block;
}

.paypal-banner__text {
  flex: 1 1 auto;
  min-width: 0;
}

.paypal-banner__headline {
  font-size: 14px;
  font-weight: 700;
  color: #0070ba;
  margin-bottom: 2px;
}

.paypal-banner__subline {
  font-size: 13px;
	color: #0070ba;
}

/* --------------------------------------------------------------------------
   Товари в каталозі: страховка від «порожнього магазину»

   ПРОБЛЕМА (скарга замовника й SEO-спеціаліста, відтворено 02.09.2026 на
   проді й на локалці): на /container-shop/ і на сторінках категорій товари
   не показуються, а після F5 з'являються.

   МЕХАНІЗМ. Батьківська тема ставить товарам opacity:0 і показує їх лише
   тоді, коли її скрипт додасть клас .animate:
     - `wglScrollAnimation()` викликається на DOMContentLoaded (theme.js);
     - усередині AnimOnScroll._init стоїть
         imagesLoaded( this.el, this._imgLoaded(self) )
       — це ВИКЛИК функції, а не передача колбека, тож перевірка «чи товар
       у в'юпорті» відбувається негайно, ще до того, як картинки задали
       розкладку. Не влучив — товар лишається прозорим до першого скролу.
     - зверху накладається WP Rocket «Delay JavaScript execution»: до першої
       взаємодії theme-addons.js взагалі не виконується (перевірено —
       `typeof window.wglScrollAnimation === 'undefined'` через 9 с після
       завантаження). Тобто без руху миші магазин порожній.
   Після F5 усе приїжджає з кешу браузера, розкладка готова вчасно — і саме
   тому баг здавався невідтворюваним.

   РІШЕННЯ. Чистий CSS, без JS: якщо через 1.2 с клас .animate так і не
   з'явився, товар проявляється сам. Щойно скрипт спрацює, селектор
   :not(.animate) перестає діяти й програється штатна анімація появи.
   Батьківську тему й плагіни не чіпаємо (правило проєкту).

   ⚠️ Затримку не зменшувати нижче ~1 с: у нормальному сценарії скрипт має
   встигнути першим, інакше товар з'явиться двічі — спершу від фолбека,
   потім від штатної анімації.
   -------------------------------------------------------------------------- */
@keyframes coinProductsFallbackIn {
	from { opacity: 0; }
	to   { opacity: 1; }
}

.wgl-products.appear-animation .product:not(.animate) {
	animation: coinProductsFallbackIn .45s ease 1.2s forwards;
}

/* Прибрана анімація в системі — показуємо одразу, без очікування скрипта */
@media (prefers-reduced-motion: reduce) {
	.wgl-products.appear-animation .product:not(.animate) {
		animation-delay: 0s;
		animation-duration: .01s;
	}
}