/* ==========================================================================
   Enlightenly: base styles
   Tokens come from the Elementor kit (Default Kit, post 44). Variable names
   (--ClrPrim1 etc.) are kept because plugins and old content still use them.
   ========================================================================== */

/* Brand fonts (self-hosted; copy the woff2 files into assets/fonts/) */
@font-face {
	font-family: "Agile Sans Light";
	src: url("../fonts/agile-sans-light.woff2") format("woff2");
	font-weight: 400;
	font-display: swap;
}
@font-face {
	font-family: "AgileSans Semi-light";
	src: url("../fonts/agile-sans-semi-light.woff2") format("woff2");
	font-weight: 400;
	font-display: swap;
}

:root {
	/* Brand colours (kit) */
	--Clr4: #FAC306;        /* gold */
	--Clr3: #F9F3E7;        /* cream */
	--Clr2: #1A235A;        /* navy */
	--ClrPrim1: #19A87B;    /* green */
	--ClrPrim2: #D52C89;    /* magenta */
	--ClrBG1: #FAFDFA;
	--ClrBG2: #FBF8F1;
	--ClrTxt1: #444444;
	--ClrTxt2: #FFFFFF;
	--ClrBorder: #444444;
	--ClrHeader: rgba(249, 243, 231, 0.95);

	/* Accessible green for text-bearing surfaces: #19A87B + white is only 3.0:1 */
	--btn-bg: #0f7a59;
	--btn-bg-hover: var(--ClrPrim2);

	/* Vendor colours: overridden per store/product by inc/vendor-colours.php */
	--vendor-dark: var(--ClrTxt1);
	--vendor-light: var(--Clr4);
	--vendor-dark-text: #ffffff;
	--vendor-light-text: var(--ClrTxt1);

	/* Type */
	--font-body: "Agile Sans Light", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	--font-head: "AgileSans Semi-light", "Agile Sans Light", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	--font-btn: "Poppins", system-ui, sans-serif;

	/* Layout */
	--container: 1200px;
	--gutter: clamp(1rem, 4vw, 2rem);
	--radius: 8px;
	--shadow: 0 2px 10px rgba(0, 0, 0, 0.08);
	--header-h: 80px;
}

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

html { -webkit-text-size-adjust: 100%; scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after { animation-duration: 0.01ms !important; transition-duration: 0.01ms !important; }
}

body {
	margin: 0;
	background: var(--ClrBG1);
	color: var(--ClrTxt1);
	font-family: var(--font-body);
	font-size: 1rem;          /* 16px everywhere; the Elementor kit dropped to 12px on mobile */
	line-height: 1.6;
	-webkit-font-smoothing: antialiased;
}

img, svg, video { max-width: 100%; height: auto; }
figure { margin: 0; }

/* Headings: the kit's 1.25 modular scale, fluid on small screens */
h1, h2, h3, h4, h5, h6 {
	font-family: var(--font-head);
	font-weight: 400;
	color: var(--Clr2);
	margin: 0 0 0.6em;
}
h1 { font-size: clamp(2rem, 1.4rem + 2.4vw, 2.441rem); line-height: 1.2; }
h2 { font-size: clamp(1.6rem, 1.3rem + 1.2vw, 1.953rem); line-height: 1.25; }
h3 { font-size: clamp(1.35rem, 1.2rem + 0.6vw, 1.563rem); line-height: 1.4; }
h4 { font-size: 1.25rem; line-height: 1.5; }
h5, h6 { font-size: 1.1rem; line-height: 1.4; }
p { margin: 0 0 1em; }

a { color: var(--Clr2); text-decoration-thickness: 1px; text-underline-offset: 0.15em; }
a:hover { color: var(--ClrPrim2); text-decoration: underline; }

:focus-visible { outline: 3px solid var(--Clr2); outline-offset: 2px; border-radius: 2px; }

.screen-reader-text {
	position: absolute !important; width: 1px; height: 1px; margin: -1px; padding: 0;
	overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}
.skip-link:focus {
	position: fixed; z-index: 1000; top: 8px; left: 8px; width: auto; height: auto; margin: 0;
	clip: auto; padding: 0.75rem 1rem; background: var(--Clr2); color: #fff; text-decoration: none;
}

