/*
 Theme Name:        Assembly Child Theme
 Theme URI:         https://assembly.axiomthemes.com/
 Description:       Assembly is a Premium WordPress theme that has built-in support for popular Page Builders, slider with swipe gestures, and is SEO- and Retina-ready. The unique system of inheritance and override options allows setting up individual parameters for different sections of your site and supported plugins.
 Author:            AxiomThemes
 Author URI:        https://axiomthemes.com/
 Template:          assembly
 Version:           1.4
 Tested up to:      6.7
 Requires at least: 5.5
 Requires PHP:      7.4
 License:           GNU General Public License v2 or later
 License URI:       http://www.gnu.org/licenses/gpl-2.0.html
 Tags:              flexible-header, custom-background, custom-colors, custom-header, custom-menu, featured-image-header, featured-images, full-width-template, microformats, post-formats, theme-options, threaded-comments, translation-ready
 Text Domain:       assembly
*/


/* =Child-Theme customization starts here
------------------------------------------------------------ */

/* =========================================================================
 * SEKCJA „JAK ZOSTAĆ PARTNEREM ZEWNĘTRZNYM”  (strona główna)
 *
 * Odwzorowanie kitu z pliku projektowego „Grow4U — System i sekcje”
 * (Claude Design). Wartości są jego, nie wymyślone:
 *
 *   Ink        #0A0A0D   tło sekcji
 *   Ink card   #0F0F14   karta kroku, hover #14141A
 *   Border     #22222B   włosowa linia siatki (dark)
 *   Akcent     #4F4FEE   numer kroku i CTA, hover #3A3ADB
 *   Muted      #9AA0AA   tekst opisu
 *   Eyebrow    #5F6672   nadtytuł mono
 *   siatka     max-width 1280px, gutter clamp(20px, 4vw, 48px)
 *   sekcja     padding clamp(72px, 9vw, 132px) 0
 *   promień    0 — kit nie ma zaokrągleń nigdzie
 *
 * Siatka kart jest zbudowana tak jak wzorzec „04 / Karty 01–03”: gap 1px na
 * tle w kolorze obramowania, więc linie między kartami są włosowe i nie ma
 * podwójnych krawędzi. `minmax(340px, 1fr)` daje przy 1280 px trzy kolumny,
 * czyli 3 × 2 dla sześciu kroków — równy blok, nie 4 + 2.
 * ========================================================================= */

.g4up-process {
	--g4up-ink: #0A0A0D;
	--g4up-card: #0F0F14;
	--g4up-card-hover: #14141A;
	--g4up-border: #22222B;
	--g4up-rule: #1E1E25;
	--g4up-accent: #4F4FEE;
	--g4up-accent-hover: #3A3ADB;
	--g4up-white: #FFFFFF;
	--g4up-muted: #9AA0AA;
	--g4up-eyebrow: #5F6672;
	--g4up-mono: ui-monospace, "DejaVu Sans Mono", SFMono-Regular, Menlo, monospace;
	--g4up-head: "Montserrat", "Liberation Sans", sans-serif;

	box-sizing: border-box;
	padding: clamp(72px, 9vw, 132px) clamp(20px, 4vw, 48px);
	background: var(--g4up-ink);
	color: var(--g4up-white);
	font-family: "DM Sans", "Liberation Sans", Arial, sans-serif;
}

.g4up-process *,
.g4up-process *::before,
.g4up-process *::after { box-sizing: border-box; }

.g4up-process__inner {
	max-width: 1280px;
	margin: 0 auto;
	display: flex;
	flex-direction: column;
	gap: clamp(36px, 4vw, 58px);
}

/* Nagłówek sekcji — wzorzec „03 / Nagłówek sekcji + intro”: etykieta i H2
   po lewej, akapit wprowadzający po prawej. */
.g4up-process__head {
	display: grid;
	gap: clamp(24px, 5vw, 72px);
	grid-template-columns: repeat(auto-fit, minmax(320px, 1fr));
}

.g4up-process__intro-left {
	display: flex;
	flex-direction: column;
	gap: 18px;
}

.g4up-eyebrow {
	font-family: var(--g4up-mono);
	font-size: 12px;
	letter-spacing: .24em;
	text-transform: uppercase;
	color: var(--g4up-eyebrow);
}

.g4up-process__title {
	margin: 0;
	font-family: var(--g4up-head);
	font-size: clamp(30px, 3.6vw, 52px);
	font-weight: 700;
	line-height: 1.06;
	letter-spacing: -0.025em;
	color: var(--g4up-white);
	text-wrap: balance;
}

.g4up-process__intro-right p {
	margin: 0;
	font-size: 17px;
	line-height: 1.62;
	color: var(--g4up-muted);
	text-wrap: pretty;
}

