/* =========================================================
   CHERUBIN SITE — overrides base, prepares WooCommerce canvas
   ========================================================= */

/* ─── UNIFIED DESIGN TOKENS ───────────────────────────────
   Single source of truth for colours across all CSS files.
   ─────────────────────────────────────────────────────── */
:root {
	/* Accent — warm plum/mauve (bridges home purple + site brown) */
	--ch-accent:       #8a5d7a;
	--ch-accent-hover: #6e4562;
	--ch-accent-light: rgba(138, 93, 122, 0.10);
	--ch-accent-glow:  0 8px 28px rgba(138, 93, 122, 0.22);

	/* Surfaces */
	--ch-bg:           #fdf8f4;
	--ch-surface:      #fffaf6;
	--ch-surface-alt:  #f9f0e8;

	/* Text */
	--ch-text:         #2c201b;
	--ch-text-muted:   #6b5048;
	--ch-text-subtle:  #9a7e72;

	/* Structure */
	--ch-border:       rgba(44, 32, 27, 0.09);
	--ch-border-strong:rgba(44, 32, 27, 0.16);
	--ch-shadow-card:  0 4px 20px rgba(44, 32, 27, 0.07);
	--ch-shadow-hover: 0 10px 32px rgba(44, 32, 27, 0.12);
	--ch-radius:       24px;
	--ch-radius-sm:    16px;
	--ch-radius-pill:  999px;

	/* Legacy aliases (keep existing code working) */
	--cherubin-surface:        var(--ch-bg);
	--cherubin-surface-strong: var(--ch-surface-alt);
	--cherubin-stroke:         var(--ch-border-strong);
	--cherubin-shadow:         0 18px 50px rgba(44, 32, 27, 0.08);
	--cherubin-card-bg:        rgba(255, 255, 255, 0.90);
	--cherubin-card-border:    1px solid var(--ch-border);
	--cherubin-card-shadow:    var(--ch-shadow-card);
	--cherubin-card-radius:    28px;
	--cherubin-soft-bg:        linear-gradient(180deg, #fffaf6 0%, #f7efe7 100%);
}

/* ─── GLOBAL ACCENT OVERRIDE ──────────────────────────────
   Replace the two competing colours (#865c87 purple on home,
   #8f5d42 brown on shop/base) with the single unified token.
   ─────────────────────────────────────────────────────── */
a {
	color: var(--ch-accent);
}
a:hover {
	color: var(--ch-accent-hover);
}

/* Primary button — accent instead of near-black */
.button,
button.button,
input[type="submit"],
a.button,
.cherubin-home__button:not(.cherubin-home__button--secondary),
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
	background: var(--ch-accent);
	color: #fff;
	box-shadow: var(--ch-accent-glow);
}
.button:hover,
a.button:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover,
.woocommerce #respond input#submit:hover {
	background: var(--ch-accent-hover);
	color: #fff;
	box-shadow: none;
}

/* Cart button in header stays dark for contrast with nav */
.cherubin-cart-link {
	background: var(--ch-text) !important;
	color: #fff7ec !important;
}
.cherubin-cart-link:hover {
	background: var(--ch-accent) !important;
	color: #fff !important;
}

/* Shop category chips — accent active state */
.cherubin-shop-sections__chips a:hover,
.cherubin-shop-sections__chips a.current {
	background: var(--ch-accent-light);
	border-color: var(--ch-accent);
	color: var(--ch-accent);
}

/* Product card meta colour */
.cherubin-product-card__meta,
.cherubin-product-card__meta a {
	color: var(--ch-accent);
}

/* Product card hover depth */
.cherubin-product-card {
	transition: box-shadow 0.2s, transform 0.2s;
}
.cherubin-product-card:hover {
	box-shadow: var(--ch-shadow-hover);
	transform: translateY(-2px);
}

/* WC product loop card hover */
.woocommerce ul.products li.product .product-wrapper {
	transition: box-shadow 0.2s, transform 0.2s;
}
.woocommerce ul.products li.product .product-wrapper:hover {
	box-shadow: var(--ch-shadow-hover);
	transform: translateY(-2px);
}

/* Breadcrumb accent */
.cherubin-breadcrumb__inner a {
	color: var(--ch-accent);
}

/* Blog post card link/meta */
.cherubin-post-card__meta,
.cherubin-post-card__link {
	color: var(--ch-accent);
}
.cherubin-post-card__link:hover {
	color: var(--ch-accent-hover);
}

/* Web eyebrow label */
.cherubin-web-eyebrow {
	color: var(--ch-accent);
}

/* Nav active state */
.cherubin-nav ul li a:hover,
.cherubin-nav ul li.current-menu-item > a,
.cherubin-nav ul li.current-page-ancestor > a {
	background: var(--ch-accent-light);
	color: var(--ch-accent);
}

body {
	background-color: var(--cherubin-surface);
}

/* --- WooCommerce main area padding --- */
#main {
	padding-top: 24px;
	padding-bottom: 48px;
}

/* --- WooCommerce shop / product cards share card style --- */
.woocommerce div.product div.summary,
.woocommerce-cart .cart-collaterals,
.woocommerce-checkout form.checkout,
.blog .post-entry,
.archive .post-entry {
	background: rgba(255, 255, 255, 0.78);
	border: 1px solid var(--cherubin-stroke);
	border-radius: 28px;
	box-shadow: var(--cherubin-shadow);
}

