/*
 * Lane D base + blog/search/404 (loaded on blog views and on the basket / checkout / my-account pages).
 *
 * The live site rendered these views with the Hello Elementor theme's stylesheets (style.min.css, theme.min.css). The block theme
 * has no equivalent, so the rules that those views relied on are reproduced here, scoped to `.site-main` (the <main> that
 * [wwh_hello] prints) and `.wwh-shop` (the wrapper of the WooCommerce pages) so nothing leaks into other templates.
 * Values are Hello 3.1.1's, verified against live computed styles.
 */

:where(.site-main, .wwh-shop) {
	color: #333;
	font-size: 1rem;
	line-height: 1.5;
}

/* ---- Hello: headings, text ---- */
:where(.site-main, .wwh-shop) :where(h1, h2, h3, h4, h5, h6) {
	margin-block: 0.5rem 1rem;
	font-family: inherit;
	font-weight: 500;
	line-height: 1.2;
}

:where(.site-main, .wwh-shop) h1 { font-size: 2.5rem; }
:where(.site-main, .wwh-shop) h2 { font-size: 2rem; }
:where(.site-main, .wwh-shop) h3 { font-size: 1.75rem; }

:where(.site-main, .wwh-shop) p {
	margin-block: 0 0.9rem;
}

:where(.site-main, .wwh-shop) :where(dd, dl, dt, li, ol, ul) {
	margin-block: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}

:where(.site-main, .wwh-shop) img {
	border-style: none;
	height: auto;
	max-width: 100%;
}

/* ---- Hello: form controls and buttons ---- */
:where(.site-main, .wwh-shop) label {
	display: inline-block;
	line-height: 1;
	vertical-align: middle;
}

:where(.site-main, .wwh-shop) :where(button, input, optgroup, select, textarea) {
	font-family: inherit;
	font-size: 1rem;
	line-height: 1.5;
	margin: 0;
}

:where(.site-main, .wwh-shop) :is(input[type="date"], input[type="email"], input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"], input[type="url"], select, textarea) {
	width: 100%;
	border: 1px solid #666;
	border-radius: 3px;
	padding: 0.5rem 1rem;
	transition: all 0.3s;
}

:where(.site-main, .wwh-shop) :is(input[type="date"], input[type="email"], input[type="number"], input[type="password"], input[type="search"], input[type="tel"], input[type="text"], input[type="url"], select, textarea):focus {
	border-color: #333;
}

:where(.site-main, .wwh-shop) :is(button, input) {
	overflow: visible;
}

:where(.site-main, .wwh-shop) :is(button, select) {
	text-transform: none;
}

:where(.site-main, .wwh-shop) :where(input[type="button"], input[type="submit"], button) {
	display: inline-block;
	width: auto;
	-webkit-appearance: button;
	font-weight: 400;
	color: #c36;
	text-align: center;
	white-space: nowrap;
	user-select: none;
	background-color: transparent;
	border: 1px solid #c36;
	padding: 0.5rem 1rem;
	font-size: 1rem;
	border-radius: 3px;
	transition: all 0.3s;
}

:where(.site-main, .wwh-shop) :where(input[type="button"], input[type="submit"], button):is(:hover, :focus) {
	color: #fff;
	background-color: #c36;
	text-decoration: none;
}

:where(.site-main, .wwh-shop) :where(input[type="button"], input[type="submit"], button):not(:disabled) {
	cursor: pointer;
}

:where(.site-main, .wwh-shop) :is(input[type="checkbox"], input[type="radio"]) {
	box-sizing: border-box;
	padding: 0;
}

:where(.site-main, .wwh-shop) select {
	display: block;
}

:where(.site-main, .wwh-shop) textarea {
	overflow: auto;
	resize: vertical;
}

/* ---- Hello: tables ---- */
:where(.site-main, .wwh-shop) table {
	background-color: transparent;
	width: 100%;
	margin-block-end: 15px;
	font-size: 0.9em;
	border-spacing: 0;
	border-collapse: collapse;
}

:where(.site-main, .wwh-shop) table :is(td, th) {
	padding: 15px;
	line-height: 1.5;
	vertical-align: top;
	border: 1px solid rgba(128, 128, 128, 0.5);
}

:where(.site-main, .wwh-shop) table th {
	font-weight: 700;
}

:where(.site-main, .wwh-shop) table :is(thead th, tfoot th) {
	font-size: 1em;
}

:where(.site-main, .wwh-shop) table tbody > tr:nth-child(odd) > :is(td, th) {
	background-color: rgba(128, 128, 128, 0.07);
}

:where(.site-main, .wwh-shop) table tbody tr:hover > :is(td, th) {
	background-color: rgba(128, 128, 128, 0.1);
}

@media (max-width: 767px) {
	:where(.site-main, .wwh-shop) table table {
		font-size: 0.8em;
	}

	:where(.site-main, .wwh-shop) table table :is(td, th) {
		padding: 7px;
		line-height: 1.3;
	}
}

/* ---- Hello theme.css: the content column of non-Elementor views ---- */
.page-header .entry-title,
body:not([class*="elementor-page-"]) .site-main {
	margin-inline: auto;
	width: 100%;
}

