/*
Theme Name: Directory Theme
Theme URI: https://github.com/freundlyapps/d-engine
Author: D-Engine
Description: A lean block theme for directories built with Directory Engine: semantic colour palette with light, dark and alternative style variations, templates for listings, categories, comparisons and guides, and patterns for search, top picks and trust. Works without the plugin, too.
Requires at least: 6.8
Tested up to: 7.1
Requires PHP: 8.2
Version: 0.8.1
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: directory-theme
Tags: block-patterns, block-styles, full-site-editing, style-variations, wide-blocks, accessibility-ready, one-column, two-columns, custom-colors, editor-style
*/

/*
 * Almost everything is in theme.json. Only what theme.json cannot express lives here.
 */

/* Skip link target and focus that is never hidden behind the sticky header. */
html {
	scroll-padding-block-start: 5rem;
}

:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 2px;
}

/* Search fields follow the palette (core draws a fixed light frame), and their outline
 * meets 3:1 against the background (WCAG 1.4.11). */
.wp-block-search__button-inside .wp-block-search__inside-wrapper,
.wp-block-search__input {
	background: var(--wp--preset--color--base);
	border-color: var(--wp--preset--color--muted);
	color: var(--wp--preset--color--contrast);
}

.wp-block-search__button-inside .wp-block-search__input {
	background: transparent;
}

/* Header: sticky on wide screens only, so it never covers content on phones. */
@media (min-width: 782px) {

	.directory-theme-header {
		position: sticky;
		inset-block-start: var(--wp-admin--admin-bar--height, 0px);
		z-index: 50;
	}
}

/* "Last updated:" only when WordPress prints a modification date. */
.directory-theme-updated:not(:has(time)) {
	display: none;
}

/* A card whose content rendered nothing (e.g. a call to action without a link) is hidden. */
.is-style-directory-card:not(:has(> *)) {
	display: none;
}

/* Wide tables in articles scroll sideways instead of widening the page. */
.wp-block-post-content :where(table) {
	display: block;
	max-width: 100%;
	overflow-x: auto;
}

/* Block style "Card" for groups and columns. */
:where(.is-style-directory-card) {
	background: var(--wp--preset--color--surface);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: var(--wp--custom--radius--large);
	padding: var(--wp--preset--spacing--50);
}

/* Block style "Eyebrow" for paragraphs: small uppercase label above a heading. */
:where(.is-style-directory-eyebrow) {
	color: var(--wp--preset--color--muted);
	font-size: var(--wp--preset--font-size--small);
	font-weight: 600;
	letter-spacing: 0.06em;
	text-transform: uppercase;
}

/* Block style "Checklist" for lists. */
:where(.is-style-directory-checklist) {
	list-style: none;
	padding-inline-start: 0;
}

:where(.is-style-directory-checklist) > li {
	padding-inline-start: 1.75em;
	position: relative;
}

:where(.is-style-directory-checklist) > li::before {
	content: "";
	position: absolute;
	inset-inline-start: 0.25em;
	inset-block-start: 0.35em;
	inline-size: 0.5em;
	block-size: 0.85em;
	border: solid var(--wp--preset--color--success);
	border-width: 0 0.15em 0.15em 0;
	transform: rotate(45deg);
}

@media (prefers-reduced-motion: reduce) {

	*,
	*::before,
	*::after {
		animation-duration: 0.01ms !important;
		transition-duration: 0.01ms !important;
		scroll-behavior: auto !important;
	}
}