/*
Theme Name: TendraPet Child
Theme URI: https://tendrapet.com/
Description: Lightweight Storefront child theme for TendraPet.
Author: TendraPet
Template: storefront
Version: 1.3.1
Text Domain: tendrapet
*/

:root {
	--tendrapet-green: #24483b;
	--tendrapet-green-dark: #18352b;
	--tendrapet-coral: #e97858;
	--tendrapet-cream: #faf8f4;
	--tendrapet-white: #ffffff;
	--tendrapet-text: #202723;
	--tendrapet-muted: #66706a;
	--tendrapet-border: #e6e8e4;
	--tendrapet-success: #2f7d57;
	--tendrapet-content-width: 75rem;
	--tendrapet-radius: 0.75rem;
}

html {
	box-sizing: border-box;
	overflow-x: hidden;
}

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

body {
	background: var(--tendrapet-cream);
	color: var(--tendrapet-text);
	font-family: Inter, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
	line-height: 1.65;
}

img {
	height: auto;
	max-width: 100%;
}

a {
	color: var(--tendrapet-green);
}

a:hover,
a:focus {
	color: var(--tendrapet-coral);
}

.col-full {
	max-width: var(--tendrapet-content-width);
	padding-left: 1rem;
	padding-right: 1rem;
}

.tendrapet-announcement {
	background: var(--tendrapet-green-dark);
	color: var(--tendrapet-white);
	font-size: 0.875rem;
	letter-spacing: 0.01em;
	padding: 0.55rem 1rem;
	text-align: center;
}

.site-header {
	background: var(--tendrapet-white);
	border-bottom: 1px solid var(--tendrapet-border);
	padding-bottom: 1rem;
	padding-top: 1rem;
}

.site-branding .site-title a {
	color: var(--tendrapet-green-dark);
	font-size: clamp(1.4rem, 4vw, 1.85rem);
	font-weight: 750;
	letter-spacing: -0.035em;
}

.site-branding .site-description {
	color: var(--tendrapet-muted);
}

.main-navigation ul.menu > li > a,
.main-navigation ul.nav-menu > li > a {
	color: var(--tendrapet-text);
	font-weight: 600;
}

.site-header-cart .cart-contents,
.site-search .widget_product_search form::before {
	color: var(--tendrapet-green);
}

button,
.button,
input[type="button"],
input[type="reset"],
input[type="submit"],
.added_to_cart,
.widget a.button {
	background: var(--tendrapet-green);
	border: 0;
	border-radius: 999px;
	color: var(--tendrapet-white);
	font-weight: 700;
	padding: 0.8rem 1.25rem;
}

button:hover,
.button:hover,
input[type="submit"]:hover,
.added_to_cart:hover,
.widget a.button:hover {
	background: var(--tendrapet-green-dark);
	color: var(--tendrapet-white);
}

input[type="text"],
input[type="email"],
input[type="tel"],
input[type="password"],
input[type="search"],
textarea,
select {
	background: var(--tendrapet-white);
	border: 1px solid var(--tendrapet-border);
	border-radius: 0.5rem;
	box-shadow: none;
}

.site-main,
.content-area {
	min-width: 0;
}

.woocommerce-message,
.woocommerce-info,
.woocommerce-noreviews,
p.no-comments {
	background: var(--tendrapet-success);
}

/* Commerce foundation. */
.woocommerce-breadcrumb {
	color: var(--tendrapet-muted);
	font-size: 0.875rem;
}

.woocommerce-products-header,
.woocommerce .product,
.woocommerce-cart-form,
.cart-collaterals,
.woocommerce-checkout,
.woocommerce-account .woocommerce {
	min-width: 0;
}

.woocommerce ul.products li.product {
	background: var(--tendrapet-white);
	border: 1px solid var(--tendrapet-border);
	border-radius: var(--tendrapet-radius);
	padding: 1rem;
}

.woocommerce ul.products li.product img {
	border-radius: calc(var(--tendrapet-radius) * 0.75);
}

.woocommerce ul.products li.product .woocommerce-loop-product__title,
.single-product div.product .product_title {
	color: var(--tendrapet-green-dark);
}

.woocommerce ul.products li.product .price,
.single-product div.product p.price {
	color: var(--tendrapet-green);
	font-weight: 800;
}

.single-product div.product .summary {
	background: var(--tendrapet-white);
	border: 1px solid var(--tendrapet-border);
	border-radius: var(--tendrapet-radius);
	padding: clamp(1.25rem, 4vw, 2rem);
}

.single-product div.product form.cart {
	border-bottom: 1px solid var(--tendrapet-border);
	border-top: 1px solid var(--tendrapet-border);
	margin: 1.5rem 0;
	padding: 1.5rem 0;
}

