/*
Theme Name: FUTIX
Theme URI: https://futix.co.il
Description: ערכת הילד של FUTIX, מבוססת Twenty Twenty-Five. הטוקנים לפי design.md סעיף 3.1.
Author: FUTIX
Template: twentytwentyfive
Version: 0.1.0
Requires at least: 6.7
Requires PHP: 8.2
License: GNU General Public License v2 or later
License URI: http://www.gnu.org/licenses/gpl-2.0.html
Text Domain: futix-theme
Tags: rtl-language-support, full-site-editing
*/

/* ==========================================================================
   שכבה 2: משמעות
   מפנה רק לטוקני הבסיס מ-theme.json (--wp--preset--*, --wp--custom--*).
   ========================================================================== */

:root {
	--color-bg: var(--wp--preset--color--navy-950);
	--color-surface: var(--wp--preset--color--navy-800);
	--color-surface-raised: var(--wp--preset--color--navy-700);
	--color-surface-light: var(--wp--preset--color--ice-50);
	--color-border: var(--wp--preset--color--navy-600);

	--color-text: var(--wp--preset--color--white);
	--color-text-secondary: var(--wp--preset--color--ice-200);
	--color-text-muted: var(--wp--preset--color--ice-400); /* רק על bg או surface */
	--color-text-on-light: var(--wp--preset--color--navy-900);
	--color-text-secondary-on-light: var(--wp--preset--color--slate-500);

	--color-accent: var(--wp--preset--color--turq-400);
	--color-accent-soft: var(--wp--preset--color--turq-500);
	--color-accent-on-light: var(--wp--preset--color--sea-700);

	--color-action: var(--wp--preset--gradient--action);
	--color-on-action: var(--wp--preset--color--navy-900);
	--color-brand: var(--wp--preset--gradient--brand);
	/* גרדיאנט שמתקדם עם כיוון הקריאה: הטורקיז הזוהר בקצה המוביל */
	--color-brand-forward: linear-gradient(to left, var(--wp--preset--color--blue-500), var(--wp--preset--color--turq-400));

	--color-success: var(--wp--preset--color--turq-500);
	--color-error: var(--wp--preset--color--red-400);
	--color-error-on-light: var(--wp--preset--color--red-700);
	--color-warning: var(--wp--preset--color--amber-400);
	--color-focus: var(--wp--preset--color--turq-400);
	--color-input-border: var(--wp--preset--color--slate-400);
	--color-white: var(--wp--preset--color--white);

	--font-heading: var(--wp--preset--font-family--heading);
	--font-body: var(--wp--preset--font-family--body);

	--radius-sm: var(--wp--custom--radius--sm);
	--radius-md: var(--wp--custom--radius--md);
	--radius-lg: var(--wp--custom--radius--lg);
	--radius-full: var(--wp--custom--radius--full);

	--shadow-card: var(--wp--preset--shadow--card);
	--glow: var(--wp--preset--shadow--glow-turq);
	--glow-strong: var(--wp--preset--shadow--glow-turq-strong);

	--duration-fast: var(--wp--custom--duration--fast);
	--duration-base: var(--wp--custom--duration--base);
	--duration-peak: var(--wp--custom--duration--peak);
	--ease-out: var(--wp--custom--ease--out);
	--ease-pop: var(--wp--custom--ease--pop);

	--size-touch: var(--wp--custom--size--touch);
	--size-focus-ring: var(--wp--custom--size--focus-ring);

	/* ======================================================================
	   שכבה 3: רכיבים
	   מפנה רק לטוקני המשמעות שלמעלה.
	   ====================================================================== */

	/* כותרת עליונה: בהירה, כדי שהלוגו הראשי בגרדיאנט ייראה כמו שעוצב (החלטת דין, 07/10/2026) */
	--header-bg: var(--color-white);
	--header-fg: var(--color-text-on-light);
	--header-accent: var(--color-accent-on-light);
	--header-hover-bg: var(--color-surface-light);
	--header-border: var(--color-input-border);

	/* כפתור ראשי */
	--button-primary-bg: var(--color-action);
	--button-primary-fg: var(--color-on-action);
	--button-primary-hover-shadow: var(--glow);
	--button-primary-disabled-bg: var(--color-surface-raised);
	--button-primary-disabled-fg: var(--color-text-muted);
	--button-radius: var(--radius-md);
	--button-min-height: var(--size-touch);
	--button-padding-block: var(--wp--preset--spacing--3);
	--button-padding-inline: var(--wp--preset--spacing--5);
	--button-font-size: var(--wp--preset--font-size--lg);

	/* כפתור משני */
	--button-secondary-border: var(--color-accent);
	--button-secondary-fg: var(--color-text);
	--button-secondary-hover-bg: var(--color-surface-raised);

	/* כרטיס חבילה */
	--package-card-bg: var(--color-surface);
	--package-card-hover-bg: var(--color-surface-raised);
	--package-card-border: var(--color-border);
	--package-card-hover-border: var(--color-accent-soft);
	--package-card-selected-border: var(--color-accent);
	--package-card-selected-shadow: var(--glow);
	--package-card-radius: var(--radius-lg);
	--package-card-shadow: var(--shadow-card);
	--package-card-strip: var(--color-brand);
	--package-card-amount-size: var(--wp--preset--font-size--3-xl);
	--package-card-price-size: var(--wp--preset--font-size--xl);
	--package-card-padding: var(--wp--preset--spacing--5);

	/* פס התקדמות */
	--progress-track-bg: var(--color-surface-raised);
	--progress-track-height: var(--wp--custom--size--progress-track);
	--progress-fill: var(--color-brand-forward);
	--progress-complete-fill: var(--color-accent);
	--progress-complete-shadow: var(--glow-strong);
	--progress-percent-size: var(--wp--preset--font-size--display);
	--progress-percent-color: var(--color-accent);
	--progress-step-size: var(--wp--preset--font-size--lg);
	--progress-step-color: var(--color-text-secondary);

	/* שדה בטופס (על משטח בהיר) */
	--input-bg: var(--color-white);
	--input-border: var(--color-input-border);
	--input-fg: var(--color-text-on-light);
	--input-label-fg: var(--color-text-on-light);
	--input-error: var(--color-error-on-light);
	--input-radius: var(--radius-sm);
	--input-min-height: var(--size-touch);

	/* הודעות מצב */
	--alert-bg: var(--color-surface);
	--alert-success: var(--color-success);
	--alert-error: var(--color-error);
	--alert-warning: var(--color-warning);

	/* שלד טעינה */
	--skeleton-bg: var(--color-surface);
	--skeleton-shine: var(--color-surface-raised);
}

