/*
Theme Name: Elves Across America
Description: Matches the Elves Across America website design. The full site stylesheet is generated by the "Elves Across America – Site Importer & Core" plugin (uploads/eaa/site.css); this file only adds WordPress-specific header menu and form styling.
Version: 1.0.0
Author: Elves Across America
Requires at least: 6.0
Requires PHP: 7.4
License: GPL-2.0-or-later
Text Domain: elves-across-america
*/

/* ---------- Header navigation (replaces the original JavaScript dropdowns) ---------- */
.eaa-menu, .eaa-menu .sub-menu, .eaa-mobile-menu, .eaa-mobile-menu .sub-menu { list-style: none; margin: 0; padding: 0; }
.eaa-menu { display: flex; align-items: center; gap: 2px; }
.eaa-menu > li { position: relative; }
.eaa-menu > li > a {
	display: inline-flex; align-items: center; gap: 4px; cursor: pointer;
	border-radius: 9999px; padding: .375rem .625rem; font-size: 13px; font-weight: 600;
	color: color-mix(in oklab, var(--foreground) 70%, transparent); text-decoration: none; transition: color .15s;
}
.eaa-menu > li > a:hover, .eaa-menu > li:focus-within > a { color: var(--primary); }
.eaa-menu > li.menu-item-has-children > a::after {
	content: ""; width: 6px; height: 6px; margin-left: 2px; margin-top: -3px;
	border-right: 2px solid currentColor; border-bottom: 2px solid currentColor; transform: rotate(45deg);
}
.eaa-menu .sub-menu {
	display: none; position: absolute; left: 0; top: 100%; z-index: 60; width: 16rem; padding: .5rem;
	background: var(--background); border: 1px solid var(--border); border-radius: .375rem; box-shadow: var(--shadow-card);
}
.eaa-menu > li:hover > .sub-menu, .eaa-menu > li:focus-within > .sub-menu { display: block; }
.eaa-menu .sub-menu a, .eaa-mobile-menu a {
	display: block; cursor: pointer; padding: .625rem .75rem; border-radius: .25rem; font-size: 14px; font-weight: 600;
	color: var(--foreground); text-decoration: none;
}
.eaa-menu .sub-menu a:hover, .eaa-mobile-menu a:hover { background: var(--muted); }

.eaa-mobile { position: relative; }
.eaa-mobile > summary { list-style: none; cursor: pointer; display: inline-flex; width: 2.5rem; height: 2.5rem; align-items: center; justify-content: center; border-radius: 9999px; }
.eaa-mobile > summary::-webkit-details-marker { display: none; }
.eaa-mobile-panel {
	position: absolute; right: 0; top: calc(100% + .5rem); z-index: 60; width: min(86vw, 20rem); max-height: 80vh; overflow-y: auto;
	padding: .75rem; background: var(--background); border: 1px solid var(--border); border-radius: .5rem; box-shadow: var(--shadow-card);
}
.eaa-mobile-menu > li { border-bottom: 1px solid var(--border); padding: .25rem 0; }
.eaa-mobile-menu > li > a[href="#"] { pointer-events: none; font-size: 12px; font-weight: 700; color: var(--secondary); }
.eaa-mobile-panel .eaa-mobile-donate { display: flex; margin-top: .75rem; }

/* ---------- FAQ (help page) ---------- */
.eaa-faq summary { list-style: none; }
.eaa-faq summary::-webkit-details-marker { display: none; }
.eaa-faq summary::after { content: "+"; float: right; color: var(--muted-foreground); }
.eaa-faq details[open] summary::after { content: "–"; }

/* ---------- Ninja Forms in the site style ---------- */
.eaa-ninja-form .nf-form-content { padding: 0; max-width: none; }
.eaa-ninja-form .nf-form-content input:not([type=button]):not([type=submit]):not([type=checkbox]),
.eaa-ninja-form .nf-form-content select,
.eaa-ninja-form .nf-form-content textarea {
	background: var(--background); border: 1px solid var(--border); border-radius: .5rem; color: var(--foreground); font: inherit; padding: .65rem .8rem; min-height: 2.75rem;
}
.eaa-ninja-form .nf-form-content input[type=submit], .eaa-ninja-form .nf-form-content button {
	background: var(--secondary); color: var(--secondary-foreground); border: 0; border-radius: .375rem;
	padding: .75rem 1.5rem; font-weight: 600; cursor: pointer;
}
.eaa-ninja-form .nf-form-content label { font-weight: 600; }
.eaa-wp-form-section h2 { margin-bottom: 1rem; }
.eaa-wp-form-section p { margin-bottom: 1rem; }

/* ---------- Blog / default WordPress content fallback ---------- */
.eaa-default { max-width: 48rem; margin: 0 auto; padding: 3rem 1rem; }
.eaa-default h1 { font-size: 2rem; margin-bottom: 1rem; }