/* Guardian Labs COA Manager — frontend
   Scoped under .glcoa so theme / Elementor styles don't leak in or out. */

.glcoa {
	--glcoa-ink: #0a2540;
	--glcoa-accent: #4a90d9;
	--glcoa-bg: #f5f7fa;
	--glcoa-card: #ffffff;
	--glcoa-line: #e2e8f0;
	--glcoa-line-strong: #cfd8e3;
	--glcoa-text: #1b2a3a;
	--glcoa-muted: #5b6b7d;
	--glcoa-radius: 14px;
	--glcoa-display: "Barlow Condensed", "Oswald", "Arial Narrow", system-ui, sans-serif;
	--glcoa-mono: ui-monospace, "SFMono-Regular", Menlo, Consolas, "Liberation Mono", monospace;
	--glcoa-ease: cubic-bezier(.2, .7, .2, 1);
	color: var(--glcoa-text);
	font-size: 16px;
	line-height: 1.5;
	box-sizing: border-box;
	-webkit-font-smoothing: antialiased;
}
.glcoa *, .glcoa *::before, .glcoa *::after { box-sizing: inherit; }
.glcoa h1, .glcoa h2, .glcoa h3, .glcoa h4, .glcoa h5, .glcoa p, .glcoa dl, .glcoa dd { margin: 0; padding: 0; }
.glcoa svg { display: block; width: 100%; height: 100%; }
.glcoa a { text-decoration: none !important; box-shadow: none !important; }
.glcoa-sr { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; padding: 0; margin: -1px; }
.glcoa-mono { font-family: var(--glcoa-mono); letter-spacing: .01em; }

.glcoa-library { max-width: 1120px; margin: 0 auto; padding: 0 0 48px; }

