/*
 * Site-specific styles for the Furniture Child theme.
 * Keep presentation responsive, accessible, and scoped to this theme.
 */

@font-face {
	font-family: "Assistant";
	font-style: normal;
	font-weight: 200 800;
	font-display: swap;
	src: url("../fonts/assistant/Assistant-VariableFont_wght.woff2") format("woff2");
}

@font-face {
	font-family: "Bellefair";
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url("../fonts/bellefair/Bellefair-Regular.woff2") format("woff2");
}

:root {
	/* Color */
	--color-ink: #20221e;
	--color-ink-soft: #565b53;
	--color-canvas: #ffffff;
	--color-surface: #f2eee5;
	--color-surface-strong: #e5ded1;
	--color-border: #d5cfc4;
	--color-border-strong: #807a70;
	--color-accent: #a9472c;
	--color-accent-hover: #883923;
	--color-link: #275a67;
	--color-success: #2f6848;
	--color-warning: #825713;
	--color-error: #962f2f;
	--color-white: #ffffff;
	--sola-icon-nav-arrow-down: url("data:image/svg+xml,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2024%2024%27%20fill%3D%27none%27%3E%3Cpath%20d%3D%27M6%209L12%2015L18%209%27%20stroke%3D%27%2320221e%27%20stroke-width%3D%271.5%27%20stroke-linecap%3D%27round%27%20stroke-linejoin%3D%27round%27%2F%3E%3C%2Fsvg%3E");

	/* Typography: self-hosted Assistant upright 200–800 with local fallbacks. */
	--font-family-sans: "Assistant", system-ui, -apple-system, "Segoe UI", sans-serif;
	--font-family-display: "Bellefair", "Assistant", Georgia, serif;
	--font-size-display: clamp(2.25rem, 8vw, 4.75rem);
	--font-size-h1: clamp(2rem, 5vw, 3.5rem);
	--font-size-h2: clamp(1.625rem, 3vw, 2.5rem);
	--font-size-h3: 1.375rem;
	--font-size-body-large: 1.125rem;
	--font-size-body: 1rem;
	--font-size-ui: 0.875rem;
	--line-height-tight: 1.08;
	--line-height-heading: 1.15;
	--line-height-body: 1.6;
	--line-height-ui: 1.4;
	--font-weight-regular: 400;
	--font-weight-medium: 500;
	--font-weight-semibold: 600;
	--font-weight-bold: 600;
	--font-weight-display: 400;

	/* Spacing: 4px base unit. */
	--space-1: 0.25rem;
	--space-2: 0.5rem;
	--space-3: 0.75rem;
	--space-4: 1rem;
	--space-6: 1.5rem;
	--space-8: 2rem;
	--space-12: 3rem;
	--space-16: 4rem;
	--space-20: 5rem;
	--space-24: 6rem;

	/* Layout and shape */
	--container-max: 90rem;
	--container-gutter: clamp(1rem, 3vw, 3rem);
	--sola-layout-max: var(--container-max);
	--reading-max: 68ch;
	--radius-sm: 0.625rem;
	--radius-md: 1rem;
	--radius-lg: 1.25rem;
	--radius-button: 0.625rem;

	/* Focus and motion */
	--focus-color: var(--color-link);
	--focus-width: 3px;
	--focus-offset: 3px;
	--motion-fast: 120ms;
	--motion-base: 180ms;
	--motion-ease: cubic-bezier(0.2, 0.7, 0.2, 1);
}

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

html {
	direction: rtl;
	scroll-behavior: smooth;
}

body {
	margin: 0;
	background-color: var(--color-canvas);
	color: var(--color-ink);
	font-family: var(--font-family-sans);
	font-size: var(--font-size-body);
	font-weight: var(--font-weight-regular);
	line-height: var(--line-height-body);
	text-rendering: optimizeLegibility;
}

html body.wp-child-theme-furniture-child,
html body.wp-child-theme-furniture-child .site {
	background: #fff !important;
}