/* ==========================================================================
   בסיס
   ========================================================================== */

body {
	background-color: var(--color-bg);
	color: var(--color-text);
	font-family: var(--font-body);
}

.tabular-nums,
.futix-price,
.futix-amount {
	font-variant-numeric: tabular-nums;
}

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: var(--size-focus-ring) solid var(--color-focus);
	outline-offset: var(--size-focus-ring);
}

/* ==========================================================================
   כפתורים
   ========================================================================== */

.futix-button {
	box-sizing: border-box;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: var(--wp--preset--spacing--2);
	min-block-size: var(--button-min-height);
	padding-block: var(--button-padding-block);
	padding-inline: var(--button-padding-inline);
	border: 0;
	border-radius: var(--button-radius);
	background: var(--button-primary-bg);
	color: var(--button-primary-fg);
	font-family: var(--font-heading);
	font-size: var(--button-font-size);
	font-weight: 700;
	text-decoration: none;
	cursor: pointer;
	transition:
		box-shadow var(--duration-fast) var(--ease-out),
		transform var(--duration-fast) var(--ease-pop);
}

.futix-button:hover {
	box-shadow: var(--button-primary-hover-shadow);
}

.futix-button:active {
	transform: scale(0.97);
}

.futix-button:disabled,
.futix-button[aria-disabled="true"] {
	background: var(--button-primary-disabled-bg);
	color: var(--button-primary-disabled-fg);
	box-shadow: none;
	transform: none;
	cursor: not-allowed;
}

/* מצב טוען: מושבת, עם טקסט, בלי לחיצה כפולה */
.futix-button[aria-busy="true"] {
	cursor: progress;
	pointer-events: none;
	opacity: 0.85;
}

/* גרסה רגועה לקופה: בלי זוהר ובלי תנועה */
.futix-button--calm:hover {
	box-shadow: none;
}

.futix-button--calm:active {
	transform: none;
}

.futix-button--secondary {
	background: transparent;
	color: var(--button-secondary-fg);
	box-shadow: inset 0 0 0 var(--size-focus-ring) var(--button-secondary-border);
}

.futix-button--secondary:hover {
	background: var(--button-secondary-hover-bg);
	box-shadow: inset 0 0 0 var(--size-focus-ring) var(--button-secondary-border);
}

/* ==========================================================================
   כרטיס חבילה
   ========================================================================== */

.futix-package-card {
	position: relative;
	display: flex;
	flex-direction: column;
	gap: var(--wp--preset--spacing--2);
	padding: var(--package-card-padding);
	padding-block-start: calc(var(--package-card-padding) + var(--wp--preset--spacing--1));
	overflow: hidden;
	border: 1px solid var(--package-card-border);
	border-radius: var(--package-card-radius);
	background: var(--package-card-bg);
	box-shadow: var(--package-card-shadow);
	color: var(--color-text);
	text-align: start;
	cursor: pointer;
	transition:
		background-color var(--duration-base) var(--ease-out),
		border-color var(--duration-base) var(--ease-out),
		transform var(--duration-base) var(--ease-out),
		box-shadow var(--duration-base) var(--ease-out);
}

.futix-package-card::before {
	content: "";
	position: absolute;
	inset-block-start: 0;
	inset-inline: 0;
	block-size: var(--wp--preset--spacing--1);
	background: var(--package-card-strip);
}

.futix-package-card:hover {
	background: var(--package-card-hover-bg);
	border-color: var(--package-card-hover-border);
	transform: translateY(-2px);
}

.futix-package-card[aria-checked="true"],
.futix-package-card.is-selected {
	background: var(--package-card-hover-bg);
	border: 2px solid var(--package-card-selected-border);
	box-shadow: var(--package-card-shadow), var(--package-card-selected-shadow);
	transform: scale(1.02);
	transition-duration: var(--duration-peak);
	transition-timing-function: var(--ease-pop);
}

.futix-package-card__check {
	position: absolute;
	inset-block-start: var(--wp--preset--spacing--4);
	inset-inline-end: var(--wp--preset--spacing--4);
	display: none;
	color: var(--package-card-selected-border);
}

.futix-package-card[aria-checked="true"] .futix-package-card__check,
.futix-package-card.is-selected .futix-package-card__check {
	display: block;
}

.futix-package-card__amount {
	margin: 0;
	font-family: var(--font-heading);
	font-size: var(--package-card-amount-size);
	font-weight: 800;
	line-height: 1;
	font-variant-numeric: tabular-nums;
}

.futix-package-card__price {
	margin: 0;
	font-size: var(--package-card-price-size);
	font-weight: 700;
	font-variant-numeric: tabular-nums;
}

.futix-package-card__meta {
	margin: 0;
	color: var(--color-text-secondary);
	font-size: var(--wp--preset--font-size--sm);
}

/* ==========================================================================
   פס התקדמות
   ========================================================================== */

.futix-progress {
	display: grid;
	gap: var(--wp--preset--spacing--3);
}

.futix-progress__percent {
	margin: 0;
	color: var(--progress-percent-color);
	font-family: var(--font-heading);
	font-size: var(--progress-percent-size);
	font-weight: 800;
	line-height: 1;
	font-variant-numeric: tabular-nums;
}

.futix-progress__step {
	margin: 0;
	color: var(--progress-step-color);
	font-size: var(--progress-step-size);
}

.futix-progress__track {
	block-size: var(--progress-track-height);
	overflow: hidden;
	border-radius: var(--radius-full);
	background: var(--progress-track-bg);
}

