/* ---------------------------------------------------------------
   Header + footer (parts/header.html, parts/footer.html)
   Colours and fonts from theme.json (hex = fallback).
---------------------------------------------------------------- */
:root {
	--wtm-ink: var(--wp--preset--color--ink, #0B1A33);
	--wtm-cream: var(--wp--preset--color--cream, #F6F1E6);
	--wtm-gold: var(--wp--preset--color--gold-light, #E3B45F);
	--wtm-gold-bright: var(--wp--preset--color--gold-bright, #F7DCA4);
	--wtm-serif: var(--wp--preset--font-family--newsreader, Newsreader, Georgia, serif);
	--wtm-sans: var(--wp--preset--font-family--outfit, Outfit, system-ui, sans-serif);
	--wtm-line-ink: rgb(246 241 230 / 0.12);
	--wtm-bar: var(--wp-admin--admin-bar--height, 0px);
}

/* Anchor links (#about...) stop below the sticky header */
html {
	scroll-padding-top: calc(var(--wp--custom--header-height, 68px) + var(--wtm-bar) + 1rem);
}

/* =========================================================
   HEADER
========================================================= */

/* Sticky: the template-part wrapper is what sticks */
.wp-block-template-part:has(> .wtm-header) {
	position: sticky;
	top: var(--wtm-bar);
	z-index: 100;
}
@media (max-width: 600px) {
	/* the admin bar scrolls away on phones */
	.wp-block-template-part:has(> .wtm-header) { top: 0; }
}

.wtm-header {
	background: var(--wtm-ink);
	color: var(--wtm-cream);
	border-bottom: 1px solid var(--wtm-line-ink);
	padding: 0.7rem var(--wp--preset--spacing--50, 1.5rem);
}
.wtm-header__inner {
	max-width: var(--wp--style--global--wide-size, 1440px);
	min-height: calc(var(--wp--custom--header-height, 68px) - 1.4rem);
	margin-inline: auto;
	gap: 2rem;
}

/* Brand: WHEN TO MOVE?  ALI DHAINI */
.wtm-header .wtm-header__brand {
	gap: 1rem;
	align-items: baseline;
	flex-shrink: 0;
}
.wtm-header__title {
	margin: 0;
	font: 600 1rem/1 var(--wtm-sans);
	letter-spacing: 0.16em;
	text-transform: uppercase;
}
.wtm-header__title a,
.wtm-header__title a:hover {
	color: var(--wtm-cream);
	text-decoration: none;
}
.wtm-header__author {
	margin: 0;
	font: 400 0.75rem/1 var(--wtm-sans);
	letter-spacing: 0.18em;
	text-transform: uppercase;
	color: rgb(246 241 230 / 0.5);
}

/* Menu */
.wtm-header__nav {
	font: 400 1rem/1 var(--wtm-sans);
}
.wtm-header__nav .wp-block-navigation__container {
	gap: clamp(1.5rem, 2.8vw, 2.75rem);
}
.wtm-header__nav .wp-block-navigation-item__content {
	color: rgb(246 241 230 / 0.85);
	text-decoration: none;
	transition: color 0.2s;
}
.wtm-header__nav .wp-block-navigation-item__content:hover,
.wtm-header__nav .wp-block-navigation-item__content:focus-visible {
	color: var(--wtm-gold);
	text-decoration: none;
}
/* Desktop: menu in the middle, language link hugging the Buy button */
.wtm-header .wtm-header__nav { margin-inline: auto; }

/* Language link: only the other language, e.g. "العربية" on the English page */
.wtm-header__inner > nav:has(> .wtm-header__lang) { flex-shrink: 0; }
.wtm-header .wtm-header__lang {
	display: flex;
	margin: 0;
	padding: 0;
	list-style: none;
}
.wtm-header__lang a {
	display: inline-block;
	padding: 0.5rem 0.25rem;
	font: 500 0.8125rem/1 var(--wtm-sans);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: rgb(246 241 230 / 0.7);
	text-decoration: none;
	transition: color 0.2s;
}
.wtm-header__lang a:hover,
.wtm-header__lang a:focus-visible {
	color: var(--wtm-gold);
	text-decoration: none;
}
.wtm-header__lang a:lang(ar) {
	font-size: 0.9375rem;
	letter-spacing: 0;
}

/* Buy the book */
.wtm-header__actions { flex-shrink: 0; }
/* .wtm-header__cta .wp-block-button__link {
	padding: 1rem 1.5rem;
	background: var(--wtm-gold);
	color: var(--wtm-ink);
	border-radius: 2px;
	font: 500 0.875rem/1 var(--wtm-sans);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	transition: background-color 0.2s;
}
.wtm-header__cta .wp-block-button__link:hover,
.wtm-header__cta .wp-block-button__link:focus-visible {
		background: #D8A64E;
	background: color-mix(in srgb, var(--wtm-gold), var(--wtm-ink) 14%);
} */
 .wtm-header__cta .wp-block-button__link {
	padding: 1rem 1.5rem;
	font: 500 0.875rem/1 var(--wtm-sans);
	letter-spacing: 0.1em;
	text-transform: uppercase;
}
.wtm-header :focus-visible {
	outline: 1px solid var(--wtm-gold);
	outline-offset: 3px;
}

/* Tablets + phones: just the title and the language link.
   No menu (one page, people scroll) and no Buy button (the hero has it). */
@media (max-width: 781px) {
	.wtm-header__inner { gap: 1rem; }
	.wtm-header .wtm-header__author,
	.wtm-header .wtm-header__nav,
	.wtm-header .wtm-header__actions { display: none; } /* beats core's display rules */
	.wtm-header__inner > nav:has(> .wtm-header__lang) { margin-inline-start: auto; }
}

/* Small phones: a long site title never pushes the language link off screen */
@media (max-width: 480px) {
	.wtm-header .wtm-header__brand { flex-shrink: 1; min-width: 0; }
	.wtm-header__title {
		white-space: nowrap;
		overflow: hidden;
		text-overflow: ellipsis;
	}
}

/* =========================================================
   FOOTER
========================================================= */
.wtm-footer {
	background: var(--wtm-ink);
	color: rgb(246 241 230 / 0.7);
	padding: clamp(4rem, 8vw, 6rem) var(--wp--preset--spacing--50, 1.5rem) 2rem;
}

.wtm-footer .wtm-footer__grid {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1.45fr) minmax(9rem, auto);
	gap: clamp(2.5rem, 5vw, 4rem);
	max-width: 88rem;
	margin-inline: auto;
}
.wtm-footer__grid > * { margin: 0; }

/* Column labels: STAY UPDATED / EXPLORE */
.wtm-footer__label {
	margin: 0 0 1.25rem;
	font: 600 0.8125rem/1 var(--wtm-sans);
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: var(--wtm-cream);
}

/* Brand column */
.wtm-footer__title {
	margin: -0.35rem 0 1rem;
	font: 600 1.5rem/1.1 var(--wtm-sans);
	letter-spacing: 0.14em;
	text-transform: uppercase;
}
.wtm-footer__title a,
.wtm-footer__title a:hover {
	color: var(--wtm-cream);
	text-decoration: none;
}
.wtm-footer__tagline {
	max-width: 18rem;
	margin: 0 0 1.25rem;
	font: 400 1.25rem/1.5 var(--wtm-serif);
	color: rgb(246 241 230 / 0.82);
}
.wtm-footer__author {
	margin: 0;
	font: 400 0.875rem/1 var(--wtm-sans);
	letter-spacing: 0.2em;
	text-transform: uppercase;
	color: rgb(246 241 230 / 0.55);
}

/* Signup column (the form goes under this text) */
.wtm-footer__text {
	max-width: 22rem;
	margin: 0 0 1.5rem;
	font: 300 1rem/1.75 var(--wtm-sans);
}

/* Explore links */
.wtm-footer__nav .wp-block-navigation__container { gap: 1.25rem; }
.wtm-footer__nav .wp-block-navigation-item__content {
	font: 300 1.0625rem/1.2 var(--wtm-sans);
	color: rgb(246 241 230 / 0.85);
	text-decoration: none;
	transition: color 0.2s;
}
.wtm-footer__nav .wp-block-navigation-item__content:hover,
.wtm-footer__nav .wp-block-navigation-item__content:focus-visible {
	color: var(--wtm-gold);
	text-decoration: none;
}

/* Instagram + WhatsApp (Social Icons block, "Logos only" style) under the author */
.wtm-footer .wtm-footer__social {
	gap: 0.5rem;
	margin: 1.5rem 0 0;
	margin-inline-start: -0.625rem; /* line the first logo up with the text above (cancels its tap padding) */
	padding: 0;
}
.wtm-footer .wtm-footer__social .wp-social-link {
	color: rgb(246 241 230 / 0.7); /* cream, not the brand colours */
	transition: color 0.2s, transform 0.2s var(--wp--custom--ease--out, ease);
}
.wtm-footer .wtm-footer__social .wp-social-link a {
	display: grid;
	place-items: center;
	width: 2.75rem; /* 44px tap target */
	height: 2.75rem;
	padding: 0;
	border-radius: 50%;
}
.wtm-footer .wtm-footer__social .wp-social-link svg {
	width: 1.375rem;
	height: 1.375rem;
}
.wtm-footer .wtm-footer__social .wp-social-link:hover,
.wtm-footer .wtm-footer__social .wp-social-link:focus-within {
	color: var(--wtm-gold);
	transform: translateY(-2px);
}
.wtm-footer .wtm-footer__social a:focus-visible {
	outline: 1px solid var(--wtm-gold);
	outline-offset: 0;
}
@media (prefers-reduced-motion: reduce) {
	.wtm-footer .wtm-footer__social .wp-social-link:hover,
	.wtm-footer .wtm-footer__social .wp-social-link:focus-within { transform: none; }
}

/* Bottom line + copyright */
.wtm-footer .wtm-footer__bottom {
	max-width: 97rem;
	margin: clamp(3rem, 6vw, 5rem) auto 0;
	padding-top: 1.75rem;
	border-top: 1px solid var(--wtm-line-ink);
}
.wtm-footer__copy {
	max-width: 88rem;
	margin: 0 auto;
	font: 300 1rem/1.5 var(--wtm-sans);
	color: rgb(246 241 230 / 0.6);
}

.wtm-footer :focus-visible {
	outline: 1px solid var(--wtm-gold);
	outline-offset: 3px;
}

@media (max-width: 900px) {
	.wtm-footer .wtm-footer__grid { grid-template-columns: 1fr; }
}

/* Arabic: no capitals or wide letter spacing */
:lang(ar) :is(.wtm-header__title, .wtm-header__author, .wtm-header__cta .wp-block-button__link,
	.wtm-footer__label, .wtm-footer__title, .wtm-footer__author) {
	letter-spacing: 0;
	text-transform: none;
}

/* ---------- Newsletter signup (Contact Form 7) ---------- */
.wtm-footer .wpcf7 { max-width: 38rem; }

.wtm-footer .wtm-signup {
	display: flex;
	gap: 0.6rem;
}
.wtm-footer .wtm-signup p { display: contents; } /* CF7 adds <p> tags; ignore them */
.wtm-footer .wtm-signup br { display: none; }
.wtm-footer .wtm-signup .wpcf7-form-control-wrap { flex: 1; min-width: 0; }

.wtm-footer .wtm-signup input[type="email"] {
	width: 100%;
	height: 3.4rem;
	box-sizing: border-box;
	padding: 0 1.1rem;
	background: rgb(0 0 0 / 0.22);
	border: 1px solid rgb(246 241 230 / 0.15);
	border-radius: 2px;
	font: 300 1rem/1 var(--wtm-sans);
	color: var(--wtm-cream);
	transition: border-color 0.2s;
}
.wtm-footer .wtm-signup input[type="email"]::placeholder { color: rgb(246 241 230 / 0.45); }
.wtm-footer .wtm-signup input[type="email"]:focus {
	outline: none;
	border-color: var(--wtm-gold);
}

.wtm-footer .wtm-signup .wpcf7-submit {
	flex-shrink: 0;
	height: 3.4rem;
	padding: 0 1.4rem;
	background: var(--wtm-gold);
	border: 0;
	border-radius: 2px;
	font: 500 1rem/1 var(--wtm-sans);
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--wtm-ink);
	cursor: pointer;
	transition: background-color 0.2s, opacity 0.2s;
}
.wtm-footer .wtm-signup .wpcf7-submit:hover { background: var(--wtm-gold-bright); }
.wtm-footer .wtm-signup .wpcf7-submit:focus-visible { outline: 1px solid var(--wtm-gold); outline-offset: 3px; }
.wtm-footer .wpcf7-form.submitting .wpcf7-submit { opacity: 0.6; cursor: wait; }
.wtm-footer .wtm-signup .wpcf7-spinner { display: none; }

/* Error under the field, and the message after submitting */
.wtm-footer .wpcf7-not-valid-tip {
	margin-top: 0.5rem;
	font: 400 0.8125rem/1.3 var(--wtm-sans);
	color: #F4A28C;
}
.wtm-footer .wpcf7 form .wpcf7-response-output {
	margin: 1rem 0 0;
	padding: 0.75rem 1rem;
	border: 0;
	border-inline-start: 2px solid var(--wtm-gold);
	background: rgb(246 241 230 / 0.05);
	font: 400 0.9rem/1.4 var(--wtm-sans);
	color: var(--wtm-cream);
}
.wtm-footer .wpcf7 form.invalid .wpcf7-response-output,
.wtm-footer .wpcf7 form.failed .wpcf7-response-output { border-inline-start-color: #F4A28C; }

@media (max-width: 480px) {
	.wtm-footer .wtm-signup { flex-direction: column; }
	.wtm-footer .wtm-signup .wpcf7-submit { width: 100%; }
}


/* ---------- Language switcher (dropdown) ---------- */
select.pll-switcher-select {
	appearance: none;
	-webkit-appearance: none;
	max-width: 8rem;
	margin: 0;
	padding: 0.55rem 1.9rem 0.55rem 0.7rem;
	background-color: transparent;
	background-image: linear-gradient(45deg, transparent 50%, currentColor 50%), linear-gradient(135deg, currentColor 50%, transparent 50%);
	background-position: right 0.9rem center, right 0.6rem center;
	background-size: 0.3rem 0.3rem;
	background-repeat: no-repeat;
	border: 1px solid rgb(246 241 230 / 0.2);
	border-radius: 2px;
	box-shadow: none;
	font-family: var(--wtm-sans);
	font-size: 0.75rem;
	font-weight: 500;
	line-height: 1;
	letter-spacing: 0.1em;
	text-transform: uppercase;
	color: var(--wtm-cream);
	cursor: pointer;
	transition: border-color 0.2s, color 0.2s;
}
select.pll-switcher-select:hover { border-color: var(--wtm-gold); color: var(--wtm-gold); }
select.pll-switcher-select:focus-visible {
	outline: 1px solid var(--wtm-gold);
	outline-offset: 3px;
}
/* the open list is drawn by the operating system: dark background, light text */
select.pll-switcher-select option { background: var(--wtm-ink); color: var(--wtm-cream); }

/* RTL: arrow on the other side */
[dir="rtl"] select.pll-switcher-select {
	padding: 0.55rem 0.7rem 0.55rem 1.9rem;
	background-position: left 0.6rem center, left 0.9rem center;
}

/* An English site title inside an RTL page would read "?When to Move":
   let the title take its direction from its own first letter. */
[dir="rtl"] .wp-block-site-title { unicode-bidi: plaintext; }

/* ---------- Arabic typography ---------- */
html[lang="ar"] { font-size: 106.25%; } /* Arabic reads small at the same rem size */
html[lang="ar"] :is(h1, h2, h3, h4) { line-height: 1.35; letter-spacing: 0; }
html[lang="ar"] p { line-height: 1.9; }
html[lang="ar"] :is(.wtm-header__title, .wtm-footer__title, .wtm-header__author, .wtm-footer__author) {
	letter-spacing: 0;
}