:where(h1, h2, h3, h4, h5, h6) {
	margin-block: 0;
	color: var(--color-ink);
	font-weight: var(--font-weight-semibold);
	line-height: var(--line-height-heading);
	text-wrap: balance;
}

:where(p) {
	max-inline-size: var(--reading-max);
}

:where(a) {
	color: var(--color-link);
	text-decoration-thickness: 0.1em;
	text-underline-offset: 0.16em;
	transition: color var(--motion-fast) var(--motion-ease);
}

:where(a:hover) {
	color: var(--color-accent-hover);
}

:where(button, input, select, textarea) {
	font: inherit;
}

/* GeneratePress/WooCommerce set a system-ui family on native controls. Keep
 * child-owned commerce controls in Assistant without touching icon pseudo-elements. */
html body.wp-child-theme-furniture-child :is(button, input, select, textarea, .button) {
	font-family: var(--font-family-sans);
}

:where(a, button, input, select, textarea, summary):focus-visible {
	outline: var(--focus-width) solid var(--focus-color);
	outline-offset: var(--focus-offset);
}

.sola-container {
	inline-size: min(
		calc(100% - var(--container-gutter) - var(--container-gutter)),
		var(--sola-layout-max)
	);
	margin-inline: auto;
}

.sola-reading-width {
	max-inline-size: var(--reading-max);
}

/* RTL utilities: apply to the smallest text or icon wrapper that owns the content. */
:where(
	.sola-ltr-isolate,
	.sola-price,
	.sola-sku,
	.sola-dimensions,
	.sola-phone,
	.sola-email,
	.sola-identifier
) {
	direction: ltr;
	unicode-bidi: isolate;
}

/* Neutral icons stay unchanged; only an explicitly directional wrapper mirrors in RTL. */
:where(.sola-icon) {
	display: inline-flex;
	flex: 0 0 auto;
}

:where(.sola-icon--neutral) {
	transform: none;
}

:dir(rtl) :where(.sola-icon--directional) {
	transform: scaleX(-1);
}

:dir(ltr) :where(.sola-icon--directional) {
	transform: none;
}

.sola-full-bleed {
	inline-size: 100vw;
	max-inline-size: none;
	margin-inline-start: calc(50% - 50vw);
}

/* Shared RTL and mixed-script utilities preserve DOM and reading order. */
.sola-text-start {
	text-align: start;
}

.sola-text-end {
	text-align: end;
}

.sola-text-center {
	text-align: center;
}

.sola-bidi-isolate {
	unicode-bidi: isolate;
}

.sola-ltr {
	direction: ltr;
	text-align: start;
	unicode-bidi: isolate;
}

.sola-rtl {
	direction: rtl;
	text-align: start;
	unicode-bidi: isolate;
}

/* One physical ILS display rule overrides legacy per-component bidi/flex
 * rules, including fragment updates and sale <del>/<ins>. Never reverse digits.
 * Narrow !important declarations are intentional at this currency boundary. */
html body [data-sola-currency="ILS"] {
	display: inline-block !important;
	direction: ltr !important;
	unicode-bidi: isolate !important;
	white-space: nowrap;
}
html body [data-sola-currency="ILS"] > .woocommerce-Price-currencySymbol {
	display: inline !important;
	direction: ltr !important;
	unicode-bidi: isolate !important;
}
/* Atomic bidi wrappers do not inherit a del ancestor's painted decoration. */
html body del [data-sola-currency="ILS"] {
	text-decoration-line: line-through;
}
/* Current price leads in RTL; the original remains secondary and semantic. */
html body :is(.price, .sola-mini-cart__recommendation-price):has(> del):has(> ins) {
	/* Override legacy catalog selectors scoped through #primary. */
	display: inline-flex !important;
	flex-wrap: wrap;
	align-items: baseline;
	direction: rtl;
	gap: 0.5em;
}
html body :is(.price, .sola-mini-cart__recommendation-price) > ins {
	order: -1;
}
html body.sola-currency-ils :is(.wc-block-formatted-money-amount, .sola-search-overlay__product-price) {
	direction: ltr !important;
	unicode-bidi: isolate !important;
	white-space: nowrap;
}