.woocommerce div.product div.summary,
.blog .post-entry,
.archive .post-entry {
	padding: 28px;
}

.woocommerce-cart .cart-collaterals,
.woocommerce-checkout form.checkout {
	padding: 24px;
}

/* Product list card radius */
.woocommerce ul.products li.product .product-wrapper,
.woocommerce ul.products li.product .product-thumb,
.woocommerce ul.products li.product .product-details {
	border-radius: 24px;
}

.woocommerce ul.products li.product .product-thumb img {
	border-radius: 24px;
}

/* Remove Petty-specific z-index layers (harmless if classes absent) */
.woocommerce div.product .product_title,
.woocommerce .product .summary .price,
.woocommerce .product .summary .woocommerce-product-details__short-description,
.woocommerce-cart .shop_table,
.woocommerce-checkout .woocommerce form.checkout {
	position: relative;
	z-index: 1;
}

/* ─── MOBILE-FIRST IMPROVEMENTS ───────────────────────────
   Touch targets, CTA prominence, trust signals.
   Mobile is primary device for cherubin.store audience.
   ─────────────────────────────────────────────────────── */

/* Touch target: category chips min 44px */
.cherubin-shop-sections__chips a {
	min-height: 44px;
}

/* WC "Add to cart" — accent colour, full-width on mobile */
.woocommerce a.button.add_to_cart_button,
.woocommerce button.button.single_add_to_cart_button,
.woocommerce input.button.single_add_to_cart_button {
	background: var(--ch-accent);
	color: #fff;
	font-weight: 700;
	border-radius: var(--ch-radius-pill);
	min-height: 48px;
	box-shadow: var(--ch-accent-glow);
	transition: background 0.15s, box-shadow 0.15s, transform 0.12s;
}
.woocommerce a.button.add_to_cart_button:hover,
.woocommerce button.button.single_add_to_cart_button:hover {
	background: var(--ch-accent-hover);
	box-shadow: none;
	transform: translateY(-1px);
}

/* WC price — bigger on mobile for readability */
.woocommerce .price ins,
.woocommerce .price > .amount {
	font-weight: 800;
}

/* WC sale badge — accent colour */
.woocommerce span.onsale {
	background: var(--ch-accent);
	min-width: auto;
	min-height: auto;
	padding: 4px 10px;
	border-radius: 999px;
	font-size: 0.78rem;
	font-weight: 700;
	line-height: 1.5;
}

/* Handmade trust badge — shown in product summary via PHP/shortcode
   .cherubin-trust-badge can be inserted anywhere */
.cherubin-trust-badge {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	padding: 6px 12px;
	background: var(--ch-accent-light);
	border: 1px solid rgba(138, 93, 122, 0.20);
	border-radius: 999px;
	font-size: 0.82rem;
	font-weight: 700;
	color: var(--ch-accent);
}

/* ─── GLOBAL SPACING & TYPOGRAPHY POLISH ──────────────────
   Consistent line-length, overflow-wrap, section rhythm.
   ─────────────────────────────────────────────────────── */

/* Prevent any text from breaking layout on narrow screens */
.cherubin-home h1,
.cherubin-home h2,
.cherubin-home h3,
.cherubin-home p,
.woocommerce div.product .product_title,
.cherubin-post-card__title {
	overflow-wrap: break-word;
	word-break: break-word;
}

/* Section heading paragraph: keep readable line-length */
.cherubin-home__section-heading p {
	max-width: 52ch;
}

/* Feature + trust + category cards: consistent text inset from card edge */
.cherubin-home__trust-card {
	padding: 22px 24px;
}

/* Step number bubble: visible background contrast */
.cherubin-home__step span {
	border: 1.5px solid rgba(138, 93, 122, 0.18);
}

/* Product notes in WC summary: remove card-in-card style,
   use a subtle background strip instead */
.cherubin-product-notes__item {
	background: rgba(139, 93, 122, 0.06);
	border-radius: 14px;
}

/* WooCommerce shop section head: prevent text overflow on tablets */
.cherubin-shop-section__head h2,
.cherubin-shop-section__head p {
	overflow-wrap: break-word;
	word-break: break-word;
}

/* Tabs on product page: wrappable on all sizes */
.woocommerce-tabs ul.tabs li a {
	overflow-wrap: break-word;
	word-break: break-word;
}

/* Breadcrumb: ensure long page names don't overflow */
.cherubin-breadcrumb__current {
	max-width: min(60vw, 360px);
}

/* ─── MOBILE OVERRIDES ─────────────────────────────────── */
@media (max-width: 767px) {
	/* Full-width add-to-cart on product page */
	.woocommerce div.product form.cart .single_add_to_cart_button {
		width: 100%;
		justify-content: center;
	}

	/* Larger price text on mobile */
	.woocommerce .price {
		font-size: 1.25rem;
	}

	/* Shop chips: allow 2-per-row on small screens */
	.cherubin-shop-sections__chips {
		gap: 8px;
	}
	.cherubin-shop-sections__chips a {
		font-size: 0.88rem;
		padding: 10px 14px;
	}

	/* Homepage hero on mobile: more breathing room for text col */
	.cherubin-home__hero {
		gap: 20px;
		padding: 22px;
	}

	/* Main CTA button full-width on mobile */
	.cherubin-home__hero-actions {
		flex-direction: column;
	}
	.cherubin-home__button {
		width: 100%;
		justify-content: center;
	}
}