/* Wyróżnienia zawsze półgrubym białym, nigdy kolorem — zasada z kitu. */
.g4up-process__intro-right strong {
	font-weight: 700;
	color: var(--g4up-white);
}

.g4up-link {
	color: var(--g4up-white);
	text-decoration: none;
	border-bottom: 1px solid var(--g4up-accent);
}

.g4up-link:hover,
.g4up-link:focus-visible { color: var(--g4up-accent); }

/* Karty kroków — wzorzec „04 / Karty 01–03”. */
.g4up-process__steps {
	display: grid;
	gap: 1px;
	background: var(--g4up-border);
	grid-template-columns: repeat(auto-fit, minmax(340px, 1fr));
	margin: 0;
	padding: 0;
	list-style: none;
}

.g4up-step {
	background: var(--g4up-card);
	padding: clamp(30px, 3vw, 48px);
	display: flex;
	flex-direction: column;
	gap: 20px;
	transition: background-color .2s ease;
}

.g4up-step:hover { background: var(--g4up-card-hover); }

.g4up-step__number {
	font-family: var(--g4up-mono);
	font-size: 40px;
	font-weight: 500;
	line-height: 1;
	color: var(--g4up-accent);
	font-variant-numeric: tabular-nums;
}

.g4up-step__title {
	margin: 0;
	font-family: var(--g4up-head);
	font-size: 21px;
	font-weight: 700;
	line-height: 1.25;
	letter-spacing: -0.01em;
	color: var(--g4up-white);
}

.g4up-step__body {
	margin: 0;
	font-size: 15.5px;
	line-height: 1.65;
	color: var(--g4up-muted);
	text-wrap: pretty;
}

/* CTA — sylwetka przycisku z kitu: prostokąt, wersaliki, rozstrzelone litery. */
.g4up-process__action { margin: 0; }

.g4up-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 19px 34px;
	background: var(--g4up-accent);
	color: var(--g4up-white);
	font-size: 12.5px;
	font-weight: 700;
	letter-spacing: .14em;
	text-transform: uppercase;
	text-decoration: none;
	border: 0;
	border-radius: 0;
	transition: background-color .2s ease;
}

.g4up-button:hover,
.g4up-button:focus-visible {
	background: var(--g4up-accent-hover);
	color: var(--g4up-white);
}

@media (prefers-reduced-motion: reduce) {
	.g4up-step,
	.g4up-button { transition: none; }
}

/* =========================================================================
 * ZAMÓWIENIE (CHECKOUT) — POPRAWKI CZYTELNOŚCI
 *
 * DLACZEGO SELEKTORY SĄ TAK ROZBUDOWANE. Kolory na tej stronie narzuca
 * „Dodatkowy CSS" z Kustomizera (`wp-custom-css`), regułami zakotwiczonymi
 * w identyfikatorze wpisu i oznaczonymi `!important`, m.in.:
 *
 *   #post-64669 .woocommerce-checkout span    { color: #000 !important }
 *   #post-64669 #payment p                    { color: #fff !important }
 *   #post-64669 #payment .payment_box p       { color: #fff !important }
 *
 * Są za szerokie: pierwsza trafia w każdy `span` na stronie (także w „zł"),
 * dwie kolejne w każdy akapit w bloku płatności (także w tekst wtyczki Tpay,
 * która rysuje go na BIAŁYM panelu). Selektor z identyfikatorem wygrywa
 * z dowolną liczbą klas, więc żeby to odwrócić, trzeba mieć co najmniej tyle
 * samo identyfikatorów i więcej klas — stąd długość poniższych reguł.
 *
 * Używamy `#order_review` i `#payment`, bo to identyfikatory z rdzenia
 * WooCommerce, takie same na każdej instalacji. `#post-64669` jest numerem
 * wpisu i na produkcji jest inny, więc nie wolno się na nim opierać.
 *
 * DOCELOWO te reguły powinny zniknąć razem z zawężeniem tamtych trzech
 * selektorów w Kustomizerze. Dopóki tam zostaną, ten plik je równoważy.
 * ========================================================================= */

/* --- 1. Symbol waluty w podsumowaniu -------------------------------------
 * Kwota jest biała na ciemnej kolumnie, a „zł" dostawało `color:#000` z reguły
 * celującej we wszystkie `span`. `inherit` wiąże symbol z kwotą na stałe —
 * cokolwiek stanie się z kolorem kwoty, symbol pójdzie za nim.
 */
#order_review .woocommerce-Price-amount .woocommerce-Price-currencySymbol {
	color: inherit !important;
}

/* --- 2. Zgoda na regulamin Tpay ------------------------------------------
 * Tpay rysuje „Płacąc, akceptujesz warunki i postanowienia" na własnym, BIAŁYM
 * panelu wyboru banku i sam nadaje temu czytelny kolor (#676986). Reguła
 * `#payment p{color:#fff}` z Kustomizera zamalowywała to na biało — czyli
 * na niewidoczne. Link ma własny kolor i zostaje bez zmian.
 */