/* המילוי גדל מימין לשמאל (RTL), דרך scaleX ולא רוחב */
.futix-progress__fill {
	block-size: 100%;
	inline-size: 100%;
	transform: scaleX(var(--progress, 0));
	transform-origin: right center;
	border-radius: inherit;
	background: var(--progress-fill);
	transition: transform var(--duration-peak) var(--ease-out);
}

[dir="ltr"] {
	--color-brand-forward: linear-gradient(to right, var(--wp--preset--color--blue-500), var(--wp--preset--color--turq-400));
}

[dir="ltr"] .futix-progress__fill {
	transform-origin: left center;
}

.futix-progress.is-complete .futix-progress__fill {
	background: var(--progress-complete-fill);
	box-shadow: var(--progress-complete-shadow);
}

/* ==========================================================================
   טפסים (על משטח בהיר)
   ========================================================================== */

.futix-form-surface {
	padding: var(--wp--preset--spacing--5);
	border-radius: var(--radius-lg);
	background: var(--color-surface-light);
	color: var(--color-text-on-light);
}

/* טקסט רגיל בתוך טופס בהיר: כהה, גם כשהטופס בתוך תוכן עמוד */
.futix-form-surface :where(p, li, strong) {
	color: inherit;
}

.futix-field {
	display: grid;
	min-inline-size: 0;
	gap: var(--wp--preset--spacing--2);
}

.futix-field__label {
	color: var(--input-label-fg);
	font-weight: 500;
}

.futix-field__input {
	box-sizing: border-box;
	inline-size: 100%;
	min-inline-size: 0;
	min-block-size: var(--input-min-height);
	padding-inline: var(--wp--preset--spacing--3);
	border: 1px solid var(--input-border);
	border-radius: var(--input-radius);
	background: var(--input-bg);
	color: var(--input-fg);
	font: inherit;
}

.futix-field.has-error .futix-field__input {
	border-color: var(--input-error);
}

.futix-field__error {
	display: flex;
	gap: var(--wp--preset--spacing--2);
	align-items: center;
	margin: 0;
	color: var(--input-error);
	font-size: var(--wp--preset--font-size--sm);
}

/* ==========================================================================
   הודעות מצב (הצלחה, שגיאה, אזהרה)
   ========================================================================== */

.futix-alert {
	display: flex;
	gap: var(--wp--preset--spacing--3);
	align-items: flex-start;
	padding: var(--wp--preset--spacing--4);
	border-inline-start: 4px solid var(--alert-success);
	border-radius: var(--radius-md);
	background: var(--alert-bg);
	color: var(--color-text);
}

.futix-alert__icon {
	flex-shrink: 0;
	color: var(--alert-success);
}

.futix-alert--error {
	border-inline-start-color: var(--alert-error);
}

.futix-alert--error .futix-alert__icon {
	color: var(--alert-error);
}

.futix-alert--warning {
	border-inline-start-color: var(--alert-warning);
}

.futix-alert--warning .futix-alert__icon {
	color: var(--alert-warning);
}

/* ==========================================================================
   שלד טעינה
   ========================================================================== */

.futix-skeleton {
	border-radius: var(--radius-sm);
	background: linear-gradient(90deg, var(--skeleton-bg) 0%, var(--skeleton-shine) 50%, var(--skeleton-bg) 100%);
	background-size: 200% 100%;
	animation: futix-shine 1.4s ease-in-out infinite;
}

@keyframes futix-shine {
	from { background-position: 100% 0; }
	to { background-position: -100% 0; }
}

/* ==========================================================================
   הפחתת תנועה
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}

	.futix-package-card:hover,
	.futix-package-card[aria-checked="true"],
	.futix-package-card.is-selected {
		transform: none;
	}
}

/* ==========================================================================
   כותרת בגרדיאנט המותג (טקסט גדול בלבד)
   ========================================================================== */

.futix-text-brand {
	background: var(--color-brand);
	-webkit-background-clip: text;
	background-clip: text;
	color: transparent;
}

/* ==========================================================================
   מבנה העמוד: כותרת, תפריט, תוכן, פוטר
   ========================================================================== */

.futix-skip {
	position: absolute;
	inset-inline-start: var(--wp--preset--spacing--3);
	inset-block-start: calc(-1 * var(--wp--preset--spacing--9));
	z-index: 100;
	padding: var(--wp--preset--spacing--2) var(--wp--preset--spacing--4);
	border-radius: var(--radius-sm);
	background: var(--color-accent);
	color: var(--color-on-action);
	font-weight: 700;
}

.futix-skip:focus {
	inset-block-start: var(--wp--preset--spacing--3);
}

.futix-header {
	position: sticky;
	inset-block-start: 0;
	z-index: 50;
	border-block-end: 1px solid var(--header-border);
	background: var(--header-bg);
	color: var(--header-fg);
	box-shadow: var(--shadow-card);
}

.futix-header__bar {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--wp--preset--spacing--3);
	max-inline-size: var(--wp--style--global--wide-size);
	margin-inline: auto;
	padding: var(--wp--preset--spacing--3) var(--wp--preset--spacing--4);
}

.futix-header__logo {
	display: inline-flex;
	min-block-size: var(--size-touch);
	align-items: center;
}

.futix-header__logo img {
	inline-size: clamp(6.5rem, 30vw, 8.75rem);
	block-size: auto;
}

.futix-header__actions {
	display: flex;
	align-items: center;
	gap: var(--wp--preset--spacing--1);
	margin-inline-start: auto;
}

.futix-header__icon,
.futix-header__toggle {
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-inline-size: var(--size-touch);
	min-block-size: var(--size-touch);
	padding: 0;
	border: 0;
	border-radius: var(--radius-md);
	background: transparent;
	color: var(--header-fg);
	cursor: pointer;
}

.futix-header__icon:hover,
.futix-header__toggle:hover {
	background: var(--header-hover-bg);
	color: var(--header-accent);
}

.futix-header__count {
	position: absolute;
	inset-block-start: var(--wp--preset--spacing--1);
	inset-inline-end: var(--wp--preset--spacing--1);
	min-inline-size: var(--wp--preset--spacing--4);
	padding-inline: var(--wp--preset--spacing--1);
	border-radius: var(--radius-full);
	background: var(--color-accent);
	color: var(--color-on-action);
	font-size: var(--wp--preset--font-size--sm);
	font-weight: 700;
	line-height: 1.4;
	text-align: center;
}

