/*
Theme Name: Johnson Bed Bug
Theme URI: https://johnsonbedbug.com
Author: Johnson Bed Bug
Description: Sales-focused block theme for Johnson Bed Bug — Oregon's bed bug extermination specialists.
Version: 1.0.0
Requires at least: 6.3
Tested up to: 6.7
Requires PHP: 8.0
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: johnsonbedbug
Tags: full-site-editing, block-themes
*/

/* ── Navigation ───────────────────────────────────────────── */

.wp-block-navigation .wp-block-navigation__container {
	gap: 1.75rem;
}

.wp-block-navigation a.wp-block-navigation-item__content {
	color: var(--wp--preset--color--light);
	text-decoration: none;
	padding-bottom: 3px;
	border-bottom: 2px solid transparent;
	transition: color 0.2s ease, border-color 0.2s ease;
}

.wp-block-navigation a.wp-block-navigation-item__content:hover {
	color: var(--wp--preset--color--white);
	border-bottom-color: var(--wp--preset--color--accent);
}

.wp-block-navigation .current-menu-item a.wp-block-navigation-item__content {
	color: var(--wp--preset--color--white);
	border-bottom-color: var(--wp--preset--color--accent);
}

/* Mobile overlay */
.wp-block-navigation__responsive-container {
	background-color: var(--wp--preset--color--dark);
}

.wp-block-navigation__responsive-container a.wp-block-navigation-item__content {
	color: var(--wp--preset--color--white);
	border-bottom: none;
	font-size: 1.5rem;
	padding: 0.75rem 0;
}

.wp-block-navigation__responsive-container a.wp-block-navigation-item__content:hover {
	color: var(--wp--preset--color--accent);
	border-bottom: none;
}

/* Hamburger button — visible on dark/mid header */
.wp-block-navigation__responsive-container-open,
.wp-block-navigation__responsive-container-close {
	color: var(--wp--preset--color--white) !important;
}

.wp-block-navigation__responsive-container-open svg,
.wp-block-navigation__responsive-container-close svg {
	fill: var(--wp--preset--color--white);
}

.wp-block-navigation__responsive-container-open svg path,
.wp-block-navigation__responsive-container-close svg path {
	fill: var(--wp--preset--color--white);
}

/* ── Service Cards ────────────────────────────────────────── */

.service-card {
	overflow: hidden;
}

/* ── Contact Form (Ninja Forms) ───────────────────────────── */

.contact-form-card {
	box-shadow: 0 12px 40px rgba(17, 27, 16, 0.08);
	border: 1px solid rgba(76, 89, 52, 0.12);
}

/* Strip Ninja Forms' default field chrome so ours shows through */
.contact-form-card .nf-form-content {
	padding: 0;
	max-width: none;
}

.contact-form-card .nf-form-fields-required {
	color: var(--wp--preset--color--primary);
	font-size: 0.8125rem;
}

.contact-form-card .nf-field-container {
	margin-bottom: 1.25rem;
}

/* Labels — match the theme's display font */
.contact-form-card .nf-field-label label {
	font-family: var(--wp--preset--font-family--display);
	font-weight: 700;
	font-size: 0.9375rem;
	color: var(--wp--preset--color--dark);
	margin-bottom: 0.4rem;
}

.contact-form-card .nf-field-label .ninja-forms-req-symbol {
	color: var(--wp--preset--color--secondary);
}

/* Text-style inputs + textarea */
.contact-form-card .nf-field-element input:not([type="button"]):not([type="checkbox"]):not([type="radio"]),
.contact-form-card .nf-field-element textarea,
.contact-form-card .nf-field-element select {
	width: 100%;
	box-sizing: border-box;
	font-family: var(--wp--preset--font-family--body);
	font-size: 1rem;
	color: var(--wp--preset--color--dark);
	background-color: var(--wp--preset--color--white);
	border: 1px solid rgba(76, 89, 52, 0.25);
	border-radius: 4px;
	padding: 0.75rem 0.9rem;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
	height: auto;
}

.contact-form-card .nf-field-element input::placeholder,
.contact-form-card .nf-field-element textarea::placeholder {
	color: rgba(76, 89, 52, 0.55);
}

.contact-form-card .nf-field-element input:not([type="button"]):focus,
.contact-form-card .nf-field-element textarea:focus,
.contact-form-card .nf-field-element select:focus {
	outline: none;
	border-color: var(--wp--preset--color--primary);
	box-shadow: 0 0 0 3px rgba(161, 154, 88, 0.25);
}

.contact-form-card .nf-field-element textarea {
	resize: vertical;
}

/* Submit button — theme accent */
.contact-form-card .nf-field-element input[type="button"],
.contact-form-card .nf-field-element .ninja-forms-field[type="button"] {
	display: block;
	width: 100%;
	margin-top: 0.5rem;
	font-family: var(--wp--preset--font-family--display);
	font-weight: 800;
	font-size: 1.125rem;
	letter-spacing: 0.02em;
	color: var(--wp--preset--color--dark);
	background-color: var(--wp--preset--color--accent);
	border: none;
	border-radius: 4px;
	padding: 0.95rem 1.75rem;
	cursor: pointer;
	transition: filter 0.2s ease, transform 0.05s ease;
}

.contact-form-card .nf-field-element input[type="button"]:hover {
	filter: brightness(0.94);
}

.contact-form-card .nf-field-element input[type="button"]:active {
	transform: translateY(1px);
}

.contact-form-card .jbb-form-note a {
	font-weight: 700;
	color: var(--wp--preset--color--primary);
}

@media (max-width: 600px) {
	.contact-form-card {
		padding: 1.75rem !important;
	}
}

/* ── Mobile Header ────────────────────────────────────────── */

@media (max-width: 780px) {
	/* Hide "Available 7 Days" sub-label in header on mobile */
	header .wp-block-group > .wp-block-group:last-child .wp-block-group > .wp-block-group > p:last-child {
		display: none;
	}

	/* Shrink header phone number on small screens */
	header .wp-block-group > .wp-block-group:last-child p:first-child a {
		font-size: 1rem !important;
	}
}

/* ── Mobile Buttons ───────────────────────────────────────── */

@media (max-width: 600px) {
	.wp-block-buttons .wp-block-button {
		width: 100%;
	}

	.wp-block-buttons .wp-block-button .wp-block-button__link {
		display: block;
		text-align: center;
		font-size: 1rem !important;
		padding: 0.9rem 1.5rem !important;
		box-sizing: border-box;
	}
}

/* ── Mobile Typography ────────────────────────────────────── */

@media (max-width: 600px) {
	.wp-block-cover h1.wp-block-heading {
		font-size: 2.5rem !important;
		letter-spacing: -0.02em;
	}

	.wp-block-heading {
		word-break: break-word;
	}
}

/* ── Mobile Proof Section — force stack ──────────────────── */

@media (max-width: 781px) {
	.wp-block-columns.is-not-stacked-on-mobile {
		flex-direction: column !important;
	}

	.wp-block-columns.is-not-stacked-on-mobile > .wp-block-column {
		flex-basis: 100% !important;
		width: 100% !important;
	}
}