/* Gem City Market Pledge — member tracker.
   Fonts are inherited from the site theme so the tracker feels native.
   Adjust the variables below to match brand colors. */
.gcm-pledge {
	--gcm-ink: #1d2b24;
	--gcm-muted: #5b6b62;
	--gcm-line: #d6e0da;
	--gcm-paper: #ffffff;
	--gcm-tint: #eef5f0;
	--gcm-accent: #0e6a4b;
	--gcm-accent-dark: #094a34;
	--gcm-gold: #d99a1e;
	--gcm-error: #a3291c;

	color: var(--gcm-ink);
	max-width: 52rem;
	margin: 0 auto;
	line-height: 1.5;
}
.gcm-pledge *, .gcm-pledge *::before, .gcm-pledge *::after { box-sizing: border-box; }
.gcm-pledge h2, .gcm-pledge h3 { color: var(--gcm-ink); margin: 0 0 .75rem; line-height: 1.2; }
.gcm-pledge h3 { font-size: 1.15rem; }

/* Notices */
.gcm-pledge__notice { padding: .75rem 1rem; border-left: 4px solid var(--gcm-accent); background: var(--gcm-tint); margin: 0 0 1.25rem; }
.gcm-pledge__notice--error { border-color: var(--gcm-error); background: #fbeeec; }

/* Month hero: the memorable element */
.gcm-pledge__hero { background: var(--gcm-accent); color: #fff; padding: 1.5rem 1.5rem 1.75rem; border-radius: 18px; margin-bottom: 1.5rem; }
.gcm-pledge__hero h2 { color: #fff; font-size: 1.1rem; font-weight: 600; margin: 0; text-align: center; }
.gcm-pledge__monthnav { display: grid; grid-template-columns: 2.5rem 1fr 2.5rem; align-items: center; margin-bottom: 1rem; }
.gcm-pledge__monthnav a { color: #fff; text-decoration: none; font-size: 1.75rem; line-height: 1; border-radius: 50%; width: 2.5rem; height: 2.5rem; display: grid; place-items: center; }
.gcm-pledge__monthnav a:hover { background: rgba(255,255,255,.15); }
.gcm-pledge__amounts { margin: 0 0 1rem; display: flex; flex-wrap: wrap; align-items: baseline; gap: .25rem .75rem; }
.gcm-pledge__spent { font-size: clamp(2.5rem, 8vw, 4rem); font-weight: 700; line-height: 1; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.gcm-pledge__of { font-size: 1.1rem; opacity: .9; }
.gcm-pledge__meter { height: 1.25rem; background: rgba(255,255,255,.2); border-radius: 999px; overflow: hidden; }
.gcm-pledge__meter span { display: block; height: 100%; background: #fff; border-radius: 999px; transition: width .6s ease-out; }
.gcm-pledge__hero.is-met .gcm-pledge__meter span { background: var(--gcm-gold); }
.gcm-pledge__status { margin: .75rem 0 0; opacity: .95; }

/* Forms */
.gcm-pledge__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(18rem, 1fr)); gap: 1.25rem; margin-bottom: 2rem; }
.gcm-pledge__panel { background: var(--gcm-paper); border: 1px solid var(--gcm-line); border-radius: 12px; padding: 1.25rem; display: flex; flex-direction: column; }
.gcm-pledge__panel label { font-weight: 600; font-size: .95rem; margin: .5rem 0 .25rem; }
.gcm-pledge__panel input[type="text"],
.gcm-pledge__panel input[type="date"],
.gcm-pledge__panel input[type="number"] { width: 100%; padding: .6rem .75rem; border: 1px solid var(--gcm-line); border-radius: 8px; font: inherit; color: inherit; background: #fff; }
.gcm-pledge__money { position: relative; }
.gcm-pledge__money span { position: absolute; left: .75rem; top: 50%; transform: translateY(-50%); color: var(--gcm-muted); }
.gcm-pledge__panel .gcm-pledge__money input { padding-left: 1.6rem; }
.gcm-pledge__panel input:focus-visible,
.gcm-pledge button:focus-visible,
.gcm-pledge a:focus-visible { outline: 3px solid var(--gcm-gold); outline-offset: 2px; }
.gcm-pledge__intro { color: var(--gcm-muted); margin: 0 0 .75rem; }

.gcm-pledge__btn { display: inline-block; margin-top: 1rem; padding: .7rem 1.25rem; background: var(--gcm-accent); color: #fff; border: 0; border-radius: 8px; font: inherit; font-weight: 600; cursor: pointer; text-decoration: none; text-align: center; }
.gcm-pledge__btn:hover { background: var(--gcm-accent-dark); color: #fff; }
.gcm-pledge__link { background: none; border: 0; padding: 0; color: var(--gcm-accent); text-decoration: underline; font: inherit; cursor: pointer; margin-left: .75rem; }
.gcm-pledge__panel .gcm-pledge__link { margin: .75rem 0 0; align-self: flex-start; color: var(--gcm-muted); }

.gcm-pledge__chips { display: flex; flex-wrap: wrap; gap: .5rem; margin-bottom: .25rem; }
.gcm-pledge__chip { padding: .4rem .9rem; border: 1px solid var(--gcm-accent); background: #fff; color: var(--gcm-accent); border-radius: 999px; font: inherit; font-weight: 600; cursor: pointer; }
.gcm-pledge__chip:hover, .gcm-pledge__chip.is-active { background: var(--gcm-accent); color: #fff; }

/* Tables */
.gcm-pledge__section { margin-bottom: 2rem; }
.gcm-pledge__tablewrap { overflow-x: auto; }
.gcm-pledge__table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
.gcm-pledge__table th, .gcm-pledge__table td { padding: .6rem .5rem; border-bottom: 1px solid var(--gcm-line); text-align: left; vertical-align: middle; }
.gcm-pledge__table thead th { font-size: .9rem; color: var(--gcm-muted); font-weight: 600; }
.gcm-pledge__table tbody th { font-weight: 500; }
.gcm-pledge__table .num { text-align: right; white-space: nowrap; }
.gcm-pledge__table .act { text-align: right; }
.gcm-pledge__table .act form { margin: 0; }
.gcm-pledge__table a { color: var(--gcm-accent); }
.gcm-pledge__empty { color: var(--gcm-muted); padding: 1rem; background: var(--gcm-tint); border-radius: 8px; }

.gcm-pledge__mini { display: inline-block; vertical-align: middle; width: 6rem; height: .5rem; background: var(--gcm-tint); border-radius: 999px; overflow: hidden; margin-right: .5rem; }
.gcm-pledge__mini span { display: block; height: 100%; background: var(--gcm-accent); }
.gcm-pledge__mini.is-met span { background: var(--gcm-gold); }
.gcm-pledge__pct { font-size: .9rem; color: var(--gcm-muted); }

.gcm-pledge .screen-reader-text { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

@media (max-width: 480px) {
	.gcm-pledge__hero { padding: 1.25rem 1rem 1.5rem; border-radius: 14px; }
	.gcm-pledge__mini { width: 3.5rem; }
}
@media (prefers-reduced-motion: reduce) {
	.gcm-pledge__meter span { transition: none; }
}

/* Check your spending anytime */
.gcm-pledge__anytime { background: var(--gcm-tint); border-radius: 12px; padding: 1.25rem; }
.gcm-pledge__anytime-grid { display: grid; grid-template-columns: 9.5rem 1fr; gap: 1.25rem; align-items: start; }
.gcm-pledge__anytime p { margin: 0 0 .75rem; }
.gcm-pledge__qr { background: #fff; padding: .25rem; border-radius: 8px; }
.gcm-pledge__qr svg { display: block; width: 100%; height: auto; }
.gcm-pledge__linkrow { display: flex; gap: .5rem; margin-bottom: .75rem; }
.gcm-pledge__linkrow input { flex: 1; min-width: 0; padding: .5rem .6rem; border: 1px solid var(--gcm-line); border-radius: 8px; font: inherit; font-size: .9rem; background: #fff; color: var(--gcm-muted); }
.gcm-pledge__btn--small { margin-top: 0; padding: .5rem .9rem; white-space: nowrap; }
.gcm-pledge__btn--ghost { margin-top: 0; background: #fff; color: var(--gcm-accent); border: 1px solid var(--gcm-accent); }
.gcm-pledge__btn--ghost:hover { background: var(--gcm-accent); color: #fff; }
.gcm-pledge__inline { margin: 0 0 .75rem; }
.gcm-pledge__pref { display: flex; flex-wrap: wrap; align-items: center; gap: .25rem .75rem; }
.gcm-pledge__pref .gcm-pledge__link { margin-left: 0; }
.gcm-pledge__muted { color: var(--gcm-muted) !important; margin-left: 0 !important; font-size: .9rem; }
@media (max-width: 560px) {
	.gcm-pledge__anytime-grid { grid-template-columns: 1fr; }
	.gcm-pledge__qr { max-width: 12rem; }
}

/* Pledge sign-up, confirmation, password */
.gcm-pledge__signup { max-width: 34rem; margin: 0 auto 1rem; }
.gcm-pledge__signup .gcm-pledge__title { font-size: 1.6rem; }
.gcm-pledge__row { display: grid; grid-template-columns: 1fr 1fr; gap: .75rem; }
.gcm-pledge__row > div { display: flex; flex-direction: column; }
.gcm-pledge__panel input[type="email"],
.gcm-pledge__panel input[type="tel"],
.gcm-pledge__panel input[type="password"] { width: 100%; padding: .6rem .75rem; border: 1px solid var(--gcm-line); border-radius: 8px; font: inherit; color: inherit; background: #fff; }
.gcm-pledge__panel label.gcm-pledge__check { font-weight: 400; margin-top: .9rem; display: flex; gap: .5rem; align-items: flex-start; }
.gcm-pledge__check input { margin-top: .3rem; }
.gcm-pledge__fine { font-size: .9rem; color: var(--gcm-muted); margin: .6rem 0 0; }
.gcm-pledge__already { text-align: center; }
.gcm-pledge__already a { color: var(--gcm-accent); }
.gcm-pledge__hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.gcm-pledge__confirm { max-width: 34rem; margin: 0 auto 1.5rem; text-align: center; align-items: center; }
.gcm-pledge__confirm-amount { font-size: clamp(2.25rem, 7vw, 3.25rem); font-weight: 700; color: var(--gcm-accent); line-height: 1.1; margin: .25rem 0 .75rem; font-variant-numeric: tabular-nums; }
.gcm-pledge__confirm-amount span { font-size: 1rem; font-weight: 400; color: var(--gcm-muted); }
.gcm-pledge__setpw { border: 2px solid var(--gcm-accent); margin-bottom: 1.5rem; }
.gcm-pledge__setpw .gcm-pledge__link { align-self: flex-start; margin: .75rem 0 0; color: var(--gcm-muted); }
@media (max-width: 480px) { .gcm-pledge__row { grid-template-columns: 1fr; } }