/* Trideon Material — extras on top of theme.json */

@media (prefers-reduced-motion: no-preference) {
	html { scroll-behavior: smooth; }
}

/* Skip link + strong, visible focus for keyboard users */
.skip-link.screen-reader-text:focus {
	background: var(--wp--preset--color--surface);
	color: var(--wp--preset--color--primary-dark);
	font-size: 1.125rem;
	padding: 1rem 1.5rem;
	border-radius: 12px;
	box-shadow: var(--wp--preset--shadow--level-2);
}
:where(a, button, input, select, textarea, summary, [tabindex]):focus-visible {
	outline: 3px solid var(--wp--preset--color--primary-dark);
	outline-offset: 3px;
	border-radius: 6px;
}

/* Tap targets: at least 48px (Material + WCAG) */
.wp-block-button__link,
.wp-block-navigation-item__content,
.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-close,
.wp-block-search__button,
input[type="submit"], button {
	min-height: 48px;
}
.wp-block-button__link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: .5rem;
	transition: box-shadow .2s ease, background-color .2s ease;
}
.wp-block-button__link:hover { box-shadow: var(--wp--preset--shadow--level-2); }

/* Full-width buttons on phones — easier to hit */
@media (max-width: 599px) {
	.wp-block-buttons.is-stacked-mobile { flex-direction: column; align-items: stretch; }
	.wp-block-buttons.is-stacked-mobile > .wp-block-button { width: 100%; }
	.wp-block-buttons.is-stacked-mobile .wp-block-button__link { width: 100%; }
}

/* Tonal button style */
.wp-block-button.is-style-tonal .wp-block-button__link {
	background: var(--wp--preset--color--primary-container);
	color: var(--wp--preset--color--on-primary-container);
}

/* Card group style (Material elevated card) */
.wp-block-group.is-style-card {
	background: var(--wp--preset--color--surface);
	border-radius: 16px;
	box-shadow: var(--wp--preset--shadow--level-1);
	padding: var(--wp--preset--spacing--40);
}

/* Header */
.trideon-header { box-shadow: var(--wp--preset--shadow--level-1); }
.trideon-header .wp-block-site-logo img,
.trideon-header .trideon-logo img { height: 56px; width: auto; }
@media (min-width: 782px) {
	.trideon-header .wp-block-site-logo img,
	.trideon-header .trideon-logo img { height: 72px; }
}

/* Mobile menu overlay: big, readable links */
.wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
	font-size: var(--wp--preset--font-size--large);
	padding: .5rem 0;
}
.wp-block-navigation__responsive-container-open svg,
.wp-block-navigation__responsive-container-close svg { width: 32px; height: 32px; }

/* Links in body copy are always underlined so they're easy to spot */
.entry-content a:not(.wp-block-button__link),
.wp-block-post-content a:not(.wp-block-button__link) {
	text-decoration-thickness: 2px;
	text-underline-offset: 3px;
}

/* Phone call cards */
.trideon-call a { text-decoration: none; }

/* Form fields: large and clear */
input[type="text"], input[type="email"], input[type="search"], input[type="tel"], input[type="url"], textarea, select {
	font-size: 1.125rem;
	padding: .75rem 1rem;
	border: 2px solid var(--wp--preset--color--outline);
	border-radius: 8px;
	min-height: 48px;
}

/* Round icon badges (home page cards) */
.trideon-icon {
	width: 64px; height: 64px; border-radius: 50%;
	display: inline-flex; align-items: center; justify-content: center;
	color: #fff; margin-bottom: .5rem;
}

/* Checkmark list */
ul.is-style-checks { list-style: none; padding-left: 0; }
ul.is-style-checks li { position: relative; padding-left: 2.25rem; margin-bottom: .75rem; }
ul.is-style-checks li::before {
	content: ""; position: absolute; left: 0; top: .3em;
	width: 1.4rem; height: 1.4rem; border-radius: 50%;
	background: var(--wp--preset--color--accent-dark) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='white'%3E%3Cpath d='M9 16.2 4.8 12l-1.4 1.4L9 19 21 7l-1.4-1.4z'/%3E%3C/svg%3E") center/70% no-repeat;
}

/* Hero image: keep it modest on phones */
@media (max-width: 781px) {
	.wp-block-columns .wp-block-image img[src*="301405042"] { max-height: 260px; width: auto; margin-inline: auto; display: block; }
}

/* Full-width landing template: sections butt together */
.page-template-page-full-width .wp-block-post-content > .alignfull { margin-block: 0; }

/* ---- v1.2: white → #33CC33 gradient ---- */
/* Soft gradient page backdrop runs the full page height */
html { background: #FFFFFF; }
body { min-height: 100vh; background-attachment: scroll; }

/* Any block using a full-strength gradient gets dark, readable text and navy links */
.has-white-green-gradient-background,
.has-green-white-gradient-background,
.has-white-green-vertical-gradient-background { color: var(--wp--preset--color--on-surface); }
:is(.has-white-green-gradient-background,.has-green-white-gradient-background,.has-white-green-vertical-gradient-background) a:not(.wp-block-button__link) {
	color: var(--wp--preset--color--on-primary-container);
}

/* Decorative gradient bands on empty edges: under the header, above the footer */
.trideon-header { border-bottom: 0; position: relative; }
.trideon-header::after {
	content: ""; position: absolute; left: 0; right: 0; bottom: -6px; height: 6px;
	background: linear-gradient(90deg,#FFFFFF 0%,#33CC33 100%);
}
.trideon-footer { position: relative; }
.trideon-footer::before {
	content: ""; position: absolute; left: 0; right: 0; top: 0; height: 6px;
	background: linear-gradient(90deg,#33CC33 0%,#FFFFFF 100%);
}

/* Cards sit on gradients — keep them crisp white with a hint of green edge */
.wp-block-group.is-style-card { border: 1px solid rgba(51,204,51,.25); }

/* Dark outline button for use on gradients */
.wp-block-button.is-style-outline-dark .wp-block-button__link {
	background: transparent; color: var(--wp--preset--color--on-surface);
	border: 2px solid var(--wp--preset--color--on-surface);
}

/* ---- v1.3: primary = #33CC33 ---- */
/* White-on-green fails contrast, so anything on a primary fill gets dark text/icons */
.has-primary-background-color { color: var(--wp--preset--color--on-surface); }
.trideon-icon.has-primary-background-color { color: var(--wp--preset--color--on-surface); }
.wp-block-button__link.has-primary-background-color:not(.has-text-color) { color: var(--wp--preset--color--on-surface); }
.trideon-icon.has-accent-background-color { color: var(--wp--preset--color--on-surface); }