/*
 * ThemeFlow base styles.
 *
 * DESIGN RULE: keep this minimal and structural only. Do NOT define global
 * colors, typography scales, spacing systems, container widths, button styles,
 * form styles, or WooCommerce component styles here. Elementor global styles
 * and WooCommerce own those. This file only provides:
 *   - a light box-sizing reset
 *   - responsive media defaults
 *   - alignment / gallery classes WordPress emits
 *   - a neutral structural fallback for non-Elementor pages
 */

*,
*::before,
*::after {
	box-sizing: border-box;
}

img,
embed,
iframe,
object,
video {
	max-width: 100%;
	height: auto;
}

figure {
	margin: 1em 0;
}

/* WordPress alignment classes. */
.alignleft {
	float: left;
	margin-right: 1.5em;
	margin-bottom: 1em;
}

.alignright {
	float: right;
	margin-left: 1.5em;
	margin-bottom: 1em;
}

.aligncenter {
	display: block;
	margin-left: auto;
	margin-right: auto;
}

.alignwide {
	max-width: 1100px;
}

.alignfull {
	max-width: 100%;
}

/* WordPress caption. */
.wp-caption {
	max-width: 100%;
}

.wp-caption-text {
	font-size: 0.85em;
}

/* Gallery grid emitted by [gallery]. */
.gallery {
	display: flex;
	flex-wrap: wrap;
	gap: 0.5em;
}

.gallery-item {
	flex: 1 1 auto;
}

/* Sticky post marker (structural only). */
.sticky {
	display: block;
}

/*
 * Neutral structural container for classic (non-Elementor) templates only.
 * Scoped to ThemeFlow's own wrappers so it can never leak into Elementor
 * containers or WooCommerce markup. No colors or fonts declared.
 */
.themeflow-site-content {
	width: 100%;
}

.themeflow-main {
	width: 100%;
	max-width: var(--themeflow-content-max, 1200px);
	margin-left: auto;
	margin-right: auto;
	padding-left: clamp(1rem, 4vw, 2rem);
	padding-right: clamp(1rem, 4vw, 2rem);
}

/* Do not constrain Elementor-built canvases. */
body.elementor-page .themeflow-main {
	max-width: none;
	padding-left: 0;
	padding-right: 0;
}

/*
 * Elementor Theme Builder content locations (single/archive) own their own
 * layout, so the builder wrapper drops ThemeFlow's classic content-width
 * constraint. Scoped to ThemeFlow's own landmark; emitted only by
 * themeflow_render_elementor_main().
 */
.themeflow-main--builder {
	max-width: none;
	padding-left: 0;
	padding-right: 0;
}