/* Glass Storefront — base (every page) */
:root {
	--gsf-ink: #141414;
	--gsf-ink-2: #3b3b3b;
	--gsf-muted: #7c7c7c;
	--gsf-line: rgba(20, 20, 20, .1);
	--gsf-bg: #f7f7f6;
	--gsf-tile: #e9e9e7;
	--gsf-glass: rgba(255, 255, 255, .55);
	--gsf-glass-strong: rgba(255, 255, 255, .8);
	--gsf-glass-edge: rgba(255, 255, 255, .6);
	--gsf-blur: saturate(170%) blur(22px);
	--gsf-r: 20px;
	--gsf-r-sm: 8px;
	--gsf-edge: clamp(12px, 2.5vw, 64px);
	--gsf-gap: 16px;
	--gsf-top: 12px;
	--gsf-header-h: 60px;
	--gsf-ann-h: 0px;
	--gsf-ease: cubic-bezier(.2, .8, .2, 1);
}
.gsf-has-ann { --gsf-ann-h: 42px; }
/* Computed on body so it picks up the announcement height and the mobile header size. */
body.gsf { --gsf-offset: calc(var(--gsf-top) + var(--gsf-ann-h) + var(--gsf-header-h) + 24px); }

body.gsf {
	margin: 0;
	/* Sticky footer: short pages still push the footer to the bottom of the screen. */
	display: flex; flex-direction: column;
	min-height: calc(100vh - var(--wp-admin--admin-bar--height, 0px));
	font-family: var(--gsf-font);
	font-weight: 400;
	color: var(--gsf-ink);
	background: var(--gsf-bg);
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-rendering: optimizeLegibility;
}
.gsf .wp-site-blocks { padding-top: var(--gsf-offset); }
.gsf-main { padding: var(--gsf-offset) var(--gsf-edge) 0; }
:where(.gsf) img { max-width: 100%; height: auto; }
.gsf :focus-visible { outline: 2px solid var(--gsf-ink); outline-offset: 2px; }

.gsf .screen-reader-text,
.gsf-sr {
	position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
	overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0;
}
.gsf-skip {
	position: fixed; top: 8px; left: 8px; z-index: 2000; padding: 10px 16px;
	background: var(--gsf-ink); color: #fff; border-radius: 8px; text-decoration: none;
	transform: translateY(-200%);
}
.gsf-skip:focus { transform: none; }

/* ---------- Glass ---------- */
.gsf-glass {
	background: var(--gsf-glass);
	-webkit-backdrop-filter: var(--gsf-blur);
	backdrop-filter: var(--gsf-blur);
	border: 1px solid var(--gsf-glass-edge);
	box-shadow: 0 12px 40px -18px rgba(0, 0, 0, .18), inset 0 1px 0 rgba(255, 255, 255, .5);
}
@supports not ((-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))) {
	.gsf-glass { background: rgba(255, 255, 255, .94); }
}

/* ---------- Header ---------- */
.gsf-header-wrap {
	position: absolute; top: 0; left: 0; right: 0; z-index: 100;
	padding: var(--gsf-top) var(--gsf-top) 0;
	pointer-events: none;
}
.gsf-fixed .gsf-header-wrap { position: fixed; }
.gsf-header-wrap > * { pointer-events: auto; }
.admin-bar .gsf-header-wrap { top: 32px; }
@media (max-width: 782px) { .admin-bar .gsf-header-wrap { top: 46px; } }

