/* ===========================================================================
   Zypento Directory — members area (/dashboard)
   Standalone template styles. Fresh teal + amber palette (matches the site).
   =========================================================================== */

:root {
	--zd-ink: #16232e;
	--zd-ink-soft: #55636e;
	--zd-ink-faint: #8492a0;
	--zd-brand: #0e7c86;
	--zd-brand-dark: #0a5c64;
	--zd-brand-050: #e8f4f5;
	--zd-brand-100: #cfe9ec;
	--zd-accent: #f4a72c;
	--zd-success: #1f9d55;
	--zd-danger: #c0392b;
	--zd-warn-bg: #fdf1dc;
	--zd-warn-ink: #8a5a10;
	--zd-bg: #f4f8fa;
	--zd-surface: #ffffff;
	--zd-line: #e2eaef;
	--zd-radius: 14px;
	--zd-radius-sm: 9px;
	--zd-shadow: 0 6px 18px rgba(16,35,46,.08);
	--zd-shadow-lg: 0 16px 40px rgba(16,35,46,.14);
	--zd-sidebar-w: 264px;
	--zd-font: "Inter", "Segoe UI", system-ui, -apple-system, sans-serif;
}

* , *::before, *::after { box-sizing: border-box; }
body.zyp-dash { margin: 0; font-family: var(--zd-font); color: var(--zd-ink); background: var(--zd-bg); line-height: 1.55; -webkit-font-smoothing: antialiased; }
body.zyp-dash a { color: var(--zd-brand-dark); text-decoration: none; }
body.zyp-dash a:hover { color: var(--zd-brand); }

.zyp-ico { width: 1.15em; height: 1.15em; flex: none; fill: none; stroke: currentColor; stroke-width: 1.85; stroke-linecap: round; stroke-linejoin: round; vertical-align: -.15em; }