.tendrapet-product-assurance {
	background: var(--tendrapet-cream);
	border: 1px solid var(--tendrapet-border);
	border-radius: var(--tendrapet-radius);
	margin-top: 1.25rem;
	padding: 1.1rem 1.25rem;
}

.tendrapet-product-assurance h2 {
	font-size: 1rem;
	margin: 0 0 0.65rem;
}

.tendrapet-product-assurance ul {
	font-size: 0.9rem;
	list-style: none;
	margin: 0;
}

.tendrapet-product-assurance li {
	margin: 0.35rem 0;
	padding-left: 1.25rem;
	position: relative;
}

.tendrapet-product-assurance li::before {
	color: var(--tendrapet-success);
	content: "\2713";
	font-weight: 800;
	left: 0;
	position: absolute;
}

.tendrapet-shop-note {
	background: var(--tendrapet-cream);
	border-left: 3px solid var(--tendrapet-coral);
	margin-bottom: 1.5rem;
	padding: 0.9rem 1rem;
}

.tendrapet-info-page {
	background: var(--tendrapet-white);
	padding: clamp(2.5rem, 7vw, 5rem) 0;
}

.tendrapet-info-page__inner {
	margin: 0 auto;
	max-width: 52rem;
}

.tendrapet-info-page .entry-title {
	color: var(--tendrapet-green-dark);
	font-size: clamp(2rem, 6vw, 3.5rem);
	letter-spacing: -0.04em;
	line-height: 1.1;
}

.tendrapet-info-page .entry-content > h2 {
	border-top: 1px solid var(--tendrapet-border);
	color: var(--tendrapet-green-dark);
	margin-top: 2.5rem;
	padding-top: 2rem;
}

.tendrapet-sticky-cart {
	display: none;
}

.site-footer {
	background: var(--tendrapet-green-dark);
	color: rgba(255, 255, 255, 0.82);
	padding-bottom: 2rem;
	padding-top: 3rem;
}

.site-footer a {
	color: var(--tendrapet-white);
}

.tendrapet-footer-credit {
	border-top: 1px solid rgba(255, 255, 255, 0.14);
	font-size: 0.875rem;
	margin-top: 1.5rem;
	padding-top: 1.25rem;
}

.tendrapet-home {
	margin: 0;
}

.tendrapet-home .col-full {
	margin-left: auto;
	margin-right: auto;
}

