/*
 * Snap Portal — styles — v1.1.0 — 2026-09-28 23:55
 * Scoped to .snp so themes (and Elementor) are not affected. WCAG AA contrast; 44px targets.
 */
.snp {
	--snp-navy: #0B1D3A; --snp-blue: #0D47A1; --snp-gold: #E8A838; --snp-gold-soft: #FDF0D5;
	--snp-green-soft: #DCF5E6; --snp-green-ink: #14532D; --snp-red-soft: #FDE2E2; --snp-red-ink: #7F1D1D;
	--snp-ink: #1B2A41; --snp-muted: #44516A; --snp-line: #D6DCE8; --snp-wash: #F4F6FA;
	--snp-serif: "DM Serif Display", Georgia, "Times New Roman", serif;
	--snp-sans: "Outfit", "Segoe UI", system-ui, -apple-system, Roboto, sans-serif;
	font-family: var(--snp-sans); color: var(--snp-ink); font-size: 17px; line-height: 1.55;
	max-width: 1180px; margin: 0 auto 3rem; box-sizing: border-box;
}
.snp *, .snp *::before, .snp *::after { box-sizing: inherit; }
.snp [hidden] { display: none !important; }
.snp .snp-h1 { font: 400 clamp(1.9rem, 4vw, 2.6rem)/1.15 var(--snp-serif); margin: 0 0 .25rem; color: #FFFFFF; }
.snp .snp-h2 { font: 400 1.7rem/1.2 var(--snp-serif); margin: 0 0 .5rem; color: var(--snp-navy); }
.snp .snp-h3 { font: 600 1.1rem/1.3 var(--snp-sans); margin: 0 0 .5rem; color: var(--snp-navy); display: flex; align-items: center; gap: .5rem; }
.snp p { margin: 0 0 .75rem; }
.snp .snp-muted, .snp .snp-hint { color: var(--snp-muted); }
.snp .snp-hint { display: block; font-size: .9rem; margin-top: .25rem; }
.snp a { color: var(--snp-blue); text-underline-offset: 2px; }
.snp :focus-visible { outline: 3px solid var(--snp-gold); outline-offset: 2px; }
.snp .snp-ico { width: 1.35em; height: 1.35em; flex: none; }

/* Buttons */
.snp .snp-btn, .snp a.snp-btn { display: inline-flex; align-items: center; justify-content: center; gap: .5em; font: 600 1rem/1.2 var(--snp-sans); padding: .75em 1.3em; min-height: 44px; border-radius: 999px; border: 2px solid var(--snp-navy); text-decoration: none; cursor: pointer; transition: background .15s, color .15s; }
.snp .snp-btn-primary, .snp a.snp-btn-primary { background: var(--snp-navy); color: #FFFFFF; }
.snp .snp-btn-primary:hover, .snp a.snp-btn-primary:hover { background: var(--snp-blue); border-color: var(--snp-blue); color: #FFFFFF; }
.snp .snp-btn-secondary, .snp a.snp-btn-secondary { background: #FFFFFF; color: var(--snp-navy); }
.snp .snp-btn-secondary:hover, .snp a.snp-btn-secondary:hover { background: var(--snp-wash); color: var(--snp-navy); }
.snp .snp-btn-gold, .snp a.snp-btn-gold { background: var(--snp-gold); border-color: var(--snp-gold); color: var(--snp-navy); }
.snp .snp-btn-gold:hover, .snp a.snp-btn-gold:hover { background: #F2C56E; color: var(--snp-navy); }
.snp .snp-btn[disabled] { opacity: .6; cursor: progress; }
.snp .snp-link { background: none; border: 0; padding: .5rem .25rem; min-height: 44px; font: 600 1rem var(--snp-sans); color: var(--snp-blue); text-decoration: underline; cursor: pointer; }
.snp .snp-row { display: flex; flex-wrap: wrap; gap: .6rem; align-items: center; }

/* Cards */
.snp .snp-card { background: #FFFFFF; border: 1px solid var(--snp-line); border-radius: 16px; padding: 1.4rem 1.5rem; }
.snp .snp-narrow { max-width: 620px; margin: 0 auto; }

/* Hero */
.snp .snp-hero { background: var(--snp-navy); color: #FFFFFF; border-radius: 20px; padding: 1.75rem 2rem; display: flex; flex-wrap: wrap; justify-content: space-between; gap: 1rem 2rem; align-items: flex-start; margin-bottom: 1.25rem; }
.snp .snp-context { color: var(--snp-gold); font-weight: 600; margin: 0; }
.snp .snp-welcome { color: #E4E9F2; margin: .5rem 0 0; max-width: 60ch; }
.snp .snp-hero-links { display: flex; gap: .25rem 1.25rem; flex-wrap: wrap; }
.snp .snp-hero-links a { color: #FFFFFF; font-weight: 600; min-height: 44px; display: inline-flex; align-items: center; }

/* Needs attention */
.snp .snp-attn { background: var(--snp-gold-soft); border: 1px solid #F1D39A; border-radius: 16px; padding: 1rem 1.5rem; margin-bottom: 1.25rem; color: #4A2E03; }
.snp .snp-attn .snp-h3 { color: #4A2E03; }
.snp .snp-attn ul { margin: 0; padding-left: 1.2rem; }
.snp .snp-attn li { margin: .3rem 0; }
.snp .snp-attn a { color: #4A2E03; font-weight: 700; }
.snp .snp-attn-src { font-weight: 700; }
.snp .snp-attn-src::after { content: ":"; }

/* Grid of cards */
.snp .snp-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 340px), 1fr)); gap: 1.25rem; align-items: start; }
.snp .snp-card-h { font: 400 1.45rem/1.2 var(--snp-serif); color: var(--snp-navy); margin: 0 0 .6rem; display: flex; align-items: center; gap: .6rem; }
.snp .snp-card-ico { width: 2.4rem; height: 2.4rem; border-radius: 12px; background: var(--snp-wash); color: var(--snp-blue); display: inline-flex; align-items: center; justify-content: center; flex: none; }
.snp .snp-summary { color: var(--snp-muted); }
.snp .snp-bar { height: 10px; background: var(--snp-wash); border-radius: 999px; overflow: hidden; margin: .25rem 0 1rem; }
.snp .snp-bar span { display: block; height: 100%; background: var(--snp-blue); border-radius: 999px; }
.snp .snp-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(110px, 1fr)); gap: .5rem; margin: 0 0 1rem; }
.snp .snp-stats div { background: var(--snp-wash); border-radius: 12px; padding: .6rem .8rem; }
.snp .snp-stats dt { font-size: .85rem; color: var(--snp-muted); }
.snp .snp-stats dd { margin: 0; font-weight: 700; font-size: 1.15rem; color: var(--snp-navy); }
.snp .snp-items { list-style: none; margin: 0 0 1rem; padding: 0; border-top: 1px solid var(--snp-line); }
.snp .snp-items li { padding: .6rem 0; border-bottom: 1px solid var(--snp-line); display: flex; flex-direction: column; }
.snp .snp-items a, .snp .snp-items span:first-child { font-weight: 600; }
.snp .snp-meta { font-size: .9rem; color: var(--snp-muted); font-weight: 400 !important; }
.snp .snp-actions { margin-top: .25rem; }

/* Forms */
.snp .snp-form { margin: 0; }
.snp .snp-field { margin: 0 0 1rem; }
.snp .snp-field label { display: block; font-weight: 600; margin-bottom: .3rem; }
.snp .snp-field input, .snp .snp-field textarea { width: 100%; font: 400 1rem var(--snp-sans); padding: .7rem .8rem; min-height: 44px; border: 1.5px solid #8A94A8; border-radius: 10px; background: #FFFFFF; color: var(--snp-ink); }
.snp .snp-check { display: flex; gap: .6rem; align-items: flex-start; margin: 0 0 .75rem; }
.snp .snp-check input { width: 1.2rem; height: 1.2rem; margin-top: .2rem; flex: none; }
.snp .snp-grid2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 260px), 1fr)); gap: 0 1.5rem; }
.snp .snp-error { background: var(--snp-red-soft); color: var(--snp-red-ink); border-radius: 10px; padding: .75rem 1rem; margin: 0 0 1rem; }
.snp .snp-ok { background: var(--snp-green-soft); color: var(--snp-green-ink); border-radius: 10px; padding: .75rem 1rem; margin: 0 0 1rem; }

/* Signed out */
.snp .snp-split { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 380px), 1fr)); gap: 1.5rem; align-items: start; }
.snp .snp-join { display: grid; gap: 1rem; }
.snp .snp-join .snp-h2 { margin-bottom: 0; }
.snp .snp-join-card { background: var(--snp-wash); border-color: transparent; }

