/* light theme: page layer for coa */
@media (prefers-color-scheme: light) {
/* from <style 1> */
html .coa-table tbody tr:hover:where(:not(.hero *):not(.hero)) { border-color: rgba(8,109,149,0.35); box-shadow: 0 10px 26px rgba(16,24,40,0.113); }
html .coa-table .compound-cell .thumb:where(:not(.hero *):not(.hero)) { background: radial-gradient(ellipse at 50% 42%, #ffffff 0%, #ffffff 78%); }
html .coa-table td[data-label="Purity"] .purity-pill:where(:not(.hero *):not(.hero)) { color: #916f31; }
html .coa-table .coa-btn-row .coa-buy-btn:where(:not(.hero *):not(.hero)) { background: #f4f6f8; color: #0b0d12; border: 1px solid rgba(11,13,18,0.184); }
html .coa-table .coa-btn-row .coa-buy-btn .cb-price:where(:not(.hero *):not(.hero)) { color: #0b0d12; }
html .coa-table .coa-btn-row .coa-buy-btn:hover:where(:not(.hero *):not(.hero)) { background: #ffffff; border-color: rgba(8,109,149,0.55); }
html .coa-table .coa-view-btn.ready:where(:not(.hero *):not(.hero)) { background: linear-gradient(180deg,#ffffff,#ffffff); border: 1px solid rgba(11,13,18,0.161); }
html .coa-table .coa-view-btn.ready:hover:where(:not(.hero *):not(.hero)) { background: linear-gradient(180deg,#ffffff,#ffffff); }
/* from <style 2> */
@media (max-width:720px) {
html .cm-table tbody tr:where(:not(.hero *):not(.hero)) { background: rgba(11,13,18,0.023); }
}
/* from <style 3> */
html .coa-viewer .coa-viewer-body:where(:not(.hero *):not(.hero)) { background: #ffffff; }
html .coa-viewer .coa-zoom-wrap:where(:not(.hero *):not(.hero)) { box-shadow: 0 4px 24px rgba(16,24,40,0.1); background: #ffffff; }
html .coa-viewer .coa-zoom-ctrl:where(:not(.hero *):not(.hero)) { background: rgba(11,13,18,0.057); border: 1px solid rgba(11,13,18,0.161); }
html .coa-viewer .coa-zoom-ctrl button:where(:not(.hero *):not(.hero)) { color: #086d95; }
html .coa-viewer .coa-zoom-ctrl #coa-zoom-pct:where(:not(.hero *):not(.hero)) { color: #086d95; }
html .coa-viewer .coa-dl-btn:where(:not(.hero *):not(.hero)) { border: 1px solid #086d95; color: #086d95; }
/* --- hand fixes for coa --- */
/* coa: hand fixes (plain rules; the generator wraps them in the light media query) */

/* "7x Analytical Panel" accordion: white card instead of a grey slab; inner table/tiles white with hairlines */
html .cm-details { background: #ffffff !important; border-color: var(--line) !important; box-shadow: 0 8px 24px rgba(16,24,40,0.05); }
html .cm-details[open] { border-color: var(--line-strong) !important; }
html .cm-summary:hover { background: rgba(8,109,149,0.04) !important; }
html .cm-eyebrow { color: var(--accent-ink) !important; }
html .cm-table-wrap { background: #ffffff; border-color: var(--line-strong) !important; }
html .cm-table thead th { background: #f8fafc !important; color: var(--text-3) !important; border-bottom-color: var(--line) !important; }
html .cm-table tbody td { border-bottom-color: var(--line) !important; }
html .cm-table .cm-std { color: var(--accent-ink) !important; background: rgba(8,109,149,0.06) !important; border-color: rgba(8,109,149,0.22) !important; }
@media (max-width: 720px) {
  html .cm-table-wrap { background: transparent; }
  html .cm-table tbody tr { background: #ffffff !important; border-color: var(--line-strong) !important; }
}

/* Certificate cards: product photos have black studio backgrounds, so the photo tile goes full-bleed black
   (same as the home product cards) instead of a black square floating in a white frame */
html .coa-table .compound-cell .thumb { background: #000000 !important; }
html .coa-table tr { box-shadow: 0 8px 24px rgba(16,24,40,0.05); }
html .coa-table tbody tr:hover { box-shadow: 0 12px 28px rgba(16,24,40,0.10) !important; }

/* "Purity + content verified": darker green so it reads on white (was 3.2:1) */
html .coa-verified { color: #0d7347 !important; background: rgba(16,185,129,0.08) !important; border-color: rgba(13,115,71,0.22) !important; }

/* "View product": the black pill becomes the ink button (light-grey pill read as disabled); CoA stays the white outline pill */
html .coa-table .coa-btn-row .coa-buy-btn, html .coa-buy-btn { background: var(--text) !important; color: #ffffff !important; border-color: var(--text) !important; }
html .coa-table .coa-btn-row .coa-buy-btn .cb-price, html .coa-buy-btn .cb-price { color: #ffffff !important; }
html .coa-table .coa-btn-row .coa-buy-btn:hover, html .coa-buy-btn:hover { background: #1c2230 !important; border-color: #1c2230 !important; }
html .coa-table .coa-view-btn.ready { background: #ffffff !important; border-color: var(--line-strong) !important; color: var(--text) !important; }
html .coa-table .coa-view-btn.ready:hover { background: #ffffff !important; border-color: var(--accent-ink) !important; color: var(--accent-ink) !important; }

/* COA viewer: dim the page behind it (a white scrim made the white card vanish into the page);
   the certificate sits on a light-grey desk so the white paper keeps its edge */
html .coa-viewer { background: rgba(11,13,18,0.62) !important; }
html .coa-viewer-card { background: #ffffff !important; border-color: var(--line) !important; box-shadow: 0 30px 70px rgba(16,24,40,0.28) !important; }
html .coa-viewer-head { background: #ffffff !important; border-bottom-color: var(--line) !important; }
html .coa-viewer .coa-viewer-body { background: var(--bg) !important; }
html .coa-viewer .coa-zoom-wrap { background: #ffffff !important; box-shadow: 0 4px 20px rgba(16,24,40,0.10) !important; }
html .coa-viewer-eyebrow { color: var(--accent-ink) !important; }
html .coa-viewer .coa-zoom-ctrl { background: #ffffff !important; border-color: var(--line-strong) !important; }
html .coa-viewer .coa-zoom-ctrl button:hover { background: rgba(8,109,149,0.10) !important; }
html .coa-viewer .coa-dl-btn { background: #ffffff; }
html .coa-viewer .coa-dl-btn:hover { background: #5ec4e8 !important; border-color: #5ec4e8 !important; color: #04121a !important; }
/* final QA: two-up phone cards: stack the price under the label so it fits inside the ink pill */
@media (max-width: 760px) {
  html .coa-table .coa-btn-row .coa-buy-btn { flex-direction: column; gap: 1px; padding: 7px 10px !important; line-height: 1.2; }
}

}