#order_review #payment .payment_box .tpay-accept-conditions p {
	color: #000 !important;
}

/* --- 3. Kupon rabatowy ---------------------------------------------------
 * Komunikat stoi nad formularzem, bo WooCommerce renderuje go POZA
 * `<form class="checkout">` — formularz kuponu jest osobnym formularzem,
 * a formularzy nie wolno zagnieżdżać (przeglądarka usunęłaby wewnętrzny,
 * a przycisk „Zastosuj" wysyłałby całe zamówienie). Zamiast go przenosić,
 * robimy z niego wyraźny, zamknięty blok zamiast sierotki nad stroną.
 *
 * Link był biały na białym tle — dziedziczył `--theme-color-text_dark`,
 * które w tym schemacie jest białe.
 */
.woocommerce-checkout .woocommerce-form-coupon-toggle {
	margin: 0 0 28px;
}

.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info {
	display: block;
	padding: 14px 18px;
	border: 1px solid rgba(0, 0, 0, .18);
	background: rgba(0, 0, 0, .03);
	color: #000;
	text-align: left;
	font-size: 15px;
	line-height: 1.5;
}

.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info::before {
	content: none;
}

.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info a.showcoupon {
	color: var(--theme-color-text_link);
	text-decoration: underline;
	font-weight: 600;
}

.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info a.showcoupon:hover,
.woocommerce-checkout .woocommerce-form-coupon-toggle .woocommerce-info a.showcoupon:focus-visible {
	color: var(--theme-color-text_hover);
}

/* Sam formularz kuponu po rozwinięciu — żeby nie odstawał od reszty. */
.woocommerce-checkout form.checkout_coupon {
	margin: 0 0 28px;
	padding: 18px;
	border: 1px solid rgba(0, 0, 0, .18);
	background: rgba(0, 0, 0, .03);
}

/* --- 4. Pole kodu rabatowego i komunikat o błędzie ------------------------
 * Dwie osobne usterki w jednym miejscu.
 *
 * POLE: tekst dziedziczył jasnoszary `#c9ced3` z ciemnego schematu motywu,
 * a formularz kuponu stoi na jasnym tle — czyli jasne na jasnym. Reguła
 * z Kustomizera, która rozjaśnia tła i czerni tekst pozostałych pól, celuje
 * w `.form-row input[type="text"]`, a pole kuponu w żadnym `.form-row` nie
 * siedzi, więc je omijała.
 *
 * KOMUNIKAT: motyw nadrzędny ustawia mu
 *     position:absolute; z-index:9; top:50%; left:50%; translate(-50%,-50%)
 * czyli kładzie go DOKŁADNIE NA POLU. To nie jest drobiazg kosmetyczny:
 * WooCommerce kasuje ten komunikat dopiero przy zdarzeniu `input` na polu
 * kodu (`remove_coupon_error`), a skoro komunikat zasłania pole i przechwytuje
 * kliknięcia, nie da się w nim nic wpisać — błąd zostaje na ekranie na zawsze
 * i nie ma go czym zamknąć. Przenosimy go pod pole i odbieramy mu zdolność
 * łapania kliknięć, żeby ta pętla nie mogła się powtórzyć.
 */

.woocommerce form.checkout_coupon .cart-coupon-inner input.input-text {
	background-color: #fff;
	color: #000;
	border: 1px solid rgba(0, 0, 0, .3);
}

.woocommerce form.checkout_coupon .cart-coupon-inner input.input-text::placeholder {
	color: #777;
	opacity: 1;
}

/* Zdanie „Jeśli masz kod rabatowy…" powtarza to, co mówi przełącznik wyżej,
   a zajmuje miejsce potrzebne na komunikat o błędzie. */
.woocommerce form.checkout_coupon > p {
	display: none;
}

.woocommerce form.checkout_coupon {
	padding-bottom: 52px;
}

.woocommerce form.checkout_coupon .coupon-error-notice {
	top: calc(100% + 8px);
	left: 0;
	right: auto;
	transform: none;
	width: 100%;
	max-width: none;
	/* Motyw rysuje to jako plakietkę-dymek: `width: max-content`, ciemne tło
	   i wyśrodkowanie NA polu. Zamieniamy ją na zwykłą linijkę błędu pod
	   polem — bez tła, bo karta kuponu jest jasna. */
	padding: 0;
	background-color: transparent;
	color: #b32d2e;
	text-align: left;
	font-size: 14px;
	line-height: 1.4;
	/* Nawet gdyby kiedyś znów wylądował na polu — nie zablokuje go. */
	pointer-events: none;
}