[dir="rtl"] .sola-icon--directional {
	transform: scaleX(-1);
}

.sola-button {
	--button-background: var(--color-ink);
	--button-border: var(--color-ink);
	--button-color: var(--color-white);
	--button-loading-color: var(--color-white);
	display: inline-flex;
	position: relative;
	align-items: center;
	justify-content: center;
	gap: var(--space-2);
	min-block-size: 3rem;
	padding-block: var(--space-3);
	padding-inline: var(--space-6);
	border: 1px solid var(--button-border);
	border-start-start-radius: 0;
	border-start-end-radius: var(--radius-button);
	border-end-end-radius: 0;
	border-end-start-radius: var(--radius-button);
	background-color: var(--button-background);
	color: var(--button-color);
	font-size: var(--font-size-ui);
	font-weight: var(--font-weight-semibold);
	line-height: var(--line-height-ui);
	text-align: center;
	text-decoration: none;
	cursor: pointer;
	transition:
		background-color var(--motion-fast) var(--motion-ease),
		border-color var(--motion-fast) var(--motion-ease),
		color var(--motion-fast) var(--motion-ease),
		opacity var(--motion-fast) var(--motion-ease);
}

.sola-button:hover {
	background-color: var(--button-hover-background, var(--button-background));
	border-color: var(--button-hover-border, var(--button-border));
	color: var(--button-hover-color, var(--button-color));
}

.sola-button--primary {
	--button-background: var(--color-accent);
	--button-border: var(--color-accent);
	--button-color: var(--color-white);
	--button-hover-background: var(--color-accent-hover);
	--button-hover-border: var(--color-accent-hover);
}

.sola-button--secondary {
	--button-background: var(--color-surface);
	--button-border: var(--color-border-strong);
	--button-color: var(--color-ink);
	--button-hover-background: var(--color-surface-strong);
	--button-hover-border: var(--color-border-strong);
	--button-loading-color: var(--color-ink);
}

.sola-button--text {
	--button-background: transparent;
	--button-border: transparent;
	--button-color: var(--color-link);
	--button-hover-background: transparent;
	--button-hover-border: transparent;
	--button-hover-color: var(--color-accent-hover);
	--button-loading-color: var(--color-link);
	padding-inline: var(--space-2);
}

.sola-button--destructive {
	--button-background: var(--color-error);
	--button-border: var(--color-error);
	--button-color: var(--color-white);
	--button-hover-background: var(--color-ink);
	--button-hover-border: var(--color-ink);
}

.sola-button:disabled,
.sola-button[aria-disabled="true"] {
	opacity: 0.55;
	cursor: not-allowed;
}

.sola-button:disabled {
	pointer-events: none;
}

.sola-button[aria-busy="true"],
.sola-button.is-loading,
.sola-button[data-loading="true"] {
	color: transparent;
	cursor: wait;
	pointer-events: none;
}

.sola-button[aria-busy="true"]::after,
.sola-button.is-loading::after,
.sola-button[data-loading="true"]::after {
	position: absolute;
	inline-size: 1rem;
	block-size: 1rem;
	border: 2px solid var(--button-loading-color);
	border-inline-start-color: transparent;
	border-radius: 50%;
	content: "";
	animation: sola-button-spin 0.8s linear infinite;
}

@keyframes sola-button-spin {
	to {
		transform: rotate(1turn);
	}
}

@media (prefers-reduced-motion: reduce) {
	:root {
		--motion-fast: 0ms;
		--motion-base: 0ms;
	}

	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		animation-iteration-count: 1 !important;
		scroll-behavior: auto !important;
		transition-duration: 0.01ms !important;
	}
}