/**
 * Base — reset + element defaults. Mobile-first, RTL by default (Persian primary language).
 */

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

html {
	min-height: 100%;
	scroll-behavior: smooth;
	overscroll-behavior-y: none;
	background: var(--rt-color-primary);
}

body {
	font-synthesis-weight: none;
	font-weight: 400;
	min-height: 100vh;
	min-height: 100dvh;
	margin: 0;
	display: flex;
	flex-direction: column;
	font-family: var(--rt-font-fa);
	font-size: var(--rt-fs-body);
	line-height: 1.7;
	color: var(--rt-color-text);
	background: var(--rt-color-background);
	-webkit-font-smoothing: antialiased;
	overscroll-behavior-y: none;
}

html[lang^="en"] body,
.rt-en {
	font-family: var(--rt-font-en);
	direction: ltr;
}

/* Keep telephone digits and the international prefix stable inside RTL prose. */
.rt-phone-number,
a[href^="tel:"] {
	direction: ltr;
	display: inline-block;
	font-variant-numeric: tabular-nums;
	unicode-bidi: isolate;
	white-space: nowrap;
}

strong, b, th { font-weight: 700; }

img, svg, video { max-width: 100%; height: auto; display: block; }

a { color: inherit; text-decoration: none; }

/*
 * Prose links must remain distinguishable without relying on colour alone.
 * Navigation, cards and button-shaped anchors keep their component styling.
 */
.rt-page-content a:not(.rt-button):not(.wp-block-button__link),
.rt-product-description a:not(.rt-button):not(.wp-block-button__link),
.rt-faq__answer a:not(.rt-button),
.woocommerce .woocommerce-privacy-policy-text a,
.woocommerce .woocommerce-terms-and-conditions-checkbox-text a {
	color: var(--rt-color-link);
	text-decoration-line: underline;
	text-decoration-thickness: 0.08em;
	text-underline-offset: 0.2em;
	text-decoration-skip-ink: auto;
}

.rt-page-content a:not(.rt-button):not(.wp-block-button__link):hover,
.rt-product-description a:not(.rt-button):not(.wp-block-button__link):hover,
.rt-faq__answer a:not(.rt-button):hover,
.woocommerce .woocommerce-privacy-policy-text a:hover,
.woocommerce .woocommerce-terms-and-conditions-checkbox-text a:hover {
	color: var(--rt-color-link-hover);
	text-decoration-thickness: 0.12em;
}

h1, h2, h3, h4, h5, h6 { margin: 0 0 var(--rt-space-2); font-weight: 700; line-height: 1.25; }

h1 { font-size: 34px; }
h2 { font-size: 28px; }
h3 { font-size: 22px; }
h4 { font-size: var(--rt-fs-h4); }

@media (min-width: 1024px) {
	h1 { font-size: var(--rt-fs-h1); }
	h2 { font-size: var(--rt-fs-h2); }
	h3 { font-size: var(--rt-fs-h3); }
}

p { margin: 0 0 var(--rt-space-2); color: var(--rt-color-text-secondary); }

ul, ol { margin: 0; padding: 0; list-style: none; }

button, input, select, textarea { font-family: inherit; font-size: inherit; }

/* Focus visibility — accessibility requirement (Phase 02 §17, Phase 04 §31) */
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
	outline: 2px solid var(--rt-color-secondary);
	outline-offset: 2px;
}

/* Skip link for keyboard users — clipped while preserving keyboard access. */
.rt-skip-link {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	clip-path: inset(50%);
	white-space: nowrap;
	border: 0;
	background: var(--rt-color-primary);
	color: var(--rt-color-white);
	z-index: 999;
}
.rt-skip-link:focus {
	width: auto;
	height: auto;
	padding: var(--rt-space-1) var(--rt-space-2);
	margin: 0;
	overflow: visible;
	clip: auto;
	clip-path: none;
	white-space: normal;
	right: var(--rt-space-2);
	top: var(--rt-space-2);
}

#rt-main-content {
	flex: 1 0 auto;
	width: 100%;
	scroll-margin-top: 5rem;
}

::selection { background: var(--rt-color-secondary); color: var(--rt-color-white); }