.futix-header__toggle {
	order: -1;
}

/* תפריט הטלפון: מגירה שנפתחת מצד ימין (בקשת דין, 07/10/2026) */
.futix-nav {
	position: fixed;
	inset-block: 0;
	inset-inline-start: 0;
	z-index: 70;
	display: flex;
	flex-direction: column;
	box-sizing: border-box;
	inline-size: min(85vw, calc(var(--wp--preset--spacing--9) * 3.5));
	padding: var(--wp--preset--spacing--3);
	overflow-y: auto;
	background: var(--header-bg);
	box-shadow: var(--shadow-card);
	transform: translateX(105%);
	visibility: hidden;
	transition: transform var(--duration-base) var(--ease-out), visibility var(--duration-base);
}

[dir="ltr"] .futix-nav {
	transform: translateX(-105%);
}

.futix-nav.is-open {
	transform: none;
	visibility: visible;
	/* נראה מיד בפתיחה, כדי שהפוקוס יוכל לעבור לתוך התפריט */
	transition: transform var(--duration-base) var(--ease-out), visibility 0s;
}

.futix-nav-overlay {
	position: fixed;
	inset: 0;
	z-index: 65;
	background: color-mix(in srgb, var(--wp--preset--color--navy-950) 60%, transparent);
}

.futix-nav__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding-block-end: var(--wp--preset--spacing--2);
	border-block-end: 1px solid var(--header-border);
	margin-block-end: var(--wp--preset--spacing--2);
}

.futix-nav__title {
	color: var(--header-fg);
	font-family: var(--font-heading);
	font-size: var(--wp--preset--font-size--lg);
	font-weight: 700;
}

.futix-nav__close {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-inline-size: var(--size-touch);
	min-block-size: var(--size-touch);
	border: 0;
	border-radius: var(--radius-md);
	background: transparent;
	color: var(--header-fg);
	cursor: pointer;
}

.futix-nav__list {
	display: grid;
	margin: 0;
	padding: 0;
	list-style: none;
}

.futix-nav__list a,
.futix-nav__soon {
	display: flex;
	align-items: center;
	gap: var(--wp--preset--spacing--2);
	min-block-size: var(--size-touch);
	padding-inline: var(--wp--preset--spacing--3);
	border-radius: var(--radius-sm);
	color: var(--header-fg);
	font-family: var(--font-heading);
	font-weight: 500;
	text-decoration: none;
}

.futix-nav__list a:hover {
	background: var(--header-hover-bg);
	color: var(--header-accent);
}

.futix-nav__soon {
	color: var(--color-text-secondary-on-light);
	cursor: default;
}

.futix-header .futix-badge {
	border-color: var(--header-accent);
	color: var(--header-accent);
}

.futix-badge {
	padding: 0 var(--wp--preset--spacing--2);
	border: 1px solid var(--color-accent-soft);
	border-radius: var(--radius-full);
	color: var(--color-accent);
	font-family: var(--font-body);
	font-size: var(--wp--preset--font-size--sm);
}

@media (min-width: 64em) { /* 1024px - משתנים לא עובדים בתוך media query */
	.futix-header__bar {
		flex-wrap: nowrap;
	}

	.futix-header__toggle,
	.futix-nav__mobile-only,
	.futix-nav__head,
	.futix-nav-overlay {
		display: none;
	}

	.futix-nav {
		position: static;
		display: block;
		inline-size: auto;
		padding: 0;
		overflow: visible;
		background: none;
		box-shadow: none;
		transform: none;
		visibility: visible;
		order: 2;
	}

	.futix-header__actions {
		order: 3;
	}

	.futix-nav__list {
		display: flex;
		gap: var(--wp--preset--spacing--1);
	}
}

.futix-main {
	padding: var(--wp--preset--spacing--6) var(--wp--preset--spacing--4) var(--wp--preset--spacing--8);
}

.wp-block-post-title.futix-page-title {
	margin-block-end: var(--wp--preset--spacing--5);
}

.futix-footer {
	border-block-start: 1px solid var(--color-border);
	background: var(--color-bg);
	color: var(--color-text-secondary);
}

.futix-footer__inner {
	display: grid;
	justify-items: center;
	gap: var(--wp--preset--spacing--2);
	max-inline-size: var(--wp--style--global--wide-size);
	margin-inline: auto;
	padding: var(--wp--preset--spacing--6) var(--wp--preset--spacing--4);
	text-align: center;
}

.futix-footer__mark {
	inline-size: var(--wp--preset--spacing--6);
	block-size: auto;
}

.futix-footer__line {
	margin: 0;
}

.futix-lead {
	color: var(--color-text-secondary);
	font-size: var(--wp--preset--font-size--lg);
}

/* ==========================================================================
   ווקומרס: סל וקופה
   הקופה על משטח בהיר, רגועה, בלי זוהר ובלי תנועה (design.md סעיפים 3, 6).
   ========================================================================== */

.futix-header--checkout .futix-header__bar {
	flex-wrap: nowrap;
}

.futix-secure {
	display: inline-flex;
	align-items: center;
	gap: var(--wp--preset--spacing--1);
	margin: 0;
	margin-inline-start: auto;
	color: var(--header-accent);
	font-size: var(--wp--preset--font-size--sm);
	font-weight: 500;
}

.futix-header__back {
	display: inline-flex;
	align-items: center;
	min-block-size: var(--size-touch);
	padding-inline: var(--wp--preset--spacing--2);
	color: var(--header-fg);
	font-size: var(--wp--preset--font-size--sm);
}

.wc-block-checkout {
	padding: var(--wp--preset--spacing--5) var(--wp--preset--spacing--4);
	border-radius: var(--radius-lg);
	background: var(--color-surface-light);
	color: var(--color-text-on-light);
}

.wc-block-checkout :where(h1, h2, h3, h4, legend, label, p, span, div) {
	color: inherit;
}

.wc-block-checkout a {
	color: var(--color-accent-on-light);
}