/* Layout */
.container { width: 100%; max-width: calc(var(--container) + var(--gutter) * 2); margin-inline: auto; padding-inline: var(--gutter); }
.container--narrow { max-width: calc(780px + var(--gutter) * 2); }
.center { text-align: center; }
.site-main { padding-block: clamp(1.5rem, 4vw, 3rem); min-height: 50vh; }
.site-main--front, .site-main--canvas { padding-block: 0; }
.page-header { margin-bottom: 1.5rem; }
.page-title { margin-bottom: 0.3em; }
.page-intro, .entry-meta { color: #666; }

.entry-content > * { max-width: 780px; margin-inline: auto; }
.entry-content > .alignwide, .entry-content--wide > * { max-width: var(--container); }
.entry-content > .alignfull { max-width: none; }
.entry-content--wide > * { margin-inline: auto; padding-inline: var(--gutter); }
.entry-content img { border-radius: var(--radius); }

/* Buttons: kit = 8px radius, accent background, magenta hover, Poppins 400 */
.button,
button.button,
input[type="submit"],
.wp-block-button__link,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit {
	display: inline-block;
	background: var(--btn-bg);
	color: var(--ClrTxt2);
	font-family: var(--font-btn);
	font-weight: 400;
	font-size: 1rem;
	line-height: 1.4;
	padding: 0.65em 1.4em;
	border: 0;
	border-radius: var(--radius);
	text-decoration: none;
	cursor: pointer;
	box-shadow: 0 0 10px rgba(0, 0, 0, 0.12);
	transition: background-color 0.15s ease, transform 0.15s ease;
}
.button:hover,
button.button:hover,
input[type="submit"]:hover,
.wp-block-button__link:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce input.button:hover {
	background: var(--btn-bg-hover);
	color: var(--ClrTxt2);
	text-decoration: none;
}
.button:active { transform: translateY(1px); }

/* Forms */
input[type="text"], input[type="email"], input[type="url"], input[type="password"],
input[type="search"], input[type="number"], input[type="tel"], textarea, select {
	width: 100%;
	padding: 0.65em 0.8em;
	font: inherit;
	color: var(--ClrTxt1);
	background: #fff;
	border: 1px solid #b9b3a6;
	border-radius: var(--radius);
}
input:focus, textarea:focus, select:focus { border-color: var(--Clr2); outline: 2px solid var(--Clr2); outline-offset: 0; }
label { display: inline-block; margin-bottom: 0.25em; }
.search-form { display: flex; gap: 0.5rem; max-width: 520px; }
.search-form label { flex: 1; margin: 0; }
.center .search-form { margin-inline: auto; margin-bottom: 1.5rem; }

/* --------------------------------------------------------------------------
   Header
   -------------------------------------------------------------------------- */
.site-header {
	position: sticky; top: 0; z-index: 100;
	background: var(--ClrHeader);
	-webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
	box-shadow: 0 1px 0 rgba(0, 0, 0, 0.06);
}
.admin-bar .site-header { top: 32px; }
@media (max-width: 782px) { .admin-bar .site-header { top: 46px; } }

.site-header__inner {
	display: flex; align-items: center; gap: 1rem;
	max-width: calc(var(--container) + var(--gutter) * 2);
	margin-inline: auto; padding: 0.5rem var(--gutter);
	min-height: var(--header-h);
}
.site-header__brand { flex-shrink: 0; margin-right: auto; display: flex; align-items: center; }
.site-header__brand a { display: inline-flex; }
.site-header__brand img,
.site-header__brand .custom-logo,
.enlightenly_store_logo { max-height: 64px; width: auto; }
.site-title { font-family: var(--font-head); font-size: 1.4rem; color: var(--Clr2); text-decoration: none; }

.primary-nav { display: flex; align-items: center; gap: 1.25rem; }
.primary-nav .menu { display: flex; align-items: center; gap: 0.25rem 1.25rem; list-style: none; margin: 0; padding: 0; }
.primary-nav .menu a {
	display: block; padding: 0.5rem 0.25rem; color: var(--ClrTxt1);
	text-decoration: none; border-bottom: 2px solid transparent;
}
.primary-nav .menu a:hover,
.primary-nav .menu .current-menu-item > a,
.primary-nav .menu .current_page_item > a { color: var(--Clr2); border-bottom-color: var(--ClrPrim2); }
.primary-nav .menu li { position: relative; }
.primary-nav .sub-menu {
	position: absolute; top: 100%; left: 0; min-width: 12rem; margin: 0; padding: 0.5rem; list-style: none;
	background: #fff; border-radius: var(--radius); box-shadow: var(--shadow); display: none;
}
.primary-nav li:hover > .sub-menu, .primary-nav li:focus-within > .sub-menu { display: block; }
.primary-nav__search { min-width: 200px; max-width: 280px; }

.site-header__actions { display: flex; align-items: center; gap: 0.75rem; }
.account-link { color: var(--ClrTxt1); text-decoration: none; padding: 0.5rem; }
.account-link:hover { color: var(--ClrPrim2); }

.nav-toggle {
	display: none; width: 44px; height: 44px; padding: 0; background: transparent; border: 0; cursor: pointer; position: relative;
}
.nav-toggle__bars, .nav-toggle__bars::before, .nav-toggle__bars::after {
	position: absolute; left: 10px; width: 24px; height: 2px; background: var(--Clr2); content: ""; transition: transform 0.2s ease, opacity 0.2s ease;
}
.nav-toggle__bars { top: 21px; }
.nav-toggle__bars::before { top: -7px; left: 0; }
.nav-toggle__bars::after { top: 7px; left: 0; }
.nav-toggle[aria-expanded="true"] .nav-toggle__bars { background: transparent; }
.nav-toggle[aria-expanded="true"] .nav-toggle__bars::before { transform: translateY(7px) rotate(45deg); }
.nav-toggle[aria-expanded="true"] .nav-toggle__bars::after { transform: translateY(-7px) rotate(-45deg); }

@media (max-width: 960px) {
	:root { --header-h: 64px; }
	.nav-toggle { display: block; order: 3; }
	.site-header__actions { order: 2; }
	.primary-nav {
		display: none; position: absolute; top: 100%; left: 0; right: 0; flex-direction: column; align-items: stretch;
		gap: 1rem; padding: 1rem var(--gutter) 1.5rem; background: var(--Clr3); box-shadow: 0 8px 12px rgba(0, 0, 0, 0.08);
	}
	.primary-nav.is-open { display: flex; }
	.primary-nav .menu { flex-direction: column; align-items: stretch; gap: 0; }
	.primary-nav .menu a { padding: 0.75rem 0; border-bottom: 1px solid rgba(0, 0, 0, 0.08); }
	.primary-nav .sub-menu { position: static; display: block; box-shadow: none; background: transparent; padding: 0 0 0 1rem; }
	.primary-nav__search { max-width: none; }
	.site-header__brand img, .site-header__brand .custom-logo, .enlightenly_store_logo { max-height: 40px; }
}

/* Mini-cart */
.mini-cart { position: relative; }
.mini-cart__toggle {
	position: relative; display: inline-flex; align-items: center; justify-content: center;
	width: 44px; height: 44px; padding: 0; color: var(--Clr2); background: transparent; border: 0; cursor: pointer;
}
.cart-count {
	position: absolute; top: 2px; right: 0; min-width: 20px; height: 20px; padding: 0 5px;
	font: 600 0.75rem/20px var(--font-btn); text-align: center; color: #fff; background: var(--ClrPrim2); border-radius: 10px;
}
.cart-count[hidden] { display: none; }
.mini-cart__panel {
	position: fixed; z-index: 210; top: 0; right: 0; bottom: 0; width: min(450px, 100vw);
	display: flex; flex-direction: column; background: #fff; box-shadow: -8px 0 24px rgba(0, 0, 0, 0.18);
	padding: 1rem 1.25rem; overflow-y: auto;
}
.mini-cart__panel[hidden], .mini-cart__backdrop[hidden] { display: none; }
.mini-cart__backdrop { position: fixed; z-index: 205; inset: 0; background: rgba(26, 35, 90, 0.4); }
.mini-cart__head { display: flex; justify-content: space-between; align-items: center; margin-bottom: 0.5rem; }
.mini-cart__title { margin: 0; font-size: 1.25rem; }
.mini-cart__close { width: 44px; height: 44px; font-size: 2rem; line-height: 1; color: var(--Clr2); background: transparent; border: 0; cursor: pointer; }
.mini-cart__panel .woocommerce-mini-cart { list-style: none; margin: 0; padding: 0; }
.mini-cart__panel .woocommerce-mini-cart-item { display: grid; grid-template-columns: 64px 1fr; gap: 0.25rem 0.75rem; padding: 0.75rem 0; border-bottom: 1px solid #e6e1d6; position: relative; }
.mini-cart__panel .woocommerce-mini-cart-item img { grid-row: span 2; width: 64px; height: 64px; object-fit: cover; margin: 0; }
.mini-cart__panel .remove_from_cart_button { position: absolute; top: 0.5rem; right: 0; width: 28px; height: 28px; line-height: 26px; text-align: center; color: #666; border: 1px solid #aaa; border-radius: 50%; text-decoration: none; }
.mini-cart__panel .woocommerce-mini-cart-item a:not(.remove_from_cart_button) { font-size: 1rem; line-height: 1.5; padding-right: 2rem; }
.mini-cart__panel .woocommerce-mini-cart__total { display: flex; justify-content: space-between; padding: 1rem 0; font-weight: 600; }
.mini-cart__panel .woocommerce-mini-cart__buttons { display: grid; gap: 0.5rem; }
.mini-cart__panel .woocommerce-mini-cart__buttons .button { text-align: center; }
.mini-cart__panel .woocommerce-mini-cart__buttons .button:not(.checkout) { background: transparent; color: var(--Clr2); box-shadow: inset 0 0 0 2px var(--Clr2); }
.mini-cart__panel .woocommerce-mini-cart__empty-message { padding: 1rem 0; }

/* --------------------------------------------------------------------------
   Cards (articles, search)
   -------------------------------------------------------------------------- */
.card-grid { display: grid; gap: 1.5rem; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); margin-bottom: 2rem; }
.card { display: flex; flex-direction: column; background: #fff; border-radius: var(--radius); box-shadow: var(--shadow); overflow: hidden; }
.card__media img { display: block; width: 100%; aspect-ratio: 3 / 2; object-fit: cover; border-radius: 0; }
.card__body { padding: 1rem 1.25rem 1.25rem; }
.card__title { font-size: 1.25rem; margin-bottom: 0.25rem; }
.card__title a { color: var(--Clr2); text-decoration: none; }
.card__title a:hover { color: var(--ClrPrim2); text-decoration: underline; }
.card__meta { font-size: 0.9rem; color: #666; margin-bottom: 0.5rem; }
.card__excerpt { margin: 0; }

.navigation.pagination { margin: 2rem 0; }
.nav-links { display: flex; flex-wrap: wrap; gap: 0.5rem; justify-content: center; }
.page-numbers { padding: 0.5rem 0.9rem; background: #fff; border-radius: var(--radius); text-decoration: none; box-shadow: var(--shadow); }
.page-numbers.current { background: var(--Clr2); color: #fff; }

.entry-image { margin-bottom: 1.5rem; }
.related-products { margin-top: 3rem; }
.comments { margin-top: 3rem; }
.comment-list { list-style: none; padding: 0; }

/* --------------------------------------------------------------------------
   Footer
   -------------------------------------------------------------------------- */
.site-footer { margin-top: clamp(2rem, 6vw, 4rem); padding-top: clamp(2rem, 5vw, 3.5rem); background: var(--Clr3); }
.site-footer__grid { display: grid; gap: 2rem; grid-template-columns: 1.4fr repeat(3, 1fr); }
.footer-brand__tag { margin: 0.75rem 0; max-width: 24ch; }
.footer-col__title { margin: 0 0 0.75rem; font-size: 1.1rem; }
.footer-list, .social-list { list-style: none; margin: 0; padding: 0; }
.footer-list li { margin-bottom: 0.4rem; }
.footer-list a { color: var(--ClrTxt1); text-decoration: none; }
.footer-list a:hover { color: var(--ClrPrim2); text-decoration: underline; }
.social-list { display: flex; gap: 0.5rem; }
.social-list a { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; color: var(--Clr2); background: #fff; border-radius: 50%; }
.social-list a:hover { background: var(--ClrPrim2); color: #fff; }
.site-footer__legal { padding-block: 1.25rem; margin-top: 1.5rem; border-top: 1px solid rgba(0, 0, 0, 0.1); font-size: 0.9rem; }
.site-footer__legal p { margin: 0; }
@media (max-width: 800px) { .site-footer__grid { grid-template-columns: 1fr 1fr; } .footer-brand { grid-column: 1 / -1; } }
@media (max-width: 480px) { .site-footer__grid { grid-template-columns: 1fr; } }

/* WooCommerce's own .alt / .disabled button colours (purple) beat the rules above; match their specificity. */
.woocommerce a.button.alt, .woocommerce button.button.alt, .woocommerce input.button.alt,
.woocommerce #respond input#submit.alt, .woocommerce a.button.alt:disabled, .woocommerce button.button.alt.disabled {
	background: var(--btn-bg); color: var(--ClrTxt2);
}
.woocommerce a.button.alt:hover, .woocommerce button.button.alt:hover, .woocommerce input.button.alt:hover,
.woocommerce #respond input#submit.alt:hover {
	background: var(--btn-bg-hover); color: var(--ClrTxt2);
}
/* Carousel plugins (owl) must clip their track or the page scrolls sideways */
.owl-carousel .owl-stage-outer, .owl-stage-outer { overflow: hidden; }

/* Breadcrumb bar on pages with no vendor: calm cream instead of the gold fallback */
body:not(.has-vendor) .breadcrumb-bar { background: var(--Clr3); }

/* Footer logo was unconstrained; page title lines up with the content column */
.site-footer .footer-brand img, .site-footer .custom-logo { max-width: 160px; height: auto; }
.woocommerce-cart .entry-content > *, .woocommerce-checkout .entry-content > *, .woocommerce-account .entry-content > * { max-width: var(--container); }

/* ==========================================================================
   Header icon cluster: search, account, cart share one size, colour and states.
   ========================================================================== */
:root { --icon-btn: 44px; --icon-size: 24px; --icon-hover: rgba(26, 35, 90, 0.08); }

/* Desktop: search joins the right-hand cluster instead of sitting before the menu. */
@media (min-width: 961px) {
	.primary-nav { display: contents; }
	.site-header__brand { order: 0; }
	.primary-nav .menu { order: 1; }
	.primary-nav__search { order: 2; min-width: 0; max-width: none; margin-left: 0.25rem; }
	.site-header__actions { order: 3; }
}
.site-header__actions { gap: 0.25rem; }

/* The shared look */
.site-header .mini-cart__toggle,
.site-header .enl-account-bar .enl-account-trigger,
.site-header .account-link,
.site-header .primary-nav__search .asp_m .probox .promagnifier {
	width: var(--icon-btn); height: var(--icon-btn); min-width: var(--icon-btn); padding: 0; margin: 0;
	display: inline-flex; align-items: center; justify-content: center;
	color: var(--Clr2); background: transparent; border: 0; border-radius: 50%;
	box-shadow: none; cursor: pointer; text-decoration: none;
	transition: background-color 0.15s ease, color 0.15s ease;
}
.site-header .mini-cart__toggle:hover,
.site-header .enl-account-bar .enl-account-trigger:hover,
.site-header .account-link:hover,
.site-header .primary-nav__search .asp_m .probox .promagnifier:hover { background: var(--icon-hover); color: var(--ClrPrim2); }
.site-header .mini-cart__toggle:focus-visible,
.site-header .enl-account-bar .enl-account-trigger:focus-visible,
.site-header .account-link:focus-visible,
.site-header .primary-nav__search .asp_m .probox .promagnifier:focus-visible { outline: 3px solid var(--Clr2); outline-offset: 2px; background: var(--icon-hover); }

/* Same icon size inside each */
.site-header .mini-cart__toggle .icon,
.site-header .enl-account-icon,
.site-header .enl-account-icon svg { width: var(--icon-size); height: var(--icon-size); }
.site-header .enl-account-icon svg { stroke-width: 1.8; }
.site-header .primary-nav__search .asp_m .probox .promagnifier .innericon,
.site-header .primary-nav__search .asp_m .probox .promagnifier .innericon svg {
	width: var(--icon-size) !important; height: var(--icon-size) !important; line-height: 1 !important;
}
.site-header .primary-nav__search .asp_m .probox .promagnifier .innericon svg { fill: currentColor !important; }

/* Search plugin: drop its own box (border, shadow, background) in the closed state */
.site-header .primary-nav__search .asp_m.asp_compact .probox,
.site-header .primary-nav__search .asp_m.asp_compact { box-shadow: none !important; background: transparent !important; border: 0 !important; margin: 0 !important; }
.site-header .primary-nav__search .asp_m .probox { height: var(--icon-btn) !important; min-height: var(--icon-btn) !important; border-radius: 22px !important; }
.site-header .primary-nav__search .asp_m .promagnifier { background: transparent !important; box-shadow: none !important; }

/* Cart badge: sits on the icon's top-right shoulder */
.site-header .cart-count { top: 4px; right: 2px; min-width: 18px; height: 18px; padding: 0 4px; font-size: 0.7rem; line-height: 18px; border-radius: 9px; box-shadow: 0 0 0 2px var(--Clr3); }

/* Account menu (logged in) */
.site-header .enl-account-menu { margin-top: 0.5rem; border-radius: var(--radius); }
.site-header .enl-account-menu a { font-size: 0.95rem; padding: 0.55rem 0.6rem; }

/* Hamburger shares the button size */
.nav-toggle { width: var(--icon-btn); height: var(--icon-btn); border-radius: 50%; }
.nav-toggle:hover { background: var(--icon-hover); }
.nav-toggle:focus-visible { outline: 3px solid var(--Clr2); outline-offset: 2px; }

/* Force the shared sizes where plugin CSS (ASP, account bar) out-ranks them */
.site-header .enl-account-bar .enl-account-icon,
.site-header .enl-account-bar .enl-account-icon svg { width: var(--icon-size) !important; height: var(--icon-size) !important; }
.site-header .primary-nav__search .asp_m .probox .promagnifier { height: var(--icon-btn) !important; width: var(--icon-btn) !important; min-height: var(--icon-btn) !important; line-height: var(--icon-btn) !important; }
.site-header .primary-nav__search, .site-header .primary-nav__search .asp_m { display: flex; align-items: center; }
.site-header .enl-account-bar { display: inline-flex; align-items: center; }

/* Account dropdown (logged in) */
.site-header .enl-account-bar { position: relative; }
.site-header .enl-account-menu {
	position: absolute; right: 0; top: calc(100% + 0.5rem); z-index: 200; min-width: 13rem; padding: 0.5rem;
	background: #fff; border: 0; border-radius: calc(var(--radius) * 1.5); box-shadow: 0 10px 30px rgba(0, 0, 0, 0.16);
}
.site-header .enl-account-menu[hidden] { display: none; }
.site-header .enl-account-menu a { display: block; padding: 0.6rem 0.8rem; color: var(--Clr2); text-decoration: none; border-radius: var(--radius); font-size: 0.95rem; }
.site-header .enl-account-menu a:hover, .site-header .enl-account-menu a:focus-visible { background: var(--Clr3); color: var(--ClrPrim2); }
.site-header .enl-account-logout { margin-top: 0.35rem; padding-top: 0.35rem; border-top: 1px solid rgba(0, 0, 0, 0.08); }

/* Search: when opened, float over the header instead of squeezing the menu */
@media (min-width: 961px) {
	.site-header__inner { position: relative; }
	.site-header .primary-nav__search .asp_m[asp-compact="open"] {
		position: absolute !important; right: calc(var(--gutter) + 96px); top: 50%; transform: translateY(-50%);
		width: min(26rem, 55vw) !important; z-index: 150; background: #fff !important;
		border-radius: 24px !important; box-shadow: 0 6px 24px rgba(0, 0, 0, 0.16) !important;
	}
}

/* Mobile: the search row in the open menu gets a label */
@media (max-width: 960px) {
	.site-header .primary-nav__search .asp_m .probox .promagnifier { width: 100% !important; justify-content: flex-start; gap: 0.75rem; padding-inline: 0.5rem; border-radius: var(--radius); }
	.site-header .primary-nav__search .asp_m .probox .promagnifier::after { content: "Search"; font-size: 1rem; color: var(--ClrTxt1); }
}

/* Search overlay / mobile row: the plugin sets inline offsets and widths, so force ours */
@media (min-width: 961px) {
	.site-header .primary-nav__search .asp_m[asp-compact="open"] {
		top: 50% !important; bottom: auto !important; left: auto !important;
		right: calc(var(--gutter) + var(--icon-btn) * 2 + 0.5rem) !important; transform: translateY(-50%) !important;
	}
}
@media (max-width: 960px) {
	.site-header .primary-nav__search, .site-header .primary-nav__search .asp_m,
	.site-header .primary-nav__search .asp_m .probox { width: 100% !important; max-width: none !important; }
}

/* Mini-cart items: thumbnail left, title beside it, shop + qty/price tucked underneath */
.mini-cart__panel .woocommerce-mini-cart-item { display: block; padding: 1rem 2.25rem 1rem 0; }
.mini-cart__panel .woocommerce-mini-cart-item a:not(.remove_from_cart_button) { display: flex; align-items: center; gap: 0.75rem; padding-right: 0; font-family: var(--font-head); line-height: 1.3; }
.mini-cart__panel .woocommerce-mini-cart-item a:not(.remove_from_cart_button) img { order: -1; flex: 0 0 64px; width: 64px; height: 64px; border-radius: var(--radius); object-fit: cover; }
.mini-cart__panel .woocommerce-mini-cart-item dl.variation { display: flex; flex-wrap: wrap; gap: 0 0.35rem; margin: 0.35rem 0 0 72px; padding: 0; border: 0; font-size: 0.9rem; color: #666; }
.mini-cart__panel .woocommerce-mini-cart-item dl.variation dt, .mini-cart__panel .woocommerce-mini-cart-item dl.variation dd { margin: 0; padding: 0; }
.mini-cart__panel .woocommerce-mini-cart-item dl.variation dd p { margin: 0; }
.mini-cart__panel .woocommerce-mini-cart-item dl.variation a { display: inline; font-size: 0.9rem; white-space: nowrap; }
.mini-cart__panel .woocommerce-mini-cart-item .quantity { display: block; margin: 0.15rem 0 0 76px; font-size: 0.95rem; }
.mini-cart__panel .remove_from_cart_button { top: 1rem; }

/* Mini-cart close cross: drawn with CSS so it is crisp and the same weight as the menu X */
.mini-cart__close { position: relative; font-size: 0; margin-right: -0.75rem; border-radius: 50%; transition: background-color 0.15s ease; }
.mini-cart__close::before, .mini-cart__close::after {
	content: ""; position: absolute; left: 50%; top: 50%; width: 22px; height: 2px; margin: -1px 0 0 -11px;
	background: var(--Clr2); border-radius: 1px; transition: background-color 0.15s ease;
}
.mini-cart__close::before { transform: rotate(45deg); }
.mini-cart__close::after { transform: rotate(-45deg); }
.mini-cart__close:hover { background: var(--icon-hover); }
.mini-cart__close:hover::before, .mini-cart__close:hover::after { background: var(--ClrPrim2); }
.mini-cart__close:focus-visible { outline: 3px solid var(--Clr2); outline-offset: 2px; }

/* Remove-item button: bigger tap target, calm until hovered */
.mini-cart__panel .remove_from_cart_button {
	top: 0.85rem; right: -0.25rem; width: 36px; height: 36px; line-height: 34px; font-size: 1.4rem; font-weight: 400;
	color: #666 !important; background: var(--Clr3); border: 0; border-radius: 50%; transition: background-color 0.15s ease, color 0.15s ease;
}
.mini-cart__panel .remove_from_cart_button:hover, .mini-cart__panel .remove_from_cart_button:focus-visible { color: #b3261e !important; background: #fde8e6; }
.mini-cart__panel .remove_from_cart_button:focus-visible { outline: 3px solid var(--Clr2); outline-offset: 2px; }

/* WooCommerce's `.woocommerce a.remove` (red, 1em) out-ranks the rule above; match and beat it */
body .mini-cart__panel .woocommerce-mini-cart-item a.remove.remove_from_cart_button {
	width: 36px !important; height: 36px !important; line-height: 34px !important; font-size: 1.4rem !important; font-weight: 400;
	color: #666 !important; background: var(--Clr3) !important; border: 0 !important; border-radius: 50%; text-align: center;
	top: 0.85rem; right: -0.25rem;
}
body .mini-cart__panel .woocommerce-mini-cart-item a.remove.remove_from_cart_button:hover,
body .mini-cart__panel .woocommerce-mini-cart-item a.remove.remove_from_cart_button:focus-visible { color: #b3261e !important; background: #fde8e6 !important; }

/* After add to cart the panel opens, so the "added to your cart" notice would only repeat it */
body.enl-cart-added .woocommerce-notices-wrapper .woocommerce-message { display: none; }

/* ==========================================================================
   Page layout: titles line up with their content column; wide pages use the full container
   ========================================================================== */
.page .page-header { max-width: 780px; margin-inline: auto; }
.woocommerce-page .page-header,
main:has(#wcfmmp-stores-wrap) .page-header { max-width: none; }
/* Stores list: don't squeeze it into the 780px reading column */
.entry-content > :has(#wcfmmp-stores-wrap) { max-width: var(--container); }
#wcfmmp-stores-wrap { max-width: none; }

/* Stores list cards: the name sits over the banner image, so give it a light chip that reads on any banner */
#wcfmmp-stores-wrap ul.wcfmmp-store-wrap li .store-data h2 {
	display: inline-block; max-width: 100%; margin: 0; padding: 0.2rem 0.65rem; border-radius: 8px;
	background: rgba(255, 255, 255, 0.9); box-shadow: 0 1px 4px rgba(0, 0, 0, 0.12);
}
#wcfmmp-stores-wrap ul.wcfmmp-store-wrap li .store-data h2 a { font-family: var(--font-head); }

/* Stores list filters: one tidy row */
.wcfmmp-store-search-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 0.75rem; align-items: center; }
.wcfmmp-store-search-form > * { width: 100% !important; margin: 0 !important; }
.wcfmmp-store-search-form input:not([type="hidden"]):not([type="checkbox"]):not([type="submit"]):placeholder-shown:not(.search-field):not(.wcfmmp-store-search) { display: none; }

/* ==========================================================================
   Stores list: no map, a tidy filter bar, and tiles that behave as one link
   ========================================================================== */
#wcfmmp-store-list-map, .wcfmmp-store-list-map { display: none !important; }

/* Filters: one white bar, three equal controls. The state box only appears once a country with states is chosen. */
.wcfmmp-store-search-form {
	padding: 1rem; margin: 0 0 1.25rem; background: #fff; border-radius: calc(var(--radius) * 1.5); box-shadow: var(--shadow);
	grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 0.75rem;
}
.wcfmmp-store-search-form select#wcfmmp_store_state:not(:has(option:nth-child(2))) { display: none; }
.wcfmmp-store-search-form input.search-field,
.wcfmmp-store-search-form select#wcfmmp_store_state,
.wcfmmp-store-search-form .select2-container .select2-selection--single {
	height: 46px; min-height: 46px; padding: 0 0.9rem; border: 1px solid #cdd6d1; border-radius: var(--radius);
	background: #fff; font: inherit; color: var(--ClrTxt1); box-shadow: none;
}
.wcfmmp-store-search-form .select2-container .select2-selection--single .select2-selection__rendered { line-height: 44px; padding-left: 0; color: var(--ClrTxt1); }
.wcfmmp-store-search-form .select2-container .select2-selection--single .select2-selection__placeholder { color: #777; }
.wcfmmp-store-search-form .select2-container .select2-selection--single .select2-selection__arrow { height: 44px; }
.wcfmmp-store-search-form input.search-field:focus,
.wcfmmp-store-search-form select#wcfmmp_store_state:focus,
.wcfmmp-store-search-form .select2-container--focus .select2-selection--single,
.wcfmmp-store-search-form .select2-container--open .select2-selection--single {
	border-color: var(--ClrPrim1); outline: 3px solid rgba(25, 168, 123, 0.2); outline-offset: 0;
}

/* Sort, result count and pages: one row, aligned */
.wcfmmp-store-lists-sorting {
	display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.75rem 1.5rem;
	margin: 0 0 1.25rem; padding: 0.6rem 0.9rem; background: #fff; border-radius: calc(var(--radius) * 1.5); box-shadow: var(--shadow);
}
.wcfmmp-store-lists-sorting > * { float: none !important; margin: 0 !important; width: auto !important; }
.wcfmmp-store-lists-sorting .spacer { display: none; }
.wcfmmp-store-lists-sorting form { flex: 0 1 auto; }
.wcfmmp-store-lists-sorting select.orderby { height: 40px; min-width: 15rem; max-width: 100%; padding: 0 0.8rem; border: 1px solid #cdd6d1; border-radius: var(--radius); background: #fff; font: inherit; color: var(--ClrTxt1); }
.wcfmmp-store-lists-sorting .woocommerce-result-count { flex: 1 1 auto; text-align: center; color: #666; font-size: 0.95rem; }
.wcfmmp-store-lists-sorting .wcfmmp-pagination { flex: 0 0 auto; }
.wcfmmp-store-lists-sorting .woocommerce-pagination ul { margin: 0; border: 0; }
@media (max-width: 700px) {
	.wcfmmp-store-lists-sorting { flex-direction: column; align-items: stretch; text-align: center; }
	.wcfmmp-store-lists-sorting select.orderby { width: 100%; min-width: 0; }
	.wcfmmp-store-lists-sorting .woocommerce-result-count { text-align: center; }
	.wcfmmp-store-lists-sorting .wcfmmp-pagination { display: flex; justify-content: center; }
}

/* Tiles: the whole card is clickable (nav.js), so show it */
#wcfmmp-stores-wrap ul.wcfmmp-store-wrap li.wcfmmp-single-store .store-wrapper { cursor: pointer; transition: transform 0.18s ease, box-shadow 0.18s ease; }
#wcfmmp-stores-wrap ul.wcfmmp-store-wrap li.wcfmmp-single-store .store-wrapper:hover { transform: translateY(-3px); box-shadow: 0 8px 22px rgba(26, 35, 90, 0.16); }
#wcfmmp-stores-wrap ul.wcfmmp-store-wrap li.wcfmmp-single-store .store-wrapper:has(a:focus-visible) { outline: 3px solid rgba(25, 168, 123, 0.5); outline-offset: 2px; }
#wcfmmp-stores-wrap ul.wcfmmp-store-wrap li .store-data h2 a { text-decoration: none; }
#wcfmmp-stores-wrap ul.wcfmmp-store-wrap li .store-data h2 a:hover { text-decoration: underline; }
@media (prefers-reduced-motion: reduce) {
	#wcfmmp-stores-wrap ul.wcfmmp-store-wrap li.wcfmmp-single-store .store-wrapper { transition: none; }
	#wcfmmp-stores-wrap ul.wcfmmp-store-wrap li.wcfmmp-single-store .store-wrapper:hover { transform: none; }
}

/* Stores list polish: beat WCFM's own padding and flatten the boxes-inside-boxes */
body .wcfmmp-store-search-form { padding: 1rem !important; box-sizing: border-box; }
#wcfmmp-stores-lists, #wcfmmp-stores-wrap-holder, #wcfmmp-stores-wrap, .wcfmmp-stores-content-holder, .wcfmmp-stores-content {
	background: transparent !important; box-shadow: none !important; padding: 0 !important; margin: 0 !important; border: 0 !important;
}
.wcfmmp-store-search-form .select2-container .select2-selection--single .select2-selection__rendered { text-align: left !important; padding-right: 2rem; line-height: 44px !important; }
.wcfmmp-store-search-form .select2-container .select2-selection--single .select2-selection__arrow { top: 0; right: 0.5rem; }
.wcfmmp-store-search-form input.search-field { width: 100%; box-sizing: border-box; }

/* Stores list: line the filter bar up with the sort bar and the tiles */
body .wcfmmp-store-search-form { margin-inline: 12px; }

/* Content tables (often pasted from Word with fixed widths like width="852" and column widths in inches):
   on phones make them fit the screen and let long words wrap, instead of widening the whole page. */
@media (max-width: 700px) {
	.entry-content table:not(.shop_table):not(.woocommerce-table),
	.tinyTxt table, .store-about table {
		width: 100% !important; max-width: 100% !important; height: auto !important; table-layout: fixed;
	}
	.entry-content table:not(.shop_table):not(.woocommerce-table) :is(td, th),
	.tinyTxt table :is(td, th), .store-about table :is(td, th) {
		width: auto !important; min-width: 0; height: auto !important; padding: 0.35rem !important; overflow-wrap: anywhere; word-break: break-word; hyphens: auto;
	}
	.entry-content table :is(td, th) p, .tinyTxt table :is(td, th) p { font-size: 1rem !important; }
}