.gsf-ann {
	height: 34px; margin-bottom: 8px; border-radius: 999px;
	display: flex; align-items: center; justify-content: center; gap: 10px; padding: 0 44px;
	position: relative; background: var(--gsf-ann-bg); color: var(--gsf-ann-fg);
	font-size: 12px; letter-spacing: .03em;
}
.gsf-ann__text { color: inherit; text-decoration: none; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
a.gsf-ann__text:hover { text-decoration: underline; }
.gsf-ann__close {
	position: absolute; right: 8px; top: 50%; transform: translateY(-50%);
	width: 26px; height: 26px; border: 0; border-radius: 50%; background: transparent; color: inherit;
	display: inline-flex; align-items: center; justify-content: center; cursor: pointer; opacity: .7;
}
.gsf-ann__close:hover { opacity: 1; }

.gsf-header {
	position: relative;
	height: var(--gsf-header-h);
	border-radius: var(--gsf-r);
	display: grid; grid-template-columns: 1fr auto 1fr; align-items: center;
	padding: 0 clamp(14px, 1.6vw, 28px);
}
.gsf-logo { justify-self: start; display: inline-flex; align-items: center; color: inherit; text-decoration: none; }
/* Stronger than WooCommerce's ".woocommerce-page img { height: auto }" on account/checkout pages. */
body.gsf .gsf-header .gsf-logo__img { height: var(--gsf-logo-h); width: auto; max-width: none; display: block; }
.gsf-logo__text { font-size: 15px; font-weight: 500; letter-spacing: .01em; }

.gsf-nav { justify-self: center; }
.gsf-menu { display: flex; align-items: center; gap: clamp(20px, 3.2vw, 60px); list-style: none; margin: 0; padding: 0; }
.gsf-menu li { position: relative; }
.gsf-menu a {
	display: inline-flex; align-items: center; gap: 6px; padding: 10px 0;
	color: var(--gsf-ink); text-decoration: none;
	font-size: 13px; letter-spacing: .04em; text-transform: uppercase;
	transition: opacity .2s;
}
.gsf-menu a:hover,
.gsf-menu .current-menu-item > a { opacity: .55; }
.gsf-chev { display: inline-flex; transition: transform .25s var(--gsf-ease); }
.gsf-menu li:hover > a .gsf-chev,
.gsf-menu li:focus-within > a .gsf-chev { transform: rotate(180deg); }

.gsf-menu .sub-menu {
	position: absolute; top: 100%; left: -14px; min-width: 230px;
	list-style: none; margin: 12px 0 0; padding: 8px;
	border-radius: 14px;
	background: var(--gsf-glass-strong);
	-webkit-backdrop-filter: var(--gsf-blur); backdrop-filter: var(--gsf-blur);
	border: 1px solid var(--gsf-glass-edge);
	box-shadow: 0 18px 50px -20px rgba(0, 0, 0, .25);
	opacity: 0; visibility: hidden; transform: translateY(-6px);
	transition: opacity .2s, transform .25s var(--gsf-ease), visibility 0s .25s;
}
.gsf-menu .sub-menu::before { content: ""; position: absolute; left: 0; right: 0; top: -14px; height: 14px; }
.gsf-menu li:hover > .sub-menu,
.gsf-menu li:focus-within > .sub-menu { opacity: 1; visibility: visible; transform: none; transition-delay: 0s; }
.gsf-menu .sub-menu a {
	display: flex; padding: 9px 12px; border-radius: 8px;
	font-size: 14px; letter-spacing: 0; text-transform: none;
}
.gsf-menu .sub-menu a:hover { opacity: 1; background: rgba(0, 0, 0, .05); }

.gsf-actions { justify-self: end; display: flex; align-items: center; gap: 4px; }
.gsf-icon-btn {
	position: relative; display: inline-flex; align-items: center; justify-content: center;
	width: 40px; height: 40px; padding: 0; border: 0; border-radius: 50%;
	background: none; color: var(--gsf-ink); cursor: pointer; text-decoration: none;
	transition: background .2s;
}
.gsf-icon-btn:hover { background: rgba(0, 0, 0, .05); }
.gsf-count {
	position: absolute; top: 5px; right: 3px; min-width: 16px; height: 16px; padding: 0 4px;
	box-sizing: border-box; border-radius: 99px; background: var(--gsf-ink); color: #fff;
	font-size: 10px; line-height: 16px; font-weight: 500; text-align: center;
}
.gsf-count[hidden] { display: none; }
.gsf-burger { display: none; }

@media (max-width: 900px) {
	:root { --gsf-header-h: 56px; --gsf-top: 8px; }
	.gsf-header { grid-template-columns: 1fr auto; padding: 0 6px 0 16px; }
	.gsf-burger { display: inline-flex; }
	.gsf-nav {
		display: none; position: absolute; top: calc(100% + 8px); left: 0; right: 0; justify-self: stretch;
		padding: 8px; border-radius: var(--gsf-r);
		max-height: calc(100vh - var(--gsf-offset)); overflow: auto;
		background: rgba(255, 255, 255, .92);
		-webkit-backdrop-filter: var(--gsf-blur); backdrop-filter: var(--gsf-blur);
		border: 1px solid var(--gsf-glass-edge);
		box-shadow: 0 18px 50px -20px rgba(0, 0, 0, .25);
	}
	.is-menu-open .gsf-nav { display: block; }
	.gsf-menu { flex-direction: column; align-items: stretch; gap: 0; }
	.gsf-menu a { display: flex; padding: 13px 12px; font-size: 14px; }
	.gsf-menu .sub-menu {
		position: static; min-width: 0; margin: 0; padding: 0 0 6px 12px;
		opacity: 1; visibility: visible; transform: none;
		background: none; border: 0; box-shadow: none; -webkit-backdrop-filter: none; backdrop-filter: none;
	}
	.gsf-menu .sub-menu::before, .gsf-chev { display: none; }
	.gsf-menu .sub-menu a { padding: 9px 12px; color: var(--gsf-ink-2); }
}

/* ---------- Footer ---------- */
.gsf-footer { margin-top: auto; width: 100%; box-sizing: border-box; padding: clamp(56px, 7vw, 120px) var(--gsf-top) var(--gsf-top); }
.gsf-footer__pill {
	min-height: 52px; box-sizing: border-box; border-radius: var(--gsf-r);
	padding: 10px clamp(16px, 1.6vw, 28px);
	display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 12px 32px;
	border-color: var(--gsf-line);
	font-size: 12px; letter-spacing: .02em; color: var(--gsf-ink-2);
}
.gsf-footer__left { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 28px; }
.gsf-footer__copy { color: var(--gsf-muted); }
.gsf-fmenu { display: flex; flex-wrap: wrap; gap: 6px 24px; list-style: none; margin: 0; padding: 0; }
.gsf-fmenu a { color: inherit; text-decoration: none; }
.gsf-fmenu a:hover { color: var(--gsf-ink); text-decoration: underline; text-underline-offset: 3px; }
.gsf-footer__right { display: flex; align-items: center; flex-wrap: wrap; gap: 8px 16px; }
.gsf-secure { display: inline-flex; align-items: center; gap: 6px; color: var(--gsf-muted); }
.gsf-pay { display: flex; gap: 6px; list-style: none; margin: 0; padding: 0; }
.gsf-pay__item {
	height: 22px; padding: 0 8px; display: flex; align-items: center;
	border: 1px solid var(--gsf-line); border-radius: 5px; background: rgba(255, 255, 255, .8);
	font-size: 10px; font-weight: 600; letter-spacing: .01em; color: var(--gsf-ink);
}
@media (max-width: 700px) {
	.gsf-footer__pill { flex-direction: column; justify-content: center; text-align: center; padding: 16px; }
	.gsf-footer__left, .gsf-footer__right { justify-content: center; }
	.gsf-fmenu { justify-content: center; }
}

/* ---------- Buttons ---------- */
.gsf-btn {
	display: flex; align-items: center; justify-content: center; width: 100%; box-sizing: border-box;
	height: 52px; padding: 0 24px; border: 1px solid var(--gsf-ink); border-radius: 6px;
	background: var(--gsf-ink); color: #fff; font: inherit; font-size: 15px; font-weight: 500;
	text-decoration: none; cursor: pointer; transition: opacity .2s;
}
.gsf-btn:hover { opacity: .85; color: #fff; }
.gsf-btn--ghost { background: transparent; color: var(--gsf-ink); }
.gsf-btn--ghost:hover { color: var(--gsf-ink); background: rgba(0, 0, 0, .04); opacity: 1; }
.gsf-btn--inline { display: inline-flex; width: auto; }
.gsf-link-btn {
	padding: 0; border: 0; background: none; cursor: pointer; font: inherit; font-size: 12px;
	color: var(--gsf-muted); text-decoration: underline; text-underline-offset: 3px;
}
.gsf-link-btn:hover { color: var(--gsf-ink); }
.is-loading { opacity: .55; pointer-events: none; }

/* ---------- Drawer (mini cart) ---------- */
.gsf-drawer { position: fixed; inset: 0; z-index: 1000; visibility: hidden; pointer-events: none; transition: visibility 0s .45s; }
.gsf-drawer.is-open { visibility: visible; pointer-events: auto; transition: none; }
.gsf-drawer__scrim { position: absolute; inset: 0; background: rgba(12, 12, 12, .28); opacity: 0; transition: opacity .35s var(--gsf-ease); }
.gsf-drawer.is-open .gsf-drawer__scrim { opacity: 1; }
.gsf-drawer__panel {
	position: absolute; top: var(--gsf-top); right: var(--gsf-top); bottom: var(--gsf-top);
	width: min(440px, calc(100% - 2 * var(--gsf-top)));
	display: flex; flex-direction: column; overflow: hidden; outline: none;
	border-radius: var(--gsf-r);
	background: var(--gsf-glass-strong);
	transform: translateX(calc(100% + 24px));
	transition: transform .45s var(--gsf-ease);
}
.gsf-drawer.is-open .gsf-drawer__panel { transform: none; }
.gsf-drawer__head { display: flex; align-items: center; justify-content: space-between; padding: 10px 10px 10px 22px; border-bottom: 1px solid var(--gsf-line); }
.gsf-drawer__title { margin: 0; font-size: 15px; font-weight: 500; }
.gsf-drawer__body { flex: 1; min-height: 0; display: flex; flex-direction: column; transition: opacity .2s; }
.gsf-drawer__body.is-busy { opacity: .5; pointer-events: none; }
body.gsf-lock { overflow: hidden; }

.gsf-mini__items { flex: 1; overflow: auto; list-style: none; margin: 0; padding: 4px 22px; overscroll-behavior: contain; }
.gsf-mini__item { display: grid; grid-template-columns: 76px minmax(0, 1fr) auto; gap: 14px; padding: 16px 0; border-bottom: 1px solid var(--gsf-line); }
.gsf-mini__item:last-child { border-bottom: 0; }
.gsf-mini__thumb { display: block; }
.gsf-mini__thumb img { width: 76px; height: 76px; object-fit: cover; border-radius: 6px; display: block; background: var(--gsf-tile); }
.gsf-mini__name { font-size: 14px; line-height: 1.3; color: inherit; text-decoration: none; }
.gsf-mini__sub { margin: 3px 0 0; font-size: 12px; color: var(--gsf-muted); }
.gsf-mini__info dl.variation { margin: 4px 0 0; font-size: 12px; color: var(--gsf-muted); }
.gsf-mini__qty { display: inline-flex; align-items: center; margin-top: 10px; border: 1px solid var(--gsf-line); border-radius: 99px; font-size: 13px; }
.gsf-mini__qty span { min-width: 20px; text-align: center; }
.gsf-mini__qty button { width: 30px; height: 30px; display: inline-flex; align-items: center; justify-content: center; border: 0; background: none; color: inherit; cursor: pointer; border-radius: 50%; }
.gsf-mini__end { display: flex; flex-direction: column; align-items: flex-end; justify-content: space-between; gap: 8px; font-size: 14px; }
.gsf-mini__foot { display: grid; gap: 12px; padding: 18px 22px 22px; border-top: 1px solid var(--gsf-line); }
.gsf-mini__row { display: flex; justify-content: space-between; align-items: baseline; font-size: 15px; }
.gsf-mini__row strong { font-weight: 500; }
.gsf-mini__note { margin: 0; font-size: 12px; color: var(--gsf-muted); }
.gsf-mini__actions { display: grid; gap: 8px; }
.gsf-mini__empty { flex: 1; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 18px; padding: 40px 24px; text-align: center; color: var(--gsf-muted); }
.gsf-mini__empty p { margin: 0; }
.gsf-mini__empty .gsf-btn { width: auto; }
.gsf-mini__errors { margin: 14px 22px 0; padding: 10px 14px; border-radius: 8px; background: #fbeaea; color: #8d1f1f; font-size: 13px; }
.gsf-mini__errors p { margin: 0; }
.gsf-mini__errors a { color: inherit; }

@media (max-width: 600px) {
	.gsf-drawer__panel {
		top: auto; left: 8px; right: 8px; bottom: calc(8px + env(safe-area-inset-bottom, 0px));
		width: auto; height: min(82vh, 680px);
		transform: translateY(calc(100% + 24px));
	}
}

/* ---------- WooCommerce notices ---------- */
.gsf .woocommerce-notices-wrapper:empty { display: none; }
.gsf .woocommerce-message,
.gsf .woocommerce-info,
.gsf .woocommerce-error {
	list-style: none; margin: 0 0 12px; padding: 14px 18px; border-radius: 10px;
	display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px;
	background: #fff; border: 1px solid var(--gsf-line); font-size: 14px; color: var(--gsf-ink);
}
.gsf .woocommerce-error { background: #fbeaea; border-color: #f0c8c8; color: #8d1f1f; }
.gsf .woocommerce-error li { margin: 0; }
.gsf .woocommerce-message .button,
.gsf .woocommerce-info .button {
	order: 2; padding: 0; background: none; border: 0; font: inherit; font-size: 13px;
	color: inherit; text-decoration: underline; text-underline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
	.gsf *, .gsf *::before, .gsf *::after { transition-duration: .01ms !important; }
}

/* Uploaded icon (e.g. Instagram glyph) */
body.gsf .gsf-header .gsf-icon-img { width: 20px; height: 20px; max-width: none; object-fit: contain; display: block; }

/* ---------- Normal pages: width setting (Storefront → Pages & blog) ---------- */
body.gsf-pw-full { --wp--style--global--content-size: 100%; --wp--style--global--wide-size: 100%; }
body.gsf-pw-wide { --wp--style--global--content-size: 1280px; --wp--style--global--wide-size: 1440px; }
body.gsf-pw-narrow { --wp--style--global--content-size: 720px; --wp--style--global--wide-size: 1280px; }

/* ---------- Campaigns ---------- */
.gsf-badge {
	display: inline-flex; align-items: center; height: 20px; padding: 0 8px; box-sizing: border-box;
	border-radius: 99px; background: var(--gsf-badge-bg, #141414); color: var(--gsf-badge-fg, #fff);
	font-size: 11px; font-weight: 500; line-height: 1; letter-spacing: .02em; text-transform: none; white-space: nowrap;
}
.gsf-card__price { display: inline-flex; flex-wrap: wrap; justify-content: flex-end; align-items: center; gap: 4px 8px; }
.gsf-buy__price { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 12px; }
.gsf-buy__mprice { align-items: center; gap: 8px; }
.gsf-buy__action:not(.is-variable) .gsf-buy__mprice { display: none; }
@media (max-width: 900px) {
	.gsf-buy__action:not(.is-variable) .gsf-buy__mprice { display: flex; flex-direction: column; align-items: flex-start; gap: 4px; }
}
.gsf-nudge {
	margin: 0 0 12px; padding: 8px 12px; border-radius: 8px;
	background: rgba(0, 0, 0, .045); color: var(--gsf-ink-2); font-size: 12px; line-height: 1.4;
}
.gsf-nudge.is-on { background: #ecf5ee; color: #1f5f32; }
.gsf-mini__row.is-discount, .gsf-cart__row.is-discount { color: #1f5f32; font-size: 14px; }
.gsf-cart__row.is-discount { padding: 12px 0 0; border-bottom: 0; }
.gsf-cart__row.is-total { padding: 14px 0 0; margin-top: 12px; border-top: 1px solid var(--gsf-line); border-bottom: 0; }
.gsf-mini__row.is-total strong, .gsf-cart__row.is-total strong { font-weight: 500; }

/* Image optimizers (ShortPixel, Imagify, EWWW…) may wrap images in <picture> for WebP/AVIF.
   This keeps the wrapper out of the layout so galleries, sliders and cards never break. */
.gsf-hero picture, .gsf-marquee picture, .gsf-gallery picture, .gsf-card picture,
.gsf-post-card picture, .gsf-post__cover picture, .gsf-mini__thumb picture,
.gsf-cart__thumb picture, .gsf-logo picture { display: contents; }

/* ---------- 404 ---------- */
.gsf-404__inner { max-width: 560px; margin: clamp(24px, 8vh, 96px) auto 0; text-align: center; }
.gsf-404__code { margin: 0; font-size: clamp(72px, 12vw, 160px); font-weight: 200; line-height: 1; letter-spacing: -.04em; color: var(--gsf-ink); }
.gsf-404__title { margin: 18px 0 0; font-size: clamp(24px, 2.4vw, 34px); font-weight: 300; letter-spacing: -.01em; }
.gsf-404__text { margin: 12px 0 0; font-size: 16px; line-height: 1.55; font-weight: 300; color: var(--gsf-ink-2); }
.gsf-404__search { display: flex; gap: 8px; margin: 28px 0 0; }
.gsf-404__search input {
	flex: 1; min-width: 0; height: 52px; box-sizing: border-box; padding: 0 16px;
	border: 1px solid var(--gsf-line); border-radius: 8px; background: #fff; font: inherit; font-size: 15px; color: var(--gsf-ink);
}
.gsf-404__search input:focus { outline: none; border-color: var(--gsf-ink); box-shadow: 0 0 0 3px rgba(20, 20, 20, .08); }
.gsf-404__actions { display: flex; justify-content: center; flex-wrap: wrap; gap: 8px 24px; margin-top: 20px; }
.gsf-404__actions .gsf-link-btn { font-size: 14px; color: var(--gsf-ink); }
.gsf-404__products { margin-top: clamp(72px, 10vw, 140px); }
.gsf-404__head { display: flex; align-items: baseline; justify-content: space-between; margin-bottom: 16px; font-size: 13px; letter-spacing: .03em; }
.gsf-404__head h2 { margin: 0; font-size: inherit; font-weight: 400; }
.gsf-upper .gsf-404__head h2 { text-transform: uppercase; }
.gsf-404__head a { color: var(--gsf-muted); text-decoration: none; }
.gsf-404__head a:hover { color: var(--gsf-ink); }