.wc-block-checkout .wc-block-components-validation-error,
.wc-block-checkout .has-error label,
.wc-block-checkout .wc-block-components-checkbox.has-error .wc-block-components-checkbox__label {
	color: var(--color-error-on-light);
}

.wc-block-checkout .wc-block-components-text-input input,
.wc-block-checkout .wc-blocks-components-select__select {
	border-color: var(--color-input-border);
	background: var(--color-white);
	color: var(--color-text-on-light);
}

.wc-block-checkout .wc-block-components-text-input label,
.wc-block-checkout .wc-block-components-checkbox__label {
	color: var(--color-text-secondary-on-light);
}

.wc-block-checkout .wc-block-components-checkbox .wc-block-components-checkbox__input[type="checkbox"] {
	border-color: var(--color-input-border);
	background: var(--color-white);
}

.wc-block-checkout .wc-block-components-checkout-place-order-button,
.wc-block-checkout .wc-block-components-checkout-place-order-button:hover {
	background: var(--color-action);
	color: var(--color-on-action);
	box-shadow: none;
	transform: none;
}

.wc-block-checkout .wc-block-components-radio-control__option,
.wc-block-checkout .wc-block-components-radio-control-accordion-option {
	color: var(--color-text-on-light);
}

.futix-checkout-main .wc-block-checkout {
	box-sizing: border-box;
	max-inline-size: 100%;
	margin-inline: auto;
}

/* קופה מזמינה בקו של האתר (בקשת דין, 04/11/2026): אותם צבעים, שדות במלבנים מעוגלים, וכל חלק בכרטיס לבן רך. */
.wc-block-checkout .wc-block-components-checkout-step {
	margin-block-end: var(--wp--preset--spacing--4);
	padding: var(--wp--preset--spacing--4);
	border: 1px solid var(--color-input-border);
	border-radius: var(--radius-lg);
	background: var(--color-white);
}

.wc-block-checkout .wc-block-components-checkout-step__heading {
	margin-block-end: var(--wp--preset--spacing--3);
}

/* body + [type]: גובר על הכלל של ווקומרס (input[type="email"] וכו', 4px) */
body .wc-block-checkout .wc-block-components-text-input input[type],
body .wc-block-checkout .wc-blocks-components-select .wc-blocks-components-select__select,
body .wc-block-checkout .wc-block-components-textarea,
body .wc-block-checkout .wc-block-components-totals-coupon__input input[type] {
	border-width: 1.5px;
	border-radius: var(--radius-md);
	transition: border-color var(--duration-fast) var(--ease-out), box-shadow var(--duration-fast) var(--ease-out);
}

body .wc-block-checkout .wc-block-components-text-input input[type]:focus,
body .wc-block-checkout .wc-blocks-components-select .wc-blocks-components-select__select:focus,
body .wc-block-checkout .wc-block-components-textarea:focus,
body .wc-block-checkout .wc-block-components-totals-coupon__input input[type]:focus {
	border-color: var(--color-accent-on-light);
	box-shadow: 0 0 0 3px color-mix(in srgb, var(--color-accent-on-light) 25%, transparent);
	outline: none;
}

body .wc-block-checkout .wc-block-components-checkbox .wc-block-components-checkbox__input[type="checkbox"] {
	border-radius: calc(var(--radius-sm) / 2);
}

.wc-block-checkout .wc-block-components-radio-control__option,
.wc-block-checkout .wc-block-components-radio-control-accordion-option,
.wc-block-checkout .wc-block-components-notice-banner {
	border-radius: var(--radius-md);
}

@media (min-width: 48em) { /* 768px: בטלפון הסיכום נפתח בראש העמוד בעיצוב של ווקומרס */
	.wc-block-checkout__sidebar .wp-block-woocommerce-checkout-order-summary-block {
		border: 1px solid var(--color-input-border);
		border-radius: var(--radius-lg);
		background: var(--color-white);
		overflow: hidden;
	}
}

body .wc-block-checkout .wc-block-components-totals-coupon__button,
body .wc-block-checkout .wc-block-components-checkout-place-order-button {
	border-radius: var(--radius-md);
}

.wc-block-checkout .wc-block-components-checkout-place-order-button {
	min-block-size: calc(var(--size-touch) + var(--wp--preset--spacing--2));
	font-size: var(--wp--preset--font-size--lg);
	font-weight: 700;
}

/* אזור לקוח: פעולה ראשית אחת ("הזמן שוב"), השאר משניות (design.md סעיף 8). */
.woocommerce-orders-table__cell-order-actions .button:not(.futix-reorder, .futix-continue) {
	background: transparent;
	color: var(--color-text);
	box-shadow: inset 0 0 0 var(--size-focus-ring) var(--color-accent);
}

.woocommerce-MyAccount-navigation ul {
	display: flex;
	flex-wrap: wrap;
	gap: var(--wp--preset--spacing--2);
	margin: 0 0 var(--wp--preset--spacing--5);
	padding: 0;
	list-style: none;
}

.woocommerce-MyAccount-navigation a {
	display: inline-flex;
	align-items: center;
	min-block-size: var(--size-touch);
	padding-inline: var(--wp--preset--spacing--3);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-full);
	color: var(--color-text);
	text-decoration: none;
}

.woocommerce-MyAccount-navigation .is-active a {
	border-color: var(--color-accent);
	color: var(--color-accent);
}

/* טפסים קלאסיים של ווקומרס (התחברות, הרשמה, פרטי חשבון) בטוקנים שלנו. */
.woocommerce form .input-text,
.woocommerce form select {
	box-sizing: border-box;
	min-block-size: var(--input-min-height);
	padding-inline: var(--wp--preset--spacing--3);
	border: 1px solid var(--input-border);
	border-radius: var(--input-radius);
	background: var(--input-bg);
	color: var(--input-fg);
}

.woocommerce form .required {
	color: var(--color-error);
	text-decoration: none;
}

.woocommerce form .woocommerce-form-row label,
.woocommerce form .form-row label {
	color: var(--color-text);
}

/* ==========================================================================
   עמוד ראשי
   ========================================================================== */

.futix-home {
	display: grid;
	margin-block-start: 0;
	gap: var(--wp--preset--spacing--8);
	padding-block-end: var(--wp--preset--spacing--8);
}