/* Panels */
.snp .snp-panel { margin-top: 1.25rem; }
.snp .snp-admin { margin-top: 1.25rem; }
.snp .snp-admin summary { cursor: pointer; min-height: 44px; }
.snp .snp-selftest ul { list-style: none; padding: 0; margin: 1rem 0 0; }
.snp .snp-selftest li { padding: .4rem .6rem; border-radius: 8px; margin: .2rem 0; }
.snp .snp-selftest .is-pass { background: var(--snp-green-soft); color: var(--snp-green-ink); }
.snp .snp-selftest .is-fail { background: var(--snp-red-soft); color: var(--snp-red-ink); }
@media (max-width: 600px) {
	.snp .snp-hero { padding: 1.25rem; border-radius: 16px; }
	.snp .snp-card { padding: 1.1rem; }
}
@media (prefers-reduced-motion: reduce) { .snp * { transition: none !important; } }

/* 1.1.0: site owner dashboard. */
.snp .snp-tabs { display: flex; flex-wrap: wrap; gap: .25rem; border-bottom: 2px solid var(--snp-line); margin: 0 0 1.25rem; }
.snp .snp-tab { background: transparent; border: 0; border-bottom: 3px solid transparent; margin-bottom: -2px; padding: .65rem 1rem; min-height: 44px; font: 600 1rem var(--snp-sans); color: var(--snp-muted); cursor: pointer; }
.snp .snp-tab:hover { color: var(--snp-navy); background: var(--snp-wash); }
.snp .snp-tab[aria-selected="true"] { color: var(--snp-navy); border-bottom-color: var(--snp-gold); }
.snp .snp-panel-tab > .snp-h2 { margin-top: 1.5rem; }
.snp .snp-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 170px), 1fr)); gap: .75rem; margin: 0 0 1.25rem; }
.snp .snp-tile { background: #FFFFFF; border: 1px solid var(--snp-line); border-radius: 14px; padding: .9rem 1rem; }
.snp .snp-tile dt { font-size: .9rem; color: var(--snp-muted); font-weight: 600; }
.snp .snp-tile dd { margin: .15rem 0 0; font: 400 2rem/1.1 var(--snp-serif); color: var(--snp-navy); }
.snp .snp-tile p { margin: .25rem 0 0; font-size: .88rem; color: var(--snp-muted); }
.snp .snp-tile.is-warn { border-color: #F1D39A; background: var(--snp-gold-soft); }
.snp .snp-tile.is-warn dd { color: #5A3704; }
.snp .snp-tile.is-good { border-color: #B7E4C7; background: var(--snp-green-soft); }
.snp .snp-tile.is-good dd { color: var(--snp-green-ink); }
.snp .snp-owner .sca-root { max-width: none; }