/* DFT Games: supporting styles. theme.json carries the design tokens;
   this file covers what theme.json cannot express. */

/* --- Accessibility: never suppress zoom, never hide focus --- */
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: 2px solid var(--wp--preset--color--accent);
	outline-offset: 2px;
	border-radius: 2px;
}

.skip-link:focus {
	background: var(--wp--preset--color--accent);
	color: var(--wp--preset--color--ink);
	padding: .75rem 1.25rem;
	z-index: 100000;
}

/* --- Eyebrow label --- */
.dftg-eyebrow {
	font-family: var(--wp--preset--font-family--mono);
	text-transform: uppercase;
	letter-spacing: .12em;
	font-weight: 500;
	margin-block: 0;
}

/* --- Header --- */
.dftg-header .wp-block-site-logo img { display: block; height: auto; }

.dftg-nav a {
	text-decoration: none;
	color: var(--wp--preset--color--text);
}
.dftg-nav a:hover,
.dftg-nav a:focus-visible {
	color: var(--wp--preset--color--accent);
	text-decoration: underline;
	text-underline-offset: .25em;
}
.dftg-nav [aria-current="page"] { color: var(--wp--preset--color--accent); }

/* Mobile overlay menu should not inherit the light default */
.wp-block-navigation__responsive-container.is-menu-open {
	background-color: var(--wp--preset--color--base) !important;
	color: var(--wp--preset--color--text) !important;
	padding-top: var(--wp--preset--spacing--60);
}

/* --- Cards --- */
.dftg-card { transition: border-color .15s ease; }
.dftg-card:hover { border-color: var(--wp--preset--color--border) !important; }
.dftg-card > *:first-child { margin-block-start: 0; }
.dftg-card > *:last-child  { margin-block-end: 0; }

/* --- Footer --- */
.dftg-footer-list { list-style: none; padding-left: 0; margin-block: .5rem 0; }
.dftg-footer-list li { margin-block: .35rem; }
.dftg-footer-list a { text-decoration: none; color: var(--wp--preset--color--text); }
.dftg-footer-list a:hover,
.dftg-footer-list a:focus-visible { color: var(--wp--preset--color--accent); text-decoration: underline; }

/* --- Outline button variant --- */
.wp-block-button.is-style-outline > .wp-block-button__link {
	background: transparent;
	color: var(--wp--preset--color--accent);
	border: 1px solid var(--wp--preset--color--border);
}
.wp-block-button.is-style-outline > .wp-block-button__link:hover,
.wp-block-button.is-style-outline > .wp-block-button__link:focus-visible {
	background: var(--wp--preset--color--surface-raised);
	color: var(--wp--preset--color--accent-warm);
	border-color: var(--wp--preset--color--accent);
}

/* --- Forms --- */
input[type="text"], input[type="email"], input[type="search"], input[type="url"],
input[type="tel"], textarea, select {
	background: var(--wp--preset--color--surface);
	color: var(--wp--preset--color--text);
	border: 1px solid var(--wp--preset--color--border);
	border-radius: 4px;
	padding: .65rem .8rem;
	font: inherit;
	max-width: 100%;
}
::placeholder { color: var(--wp--preset--color--text-muted); opacity: 1; }

/* --- Media --- */
img, video, iframe { max-width: 100%; height: auto; }
figure figcaption {
	color: var(--wp--preset--color--text-muted);
	font-size: var(--wp--preset--font-size--sm);
	margin-block-start: .6rem;
}

/* --- Tables --- */
table { border-collapse: collapse; width: 100%; }
th, td { border-bottom: 1px solid var(--wp--preset--color--hairline); padding: .6rem .5rem; text-align: left; }
th { font-weight: 650; }

/* --- Respect reduced motion --- */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after {
		animation-duration: .001ms !important;
		transition-duration: .001ms !important;
		scroll-behavior: auto !important;
	}
}

/* --- Text measure: keeps prose readable inside wide containers --- */
.dftg-measure { max-width: 46rem; margin-inline: 0; }
.dftg-measure > * { max-width: 100%; }