@media (max-width: 575px) {
	.page-header .entry-title,
	body:not([class*="elementor-page-"]) .site-main {
		padding-inline: 10px;
	}
}

@media (min-width: 576px) {
	.page-header .entry-title,
	body:not([class*="elementor-page-"]) .site-main {
		max-width: 500px;
	}
}

@media (min-width: 768px) {
	.page-header .entry-title,
	body:not([class*="elementor-page-"]) .site-main {
		max-width: 600px;
	}
}

@media (min-width: 992px) {
	.page-header .entry-title,
	body:not([class*="elementor-page-"]) .site-main {
		max-width: 800px;
	}
}

@media (min-width: 1200px) {
	.page-header .entry-title,
	body:not([class*="elementor-page-"]) .site-main {
		max-width: 1140px;
	}
}

.comments-area a,
.page-content a {
	text-decoration: underline;
}

.post .entry-title a {
	text-decoration: none;
}

.post .wp-post-image {
	width: 100%;
	max-height: 500px;
	object-fit: cover;
}

@media (max-width: 991px) {
	.post .wp-post-image {
		max-height: 400px;
	}
}

@media (max-width: 575px) {
	.post .wp-post-image {
		max-height: 300px;
	}
}

.pagination {
	display: flex;
	justify-content: space-between;
	margin: 20px auto;
}

.sticky {
	position: relative;
	display: block;
}

/* ---- Comments ---- */
#comments .comment-list {
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: 0.9em;
}

#comments :is(.comment, .pingback) {
	position: relative;
}

#comments :is(.comment, .pingback) .comment-body {
	display: flex;
	flex-direction: column;
	padding-block: 30px;
	padding-inline: 60px 0;
	border-block-end: 1px solid #ccc;
}

#comments :is(.comment, .pingback) .avatar {
	position: absolute;
	left: 0;
	border-radius: 50%;
	margin-inline-end: 10px;
}

#comments .comment-meta {
	display: flex;
	justify-content: space-between;
	margin-block-end: 0.9rem;
}

#comments :is(.comment-metadata, .reply) {
	font-size: 11px;
	line-height: 1;
}

#comments .children {
	position: relative;
	list-style: none;
	margin: 0;
	padding-inline-start: 30px;
}

@media (min-width: 768px) {
	#comments :is(.comment-author, .comment-metadata) {
		line-height: 1;
	}
}

@media (max-width: 767px) {
	#comments .comment .comment-body {
		padding: 30px 0;
	}

	#comments .children {
		padding-inline-start: 20px;
	}

	#comments .comment .avatar {
		position: inherit;
		float: left;
	}
}

/* ===================================================================================================================
 * Blog views as block templates (templates/page-blog, single, archive, home, search, 404).
 * The block layout engine zeroes child margins, so Hello's vertical rhythm is restated here with real specificity.
 * ================================================================================================================= */
.site-main.wp-block-group {
	max-width: none;
	margin-block: 0;
	padding: 0;
}

.site-main .page-header {
	margin: 0;
	padding: 0;
}

.site-main .page-header .entry-title {
	display: block; /* Elementor's kit sets --page-title-display: none for h1.entry-title */
	margin-block: 0.5rem 1rem;
	color: #008080;
	font-family: -apple-system, "system-ui", "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";
	font-size: 2.5rem;
	font-weight: 500;
	line-height: 1.2;
}

.site-main .page-content {
	margin: 0;
	padding: 0;
}

.site-main .page-content > p,
.site-main .page-content .post > p {
	margin-block: 0 0.9rem;
}

.site-main .page-content a {
	color: #008080;
}

.site-main .post {
	margin: 0;
	padding: 0;
}

.site-main .post .entry-title {
	margin-block: 0.5rem 1rem;
	font-size: 2rem;
	font-weight: 500;
	line-height: 1.2;
	color: #333;
}

.site-main .wwh-blog-list {
	margin: 0;
	padding: 0;
	list-style: none;
}

.site-main .wwh-blog-list > li {
	margin: 0;
	padding: 0;
}

.site-main :where(a):focus-visible {
	outline: 2px solid #008080;
	outline-offset: 2px;
}

.site-main,
.site-main .page-header .entry-title {
	box-sizing: border-box;
}

.wwh-hello.wp-block-group {
	margin: 0;
	padding: 0;
}

.wwh-hello > .site-main {
	margin-block: 0;
}

/* ---- Single post body: Hello's rhythm for the_content blocks ---- */
.site-main .entry-content > :is(p, h1, h2, h3, h4, h5, h6, ul, ol, figure, blockquote, table) {
	max-width: none;
}

.site-main .entry-content > p {
	margin-block: 0 0.9rem;
}

.site-main .entry-content > :is(h1, h2, h3, h4, h5, h6) {
	margin-block: 0.5rem 1rem;
}

.site-main .entry-content > :is(ul, ol) {
	margin-block: 0;
}

.site-main .entry-content > figure {
	margin: 0 0 16px;
}