/* ---------- Hero ---------- */
.glcoa-hero {
	position: relative;
	overflow: hidden;
	background: radial-gradient(1200px 400px at 85% -20%, color-mix(in srgb, var(--glcoa-accent) 45%, transparent), transparent 60%), var(--glcoa-ink);
	background-color: var(--glcoa-ink);
	color: #fff;
	border-radius: calc(var(--glcoa-radius) + 4px);
	padding: clamp(32px, 6vw, 64px) clamp(22px, 5vw, 56px) clamp(28px, 5vw, 48px);
	margin-bottom: 28px;
	isolation: isolate;
}
.glcoa-hero__grid {
	position: absolute; inset: 0; z-index: -1; opacity: .35;
	background-image:
		linear-gradient(rgba(255,255,255,.07) 1px, transparent 1px),
		linear-gradient(90deg, rgba(255,255,255,.07) 1px, transparent 1px);
	background-size: 32px 32px;
	-webkit-mask-image: linear-gradient(180deg, #000 0%, transparent 90%);
	mask-image: linear-gradient(180deg, #000 0%, transparent 90%);
}
.glcoa-eyebrow {
	font-family: var(--glcoa-display);
	font-weight: 600;
	font-size: 14px;
	letter-spacing: .28em;
	text-transform: uppercase;
	color: var(--glcoa-accent);
	display: inline-flex; align-items: center; gap: 10px;
}
.glcoa-eyebrow::before { content: ""; width: 22px; height: 2px; background: currentColor; display: inline-block; }
.glcoa-hero .glcoa-eyebrow { color: color-mix(in srgb, var(--glcoa-accent) 70%, #fff); }
.glcoa .glcoa-hero__title {
	font-family: var(--glcoa-display);
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: .02em;
	font-size: clamp(38px, 6.5vw, 68px);
	line-height: .95;
	color: #fff;
	margin: 14px 0 16px;
}
.glcoa-hero__intro { max-width: 640px; color: rgba(255,255,255,.78); font-size: 17px; }
.glcoa .glcoa-hero__stats {
	display: flex; flex-wrap: wrap; gap: 10px 36px;
	margin-top: 28px; padding-top: 20px;
	border-top: 1px solid rgba(255,255,255,.14);
}
.glcoa-hero__stats div { display: flex; flex-direction: column-reverse; }
.glcoa-hero__stats dt { font-size: 12px; letter-spacing: .14em; text-transform: uppercase; color: rgba(255,255,255,.6); }
.glcoa-hero__stats dd { font-family: var(--glcoa-display); font-weight: 600; font-size: 28px; line-height: 1.1; color: #fff; }

.glcoa-preview-banner {
	background: #fff8e6; border: 1px solid #f0d58a; color: #6b5200;
	border-radius: 10px; padding: 10px 14px; margin-bottom: 14px; font-size: 14px;
}

/* ---------- Toolbar / search ---------- */
.glcoa-toolbar { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 16px; margin: 0 0 16px; }
.glcoa-search { position: relative; flex: 1 1 340px; display: block; margin: 0; }
.glcoa-search__icon { position: absolute; left: 16px; top: 50%; width: 20px !important; height: 20px !important; transform: translateY(-50%); color: var(--glcoa-muted); pointer-events: none; }
.glcoa .glcoa-search__input {
	width: 100%; height: 54px; margin: 0;
	padding: 0 18px 0 48px !important;
	font-size: 16px; color: var(--glcoa-text);
	background: var(--glcoa-card) !important;
	border: 1px solid var(--glcoa-line-strong) !important;
	border-radius: 12px !important;
	box-shadow: 0 1px 2px rgba(10, 37, 64, .04);
	outline: none;
	transition: border-color .2s, box-shadow .2s;
	-webkit-appearance: none; appearance: none;
}
.glcoa .glcoa-search__input:focus { border-color: var(--glcoa-accent) !important; box-shadow: 0 0 0 4px color-mix(in srgb, var(--glcoa-accent) 18%, transparent); }
.glcoa-results { font-size: 14px; color: var(--glcoa-muted); min-height: 1em; }

/* ---------- Product rows ---------- */
.glcoa-list { display: flex; flex-direction: column; gap: 10px; }
.glcoa-item {
	background: var(--glcoa-card);
	border: 1px solid var(--glcoa-line);
	border-radius: var(--glcoa-radius);
	transition: border-color .2s, box-shadow .25s var(--glcoa-ease), transform .25s var(--glcoa-ease);
	margin: 0;
}
.glcoa-item:hover { border-color: var(--glcoa-line-strong); box-shadow: 0 6px 24px -12px rgba(10, 37, 64, .25); }
.glcoa-item[open] { border-color: color-mix(in srgb, var(--glcoa-accent) 55%, var(--glcoa-line)); box-shadow: 0 12px 40px -18px rgba(10, 37, 64, .35); }
.glcoa-item__summary {
	list-style: none;
	cursor: pointer;
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto auto 34px;
	align-items: center;
	gap: 16px;
	padding: 18px 20px 18px 24px;
	border-radius: var(--glcoa-radius);
	outline: none;
	user-select: none;
}
.glcoa-item__summary::-webkit-details-marker { display: none; }
.glcoa-item__summary::marker { content: ""; }
.glcoa-item__summary:focus-visible { box-shadow: 0 0 0 3px color-mix(in srgb, var(--glcoa-accent) 45%, transparent); }
.glcoa-item__name {
	font-family: var(--glcoa-display);
	font-weight: 600;
	font-size: 22px;
	letter-spacing: .02em;
	text-transform: uppercase;
	color: var(--glcoa-ink);
	line-height: 1.15;
}
.glcoa-chip {
	display: inline-flex; align-items: center;
	padding: 4px 10px;
	border-radius: 999px;
	font-size: 13px; font-weight: 600; letter-spacing: .02em;
	color: var(--glcoa-ink);
	background: color-mix(in srgb, var(--glcoa-accent) 12%, #fff);
	border: 1px solid color-mix(in srgb, var(--glcoa-accent) 30%, #fff);
	white-space: nowrap;
}
.glcoa-item__count { font-size: 14px; color: var(--glcoa-muted); white-space: nowrap; }
.glcoa-item__icon {
	width: 34px; height: 34px; padding: 7px;
	border-radius: 50%;
	color: var(--glcoa-ink);
	background: var(--glcoa-bg);
	transition: transform .35s var(--glcoa-ease), background .2s, color .2s;
}
.glcoa-item[open] .glcoa-item__icon { transform: rotate(180deg); background: var(--glcoa-ink); color: #fff; }
.glcoa-item__body { overflow: hidden; }
.glcoa-item__inner { padding: 4px 20px 22px 24px; border-top: 1px solid var(--glcoa-line); padding-top: 18px; }

/* ---------- Lots and certificates ---------- */
.glcoa .glcoa-group-title {
	font-family: var(--glcoa-display); font-weight: 600; text-transform: uppercase;
	letter-spacing: .14em; font-size: 13px; color: var(--glcoa-muted);
	margin: 6px 0 10px;
}
.glcoa-lots { display: flex; flex-direction: column; gap: 14px; margin-bottom: 16px; }
.glcoa-lot {
	background: var(--glcoa-bg);
	border: 1px solid var(--glcoa-line);
	border-radius: 12px;
	padding: 14px;
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(280px, 1fr));
	gap: 12px;
}
.glcoa-lot.is-historical { opacity: .88; }
.glcoa-lot__head { grid-column: 1 / -1; display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 12px; }
.glcoa-lot__label { font-size: 11px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; color: var(--glcoa-muted); }
.glcoa-lot__number { font-family: var(--glcoa-mono); font-size: 15px; font-weight: 600; color: var(--glcoa-ink); word-break: break-all; }
.glcoa .glcoa-lot__link { margin-left: auto; font-size: 13px; font-weight: 600; color: var(--glcoa-accent) !important; }
.glcoa .glcoa-lot__link:hover { text-decoration: underline !important; }

.glcoa-cert {
	background: var(--glcoa-card);
	border: 1px solid var(--glcoa-line);
	border-radius: 10px;
	padding: 16px;
	display: flex; flex-direction: column; gap: 12px;
}
.glcoa-cert__top { display: flex; align-items: center; gap: 10px; }
.glcoa-cert__icon { flex: 0 0 34px; width: 34px; height: 34px; padding: 7px; border-radius: 8px; color: var(--glcoa-accent); background: color-mix(in srgb, var(--glcoa-accent) 10%, #fff); }
.glcoa .glcoa-cert__title { font-size: 16px; font-weight: 700; color: var(--glcoa-ink); line-height: 1.25; font-family: inherit; text-transform: none; letter-spacing: 0; }
.glcoa-cert__meta { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 14px; }
.glcoa-cert__meta div { min-width: 0; }
.glcoa-cert__meta dt { font-size: 11px; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--glcoa-muted); }
.glcoa-cert__meta dd { font-size: 14px; color: var(--glcoa-text); overflow-wrap: anywhere; }
.glcoa-cert__extra { font-size: 13px; color: var(--glcoa-muted); }
.glcoa-cert__actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: auto; }

.glcoa .glcoa-btn {
	display: inline-flex; align-items: center; justify-content: center; gap: 8px;
	min-height: 42px; padding: 0 16px;
	border-radius: 9px;
	font-size: 14px; font-weight: 600; line-height: 1;
	letter-spacing: .01em;
	transition: background .2s, color .2s, border-color .2s, transform .15s;
	cursor: pointer;
	flex: 1 1 auto;
}
.glcoa .glcoa-btn svg { width: 16px; height: 16px; flex: 0 0 16px; }
.glcoa .glcoa-btn--primary { background: var(--glcoa-ink) !important; color: #fff !important; border: 1px solid var(--glcoa-ink); }
.glcoa .glcoa-btn--primary:hover { background: color-mix(in srgb, var(--glcoa-ink) 82%, var(--glcoa-accent)) !important; }
.glcoa .glcoa-btn--ghost { background: #fff !important; color: var(--glcoa-ink) !important; border: 1px solid var(--glcoa-line-strong); }
.glcoa .glcoa-btn--ghost:hover { border-color: var(--glcoa-accent); color: var(--glcoa-accent) !important; }
.glcoa .glcoa-btn:active { transform: translateY(1px); }
.glcoa .glcoa-btn:focus-visible, .glcoa a:focus-visible, .glcoa button:focus-visible { outline: 3px solid color-mix(in srgb, var(--glcoa-accent) 55%, transparent); outline-offset: 2px; }

.glcoa .glcoa-link { display: inline-flex; gap: 6px; font-size: 14px; font-weight: 600; color: var(--glcoa-accent) !important; margin-top: 4px; }
.glcoa .glcoa-link:hover { text-decoration: underline !important; }

.glcoa-empty {
	text-align: center; color: var(--glcoa-muted);
	padding: 36px 16px; border: 1px dashed var(--glcoa-line-strong); border-radius: var(--glcoa-radius);
	background: var(--glcoa-bg);
}
.glcoa .glcoa-more {
	display: block; margin: 18px auto 0; padding: 12px 22px;
	background: #fff !important; color: var(--glcoa-ink) !important;
	border: 1px solid var(--glcoa-line-strong) !important; border-radius: 999px !important;
	font-weight: 600; font-size: 14px; cursor: pointer;
}
.glcoa .glcoa-more:hover { border-color: var(--glcoa-accent) !important; }
.glcoa-disclaimer { margin-top: 28px !important; font-size: 13px; color: var(--glcoa-muted); text-align: center; max-width: 720px; margin-left: auto !important; margin-right: auto !important; }

/* ---------- Product page block ---------- */
.glcoa-product { margin: 32px 0; padding: 24px; border: 1px solid var(--glcoa-line); border-radius: calc(var(--glcoa-radius) + 2px); background: #fff; clear: both; }
.woocommerce-Tabs-panel .glcoa-product { margin: 0; }
.glcoa-product__head { margin-bottom: 18px; }
.glcoa-product__head .glcoa-eyebrow { color: var(--glcoa-ink); font-size: 18px; letter-spacing: .18em; }
.glcoa-product__head .glcoa-eyebrow::before { background: var(--glcoa-accent); }
.glcoa-product__intro { margin-top: 6px !important; color: var(--glcoa-muted); }
.glcoa .glcoa-product__strength { display: flex; align-items: center; gap: 12px; margin: 18px 0 10px; font-size: 15px; }
.glcoa-product__count { font-size: 14px; color: var(--glcoa-muted); font-weight: 400; }
.glcoa-product__group[hidden] { display: none !important; }
.glcoa-variation-note { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; font-size: 14px; color: var(--glcoa-muted); }
.glcoa-variation-note[hidden] { display: none !important; }
.glcoa .glcoa-linkbtn { background: none !important; border: 0 !important; padding: 0 !important; color: var(--glcoa-accent) !important; font-weight: 600; cursor: pointer; font-size: 14px; text-decoration: underline; }

/* ---------- Lot page ---------- */
.glcoa-page-wrap { padding: clamp(20px, 4vw, 48px) 16px; }
.glcoa-batch { max-width: 960px; margin: 0 auto; }
.glcoa-hero--lot { padding-bottom: clamp(26px, 4vw, 40px); }
.glcoa-batch__card { background: #fff; border: 1px solid var(--glcoa-line); border-radius: var(--glcoa-radius); padding: 22px 24px; margin: -54px 16px 26px; position: relative; box-shadow: 0 18px 40px -24px rgba(10, 37, 64, .45); }
.glcoa-batch.is-compact .glcoa-batch__card { margin: 0 0 18px; }
.glcoa-batch__facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 16px 24px; }
.glcoa-batch__facts dt { font-size: 11px; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; color: var(--glcoa-muted); }
.glcoa-batch__facts dd { font-size: 17px; font-weight: 600; color: var(--glcoa-ink); overflow-wrap: anywhere; }
.glcoa-batch__facts dd a { color: var(--glcoa-ink) !important; border-bottom: 2px solid color-mix(in srgb, var(--glcoa-accent) 40%, transparent); }
.glcoa .glcoa-batch__subhead { font-family: var(--glcoa-display); font-weight: 600; font-size: 22px; text-transform: uppercase; letter-spacing: .06em; color: var(--glcoa-ink); margin: 0 0 12px; }
.glcoa-lots--grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 14px; }
.glcoa-batch__back { margin-top: 24px !important; }

/* ---------- Responsive ---------- */
@media (max-width: 640px) {
	.glcoa-item__summary {
		grid-template-columns: minmax(0, 1fr) auto 34px;
		grid-template-areas: "name name icon" "strength count icon";
		gap: 8px 12px;
		padding: 16px;
	}
	.glcoa-item__name { grid-area: name; font-size: 20px; }
	.glcoa-item__strength { grid-area: strength; }
	.glcoa-item__count { grid-area: count; font-size: 13px; }
	.glcoa-item__icon { grid-area: icon; }
	.glcoa-item__inner { padding: 14px 14px 18px; }
	.glcoa-lot { grid-template-columns: 1fr; padding: 10px; }
	.glcoa-cert__meta { grid-template-columns: 1fr 1fr; }
	.glcoa-product { padding: 16px; }
	.glcoa-batch__card { margin: -40px 8px 22px; padding: 18px; }
}

@media (prefers-reduced-motion: reduce) {
	.glcoa *, .glcoa *::before, .glcoa *::after { transition: none !important; animation: none !important; }
}

@supports not (color: color-mix(in srgb, red 50%, blue)) {
	.glcoa-chip { background: #eaf2fb; border-color: #c7dcf3; }
	.glcoa-cert__icon { background: #eef5fc; }
	.glcoa-item[open] { border-color: #9cc0e8; }
}