.futix-hero {
	position: relative;
	display: grid;
	justify-items: center;
	gap: var(--wp--preset--spacing--4);
	padding: var(--wp--preset--spacing--4) var(--wp--preset--spacing--4) var(--wp--preset--spacing--5);
	overflow: hidden;
	text-align: center;
}

/* האור מאחורי הברק: הרגע הרגשי הראשון (design.md סעיף 1). */
.futix-hero__glow {
	position: absolute;
	inset: 0;
	/* שתי שכבות אור שדועכות בעקומה רכה עד אפס, בלי קו קצה (בקשת דין, 07/10/2026) */
	background:
		/* בתחתית: מתכהה בהדרגה לצבע העמוד, בלי קו בסוף האזור */
		linear-gradient(to bottom, transparent 50%, var(--color-bg) 100%),
		radial-gradient(
			ellipse var(--futix-light-w) var(--futix-light-h) at 50% var(--futix-light-y),
			color-mix(in srgb, var(--wp--preset--color--white) 100%, transparent) 0%,
			color-mix(in srgb, var(--wp--preset--color--white) 91%, transparent) 7%,
			color-mix(in srgb, var(--wp--preset--color--white) 78%, transparent) 14%,
			color-mix(in srgb, var(--wp--preset--color--white) 63%, transparent) 21%,
			color-mix(in srgb, var(--wp--preset--color--white) 48%, transparent) 29%,
			color-mix(in srgb, var(--wp--preset--color--white) 35%, transparent) 36%,
			color-mix(in srgb, var(--wp--preset--color--white) 24%, transparent) 43%,
			color-mix(in srgb, var(--wp--preset--color--white) 15%, transparent) 50%,
			color-mix(in srgb, var(--wp--preset--color--white) 9%, transparent) 57%,
			color-mix(in srgb, var(--wp--preset--color--white) 5%, transparent) 64%,
			color-mix(in srgb, var(--wp--preset--color--white) 2%, transparent) 71%,
			color-mix(in srgb, var(--wp--preset--color--white) 1%, transparent) 79%,
			color-mix(in srgb, var(--wp--preset--color--white) 0%, transparent) 86%,
			color-mix(in srgb, var(--wp--preset--color--white) 0%, transparent) 93%,
			color-mix(in srgb, var(--wp--preset--color--white) 0%, transparent) 100%
		),
		radial-gradient(
			ellipse calc(var(--futix-light-w) * 1.6) calc(var(--futix-light-h) * 1.6) at 50% var(--futix-light-y),
			color-mix(in srgb, var(--wp--preset--color--blue-500) 85%, transparent) 0%,
			color-mix(in srgb, var(--wp--preset--color--blue-500) 78%, transparent) 7%,
			color-mix(in srgb, var(--wp--preset--color--blue-500) 69%, transparent) 14%,
			color-mix(in srgb, var(--wp--preset--color--blue-500) 59%, transparent) 21%,
			color-mix(in srgb, var(--wp--preset--color--blue-500) 49%, transparent) 29%,
			color-mix(in srgb, var(--wp--preset--color--blue-500) 39%, transparent) 36%,
			color-mix(in srgb, var(--wp--preset--color--blue-500) 30%, transparent) 43%,
			color-mix(in srgb, var(--wp--preset--color--blue-500) 22%, transparent) 50%,
			color-mix(in srgb, var(--wp--preset--color--blue-500) 15%, transparent) 57%,
			color-mix(in srgb, var(--wp--preset--color--blue-500) 10%, transparent) 64%,
			color-mix(in srgb, var(--wp--preset--color--blue-500) 6%, transparent) 71%,
			color-mix(in srgb, var(--wp--preset--color--blue-500) 3%, transparent) 79%,
			color-mix(in srgb, var(--wp--preset--color--blue-500) 2%, transparent) 86%,
			color-mix(in srgb, var(--wp--preset--color--blue-500) 1%, transparent) 93%,
			color-mix(in srgb, var(--wp--preset--color--blue-500) 0%, transparent) 100%
		);
	pointer-events: none;
}

.futix-hero {
	--futix-light-w: max(calc(var(--wp--preset--spacing--9) * 4.5), 50vw);
	--futix-light-h: calc(var(--wp--preset--spacing--9) * 3.8);
	--futix-light-y: 24%;
}

@media (max-width: 40em) {
	.futix-hero {
		/* רחב בהרבה מהמסך: אין צורה בצדדים, רק התבהרות רכה שדועכת למטה */
		--futix-light-w: 190vw;
		--futix-light-h: calc(var(--wp--preset--spacing--9) * 2.3);
		--futix-light-y: 17%;
	}
}

/* האור מאחורי הסמל: מתבהר לכיוון המרכז, כדי שצבעי הלוגו המקוריים ייראו (בקשת דין, 07/10/2026). */
.futix-hero__mark-wrap {
	position: relative;
	display: grid;
	place-items: center;
	inline-size: clamp(8rem, 36vw, 12rem);
	aspect-ratio: 1;
	margin-block-end: calc(-1 * var(--wp--preset--spacing--3));
}

.futix-hero__mark {
	position: relative;
	inline-size: 62%;
	block-size: auto;
	animation: futix-hero-in calc(var(--duration-peak) * 2) var(--ease-pop) both;
}

@keyframes futix-hero-in {
	from {
		opacity: 0;
		transform: scale(0.8) translateY(var(--wp--preset--spacing--3));
	}
	to {
		opacity: 1;
		transform: none;
	}
}

.futix-hero__text {
	position: relative;
	display: grid;
	justify-items: center;
	gap: var(--wp--preset--spacing--4);
	max-inline-size: var(--wp--style--global--content-size);
}

.futix-hero__title {
	margin: 0;
	font-size: clamp(2rem, 7vw, 3.5rem);
	font-weight: 800;
	line-height: 1.05;
}

.futix-hero__lead {
	margin: 0;
	color: var(--color-text-secondary);
	font-size: var(--wp--preset--font-size--lg);
}