/* Brand lockup (shared) */
.zyp-brand-mark { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: linear-gradient(135deg, var(--zd-brand), var(--zd-brand-dark)); color: #fff; font-weight: 800; font-size: .85rem; flex: none; }
.zyp-brand-text { font-weight: 800; font-size: 1.02rem; }

/* Buttons */
.zyp-btn { display: inline-flex; align-items: center; justify-content: center; gap: .5rem; font-family: var(--zd-font); font-weight: 600; font-size: .96rem; padding: .72rem 1.2rem; border-radius: 999px; border: 1px solid transparent; cursor: pointer; transition: background .18s, box-shadow .18s, opacity .18s; }
.zyp-btn--primary { background: var(--zd-brand); color: #fff; }
.zyp-btn--primary:hover { background: var(--zd-brand-dark); color: #fff; }
/* Buttons rendered as <a> must keep button colors (beats the base anchor rule). */
body.zyp-dash a.zyp-btn--primary, body.zyp-dash a.zyp-btn--primary:hover { color: #fff; }
.zyp-btn[hidden] { display: none; }
.zyp-btn--ghost { background: transparent; color: var(--zd-brand-dark); border-color: var(--zd-brand-100); }
.zyp-btn--ghost:hover { background: var(--zd-brand-050); }
.zyp-btn[disabled] { opacity: .5; cursor: not-allowed; }
.zyp-btn.is-loading { opacity: .7; pointer-events: none; }

.zyp-link { background: none; border: 0; padding: 0; cursor: pointer; color: var(--zd-brand-dark); font: inherit; font-weight: 600; }
.zyp-link:hover { color: var(--zd-brand); text-decoration: underline; }
.zyp-link--center { display: block; margin: .4rem auto 0; }

/* Alerts */
.zyp-alert { display: flex; align-items: center; gap: .6rem; padding: .8rem 1rem; border-radius: var(--zd-radius-sm); font-size: .95rem; margin-bottom: 1rem; }
.zyp-alert .zyp-ico { width: 1.15rem; height: 1.15rem; }
.zyp-alert--success { background: #e7f7ee; color: var(--zd-success); }
.zyp-alert--error { background: #fdecea; color: var(--zd-danger); }
.zyp-alert--warn { background: var(--zd-warn-bg); color: var(--zd-warn-ink); }
.zyp-alert--warn .zyp-link { color: var(--zd-warn-ink); text-decoration: underline; margin-left: auto; }

/* =========================== ACCESS AREA =========================== */
.zyp-access { min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 2rem 1.25rem; gap: 1rem;
	background:
		radial-gradient(55% 60% at 85% 0%, var(--zd-brand-050) 0%, transparent 60%),
		radial-gradient(50% 55% at 5% 5%, #fdf3e2 0%, transparent 55%),
		var(--zd-bg);
}
.zyp-access__card { width: 100%; max-width: 430px; background: var(--zd-surface); border: 1px solid var(--zd-line); border-radius: var(--zd-radius); box-shadow: var(--zd-shadow-lg); padding: 1.9rem; }
.zyp-access__brand { display: flex; align-items: center; gap: .6rem; justify-content: center; margin-bottom: 1.4rem; }
.zyp-access__foot { font-size: .9rem; }
.zyp-access__foot a { color: var(--zd-ink-soft); }

.zyp-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: .3rem; background: var(--zd-bg); padding: .3rem; border-radius: 999px; margin-bottom: 1.4rem; }
.zyp-tab { border: 0; background: none; padding: .55rem; border-radius: 999px; font-family: var(--zd-font); font-weight: 600; font-size: .92rem; color: var(--zd-ink-soft); cursor: pointer; transition: background .15s, color .15s; }
.zyp-tab.is-active { background: var(--zd-surface); color: var(--zd-brand-dark); box-shadow: var(--zd-shadow); }

.zyp-form__title { font-size: 1.4rem; font-weight: 800; margin: 0 0 .25rem; }
.zyp-form__sub { color: var(--zd-ink-soft); font-size: .95rem; margin: 0 0 1.2rem; }
.zyp-form__fine { color: var(--zd-ink-faint); font-size: .8rem; margin: .9rem 0 0; text-align: center; }
.zyp-form__row { display: flex; align-items: center; justify-content: space-between; margin: .2rem 0 1.1rem; font-size: .9rem; }

.zyp-field { display: block; margin-bottom: 1rem; }
.zyp-field[hidden] { display: none; }
.zyp-field > span { display: block; font-size: .86rem; font-weight: 600; color: var(--zd-ink-soft); margin-bottom: .35rem; }
.zyp-field input[type=text], .zyp-field input[type=email], .zyp-field input[type=password],
.zyp-field input[type=url], .zyp-field input[type=tel], .zyp-field select, .zyp-field textarea {
	width: 100%; padding: .72rem .85rem; border: 1px solid var(--zd-line); border-radius: var(--zd-radius-sm);
	font: inherit; color: var(--zd-ink); background: #fff; transition: border-color .15s, box-shadow .15s;
}
.zyp-field textarea { resize: vertical; min-height: 92px; }
.zyp-field input:focus, .zyp-field select:focus, .zyp-field textarea:focus { outline: 0; border-color: var(--zd-brand-100); box-shadow: 0 0 0 3px var(--zd-brand-050); }
.zyp-field.has-error input { border-color: var(--zd-danger); }
.zyp-field__err { display: none; color: var(--zd-danger); font-size: .82rem; font-style: normal; margin-top: .3rem; }
.zyp-field.has-error .zyp-field__err { display: block; }

.zyp-check { display: inline-flex; align-items: center; gap: .4rem; color: var(--zd-ink-soft); cursor: pointer; }
.zyp-form .zyp-btn--primary { width: 100%; }
.zyp-formmsg { padding: .7rem .9rem; border-radius: var(--zd-radius-sm); font-size: .9rem; margin-bottom: 1rem; }
.zyp-formmsg.is-error { background: #fdecea; color: var(--zd-danger); }
.zyp-formmsg.is-success { background: #e7f7ee; color: var(--zd-success); }
.zyp-formmsg.is-wait { background: var(--zd-brand-050); color: var(--zd-brand-dark); }

.cf-turnstile { margin-bottom: 1rem; }
.zyp-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* =========================== APP SHELL =========================== */
.zyp-shell { display: flex; min-height: 100vh; min-height: 100dvh; }
.zyp-scrim { display: none; }

.zyp-sidebar { width: var(--zd-sidebar-w); flex: none; background: var(--zd-surface); border-right: 1px solid var(--zd-line); display: flex; flex-direction: column; }
.zyp-sidebar__brand { display: flex; align-items: center; gap: .6rem; padding: 1.15rem 1.25rem; border-bottom: 1px solid var(--zd-line); }
.zyp-sidebar__close { display: none; margin-left: auto; background: none; border: 0; cursor: pointer; color: var(--zd-ink-soft); padding: .3rem; }

.zyp-nav { padding: .9rem .7rem; display: flex; flex-direction: column; gap: .15rem; flex: 1; }
.zyp-nav__item { display: flex; align-items: center; gap: .7rem; padding: .65rem .8rem; border-radius: var(--zd-radius-sm); color: var(--zd-ink-soft); font-weight: 600; font-size: .95rem; transition: background .15s, color .15s; }
.zyp-nav__item .zyp-ico { width: 1.2rem; height: 1.2rem; }
.zyp-nav__item:hover { background: var(--zd-bg); color: var(--zd-brand-dark); }
.zyp-nav__item.is-active { background: var(--zd-brand-050); color: var(--zd-brand-dark); }
.zyp-nav__item--muted { color: var(--zd-ink-faint); }

.zyp-sidebar__foot { border-top: 1px solid var(--zd-line); padding: .8rem .7rem; }
.zyp-usercard { display: flex; align-items: center; gap: .6rem; padding: .4rem .8rem .7rem; }
.zyp-avatar { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 50%; background: var(--zd-brand-050); color: var(--zd-brand-dark); font-weight: 800; flex: none; }
.zyp-usercard__meta { display: flex; flex-direction: column; min-width: 0; }
.zyp-usercard__meta strong { font-size: .9rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.zyp-usercard__meta em { font-style: normal; font-size: .78rem; color: var(--zd-ink-faint); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

.zyp-main { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.zyp-topbar { display: flex; align-items: center; gap: .8rem; padding: .9rem 1.25rem; background: var(--zd-surface); border-bottom: 1px solid var(--zd-line); position: sticky; top: 0; z-index: 5; }
.zyp-topbar__menu { display: none; background: none; border: 0; cursor: pointer; color: var(--zd-ink); padding: .3rem; }
.zyp-topbar__title { font-size: 1.02rem; }

.zyp-content { padding: clamp(1.25rem, 3vw, 2.2rem); max-width: 960px; width: 100%; }
.zyp-h1 { font-size: 1.6rem; font-weight: 800; margin: 0 0 .3rem; }
.zyp-lead { color: var(--zd-ink-soft); margin: 0 0 1.6rem; }
.zyp-muted { color: var(--zd-ink-faint); font-size: .9rem; }
.zyp-ok { color: var(--zd-success); }

.zyp-cards { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); margin-bottom: 1.6rem; }
.zyp-card { background: var(--zd-surface); border: 1px solid var(--zd-line); border-radius: var(--zd-radius); padding: 1.2rem; }
.zyp-card__label { display: block; color: var(--zd-ink-faint); font-size: .85rem; margin-bottom: .35rem; }
.zyp-card__value { font-size: 1.7rem; font-weight: 800; color: var(--zd-ink); }
.zyp-card__sub { display: block; color: var(--zd-warn-ink); font-size: .8rem; margin-top: .2rem; }

.zyp-panel { background: var(--zd-surface); border: 1px solid var(--zd-line); border-radius: var(--zd-radius); padding: 1.5rem; margin-bottom: 1.2rem; }
.zyp-panel--cta { display: flex; align-items: center; justify-content: space-between; gap: 1.2rem; }
.zyp-panel--cta h2 { margin: 0 0 .3rem; font-size: 1.2rem; }
.zyp-panel--cta p { margin: 0; color: var(--zd-ink-soft); }
.zyp-balance { font-size: 2.2rem; font-weight: 800; margin: .3rem 0 1rem; }

/* Wallet top-up */
.zyp-topup__presets { display: flex; gap: .6rem; margin-bottom: 1rem; flex-wrap: wrap; }
.zyp-topup__row { display: flex; align-items: flex-end; gap: .8rem; flex-wrap: wrap; margin-bottom: .8rem; }
.zyp-topup__amount { margin-bottom: 0; flex: 0 1 220px; }
.zyp-topup__amount input[type=number] { width: 100%; padding: .72rem .85rem; border: 1px solid var(--zd-line); border-radius: var(--zd-radius-sm); font: inherit; color: var(--zd-ink); }
.zyp-topup__amount input[type=number]:focus { outline: 0; border-color: var(--zd-brand-100); box-shadow: 0 0 0 3px var(--zd-brand-050); }

/* Bank transfer (Wise) details */
.zyp-wisebox { margin-top: 1.2rem; padding: 1.1rem 1.2rem; background: var(--zd-bg); border: 1px dashed var(--zd-brand-100); border-radius: var(--zd-radius-sm); }
.zyp-wisebox__details { margin: .6rem 0; padding: .8rem 1rem; background: #fff; border: 1px solid var(--zd-line); border-radius: var(--zd-radius-sm); font-family: var(--zd-font); font-size: .92rem; white-space: pre-wrap; word-break: break-word; }
.zyp-wisebox__ref { margin: .4rem 0 0; font-size: .92rem; }
.zyp-wisebox__ref strong { color: var(--zd-brand-dark); font-family: var(--zd-font); }
.zyp-wisebox__ref .zyp-muted { display: block; font-size: .8rem; }

/* Wallet ledger */
.zyp-txnfilters { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; margin-bottom: 1rem; }
.zyp-txnfilters input[type=search], .zyp-txnfilters input[type=date] {
	padding: .55rem .8rem; border: 1px solid var(--zd-line); border-radius: var(--zd-radius-sm);
	font: inherit; font-size: .9rem; color: var(--zd-ink); background: #fff;
	transition: border-color .15s, box-shadow .15s;
}
.zyp-txnfilters input[type=search] { flex: 1 1 180px; min-width: 150px; }
.zyp-txnfilters input:focus { outline: 0; border-color: var(--zd-brand-100); box-shadow: 0 0 0 3px var(--zd-brand-050); }
.zyp-txnfilters__sep { color: var(--zd-ink-faint); }
.zyp-txn__sub { display: block; color: var(--zd-ink-faint); font-size: .8rem; margin-top: .15rem; font-weight: 400; }
.zyp-txnpager { display: flex; align-items: center; justify-content: center; gap: 1rem; margin-top: 1rem; }
.zyp-txnpager__info { color: var(--zd-ink-faint); font-size: .9rem; }
[data-txn-list] { transition: opacity .15s ease; }
[data-txn-list].is-refreshing { opacity: .5; pointer-events: none; }

.zyp-txns { display: flex; flex-direction: column; }
.zyp-txn { display: grid; grid-template-columns: 110px 1fr auto auto; gap: 1rem; align-items: center; padding: .65rem 0; border-bottom: 1px solid var(--zd-line); font-size: .93rem; }
.zyp-txn:last-child { border-bottom: 0; }
.zyp-txn__date { color: var(--zd-ink-faint); }
.zyp-txn__amount { font-weight: 700; text-align: right; }
.zyp-txn__amount.is-credit { color: var(--zd-success); }
.zyp-txn__amount.is-debit { color: var(--zd-ink); }
.zyp-txn__balance { color: var(--zd-ink-faint); text-align: right; min-width: 70px; }
@media (max-width: 560px) {
	.zyp-txn { grid-template-columns: 1fr auto; }
	.zyp-txn__date, .zyp-txn__balance { display: none; }
}
.zyp-kv { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: .7rem 0; border-bottom: 1px solid var(--zd-line); }
.zyp-kv:last-child { border-bottom: 0; }
.zyp-kv > span { color: var(--zd-ink-soft); }

.zyp-empty { text-align: center; background: var(--zd-surface); border: 1px dashed var(--zd-line); border-radius: var(--zd-radius); padding: 3rem 1.5rem; }
.zyp-empty__ico { width: 2.4rem; height: 2.4rem; color: var(--zd-brand); margin-bottom: .6rem; }
.zyp-empty h2 { margin: 0 0 .4rem; font-size: 1.2rem; }
.zyp-empty p { color: var(--zd-ink-soft); max-width: 42ch; margin: 0 auto 1.2rem; }

/* =========================== RESPONSIVE =========================== */
@media (max-width: 860px) {
	.zyp-topbar__menu { display: inline-flex; }
	.zyp-sidebar__close { display: inline-flex; }
	.zyp-sidebar {
		position: fixed; top: 0; left: 0; bottom: 0; z-index: 50;
		transform: translateX(-100%); transition: transform .25s ease; box-shadow: var(--zd-shadow-lg);
	}
	.zyp-shell.is-sidebar-open .zyp-sidebar { transform: translateX(0); }
	.zyp-shell.is-sidebar-open .zyp-scrim { display: block; position: fixed; inset: 0; background: rgba(16,35,46,.45); z-index: 40; }
	.zyp-panel--cta { flex-direction: column; align-items: flex-start; }
}

/* =========================== SPA sections + account forms =========================== */
.zyp-section[hidden] { display: none; }
.zyp-panel__title { font-size: 1.12rem; font-weight: 700; margin: 0 0 1rem; }
.zyp-accountform { max-width: 520px; }
.zyp-accountform .zyp-btn { width: auto; }
.zyp-field__hint { font-weight: 400; font-style: normal; font-size: .78rem; color: var(--zd-ink-faint); }
.zyp-field-inline { display: flex; align-items: center; gap: .4rem; margin: 0 0 1.1rem; font-size: .9rem; }
.zyp-field-inline .zyp-ico { width: 1rem; height: 1rem; }

/* Wider access card (submission form) */
.zyp-access__card--wide { max-width: 560px; }
.zyp-submitform .zyp-field:last-of-type { margin-bottom: 1rem; }
.zyp-formdivider { border: 0; border-top: 1px solid var(--zd-line); margin: 1.4rem 0 1.2rem; }
.zyp-check--block { display: flex; align-items: flex-start; gap: .5rem; margin: 0 0 1rem; color: var(--zd-ink-soft); cursor: pointer; }
.zyp-check--block input { margin-top: .2rem; }
.zyp-field__err--loose { display: none; color: var(--zd-danger); font-size: .82rem; font-style: normal; margin: -.6rem 0 .8rem; }

/* Two-card submission wizard */
.zyp-steps { display: flex; gap: .5rem; justify-content: center; margin-bottom: 1.4rem; }
.zyp-step { width: 34px; height: 5px; border-radius: 999px; background: var(--zd-line); transition: background .2s ease; }
.zyp-step.is-active { background: var(--zd-brand); }
.zyp-slider { overflow: hidden; transition: height .3s ease; }
.zyp-slider__track { display: flex; transition: transform .3s ease; }
.zyp-slide { flex: 0 0 100%; min-width: 100%; align-self: flex-start; padding: 0 2px; }
.zyp-slide__title { font-family: var(--zd-font); font-size: 1.05rem; font-weight: 700; margin: 0 0 1rem; }
.zyp-wizard__actions { display: flex; gap: .8rem; }
.zyp-wizard__actions .zyp-btn { flex: 1; }

/* Plan / listing-type selector */
.zyp-plans { display: flex; flex-direction: column; gap: .7rem; margin-bottom: 1rem; }
.zyp-plan { position: relative; display: block; cursor: pointer; }
.zyp-plan input { position: absolute; opacity: 0; width: 0; height: 0; pointer-events: none; }
.zyp-plan__card { display: flex; flex-wrap: wrap; align-items: center; gap: .5rem; border: 1.5px solid var(--zd-line); border-radius: var(--zd-radius); padding: 1rem 1.1rem; transition: border-color .15s, background .15s, box-shadow .15s; }
.zyp-plan:hover .zyp-plan__card { border-color: var(--zd-brand-100); }
.zyp-plan input:focus-visible + .zyp-plan__card { box-shadow: 0 0 0 3px var(--zd-brand-050); }
.zyp-plan input:checked + .zyp-plan__card { border-color: var(--zd-brand); background: var(--zd-brand-050); }
.zyp-plan__badge { font-family: var(--zd-font); font-weight: 700; font-size: .66rem; text-transform: uppercase; letter-spacing: .05em; color: var(--zd-warn-ink); background: var(--zd-warn-bg); padding: .18rem .5rem; border-radius: 999px; }
.zyp-plan__name { font-family: var(--zd-font); font-weight: 700; font-size: 1.02rem; }
.zyp-plan__price { margin-left: auto; font-family: var(--zd-font); font-weight: 800; font-size: 1.05rem; color: var(--zd-ink); }
.zyp-plan__price span { margin-left: .25rem; font-weight: 500; font-size: .78rem; color: var(--zd-ink-faint); }
.zyp-plan__desc { flex: 1 1 100%; color: var(--zd-ink-soft); font-size: .87rem; }

/* Google Map location picker */
.zyp-map { width: 100%; height: 240px; border: 1px solid var(--zd-line); border-radius: var(--zd-radius-sm); background: #eef3f6; margin-bottom: .4rem; }
.zyp-field .zyp-field__hint { display: block; margin-top: .35rem; }
/* Places Autocomplete dropdown sits above the card / dashboard chrome. */
.pac-container { z-index: 100001; }

/* Map search row (plain input / legacy widget / Places-New web component) */
.zyp-mapsearch { display: flex; gap: .5rem; margin-bottom: .55rem; }
.zyp-mapsearch input[type=text] {
	flex: 1; min-width: 0; padding: .6rem .85rem; border: 1px solid var(--zd-line); border-radius: var(--zd-radius-sm);
	font: inherit; color: var(--zd-ink); background: #fff; transition: border-color .15s, box-shadow .15s;
}
.zyp-mapsearch input[type=text]:focus { outline: 0; border-color: var(--zd-brand-100); box-shadow: 0 0 0 3px var(--zd-brand-050); }
.zyp-mapsearch .zyp-btn { padding: .55rem 1.1rem; border-radius: var(--zd-radius-sm); }
.zyp-mapsearch gmp-place-autocomplete { flex: 1; min-width: 0; border-radius: var(--zd-radius-sm); }

/* My Listings */
.zyp-section-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.4rem; flex-wrap: wrap; }
.zyp-section-head .zyp-h1 { margin: 0; }
.zyp-listinglist { display: flex; flex-direction: column; gap: .6rem; margin-bottom: 1.4rem; }
.zyp-listinglist[hidden] { display: none; }
.zyp-listingform__head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
.zyp-listingform__head .zyp-panel__title { margin: 0; }
.zyp-listingrow { display: flex; align-items: center; justify-content: space-between; gap: 1rem; flex-wrap: wrap; background: var(--zd-surface); border: 1px solid var(--zd-line); border-radius: var(--zd-radius-sm); padding: .9rem 1.1rem; }
.zyp-listingrow__title { font-weight: 600; }
.zyp-listingrow__main { display: flex; align-items: center; gap: .6rem; flex-wrap: wrap; min-width: 0; }
.zyp-listingrow__actions { display: flex; align-items: center; gap: .5rem; margin-left: auto; }
.zyp-btn--sm { padding: .45rem .9rem; font-size: .85rem; }
.zyp-badge { font-family: var(--zd-font); font-weight: 700; font-size: .72rem; padding: .25rem .6rem; border-radius: 999px; white-space: nowrap; }
.zyp-badge--live { background: #e7f7ee; color: var(--zd-success); }
.zyp-badge--pending { background: var(--zd-warn-bg); color: var(--zd-warn-ink); }
.zyp-badge--draft { background: #eef3f6; color: var(--zd-ink-faint); }

/* Lead marketplace */
.zyp-walletbar {
	display: flex; align-items: center; gap: 1rem;
	background: linear-gradient(120deg, var(--zd-brand-dark), var(--zd-brand)); color: #fff;
	border-radius: var(--zd-radius); padding: 1rem 1.3rem; margin-bottom: 1.4rem;
	box-shadow: var(--zd-shadow);
}
.zyp-walletbar__icon { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; background: rgba(255,255,255,.16); flex: none; }
.zyp-walletbar__icon .zyp-ico { width: 1.4rem; height: 1.4rem; }
.zyp-walletbar__meta { display: flex; flex-direction: column; min-width: 0; }
.zyp-walletbar__label { font-size: .8rem; opacity: .85; }
.zyp-walletbar__value { font-family: var(--zd-font); font-size: 1.5rem; font-weight: 800; line-height: 1.15; }
.zyp-walletbar__btn { margin-left: auto; background: #fff; color: var(--zd-brand-dark); border-color: transparent; }
.zyp-walletbar__btn:hover { background: var(--zd-brand-050); color: var(--zd-brand-dark); }

.zyp-leadtabs { display: inline-flex; gap: .3rem; background: var(--zd-line); padding: .3rem; border-radius: 999px; margin-bottom: 1.2rem; }
.zyp-leadtab {
	display: inline-flex; align-items: center; gap: .45rem;
	border: 0; background: none; padding: .55rem 1.1rem; border-radius: 999px;
	font-family: var(--zd-font); font-weight: 600; font-size: .92rem; color: var(--zd-ink-soft);
	cursor: pointer; transition: background .15s, color .15s;
}
.zyp-leadtab.is-active { background: var(--zd-surface); color: var(--zd-brand-dark); box-shadow: var(--zd-shadow); }
.zyp-leadtab__count {
	display: inline-grid; place-items: center; min-width: 1.5rem; height: 1.5rem; padding: 0 .4rem;
	border-radius: 999px; background: var(--zd-brand-050); color: var(--zd-brand-dark);
	font-size: .75rem; font-weight: 700;
}
.zyp-leadtab.is-active .zyp-leadtab__count { background: var(--zd-brand); color: #fff; }
[data-leads-panel][hidden] { display: none; }
[data-leads-panel] { transition: opacity .15s ease; }
[data-leads-panel].is-refreshing { opacity: .5; pointer-events: none; }

.zyp-leadlist { display: flex; flex-direction: column; gap: .8rem; }
.zyp-leadcard { margin-bottom: 0; }
.zyp-leadcard__head { display: flex; align-items: center; justify-content: space-between; gap: .8rem; margin-bottom: .35rem; }
.zyp-leadcard__head strong { font-family: var(--zd-font); font-size: 1.05rem; }
.zyp-leadcard__meta { color: var(--zd-ink-soft); font-size: .9rem; margin: 0 0 .5rem; }
.zyp-leadcard__excerpt { color: var(--zd-ink); font-size: .95rem; margin: 0 0 .9rem; white-space: pre-wrap; font-style: italic; border-left: 3px solid var(--zd-brand-100); padding-left: .75rem; }
.zyp-leadcard__actions { display: flex; gap: .6rem; flex-wrap: wrap; }
.zyp-leadcard .zyp-formmsg { margin-bottom: .8rem; }

/* Lead refund request */
.zyp-refund { margin-top: .4rem; }
.zyp-refundform { margin-top: .8rem; padding: 1rem; background: var(--zd-bg); border: 1px solid var(--zd-line); border-radius: var(--zd-radius-sm); }
.zyp-refundform .zyp-field { margin-bottom: .8rem; }
.zyp-refundform .zyp-field select, .zyp-refundform .zyp-field input[type=text] {
	width: 100%; padding: .6rem .8rem; border: 1px solid var(--zd-line); border-radius: var(--zd-radius-sm);
	font: inherit; font-size: .92rem; color: var(--zd-ink); background: #fff;
}
.zyp-refundform .zyp-muted { margin: .7rem 0 0; font-size: .82rem; }

/* Email-confirmation gate */
.zyp-confirm { text-align: center; }
.zyp-confirm__icon { display: inline-grid; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: var(--zd-warn-bg); color: var(--zd-warn-ink); margin: .3rem 0 1rem; }
.zyp-confirm__icon .zyp-ico { width: 1.6rem; height: 1.6rem; }
.zyp-confirm__resend { width: 100%; }
.zyp-confirm__hint { margin: 1rem 0 0; font-size: .9rem; color: var(--zd-ink-soft); }

@media (prefers-reduced-motion: reduce) {
	.zyp-sidebar { transition: none; }
}