/*
Theme Name: Nomads of Hope
Theme URI: https://nomadsofhope.com/
Author: Nomads of Hope
Description: Black ground, white headlines, one accent color per program: blue for the Language Project, green for Nomads Scholars, terracotta for Building Projects, white for Nomads of Hope as a whole.
Requires at least: 6.6
Tested up to: 7.0
Requires PHP: 7.4
Version: 1.36
License: GNU General Public License v2 or later
Text Domain: nomads
*/

/* Accent variables. Default = Nomads of Hope as a whole (white). A group set to a program style switches the accent for everything inside it. */
:root, body {
	--accent: #FFFFFF; --accent-hover: #E8E3DA; --accent-text: #FFFFFF; --accent-on: #0C0C0C; --accent-wash: #232120;
}
.is-style-program-lang, body.nh-accent-lang .nh-updates {
	--accent: #5B95EA; --accent-hover: #78A8EE; --accent-text: #8DB6F2; --accent-on: #0A1A33; --accent-wash: #101B2D;
}
.is-style-program-scholars, body.nh-accent-scholars .nh-updates {
	--accent: #A3C93A; --accent-hover: #B8D85E; --accent-text: #BEDD6E; --accent-on: #1C2606; --accent-wash: #1C230C;
}
.is-style-program-build, body.nh-accent-build .nh-updates {
	--accent: #E07A45; --accent-hover: #EC9766; --accent-text: #F0A97D; --accent-on: #3D1508; --accent-wash: #2E1A10;
}
body { -webkit-font-smoothing: antialiased; }
h1, h2, h3 { text-wrap: balance; }
a:focus-visible, summary:focus-visible, button:focus-visible { outline: 2px solid #FFFFFF; outline-offset: 2px; }

/* Kicker: a small capital-letter label with a colored dot, in the program color */
p.is-style-kicker {
	display: flex; align-items: center; gap: 8px; margin: 0;
	font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; line-height: 1.3;
	color: var(--accent-text);
}
p.is-style-kicker::before { content: ""; width: 8px; height: 8px; border-radius: 999px; background: var(--accent); flex: none; }

/* Outline button */
.wp-block-button.is-style-outline > .wp-block-button__link {
	background: transparent; color: var(--accent-text); border: 1px solid currentColor;
}
.wp-block-button.is-style-outline > .wp-block-button__link:hover { background: transparent; color: var(--accent); }

/* Header */
.nh-header { border-bottom: 1px solid var(--wp--preset--color--line); }
.nh-header .nh-logo img { height: 40px; width: auto; }
.nh-header .wp-block-navigation { font-size: 15px; font-weight: 700; }
.nh-header .wp-block-navigation a { text-decoration: none; color: var(--wp--preset--color--body); }
.nh-header .wp-block-navigation a:hover, .nh-header .wp-block-navigation .current-menu-item > a { color: #FFFFFF; }
.nh-header .wp-block-navigation__responsive-container.is-menu-open { background: var(--wp--preset--color--page); color: var(--wp--preset--color--body); }
.nh-header .wp-block-button__link { padding: 10px 18px; white-space: nowrap; }
@media (max-width: 520px) { .nh-header .nh-logo img { height: 30px; } }

/* Language switcher: EN · ES, small and quiet */
.nh-lang { display: inline-flex; align-items: center; gap: 6px; font-size: 13px; font-weight: 700; letter-spacing: .06em; white-space: nowrap; }
.nh-lang a { color: var(--wp--preset--color--muted); text-decoration: none; }
.nh-lang a:hover { color: #FFFFFF; }
.nh-lang .nh-lang-current { color: #FFFFFF; }
.nh-lang .nh-lang-sep { color: var(--wp--preset--color--line); }
/* TranslatePress's own floating dropdown is replaced by the header switcher */
#trp-floater-ls, .trp-floating-switcher { display: none !important; }

/* Logo lockup and tagline: lowercase, wide gap, in the logo's own sans, directly under the logo */
.nh-lockup img { width: min(100%, 440px); height: auto; }
p.nh-tagline {
	font-family: var(--wp--preset--font-family--logo-sans); font-weight: 400; text-transform: lowercase;
	letter-spacing: .02em; color: #FFFFFF; font-size: clamp(16px, 2vw, 21px); margin-top: 10px;
}
.nh-footer p.nh-tagline { font-size: 15px; color: var(--wp--preset--color--body); }

/* Home hero photo */
.nh-hero-photo img { width: 100%; height: clamp(340px, 52vw, 560px); object-fit: cover; object-position: center 40%; }

/* Program tiles */
.nh-tile { background: var(--wp--preset--color--card); border-radius: 8px; overflow: hidden; height: 100%; }
.nh-tile .wp-block-image { margin: 0; }
.nh-tile .wp-block-image img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.nh-tile .nh-tile-body { padding: 22px; }
.nh-tile .nh-tile-body a { color: var(--accent-text); font-weight: 700; text-decoration: none; }
.nh-tile .nh-photo-wanted { aspect-ratio: 4 / 3; display: flex; align-items: center; justify-content: center; text-align: center; padding: 24px; margin: 0; background: var(--accent-wash); color: var(--wp--preset--color--muted); font-size: 14px; }

/* Now strip */
.nh-now { background: var(--accent-wash); border-top: 1px solid var(--wp--preset--color--line); border-bottom: 1px solid var(--wp--preset--color--line); }
.nh-now .nh-now-line { font-family: var(--wp--preset--font-family--display); font-weight: 600; font-size: 22px; line-height: 1.25; color: #FFFFFF; margin: 6px 0 0; }

/* Facts row */
.nh-facts { border: 1px solid var(--wp--preset--color--line); border-radius: 8px; overflow: hidden; gap: 1px !important; background: var(--wp--preset--color--line); }
.nh-facts > .wp-block-group { background: var(--wp--preset--color--page); padding: 16px 18px; }
.nh-facts p { margin: 0; }
.nh-facts .nh-fact-label { font-size: 12px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--wp--preset--color--muted); }
.nh-facts .nh-fact-value { font-weight: 700; color: #FFFFFF; font-variant-numeric: tabular-nums; }

/* Program page photo */
.nh-page-photo img { border-radius: 8px; width: 100%; aspect-ratio: 3 / 4; object-fit: cover; }

/* Open-for-more sections (Details block) */
.wp-block-details summary {
	cursor: pointer; list-style: none; padding: 18px 22px; display: flex; justify-content: space-between; gap: 16px;
	font-family: var(--wp--preset--font-family--display); font-weight: 600; font-size: 19px; color: #FFFFFF;
}
.wp-block-details summary::-webkit-details-marker { display: none; }
.wp-block-details summary::after { content: "+"; color: var(--accent-text); font-size: 24px; line-height: 1; }
.wp-block-details[open] summary::after { content: "\2013"; }
.wp-block-details > :not(summary) { margin-left: 22px; margin-right: 22px; }
.wp-block-details > :last-child { margin-bottom: 22px; }
.wp-block-details + .wp-block-details { margin-top: 12px; }
.wp-block-details li strong { color: #FFFFFF; }

/* Fund band */
.nh-band { background: var(--wp--preset--color--card); border-radius: 8px; overflow: hidden; }
.nh-band .wp-block-image { margin: 0; height: 100%; }
.nh-band .wp-block-image img { width: 100%; height: 100%; min-height: 240px; object-fit: cover; }
.nh-band .nh-band-text { padding: 32px; }

/* Link cards */
.nh-linkcard { border: 1px solid var(--wp--preset--color--line); border-radius: 8px; padding: 18px 22px; }
.nh-linkcard p { margin: 0; }
.nh-linkcard a { font-family: var(--wp--preset--font-family--display); font-weight: 600; font-size: 18px; color: var(--accent-text); text-decoration: none; }
.nh-linkcard .nh-linkcard-sub { color: var(--wp--preset--color--muted); font-size: 15px; }

/* News cards */
.nh-news .wp-block-post { background: var(--wp--preset--color--card); border-radius: 8px; overflow: hidden; }
.nh-news .wp-block-post-featured-image { margin: 0; }
.nh-news .wp-block-post-featured-image img { aspect-ratio: 4 / 3; object-fit: cover; }
.nh-news .nh-news-body { padding: 20px; }
.nh-news .wp-block-post-title a { text-decoration: none; color: #FFFFFF; }

/* Footer */
.nh-footer { border-top: 1px solid var(--wp--preset--color--line); color: var(--wp--preset--color--muted); font-size: 15px; }
.nh-footer .nh-logo img { width: 260px; height: auto; }
.nh-footer h2 { font-family: var(--wp--preset--font-family--text); font-size: 13px; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.nh-footer a { color: var(--wp--preset--color--body); text-decoration: none; }
.nh-footer a:hover { color: #FFFFFF; }
.nh-footer p { margin: 0 0 6px; }

/* WPForms on the black ground */
.wpforms-container input, .wpforms-container select, .wpforms-container textarea { background: #FFFFFF !important; color: #0C0C0C !important; }
.wpforms-container label, .wpforms-container .wpforms-field-label { color: var(--wp--preset--color--body) !important; }
.wpforms-container button[type="submit"] { background: var(--accent) !important; color: var(--accent-on) !important; border: 0 !important; border-radius: 4px !important; font-weight: 700 !important; }

@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; } }

/* Section spacing helpers used by the patterns */
.nh-section { padding-top: 72px; padding-bottom: 72px; }
.nh-section-tight { padding-top: 40px; padding-bottom: 40px; }
.nh-section-top0 { padding-top: 0; }

/* Browsers give <figure> a 40px side margin; block themes don't reset it */
figure.wp-block-image:not(.alignfull):not(.alignwide):not(.aligncenter) { margin-left: 0; margin-right: 0; }

/* Older pages still built with Divi, shown without Divi */
.nh-divi-page main { overflow-wrap: anywhere; }
.nh-divi-section { margin: 0 0 40px; }
.nh-divi-row { display: flex; flex-wrap: wrap; gap: 32px; margin: 0 0 24px; }
.nh-divi-col { flex: 1 1 260px; min-width: 0; }
.nh-divi-col.nh-col-4_4 { flex-basis: 100%; }
.nh-divi-image img, .nh-divi-blurb img, .nh-divi-slide img { border-radius: 8px; max-width: 100%; height: auto; }
.nh-divi-blurb h3 a { color: #FFFFFF; text-decoration: none; }
.nh-divi-sub { color: var(--wp--preset--color--muted); }
.nh-divi-buttons { margin: 16px 0; }
.nh-divi-accordion { display: grid; gap: 12px; margin: 16px 0; }
.nh-divi-accordion .wp-block-details + .wp-block-details { margin-top: 0; }
.nh-divi-code table { width: 100%; border-collapse: collapse; }
.nh-divi-code td, .nh-divi-code th { border: 1px solid var(--wp--preset--color--line); padding: 6px 8px; }

/* Placeholder where a photo is still wanted */
.nh-photo-wanted { border-radius: 8px; aspect-ratio: 4 / 3; display: flex; align-items: center; justify-content: center; text-align: center; padding: 24px; background: var(--accent-wash); color: var(--wp--preset--color--muted); font-size: 14px; }

/* Team list */
.nh-people p { margin: 0 0 4px; }
.nh-people .nh-role { color: var(--wp--preset--color--muted); font-size: 15px; margin-bottom: 14px; }
.nh-divi-accordion .wp-block-details { background: var(--wp--preset--color--card); border: 1px solid var(--wp--preset--color--line); border-radius: 8px; }

/* WPForms small print on the black ground */
.wpforms-container .wpforms-field-description, .wpforms-container .wpforms-field-sublabel, .wpforms-container .wpforms-field-limit-text,
.wpforms-container .wpforms-payment-total, .wpforms-container .wpforms-field-html, .wpforms-container .wpforms-field-payment-total,
.wpforms-container .wpforms-single-item-price, .wpforms-container .wpforms-field-payment-total * { color: var(--wp--preset--color--muted) !important; }
.wpforms-container .wpforms-payment-total, .wpforms-container .wpforms-field-html { color: var(--wp--preset--color--body) !important; }

/* Custom HTML blocks from the Divi pages were designed on white; keep them on paper */
.nh-divi-code { background: #FBF8F2; color: #1E1C1A; border-radius: 8px; padding: 24px; margin: 16px 0; }
.nh-divi-code a { color: #8A3F14; }
.nh-header p:has(> .nh-lang) { margin: 0; }
.nh-page-photo.nh-landscape img { aspect-ratio: 4 / 3; }
.nh-page-photo.nh-square img { aspect-ratio: 1 / 1; }
.wpforms-container .wpforms-field-html, .wpforms-container .wpforms-field-html * { color: var(--wp--preset--color--body) !important; }
.wpforms-container .wpforms-field-html h1, .wpforms-container .wpforms-field-html h2, .wpforms-container .wpforms-field-html h3, .wpforms-container .wpforms-field-html h4 { color: #FFFFFF !important; }

/* Materials list: name, with a short description under it in smaller type */
.nh-materials { list-style: none; padding-left: 0; display: grid; gap: 18px; }
.nh-materials li { font-size: 15px; line-height: 1.55; color: var(--wp--preset--color--muted); padding-left: 20px; position: relative; }
.nh-materials li::before { content: ""; position: absolute; left: 0; top: .55em; width: 8px; height: 8px; border-radius: 999px; background: var(--accent); }
.nh-materials li strong { font-size: 18px; color: #FFFFFF; font-family: var(--wp--preset--font-family--display); font-weight: 600; }
.wpforms-container .wpforms-field-content, .wpforms-container .wpforms-field-content * { color: var(--wp--preset--color--muted) !important; }
.wpforms-container .wpforms-field-content h1, .wpforms-container .wpforms-field-content h2, .wpforms-container .wpforms-field-content h3, .wpforms-container .wpforms-field-content h4 { color: #FFFFFF !important; }
.nh-linkcard h3 { margin: 6px 0 8px; }
.nh-linkcard .nh-linkcard-sub { max-width: 640px; }
.nh-linkcard > .wp-block-group { flex: 1 1 360px; }
.nh-linkcard .wp-block-button__link { color: var(--accent-on); font-family: var(--wp--preset--font-family--text); font-size: 15px; font-weight: 700; }
.nh-linkcard .wp-block-button__link:hover { color: var(--accent-on); }

/* Email updates band above the footer */
.nh-updates { border-top: 1px solid var(--wp--preset--color--line); background: var(--wp--preset--color--card); }
.nh-updates h2 { font-size: clamp(24px, 2.6vw, 30px); margin: 6px 0 8px; }
.nh-updates .wpforms-container { margin: 0 !important; }
.nh-updates .wpforms-field { padding-top: 0 !important; }
.nh-updates .wpforms-field-sublabel { display: none !important; }
.nh-updates .wpforms-field input, .nh-updates .wpforms-field .wpforms-field-row { max-width: 100% !important; }
.nh-updates .wpforms-field { padding-bottom: 12px !important; }
.nh-updates .wpforms-submit-container { padding-top: 4px !important; }

/* Signup band: soften the white a notch */
.nh-updates .wpforms-container input { background: #DCD6CC !important; border-color: #DCD6CC !important; color: #0C0C0C !important; }
.nh-updates .wpforms-container input::placeholder { color: #6E6A64 !important; }
.nh-updates .wpforms-container button[type="submit"] { background: #DCD6CC !important; color: #0C0C0C !important; }
.nh-updates .wpforms-container button[type="submit"]:hover { background: #E8E3DA !important; }
.nh-updates .wpforms-container button[type="submit"] { background: var(--accent) !important; color: var(--accent-on) !important; }
.nh-updates .wpforms-container button[type="submit"]:hover { background: var(--accent-hover) !important; }
body:not([class*="nh-accent-"]) .nh-updates .wpforms-container button[type="submit"] { background: #DCD6CC !important; color: #0C0C0C !important; }
body:not([class*="nh-accent-"]) .nh-updates .wpforms-container button[type="submit"]:hover { background: #E8E3DA !important; }