.futix-hero__actions .futix-button {
	min-inline-size: calc(var(--wp--preset--spacing--9) * 1.8);
	min-block-size: var(--size-touch);
	padding-block: var(--wp--preset--spacing--2);
	padding-inline: var(--wp--preset--spacing--6);
	border-radius: var(--radius-full);
	font-size: var(--wp--preset--font-size--base);
	box-shadow: var(--glow);
}

.futix-home-section {
	display: grid;
	gap: var(--wp--preset--spacing--5);
	box-sizing: border-box;
	inline-size: 100%;
	max-inline-size: calc(var(--wp--style--global--content-size) + var(--wp--preset--spacing--4) * 2);
	margin-inline: auto;
	padding-inline: var(--wp--preset--spacing--4);
	scroll-margin-block-start: calc(var(--wp--preset--spacing--9) + var(--wp--preset--spacing--4));
}

.futix-home-section__title {
	margin: 0;
	font-size: var(--wp--preset--font-size--3-xl);
	text-align: center;
}

/* שורה אחרונה חלקית ממורכזת, כדי שלא יישאר חור (5 עמודים: 3 + 2) */
.futix-pillars {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--wp--preset--spacing--3);
	margin: 0;
	padding: 0;
	list-style: none;
}

.futix-pillar {
	flex: 1 1 calc(var(--wp--preset--spacing--9) * 2.2);
	max-inline-size: calc((100% - 2 * var(--wp--preset--spacing--3)) / 3);
	display: grid;
	gap: var(--wp--preset--spacing--2);
	align-content: start;
	padding: var(--wp--preset--spacing--5);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-lg);
	background: var(--color-surface);
}

.futix-pillar svg {
	color: var(--color-accent);
}

.futix-pillar h3 {
	margin: 0;
	font-size: var(--wp--preset--font-size--xl);
}

.futix-pillar p {
	margin: 0;
	color: var(--color-text-secondary);
}

.futix-faq {
	display: grid;
	gap: var(--wp--preset--spacing--2);
}

.futix-faq details,
.wp-block-details {
	margin: 0;
	padding: 0;
	overflow: hidden;
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
	background: var(--color-surface);
}

.futix-faq summary,
.wp-block-details summary {
	position: relative;
	display: flex;
	gap: var(--wp--preset--spacing--3);
	align-items: center;
	justify-content: space-between;
	min-block-size: var(--size-touch);
	padding: var(--wp--preset--spacing--3) var(--wp--preset--spacing--4);
	font-family: var(--font-heading);
	font-weight: 700;
	list-style: none;
	cursor: pointer;
}

.futix-faq summary::-webkit-details-marker,
.wp-block-details summary::-webkit-details-marker {
	display: none;
}

/* חץ שמסתובב כשהשאלה נפתחת */
.futix-faq summary::after,
.wp-block-details summary::after {
	content: "";
	flex-shrink: 0;
	inline-size: var(--wp--preset--spacing--2);
	block-size: var(--wp--preset--spacing--2);
	border-block-end: 2px solid currentColor;
	border-inline-start: 2px solid currentColor; /* ב-RTL: חץ למטה */
	transform: translateY(-25%) rotate(45deg);
	transition: transform var(--duration-base) var(--ease-out);
}

.futix-faq details[open] summary::after,
.wp-block-details[open] summary::after {
	transform: translateY(25%) rotate(-135deg);
}

.futix-faq summary:hover,
.wp-block-details summary:hover {
	color: var(--color-accent);
}

.futix-faq summary:focus,
.wp-block-details summary:focus {
	outline: none;
}

.futix-faq summary:focus-visible,
.wp-block-details summary:focus-visible {
	outline: var(--size-focus-ring) solid var(--color-focus);
	outline-offset: calc(-1 * var(--size-focus-ring) * 2);
	border-radius: var(--radius-md);
}

.futix-faq details[open] summary,
.wp-block-details[open] summary {
	color: var(--color-accent);
}

.futix-faq details > :not(summary),
.wp-block-details > :not(summary) {
	margin: 0;
	padding: 0 var(--wp--preset--spacing--4) var(--wp--preset--spacing--4);
	color: var(--color-text-secondary);
}

.futix-faq a,
.wp-block-details a,
.futix-home-more a {
	color: var(--color-accent);
}

.futix-home-more {
	margin: 0;
	text-align: center;
}

.futix-cancel-link {
	font-weight: 700;
}

.futix-nowrap {
	white-space: nowrap;
}

.futix-footer__links {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	gap: var(--wp--preset--spacing--1) var(--wp--preset--spacing--4);
	margin: 0;
	padding: 0;
	list-style: none;
}

.futix-footer__links a {
	display: inline-flex;
	align-items: center;
	min-block-size: var(--size-touch);
	color: var(--color-text-secondary);
	font-size: var(--wp--preset--font-size--sm);
}

.futix-footer__links a:hover {
	color: var(--color-accent);
}

.futix-footer__links a.is-strong {
	color: var(--color-accent);
	font-weight: 700;
}

/* תוכן עמודים רגילים (מדריכים, שאלות, עמודים משפטיים) */
/* משקל אפס (:where), כדי שרכיבים על משטח בהיר יקבעו צבע משלהם */
:where(.futix-main .wp-block-post-content) a {
	color: var(--color-accent);
}

.futix-main .wp-block-post-content :where(ul, ol) {
	display: grid;
	gap: var(--wp--preset--spacing--2);
	padding-inline-start: var(--wp--preset--spacing--5);
}

:where(.futix-main .wp-block-post-content) :where(p, li) {
	color: var(--color-text-secondary);
}

:where(.futix-main .wp-block-post-content) strong {
	color: var(--color-text);
}

.futix-main .wp-block-details + .wp-block-details {
	margin-block-start: var(--wp--preset--spacing--2);
}

/* פוקוס על הכותרת הבהירה: ירוק-ים כהה, כי טורקיז על לבן לא נראה. */
.futix-header :focus-visible {
	outline-color: var(--header-accent);
}