.tendrapet-hero {
	background: linear-gradient(145deg, #f1eee7 0%, #faf8f4 58%, #e8f0eb 100%);
	padding: clamp(3.5rem, 8vw, 7rem) 0;
}

.tendrapet-hero__inner,
.tendrapet-split,
.tendrapet-faq-preview {
	display: grid;
	gap: 2rem;
}

.tendrapet-hero h1 {
	color: var(--tendrapet-green-dark);
	font-size: clamp(2.45rem, 8vw, 4.8rem);
	letter-spacing: -0.055em;
	line-height: 1.02;
	margin: 0 0 1.25rem;
	max-width: 12ch;
}

.tendrapet-eyebrow {
	color: var(--tendrapet-coral);
	font-size: 0.78rem;
	font-weight: 800;
	letter-spacing: 0.11em;
	margin-bottom: 0.85rem;
	text-transform: uppercase;
}

.tendrapet-hero__lead {
	color: var(--tendrapet-muted);
	font-size: clamp(1.05rem, 2vw, 1.25rem);
	max-width: 36rem;
}

.tendrapet-actions {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 1rem 1.25rem;
	margin-top: 1.75rem;
}

.tendrapet-text-link {
	font-weight: 750;
}

.tendrapet-hero__panel {
	align-self: end;
	background: var(--tendrapet-white);
	border: 1px solid rgba(36, 72, 59, 0.12);
	border-radius: calc(var(--tendrapet-radius) * 1.5);
	box-shadow: 0 1.25rem 3.5rem rgba(24, 53, 43, 0.1);
	padding: clamp(1.5rem, 5vw, 2.5rem);
}

.tendrapet-hero__panel > p {
	color: var(--tendrapet-green-dark);
	font-size: 1.25rem;
	font-weight: 800;
}

.tendrapet-hero__panel ul {
	list-style: none;
	margin: 1rem 0 0;
}

.tendrapet-hero__panel li {
	border-top: 1px solid var(--tendrapet-border);
	padding: 0.85rem 0 0.85rem 1.5rem;
	position: relative;
}

.tendrapet-hero__panel li::before {
	color: var(--tendrapet-success);
	content: "\2713";
	font-weight: 800;
	left: 0;
	position: absolute;
}

.tendrapet-section {
	background: var(--tendrapet-white);
	padding: clamp(3.5rem, 8vw, 6.5rem) 0;
}

.tendrapet-section--tint {
	background: var(--tendrapet-cream);
}

.tendrapet-section--dark {
	background: var(--tendrapet-green-dark);
	color: rgba(255, 255, 255, 0.82);
}

.tendrapet-section h2 {
	color: var(--tendrapet-green-dark);
	font-size: clamp(1.9rem, 5vw, 3.25rem);
	letter-spacing: -0.04em;
	line-height: 1.12;
	margin-bottom: 2rem;
	max-width: 19ch;
}

.tendrapet-section--dark h2 {
	color: var(--tendrapet-white);
}

.tendrapet-card-grid {
	display: grid;
	gap: 1rem;
}

.tendrapet-card,
.tendrapet-model-card {
	border: 1px solid var(--tendrapet-border);
	border-radius: var(--tendrapet-radius);
	padding: clamp(1.35rem, 4vw, 2rem);
}

.tendrapet-card h3,
.tendrapet-model-card h3 {
	color: var(--tendrapet-green-dark);
	font-size: 1.25rem;
	margin-bottom: 0.65rem;
}

.tendrapet-model-card {
	border-color: rgba(255, 255, 255, 0.15);
}

.tendrapet-model-card h3 {
	color: var(--tendrapet-white);
}

.tendrapet-feature-list {
	display: grid;
	gap: 1px;
	background: var(--tendrapet-border);
	border: 1px solid var(--tendrapet-border);
	border-radius: var(--tendrapet-radius);
	overflow: hidden;
}

.tendrapet-feature-list > div {
	background: var(--tendrapet-white);
	display: grid;
	gap: 0.35rem;
	padding: 1.25rem;
}

.tendrapet-feature-list strong {
	color: var(--tendrapet-green-dark);
}

.tendrapet-feature-list span,
.tendrapet-steps span {
	color: var(--tendrapet-muted);
}

.tendrapet-steps {
	counter-reset: steps;
	list-style: none;
	margin: 0;
}

.tendrapet-steps li {
	border-top: 1px solid var(--tendrapet-border);
	counter-increment: steps;
	display: grid;
	gap: 0.35rem;
	padding: 1.1rem 0 1.1rem 3rem;
	position: relative;
}

.tendrapet-steps li::before {
	color: var(--tendrapet-coral);
	content: "0" counter(steps);
	font-weight: 800;
	left: 0;
	position: absolute;
}

.tendrapet-button--light {
	background: var(--tendrapet-white);
	color: var(--tendrapet-green-dark);
	margin-top: 1.5rem;
}

.tendrapet-faq-preview__links {
	display: grid;
	gap: 0.75rem;
}

.tendrapet-faq-preview__links a {
	background: var(--tendrapet-white);
	border: 1px solid var(--tendrapet-border);
	border-radius: var(--tendrapet-radius);
	font-weight: 750;
	padding: 1rem 1.25rem;
}

@media (min-width: 768px) {
	.tendrapet-hero__inner {
		align-items: center;
		grid-template-columns: minmax(0, 1.25fr) minmax(18rem, 0.75fr);
	}

	.tendrapet-card-grid--three {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.tendrapet-feature-list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.tendrapet-split,
	.tendrapet-faq-preview {
		align-items: start;
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 767px) {
	.site-header {
		padding-bottom: 0.75rem;
		padding-top: 0.75rem;
	}

	.menu-toggle {
		background: transparent;
		border: 1px solid var(--tendrapet-border);
		border-radius: 999px;
		color: var(--tendrapet-green-dark);
	}

	.main-navigation.toggled .handheld-navigation {
		background: var(--tendrapet-white);
		border-top: 1px solid var(--tendrapet-border);
		margin-top: 0.75rem;
		padding: 0.75rem 0;
	}

	body.single-product {
		padding-bottom: 5rem;
	}

	.tendrapet-sticky-cart {
		align-items: center;
		background: rgba(255, 255, 255, 0.97);
		border-top: 1px solid var(--tendrapet-border);
		bottom: 0;
		display: flex;
		gap: 0.75rem;
		justify-content: space-between;
		left: 0;
		padding: 0.7rem max(1rem, env(safe-area-inset-left)) calc(0.7rem + env(safe-area-inset-bottom)) max(1rem, env(safe-area-inset-right));
		position: fixed;
		right: 0;
		z-index: 999;
	}

	.tendrapet-sticky-cart__price {
		color: var(--tendrapet-green-dark);
		font-size: 0.9rem;
		font-weight: 800;
		max-width: 45%;
	}

	.tendrapet-sticky-cart .button {
		margin: 0;
		white-space: nowrap;
	}
}
