/*
Theme Name: Carol Modas
Theme URI: https://lojacarolmodas.com.br
Description: Child theme of Twenty Twenty-Five carrying the Carol Modas identity —
  berry/plum palette, Tenor Sans + Manrope, pill buttons, brand logo — so the shop
  matches the storefront.
Author: Carol Modas
Template: twentytwentyfive
Version: 2.1.2
Text Domain: carol-modas
*/

/* Tenor Sans ships one weight and has no italic: forbid the browser from faking
   either. Emphasis inside headings is carried by the berry colour instead. */
* {
	font-synthesis: none;
}

h1 em,
h2 em,
h3 em,
h4 em,
.wp-block-heading em,
.wp-block-post-title em,
.wc-block-components-product-name em {
	font-style: normal;
	color: #a42e5c;
}

/* Header: the logo rides at ~60px high, whatever width the block asks for. */
.wp-block-site-logo {
	margin: 0;
}

.wp-block-site-logo img {
	max-height: 60px;
	width: auto;
}

/* Store notice.
   WooCommerce prints it as a body child with `absolute; bottom: 0` and a fixed
   height, so it hangs over the first screen and its wrapped text overflows.
   Put it back in normal flow at the top: it scrolls away instead of covering the
   page. No `display` rule — "Dispensar" hides it with an inline display:none. */
html body .woocommerce-store-notice,
html body p.woocommerce-store-notice {
	position: static !important;
	inset: auto !important;
	height: auto !important;
	width: auto !important;
	margin: 0 !important;
	padding: 0.65rem 1.25rem !important;
	text-align: center;
	line-height: 1.45;
	background: #2a1520 !important;
	color: #fffcfb !important;
}

.woocommerce-store-notice a,
.woocommerce-store-notice .woocommerce-store-notice__dismiss-link {
	color: #f2a7c3 !important;
}

/* WooCommerce injects a customer-account and a mini-cart block into the header
   template part, which lands on its own row. The nav carries both links. */
.wp-block-woocommerce-customer-account,
.wp-block-woocommerce-mini-cart {
	display: none !important;
}

/* One-row header: brand left, navigation right. */
header.wp-block-template-part .wp-block-group-is-layout-flex {
	flex-wrap: wrap;
	gap: 1rem 1.25rem;
	align-items: center;
}

/* Sale badge: berry, uppercase, pill. */
.wc-block-components-product-sale-badge,
.woocommerce span.onsale {
	background: #a42e5c !important;
	color: #ffffff !important;
	text-transform: uppercase;
	letter-spacing: 0.12em;
	font-size: 0.7rem;
	border-radius: 999px;
	padding: 0.2rem 0.7rem;
}

/* Product cards: 3:4 imagery comes from WooCommerce cropping; keep the frame soft. */
.wp-block-woocommerce-product-template .wp-block-post-featured-image img,
ul.wc-block-product-template .wc-block-components-product-image img {
	border-radius: 16px;
}

/* Footer: the light logo on the plum background, set as CSS so the artwork lives
   in the theme rather than depending on an attachment ID. */
.cm-footer-logo {
	height: 72px;
	width: min(300px, 76%);
	margin: 0 auto 1.25rem;
	background: url("assets/logo-light.png") no-repeat center / contain;
}

.cm-footer a {
	color: #f2a7c3;
}

.cm-footer a:hover {
	color: #fffcfb;
}

/* Eyebrow / label text: Tenor Sans, uppercase, wide tracking. */
.cm-label {
	font-family: var(--wp--preset--font-family--heading), "Times New Roman", serif;
	text-transform: uppercase;
	letter-spacing: 0.2em;
	font-size: 0.74rem;
	font-weight: 400;
}

/* Mobile overlay menu.
   The navigation block is right-justified so the inline desktop menu sits at the
   end of the header row, and the overlay inherits that justification, which
   right-aligns every entry once the drawer is open. The storefront's drawer is
   left aligned, in the display face at 2rem, with a hairline between entries, so
   the shop mirrors it here. Twenty Twenty-Five opens this overlay below 600px.
   The !important values override the layout's
   --navigation-layout-justification-setting, which core applies inline. */
@media (max-width: 599px) {
	.wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__responsive-container-content {
		align-items: flex-start !important;
	}

	.wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation__container {
		align-items: stretch;
		gap: 0;
		justify-content: flex-start !important;
		text-align: left;
		width: 100%;
	}

	.wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item {
		align-items: stretch;
		border-bottom: 1px solid var(--wp--preset--color--line, rgb(42 21 32 / 0.12));
		justify-content: flex-start;
		width: 100%;
	}

	.wp-block-navigation .wp-block-navigation__responsive-container.is-menu-open .wp-block-navigation-item__content {
		font-family: var(--wp--preset--font-family--heading), "Times New Roman", serif;
		font-size: 2rem;
		font-weight: 400;
		line-height: 1.15;
		padding: 1rem 0;
		text-align: left;
		width: 100%;
	}
}
