/**
 * Storefront-inspired structural styles for WooCommerce-heavy pages.
 *
 * PURPOSE: Layout and structure ONLY. All colors, fonts, and visual tokens
 * are defined in hmh-overrides.css (:root block). This file references
 * var(--hmh-*) tokens — it does NOT declare its own.
 *
 * LOAD ORDER: reset.css → storefront-inspired.css → style.css → hmh-overrides.css
 */

/* --- Content Width Constraint --- */
/* --hmh-content-width is defined in hmh-overrides.css :root block */

.fl-page-content,
.site-content,
.content-area {
	max-width: var(--hmh-content-width);
	margin: 0 auto;
	padding: var(--hmh-space-xl) var(--hmh-space-md);
}

/* --- Heading rhythm --- */
h1, h2, h3, h4, h5, h6 {
	line-height: 1.25;
	margin-bottom: var(--hmh-space-md);
}

p + p {
	margin-top: var(--hmh-space-md);
}

/* --- Buttons (structural only — colors in hmh-overrides.css section 3) --- */
button,
.button,
input[type="button"],
input[type="submit"],
input[type="reset"],
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button {
	display: inline-block;
	padding: 0.65em 1.15em;
	line-height: 1.2;
	font-weight: 600;
	text-decoration: none;
	cursor: pointer;
	transition: filter 0.2s ease, transform 0.2s ease;
}

button:hover,
.button:hover,
input[type="button"]:hover,
input[type="submit"]:hover,
input[type="reset"]:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover {
	filter: brightness(0.95);
	transform: translateY(-1px);
}

/* --- Inputs (structural only — colors in hmh-overrides.css section 4) --- */
input[type="text"],
input[type="email"],
input[type="url"],
input[type="password"],
input[type="search"],
input[type="number"],
input[type="tel"],
textarea,
select {
	width: 100%;
	max-width: 100%;
	padding: 0.65em 0.8em;
	color: inherit;
}

/* --- Card-like containment for WooCommerce panels ---
   NOTE: .hentry, .widget, and ul.products are NOT styled here.
   - .hentry conflicts with individual product card styling (hmh-overrides 6.2)
   - ul.products is a GRID container, not a card (hmh-overrides 7.1)
   - .widget styling is in hmh-overrides or not needed
   - Individual product cards: hmh-overrides 6.2
   - Cart totals/checkout panels: hmh-overrides 9.2, 10.1, 10.2
   These selectors remain as FALLBACK only for pages not yet covered. --- */
.woocommerce .woocommerce-form-login,
.woocommerce .woocommerce-form-coupon,
.woocommerce .woocommerce-MyAccount-content,
.woocommerce .woocommerce-MyAccount-navigation {
	background: var(--hmh-surface, #fff);
	border: 1px solid var(--hmh-border, #e7e7e5);
	border-radius: var(--hmh-radius, 6px);
	padding: var(--hmh-space-lg, 1.5rem);
}

/* --- Product Grid ---
   REMOVED: Grid definition, li.product flex layout, product title sizing,
   button width, product image sizing — all fully handled by hmh-overrides.css
   sections 7.1–7.7 with proper specificity (body .woocommerce ...).
   Keeping this comment as a breadcrumb for future maintainers. */

/* --- Pagination ---
   REMOVED: Fully handled by hmh-overrides.css with proper specificity. */

/* --- Quantity inputs --- */
.woocommerce .quantity .qty {
	max-width: 5rem;
}

/* --- BB utility spacing ---
   REMOVED: Fully handled by hmh-overrides.css section 11. */

/* --- Responsive ---
   REMOVED: Fully handled by hmh-overrides.css section 13. */