/* בטלפון: האור מתרכז בסמל ומתכהה לפני הכותרת, כדי שהיא תישאר בולטת. */
@media (max-width: 40em) {
	.futix-hero__glow {
		background:
			radial-gradient(
				ellipse 28rem 20rem at 50% 24%,
				var(--wp--preset--color--white) 0%,
				var(--wp--preset--color--ice-50) 9%,
				color-mix(in srgb, var(--wp--preset--color--ice-200) 90%, var(--wp--preset--color--blue-500)) 19%,
				color-mix(in srgb, var(--wp--preset--color--blue-500) 75%, var(--wp--preset--color--navy-800)) 34%,
				var(--wp--preset--color--navy-800) 52%,
				var(--wp--preset--color--navy-950) 78%
			);
	}
}

.futix-hero__text {
	gap: var(--wp--preset--spacing--3);
}

@media (max-width: 40em) {
	.futix-hero__lead {
		font-size: var(--wp--preset--font-size--base);
	}
}

@media (max-width: 40em) {
	.futix-home {
		gap: var(--wp--preset--spacing--6);
	}

	.futix-hero {
		padding-block-end: 0;
	}
}

/* קישורים בתוך העמוד ("לבחירת חבילה", דילוג בין שלבים במדריך) גוללים בעדינות (בקשת דין 04/11/2026).
   מי שביקש פחות תנועה, במערכת או בתפריט הנגישות, מקבל קפיצה רגילה. */
@media (prefers-reduced-motion: no-preference) {
	html {
		scroll-behavior: smooth;
	}
}

html.futix-a11y-motion {
	scroll-behavior: auto;
}

/* הכותרת בצבעי המותג: צל כהה עדין, כדי שלא תיבלע באור (בקשת דין, 07/10/2026) */
.futix-hero__title .futix-text-brand {
	filter: drop-shadow(0 2px 6px var(--wp--preset--color--navy-950)) drop-shadow(0 0 2px var(--wp--preset--color--navy-950));
}

/* טלפון וטאבלט: הלוגו במרכז הכותרת, תפריט מימין, סל וחשבון משמאל (בקשת דין, 07/10/2026) */
@media (max-width: 63.99em) {
	.futix-header__bar {
		position: relative;
	}

	.futix-header__logo {
		position: absolute;
		inset-inline-start: 50%;
		transform: translateX(50%);
	}

	[dir="ltr"] .futix-header__logo {
		transform: translateX(-50%);
	}

	/* בקופה אין תפריט: הלוגו נשאר בשורה, אחרת הוא עולה על "תשלום מאובטח". */
	.futix-header--checkout .futix-header__logo,
	[dir="ltr"] .futix-header--checkout .futix-header__logo {
		position: static;
		transform: none;
	}
}

/* "הגדרות עוגיות" בפוטר: נראה כמו שאר הקישורים */
.futix-footer__btn {
	display: inline-flex;
	align-items: center;
	min-block-size: var(--size-touch);
	padding: 0;
	background: none;
	border: 0;
	color: var(--color-text-secondary);
	font: inherit;
	font-size: var(--wp--preset--font-size--sm);
	cursor: pointer;
}

.futix-footer__btn:hover {
	color: var(--color-accent);
}

/* מטבע FUTIX בראש עמוד הבית (בקשת דין, 08/10/2026): במקום הסמל, עם הילת זהב עדינה */
.futix-hero__mark--coin {
	inline-size: 78%;
	filter: drop-shadow(0 var(--wp--preset--spacing--2) var(--wp--preset--spacing--5) color-mix(in srgb, var(--wp--preset--color--amber-400) 40%, transparent));
}

@media (max-width: 47.99em) {
	.futix-pillar {
		max-inline-size: none;
	}
}

/* רשימת המדריכים: כרטיס לכל מדריך עם תיאור קצר */
.futix-guide-list {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(min(100%, calc(var(--wp--preset--spacing--9) * 2.6)), 1fr));
	gap: var(--wp--preset--spacing--3);
	margin: 0;
	padding: 0;
	list-style: none;
}

.futix-guide-card a {
	display: grid;
	gap: var(--wp--preset--spacing--1);
	block-size: 100%;
	box-sizing: border-box;
	padding: var(--wp--preset--spacing--4);
	border: 1px solid var(--color-border);
	border-radius: var(--radius-lg);
	background: var(--color-surface);
	color: var(--color-text);
	text-decoration: none;
	transition: border-color var(--duration-fast) var(--ease-out), background-color var(--duration-fast) var(--ease-out);
}

.futix-guide-card a:hover {
	border-color: var(--color-accent-soft);
	background: var(--color-surface-raised);
}

.futix-guide-card a:focus-visible {
	outline: var(--size-focus-ring) solid var(--color-focus);
	outline-offset: var(--size-focus-ring);
}

.futix-guide-card strong {
	font-family: var(--font-heading);
	font-size: var(--wp--preset--font-size--lg);
	color: var(--color-text);
}

.futix-guide-card span {
	color: var(--color-text-secondary);
	font-size: var(--wp--preset--font-size--sm);
}

.futix-guide-cta {
	margin-block-start: var(--wp--preset--spacing--5);
}

/* מדריך בשלבים (מדריך המרקט, 04/11/2026): צילומי מסך, קישורי דילוג ועוגנים שלא נבלעים מתחת לכותרת הדביקה */
.wp-block-heading[id] {
	scroll-margin-block-start: calc(var(--wp--preset--spacing--9) + var(--wp--preset--spacing--4));
}

.futix-guide-skip a {
	display: inline-flex;
	align-items: center;
	min-block-size: var(--size-touch);
	font-weight: 700;
}

.futix-guide-note {
	margin-block: var(--wp--preset--spacing--4);
}

.futix-guide-note p {
	margin: 0;
}

.futix-guide-shot {
	display: grid;
	justify-items: center;
	gap: var(--wp--preset--spacing--2);
	margin: var(--wp--preset--spacing--4) 0;
}

.futix-guide-shot img {
	inline-size: 100%;
	block-size: auto;
	border: 1px solid var(--color-border);
	border-radius: var(--radius-md);
}

.futix-guide-shot--phone img {
	max-inline-size: min(100%, 18rem); /* 288px: צילום טלפון לא נמתח לרוחב מסך מחשב */
}

.futix-guide-shot figcaption {
	color: var(--color-text-secondary);
	font-size: var(--wp--preset--font-size--sm);
	text-align: center;
}