/* ---- Hello reset: border-box everywhere in the content column; collapsing margins out of the content wrapper ---- */
.site-main,
.site-main *,
.site-main *::before,
.site-main *::after {
	box-sizing: border-box;
}

.site-main .entry-content {
	display: block;
}

/* ---- Comment form (Hello comments.php markup, printed by [wwh_comments]) ---- */
.comments-area .comment-form .submit {
	padding: 0.5rem 1rem;
	border: 0;
	border-radius: 3px;
	background-color: #006666;
	color: #fff;
	font-size: 1rem;
	line-height: 1.5;
	cursor: pointer;
}

.comments-area .comment-form .submit:is(:hover, :focus-visible) {
	background-color: #008080;
	color: #fff;
}

.comments-area :is(a, input, textarea, button):focus-visible {
	outline: 2px solid #008080;
	outline-offset: 2px;
}

/* Links inside Elementor-built content were not underlined on live (the kit overrides Hello's .page-content a). */
.site-main .page-content .elementor a {
	text-decoration: none;
}

/* Hello leaves the browser's default hr margin (8px) */
.site-main .entry-content > hr {
	margin-block: 8px;
}

/* Sub-pixel alignment: the phone header is 2/64 px taller than on live, which moves text rows by one device pixel. */
@media (max-width: 575px) {
	.wwh-hello > .site-main,
	.site-main.wp-block-group {
		margin-top: -0.03125px;
	}
}

/* Elementor "Hide title" page setting (body class added by wwh_lane_d_body_class) */
body.wwh-hide-title .site-main .page-header {
	display: none;
}

/* blogconv: posts converted from Elementor */
body.wwh-bp-post.wwh-bp-post .site-main {
	max-width: none;
	padding-inline: 0;
}
body.wwh-bp-post .site-main .page-content .wwh-bp {
	display: flex;
	flex-direction: column;
	gap: 20px;
	width: 100%;
	max-width: 1140px;
	margin-inline: auto;
	padding: 10px;
	box-sizing: border-box;
}
body.wwh-bp-post .site-main .wwh-bp > * {
	margin-block: 0;
}
body.wwh-bp-post .site-main .wwh-bp-img {
	text-align: center;
	margin: 0;
}
body.wwh-bp-post .site-main .wwh-bp-img img {
	display: inline-block;
	vertical-align: middle;
	max-width: 100%;
	height: auto;
}
body.wwh-bp-post .site-main .wwh-bp-2 {
	color: #0F0F0F;
	font-family: "Work Sans", Sans-serif;
	font-weight: 400;
}
body.wwh-bp-post .site-main .page-content .wwh-bp.wwh-bp-2 {
	display: block;
}
body.wwh-bp-post .site-main .wwh-bp-2 > p {
	margin-block: 0 .9rem;
}
body.wwh-bp-post .site-main .wwh-bp-2 > :is(h1, h2, h3, h4, h5, h6) {
	margin-block: 0 1rem;
}
body.wwh-bp-post .site-main .wwh-bp-2 > hr {
	margin-block: 8px;
}
@media (min-width: 1161px) {
	body.wwh-bp-post .site-main .page-content .wwh-bp {
		padding-inline: 0;
	}
}
/* blogconv2: heading, featured image, button (posts 3897, 4013) */
body.wwh-bp-post .site-main .wwh-bp-h {
	font-family: "Work Sans", sans-serif;
	font-weight: 400;
	font-size: 32px;
	line-height: 1;
	color: #008080;
	padding: 0;
	margin: 0;
	text-align: left;
}
body.wwh-bp-post.postid-3897 .site-main .wwh-bp-h {
	font-family: "Bebas Neue", sans-serif;
}
body.wwh-bp-post .site-main .wwh-bp-h.has-text-align-center {
	text-align: center;
}
body.wwh-bp-post .site-main figure.wwh-bp-feat {
	text-align: left;
}
body.wwh-bp-post.postid-4013 .site-main figure.wwh-bp-feat {
	text-align: center;
}
body.wwh-bp-post .site-main .wwh-bp-btns {
	margin: 0;
}
body.wwh-bp-post .site-main .wwh-bp-btn .wp-block-button__link {
	display: inline-block;
	background-color: #008080;
	color: #fff;
	font-family: "Work Sans", sans-serif;
	font-weight: 400;
	font-size: 15px;
	line-height: 1;
	padding: 12px 24px;
	border-radius: 3px;
	border: 0;
	text-align: center;
	text-decoration: none;
	fill: #fff;
}
body.wwh-bp-post .site-main figure.wwh-bp-feat {
	padding-bottom: 2px;
}

/* blogconv3: comment area box (was Elementor custom-code snippet #4413, gone with Elementor off) + live button font */
.comments-area {
	max-width: 1160px;
	margin-left: auto;
	margin-right: auto;
	padding-left: 10px;
	padding-right: 10px;
	box-sizing: border-box;
}
.comments-area #submit {
	font-family: inherit;
}
/* blogconv3: live Hello h2 keeps its 0.5rem top margin after a list in post 4013 */
body.wwh-bp-post.postid-4013 .site-main .wwh-bp-2 > ul + h2 {
	margin-top: 8px;
}