/*
Theme Name: Lettermen's Energy Standard
Theme URI: https://lettermens-energy.com/
Template: le-parent
Author: LimeLight Marketing
Author URI: https://limelightmarketing.com/
Description: Standard child theme for Lettermen's Energy dealer network - inherits all parent components with standard visual design
Version: 1.0.0
Tested up to: 6.7
Requires PHP: 8.2
License: MIT
Text Domain: le-standard
Tags: custom-background, custom-logo, custom-menu, translation-ready, block-theme, child-theme
*/

/* 
 * Child Theme Overrides
 * Add any Standard-specific CSS customizations below
 * Parent styles are automatically loaded
 */

/* Button corner radius — Standard = 6px. Consumed by the parent's `.le-btn`
   rule and the Gravity Forms submit rule. */
.le-standard {
	--le-btn-radius: 0.375rem;
}

/* Header */
.site-header {
	background-color: #fff;
	border-bottom: 1px solid var(--color-gray-light, #f0f0f0);
}

/* Allow the nav wrapper to participate in the header flex row without adding an extra box */
.le-header-nav-wrapper {
	display: block;
}

/* Utility Bar — hidden in Standard (Premium-only feature) */
.le-utility-bar {
	display: none;
}

/* Feature Grid Block — Standard */
.le-feature-grid-block .feature-grid-card {
	border-radius: 1rem;
}

/* FAQ Accordion — Standard */
.le-accordion-block .accordion-item {
	border-radius: 0.5rem;
}

/* Image Banner — Standard: matches the standard design — a 16:9 banner with a
   less pronounced corner radius. Premium keeps the block's default fixed height
   (h-72/h-80) and rounded-2xl (1rem). Unlayered + scoped so these beat the block's
   utilities (height:auto cancels h-72/md:h-80 so aspect-ratio governs the size). */
.le-standard .le-image-banner-frame {
	border-radius: 0.25rem;
	height: auto;
	aspect-ratio: 16 / 9;
}

/* Image Banner — Standard: no gradient overlay (the standard design shows a plain
   image). Premium keeps its brand gradient. */
.le-standard .le-image-banner-overlay {
	display: none;
}

/* Testimonial Section — Standard: clean, low-motion cards.
   Radius follows the parent's rounded-md (6px) token; only elevation differs. */
.le-standard .le-testimonial-card {
	box-shadow: 0 4px 14px rgba(0, 0, 0, 0.06);
	transition: box-shadow 160ms ease;
}

.le-standard .le-testimonial-card:hover {
	box-shadow: 0 8px 22px rgba(0, 0, 0, 0.1);
}

@media (prefers-reduced-motion: reduce) {
	.le-standard .le-testimonial-card {
		transition: none;
	}
}

/* Page Header — Standard: breadcrumbs live inside the navy header. When this
   block is present, hide the separate gray breadcrumb bar so the trail isn't
   shown twice. Pages without the block keep their gray bar. (:has scopes the
   hide to the page, not the whole site.) */
.le-standard:has(.le-page-header-block) .le-breadcrumb-bar {
	display: none;
}

.le-sticky-sidebar-block {
	padding-inline: 0.25rem;
}

/* Sticky sidebar ink — Standard. The rail paints the raw --color-primary, so its
   icons follow the dealer's "Text on Primary" ink instead of a hard-coded white,
   matching solid CTAs and the Gravity Forms submit. The token defaults to
   #ffffff, so this is a no-op until a dealer with a light primary sets it. */
.le-sticky-sidebar-block a {
	color: var(--color-on-primary, #fff);
}

/* Sticky sidebar hover — Standard. Same wash as Premium's: gives the icon a
   visible highlight behind its native title-attribute tooltip on hover. This
   isn't a Premium/Standard visual distinction, just parity that was missing. */
.le-sticky-sidebar-block a:hover {
	color: var(--color-on-primary, #fff);
	background-color: color-mix(in srgb, var(--color-on-primary, #fff) 10%, transparent);
}

html .gform_wrapper .gfield input[type="text"],
html .gform_wrapper .gfield input[type="email"],
html .gform_wrapper .gfield input[type="tel"],
html .gform_wrapper .gfield select,
html .gform_wrapper .gfield textarea {
	border-radius: 0.25rem !important;
	box-shadow: none !important;
	border-color: var(--color-border, #d1d5db) !important;
	background-color: var(--color-white, #fff) !important;
}

/* GF submit/footer buttons follow --le-btn-radius (Standard = 6px) via the
   parent's global GF rule, matching .le-btn CTAs — no radius override here.
   (The input FIELDS above stay 4px intentionally; buttons are not fields.) */

/* Location Archive cards — Standard: clean and low-motion, so the card gains
   elevation and a brand border on hover but does NOT lift. Only the arrow
   moves, and just enough to signal the card is a link (the visible "View
   Location" cue in the parent markup does the rest, including on touch). */
.le-standard .le-location-card {
	transition: box-shadow 160ms ease, border-color 160ms ease;
}

/* :focus-within so tabbing to the card's link gives the same feedback a mouse
   user gets — the elevation is part of the affordance, not just decoration. */
.le-standard .le-location-card:hover,
.le-standard .le-location-card:focus-within {
	box-shadow: 0 8px 22px rgba(0, 0, 0, 0.1);
	border-color: var(--color-primary, #007A78);
}

.le-standard .le-location-card-arrow {
	transition: transform 160ms ease;
}

.le-standard .le-location-card:hover .le-location-card-arrow,
.le-standard .le-location-card:focus-within .le-location-card-arrow {
	transform: translateX(2px);
}

@media (prefers-reduced-motion: reduce) {
	.le-standard .le-location-card,
	.le-standard .le-location-card-arrow {
		transition: none;
	}

	.le-standard .le-location-card:hover .le-location-card-arrow,
	.le-standard .le-location-card:focus-within .le-location-card-arrow {
		transform: none;
	}
}

/* Resource Links Grid — Standard: clean and low-motion. The card gains a
   subtle shadow and a brand border on hover but does NOT lift; the CTA button
   inside is the actual affordance. :focus-within so tabbing to that button
   gives keyboard users the same feedback. */
.le-standard .le-resource-links-grid-card {
	transition: box-shadow 160ms ease, border-color 160ms ease;
}

.le-standard .le-resource-links-grid-card:hover,
.le-standard .le-resource-links-grid-card:focus-within {
	box-shadow: 0 8px 22px rgba(0, 0, 0, 0.1);
	border-color: var(--color-primary, #007A78);
}

@media (prefers-reduced-motion: reduce) {
	.le-standard .le-resource-links-grid-card {
		transition: none;
	}
}
