/*
Theme Name: GenAI Base
Theme URI: https://genai4biz.com
Author: Andy
Description: A neutral, structurally complete Full Site Editing base theme. Every visual decision (colour, type, spacing) lives in theme.json as semantic tokens; this theme intentionally has almost no opinionated design so a child theme's theme.json can restyle it completely. Not intended to be used standalone as a "design" — pair it with a child theme.
Requires at least: 6.6
Tested up to: 7.1
Requires PHP: 8.1
Version: 1.1.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: genai-base

This file intentionally contains almost no design rules. Nearly everything
visual (colour, typography, spacing, block defaults) is defined in
theme.json, because theme.json values are what a child theme overrides.
What's here is limited to things theme.json genuinely cannot express:
focus-visible outlines beyond core block support, the skip-link's visual
treatment, a couple of small accessibility utilities, and the FAQ pattern's
<details>/<summary> marker styling. See README.md for the full design
rationale and a map of every token defined in theme.json.
*/

/* -----------------------------------------------------------------------
   Accessibility: screen-reader-only utility
   Used by the skip link and anywhere else text needs to exist for
   assistive tech only. Standard WordPress core pattern/class name so it
   matches conventions contributors and child-theme authors already know.
----------------------------------------------------------------------- */
.screen-reader-text {
	border: 0;
	clip: rect(1px, 1px, 1px, 1px);
	clip-path: inset(50%);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute !important;
	width: 1px;
	word-wrap: normal !important;
}

.screen-reader-text:focus {
	background-color: var(--wp--preset--color--base, #fff);
	color: var(--wp--preset--color--contrast, #111);
	clip: auto !important;
	clip-path: none;
	display: block;
	font-size: 1rem;
	font-weight: 600;
	height: auto;
	left: 1rem;
	line-height: normal;
	padding: 0.75rem 1.25rem;
	text-decoration: none;
	top: 1rem;
	width: auto;
	z-index: 100000;
	border-radius: var(--wp--custom--genai-base--radius--sm, 0.25rem);
	box-shadow: 0 0 0 2px var(--wp--preset--color--primary, #1a56db);
}

/* -----------------------------------------------------------------------
   Visible focus states
   WordPress core auto-injects a skip link for block themes and reuses the
   .screen-reader-text rules above for it. This block covers everything
   else: a consistent, clearly visible focus ring for every interactive
   element, regardless of block. Meets WCAG 2.2 focus-visibility guidance.
----------------------------------------------------------------------- */
a:focus-visible,
button:focus-visible,
input:focus-visible,
textarea:focus-visible,
select:focus-visible,
summary:focus-visible,
[tabindex]:focus-visible {
	outline: 2px solid var(--wp--preset--color--primary, #1a56db);
	outline-offset: 2px;
	border-radius: var(--wp--custom--genai-base--radius--sm, 0.25rem);
}

/* -----------------------------------------------------------------------
   FAQ accordion (core/details block)
   The FAQ pattern uses core/details for a native, JS-free accordion.
   Core styles the <details>/<summary> minimally; this adds a rotating
   disclosure indicator and consistent spacing so it reads as an
   accordion rather than a bare HTML disclosure widget.
----------------------------------------------------------------------- */
.genai-faq-item {
	border-bottom: 1px solid var(--wp--preset--color--border, #e2e2e2);
}

.genai-faq-item summary {
	cursor: pointer;
	font-weight: 600;
	padding-block: var(--wp--preset--spacing--sm, 1rem);
	list-style: none;
	position: relative;
	padding-inline-end: 2rem;
}

.genai-faq-item summary::-webkit-details-marker {
	display: none;
}

.genai-faq-item summary::after {
	content: "+";
	position: absolute;
	right: 0;
	top: var(--wp--preset--spacing--sm, 1rem);
	font-weight: 400;
	font-size: 1.25em;
	line-height: 1;
	transition: transform 0.15s ease;
}

.genai-faq-item[open] summary::after {
	content: "\2212"; /* minus sign */
}

.genai-faq-item .genai-faq-answer {
	padding-block-end: var(--wp--preset--spacing--sm, 1rem);
}

/* -----------------------------------------------------------------------
   Logo / trust bar placeholder tiles
   The logo bar pattern ships with neutral placeholder tiles (no real
   logos, since the base theme carries no client assets). This keeps
   them visually inert but obviously "placeholder" in the editor and on
   the front end until a child theme or page editor swaps in real logos.
----------------------------------------------------------------------- */
.genai-logo-placeholder {
	display: flex;
	align-items: center;
	justify-content: center;
	min-height: 3rem;
	border: 1px dashed var(--wp--preset--color--border, #e2e2e2);
	border-radius: var(--wp--custom--genai-base--radius--sm, 0.25rem);
	color: var(--wp--preset--color--muted-text, #6b7280);
	font-size: var(--wp--preset--font-size--x-small, 0.75rem);
	text-transform: uppercase;
	letter-spacing: 0.05em;
}

/* -----------------------------------------------------------------------
   Header navigation: hover and current-page states
   Default link colour is set via theme.json (styles.blocks.core/navigation),
   so a child theme's palette swap carries through automatically. Hover and
   current-page colours are handled here as plain CSS instead — WordPress
   has no theme.json key for "current page" at all, and theme.json's
   :hover sub-key for this block did not visibly apply on the live site
   (v1.0.5 moved it to plain CSS, but that also showed no visible change,
   most likely a tie in CSS specificity against theme.json's own generated
   default-colour rule, lost on source order). !important here removes any
   doubt about which rule wins. Both still read the same "primary" token,
   so they stay in step with whatever a child theme sets. Two current-page
   selectors because WordPress marks the current item two different ways
   depending on the block/link type; includes/navigation.php makes this
   fire consistently for every link type, not just auto-detected ones like
   Home Link.
----------------------------------------------------------------------- */
.wp-block-navigation-item__content:hover {
	color: var(--wp--preset--color--primary, currentColor) !important;
	background-color: transparent !important;
}

.wp-block-navigation-item.current-menu-item > .wp-block-navigation-item__content,
.wp-block-navigation-item__content[aria-current="page"] {
	color: var(--wp--preset--color--primary, currentColor);
	font-weight: 600;
}
