/* Zinn Showcase — cream admin/seller + public profile styling. Versioned (§16). */
.zsc-seller, .zsc-admin, .zsc-prefs { --cream-card:#fff; --cream-border:#ecd9a0; --cream-soft:#fef9e6; --gold-deep:#8a6410; --gold-mid:#B8860B; --ink:#2a2118; --ink-soft:#5a4408; color:var(--ink); }

/* Buyer showcase prefs (inside Account & Security) */
.zsc-prefs { max-width:560px; margin-top:6px; }
.zds-card .zsc-prefs p { margin:0 0 16px; }
.zds-card .zsc-prefs label { display:flex; align-items:center; justify-content:space-between; gap:18px; font-size:14.5px; color:var(--ink); font-weight:600; }
.zds-card .zsc-prefs select { padding:10px 14px; border:1px solid var(--cream-border); border-radius:9px; font-size:14px; background:#fffdf7; color:var(--ink); min-width:185px; cursor:pointer; }
.zds-card .zsc-prefs .zinc-muted { display:block; margin:6px 0 0; font-size:12.5px; color:#8a7a5f; line-height:1.6; }
.zsc-pref-status { color:#2d6a2d; font-weight:700; }

/* Seller / admin card editors */
.zsc-card, .zsc-review { background:#fff; border:1px solid var(--cream-border); border-radius:10px; padding:14px 16px; margin:0 0 12px; }
.zsc-card-head { margin:0 0 12px; }
.zsc-card-head strong { font-size:15px; color:var(--ink); }
.zsc-card-status { color:var(--gold-deep); font-weight:600; font-size:13px; margin-left:6px; }
.zsc-card-src { display:inline-block; margin-left:8px; font-size:11.5px; font-weight:700; color:#7a5a00; background:#fef3d4; border:1px solid var(--cream-border); border-radius:999px; padding:2px 9px; }
.zsc-field-label { display:block; font-size:13px; font-weight:700; color:var(--ink-soft); margin:10px 0 2px; }
.zsc-field-hint { font-size:12.5px; color:#8a7a5f; line-height:1.5; margin:0 0 8px; }
.zsc-seller textarea, .zsc-seller input[type=text], .zsc-seller select { font-size:13px; padding:7px 10px; border:1px solid var(--cream-border); border-radius:8px; background:#fff; }
.zsc-card .zsc-final { width:100%; box-sizing:border-box; }
.zsc-sample-row { display:flex; gap:8px; flex-wrap:wrap; align-items:flex-start; margin:0 0 6px; }
.zsc-card .zsc-sample-value { flex:1 1 320px; min-width:200px; }
.zsc-card .zsc-sample-text { flex:1 1 320px; min-width:200px; box-sizing:border-box; resize:vertical; }
.zsc-sample-text-hint { margin-top:0; }
.zsc-submit-hint { margin-top:4px; }
/* Generic action buttons — but NOT the pills (they reuse the shell's pill
   component; excluding them here is what stops the gold-gradient overriding the
   unified pill styling and causing invisible-on-hover text). */
.zsc-seller button:not(.zsc-pill), .zsc-admin button:not(.zsc-pill) {
	cursor:pointer; font-size:12.5px; font-weight:700; padding:7px 14px; border-radius:8px;
	border:1px solid var(--gold-mid); background:linear-gradient(135deg,#B8860B,#DAA520); color:#fff; margin:2px 4px 2px 0;
}
.zsc-seller button:not(.zsc-pill):disabled { opacity:.5; cursor:not-allowed; filter:grayscale(.3); }
.zsc-admin .zsc-admin-act[data-do="reject"], .zsc-dismiss { background:#f3efe6 !important; color:#7a5400 !important; border-color:#e7c462 !important; }
/* Secondary buttons (search / load more) — outline style */
.zsc-seller button.zsc-btn-2 { background:#fff !important; color:var(--gold-deep) !important; }
.zsc-seller button.zsc-btn-2:hover { background:var(--cream-soft) !important; }
.zsc-review details summary { cursor:pointer; color:var(--gold-deep); font-weight:600; margin:6px 0; }

/* Order picker — tools (search), rows, load more */
.zsc-picker-tools { display:flex; gap:8px; flex-wrap:wrap; align-items:center; margin:0 0 12px; }
.zsc-order-search { flex:1 1 240px; min-width:200px; padding:10px 13px; border:1px solid var(--cream-border); border-radius:9px; font-size:14px; background:#fffdf7; color:var(--ink); }
.zsc-order-search:focus { outline:none; border-color:var(--gold-mid); box-shadow:0 0 0 3px rgba(184,134,11,.15); }
.zsc-load-more { margin-top:4px; }
.zsc-pick-empty { color:#8a7a5f; font-size:13px; margin:6px 2px; }
.zsc-picker { display:flex; flex-direction:column; gap:8px; max-height:560px; overflow-y:auto; padding:2px; }
.zsc-pick { display:flex; align-items:center; justify-content:space-between; gap:14px; padding:12px 14px; background:#fffdf7; border:1px solid var(--cream-border); border-radius:10px; }
.zsc-pick:hover { background:#fff8e8; }
.zsc-pick-main { display:flex; flex-direction:column; gap:4px; min-width:0; }
.zsc-pick-type { align-self:flex-start; font-size:11px; font-weight:700; color:#7a5a00; background:#fef3d4; border:1px solid var(--cream-border); border-radius:999px; padding:2px 10px; }
.zsc-pick-item { font-size:14.5px; font-weight:700; color:var(--ink); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.zsc-pick-meta { font-size:12.5px; color:#8a7a5f; }
.zsc-pick .zsc-create { flex:0 0 auto; margin:0; }
.zsc-create-status { display:block; margin:10px 2px 0; font-size:12.5px; color:#2d6a2d; }
@media(max-width:560px){
	.zsc-pick { flex-direction:column; align-items:stretch; }
	.zsc-pick .zsc-create { width:100%; }
	.zsc-pick-item { white-space:normal; }
}

/* Working overlay (mounts on <body>, so styles are global) */
#zsc-overlay { display:none; position:fixed; inset:0; z-index:99999; align-items:center; justify-content:center; background:rgba(42,33,24,.45); }
#zsc-overlay .zsc-ov-box { background:#fffdf7; border:1px solid #ecd9a0; border-radius:14px; padding:26px 30px; text-align:center; box-shadow:0 8px 30px rgba(0,0,0,.2); max-width:300px; }
#zsc-overlay .zsc-ov-spin { width:34px; height:34px; margin:0 auto 14px; border:3px solid #f0e2b8; border-top-color:#B8860B; border-radius:50%; animation:zsc-spin .8s linear infinite; }
#zsc-overlay .zsc-ov-msg { margin:0; font-size:14.5px; font-weight:700; color:#7a5a00; }
@keyframes zsc-spin { to { transform:rotate(360deg); } }

/* Verify-to-unlock gate (unverified Zinners) — matches the platform gate style */
.zsc-gate { background:#fff8e1; border:1px solid #e7c200; border-left:4px solid #c79412; border-radius:10px; padding:16px 18px; }
.zsc-gate-lead { font-weight:700; color:#7a5a00; margin:0 0 8px; font-size:15px; }
.zsc-gate p { color:var(--ink-soft); line-height:1.6; margin:0 0 12px; }
.zsc-gate-actions { margin:0; }
.zsc-btn { display:inline-block; cursor:pointer; font-size:14px; font-weight:700; padding:10px 20px; border-radius:9px; border:1px solid var(--gold-mid); background:linear-gradient(135deg,#B8860B,#DAA520); color:#fff; text-decoration:none; }
.zsc-btn:hover { filter:brightness(1.06); }

/* ── Pills + status groups (seller + admin) ───────────────────────────────
   Pills REUSE the shell's canonical component (.zds-orders-typefilter /
   .zds-orders-typepill / -active). We add NO custom pill colours (a per-plugin
   restyle caused the invisible-on-hover bug). .zsc-pill is only a JS hook. */
.zds-orders-typefilter.zsc-pillbar { margin-bottom:16px; }
/* Pills are anchors; no underline, and keep the active pill text white even if the
   shell sets a section-anchor colour (scoped + specific = unified, not a restyle). */
.zsc-seller a.zsc-pill, .zsc-admin a.zsc-pill { text-decoration:none; }
.zsc-seller a.zsc-pill.zds-orders-typepill-active, .zsc-admin a.zsc-pill.zds-orders-typepill-active { color:#fff; }

/* Condensed case-study card (collapsed by default; "Edit" expands the editor) */
.zsc-card-snippet { font-size:13.5px; color:#3a3326; line-height:1.55; margin:6px 0; }
.zsc-card-actions { margin:8px 0 0; display:flex; flex-wrap:wrap; gap:6px; align-items:center; }
.zsc-live-badge { font-size:12px; font-weight:700; color:#2d6a2d; margin:4px 0 0; }
.zsc-editor { margin-top:12px; padding-top:14px; border-top:1px dashed var(--cream-border); }

/* Live-card edit notice (seller) + admin live-vs-proposed diff */
.zsc-live-notice { font-size:13px; color:#5a4408; background:var(--cream-soft); border:1px solid var(--cream-border); border-left:4px solid var(--gold-mid); border-radius:8px; padding:10px 13px; margin:0 0 12px; line-height:1.5; }
.zsc-diff { display:flex; gap:12px; flex-wrap:wrap; margin:6px 0; }
.zsc-diff-col { flex:1 1 280px; min-width:240px; background:#fff; border:1px solid var(--cream-border); border-radius:9px; padding:10px 13px; font-size:13px; color:var(--ink-soft); }
.zsc-diff-col h4 { margin:0 0 6px; font-size:12px; text-transform:uppercase; letter-spacing:.03em; color:#8a7a5f; }
.zsc-diff-new { background:#f4fbf4; border-color:#bfe3bf; }
.zsc-diff-new h4 { color:#2d6a2d; }

/* Admin quick-stats header */
.zsc-stats { display:flex; flex-wrap:wrap; gap:10px; margin:0 0 16px; }
.zsc-stat { flex:1 1 110px; background:#fff; border:1px solid var(--cream-border); border-radius:12px; padding:12px 14px; text-align:center; }
.zsc-stat-n { display:block; font-size:24px; font-weight:800; color:var(--gold-deep); line-height:1.1; }
.zsc-stat-l { display:block; font-size:11.5px; font-weight:600; color:#8a7a5f; margin-top:3px; }

/* Reject reason box (admin) + reason notice (seller) */
.zsc-reject-box { margin:6px 0 2px; padding:10px 12px; background:#fff7f3; border:1px solid #e7b9a0; border-radius:9px; }
.zsc-reject-box .zsc-reject-reason { width:100%; box-sizing:border-box; font-size:13px; padding:8px 10px; border:1px solid #e7c462; border-radius:8px; resize:vertical; margin:0 0 8px; }
.zsc-reject-confirm { cursor:pointer; font-size:12.5px; font-weight:700; padding:7px 14px; border-radius:8px; border:1px solid #c0392b; background:#c0392b; color:#fff; }
.zsc-reject-shown { font-size:13px; color:#7a3a1f; background:#fff3ee; border:1px solid #e7b9a0; border-radius:8px; padding:8px 11px; margin:6px 0; }
.zsc-reject-notice { font-size:13px; color:#7a3a1f; background:#fff3ee; border:1px solid #e7b9a0; border-left:4px solid #c0392b; border-radius:8px; padding:10px 13px; margin:0 0 12px; line-height:1.5; }

/* Admin review: full brief + official badge */
.zsc-review-brief { background:var(--cream-soft); border:1px solid var(--cream-border); border-radius:8px; padding:10px 13px; font-size:13px; color:var(--ink-soft); line-height:1.55; margin:8px 0; max-height:280px; overflow-y:auto; }
.zsc-official-badge { display:inline-block; font-size:11.5px; font-weight:800; color:#7a5400; background:#fff3d4; border:1px solid #e7c462; border-radius:999px; padding:3px 11px; }

/* Seller "view on profile" link + platform-purchase pick rows */
.zsc-profile-link { margin:0 0 12px; }
.zsc-pick-platform { border-color:#e7c462; background:#fffaf0; }
.zsc-pick-badge { align-self:flex-start; font-size:10.5px; font-weight:800; color:#7a5400; background:#fff3d4; border:1px solid #e7c462; border-radius:999px; padding:2px 9px; }
.zsc-pick-notice { font-size:12px; color:#8a6a1f; line-height:1.5; margin:4px 0 0; }

/* ── Public profile: Real Client Work ─────────────────────────── */
.zinn-showcase-section { margin:32px 0; }
.zinn-showcase-section > h2 { font-size:22px; color:#2a2118; margin:0 0 16px; }
.zinn-showcase-head { background:linear-gradient(135deg,#fff3d0 0%,#fff8e6 100%); border:1px solid #e7c462; border-left:5px solid #B8860B; border-radius:14px; padding:20px 22px; margin:0 0 18px; box-shadow:0 2px 10px rgba(138,100,16,.08); }
.zinn-showcase-title { font-size:22px; color:#7a5400; margin:0 0 6px; display:flex; align-items:center; gap:8px; font-weight:800; }
.zinn-showcase-title-ic { font-size:22px; }
.zinn-showcase-lead { font-size:13.5px; color:#5a4408; line-height:1.6; margin:0; }
/* Full-width cards (one per row), each a roomy panel. */
.zinn-showcase-grid { display:grid; grid-template-columns:1fr; gap:14px; }
.zinn-showcase-badges { display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.zinn-showcase-type { font-size:11.5px; font-weight:700; color:#7a5a00; background:#fef3d4; border:1px solid #ecd9a0; border-radius:999px; padding:3px 11px; }
.zinn-showcase-badge-official { background:linear-gradient(135deg,#1a1a2e,#2c2c4a) !important; color:#ffd700 !important; border:1px solid #d4a84b; }
.zinn-showcase-badge-partner { background:linear-gradient(135deg,#1a1a2e,#2c2c4a) !important; color:#ffd700 !important; border:1px solid #d4a84b; }
.zinn-showcase-client-lbl { font-weight:800; color:#8a6410; }
.zinn-showcase-date { color:#8a7a5f; font-weight:600; }
.zinn-showcase-more-wrap { text-align:center; margin:18px 0 0; }
.zinn-showcase-more { cursor:pointer; font-size:14px; font-weight:700; padding:11px 26px; border-radius:9px; border:1px solid #B8860B; background:#fff; color:#8a6410; }
.zinn-showcase-more:hover { background:#fffaed; }
.zinn-showcase-more:disabled { opacity:.5; cursor:not-allowed; }
.zinn-showcase-card {
	background:#fff; border:1px solid #ecd9a0; border-radius:14px; padding:18px 18px 16px;
	box-shadow:0 1px 3px rgba(138,100,16,.06); display:flex; flex-direction:column; gap:8px;
}
.zinn-showcase-badge {
	align-self:flex-start; background:linear-gradient(135deg,#B8860B 0%,#D4A527 100%); color:#fff;
	font-size:11px; font-weight:700; letter-spacing:.03em; padding:4px 11px; border-radius:999px;
}
.zinn-showcase-rating { color:#D4A527; font-size:15px; letter-spacing:1px; }
.zinn-showcase-for { font-size:13px; color:#5a4408; margin:2px 0; }
.zinn-showcase-for span { font-weight:700; color:#8a7a5f; }
.zinn-showcase-for a { font-weight:700; color:#8a6410; text-decoration:none; }
.zinn-showcase-for a:hover { text-decoration:underline; }
.zinn-showcase-card p { margin:3px 0; }
.zinn-showcase-text { font-size:14px; line-height:1.55; color:#3a3326; margin:2px 0; }
.zinn-showcase-sample { width:100%; border-radius:10px; border:1px solid #ecd9a0; margin:4px 0; }
/* "View the work" — proper button. High specificity + !important so the theme's
   generic `a` colour can't make the label gold-on-gold (was unreadable). Dark
   navy text on gold = strong contrast, matching the offer popup CTA. */
.zinn-showcase-card p:has(> .zinn-showcase-sample-link) { margin:8px 0 2px; }
.zinn-showcase-card a.zinn-showcase-sample-link,
.zinn-showcase-card a.zinn-showcase-sample-link:link,
.zinn-showcase-card a.zinn-showcase-sample-link:visited {
	display:inline-flex; align-items:center; gap:6px; font-weight:800; font-size:13.5px;
	text-decoration:none; color:#1a1a2e !important; background:linear-gradient(135deg,#B8860B,#DAA520);
	border:1px solid var(--gold-mid); border-radius:9px; padding:10px 18px;
}
.zinn-showcase-card a.zinn-showcase-sample-link:hover { filter:brightness(1.06); color:#1a1a2e !important; text-decoration:none; }
.zinn-showcase-sample-text { border-left:3px solid #D4A527; margin:4px 0; padding:4px 0 4px 12px; color:#5a4408; font-style:italic; }
.zinn-showcase-client { font-size:12.5px; color:#8a7a5f; margin:2px 0 0; font-weight:600; }

/* Seller "how it works" explainer */
.zsc-seller .zsc-howto { background:var(--cream-soft); border:1px solid var(--cream-border); border-radius:8px; padding:12px 14px; font-size:13px; color:var(--ink-soft); line-height:1.55; margin:0 0 12px; }
.zsc-seller select.zsc-order-id { padding:8px 11px; border:1px solid var(--cream-border); border-radius:8px; font-size:13px; min-width:240px; }

/* ── Mobile (admin + seller showcase) — many sellers set these up on phones ── */
@media (max-width:600px) {
	.zsc-card, .zsc-review { padding:12px 13px; }
	/* Stack the condensed action row and make each control full-width + tappable. */
	.zsc-card-actions { flex-direction:column; align-items:stretch; }
	.zsc-seller button:not(.zsc-pill), .zsc-admin button:not(.zsc-pill) { width:100%; margin:4px 0 0; }
	/* Sample picker stacks. */
	.zsc-seller .zsc-sample-row { flex-direction:column; }
	.zsc-seller .zsc-sample-row .zsc-sample-kind,
	.zsc-card .zsc-sample-value,
	.zsc-card .zsc-sample-text { width:100%; box-sizing:border-box; flex:1 1 auto; min-width:0; }
	/* Admin live-vs-proposed diff stacks. */
	.zsc-diff { flex-direction:column; }
	.zsc-diff-col { min-width:0; flex:1 1 auto; }
	/* Stat tiles two-up. */
	.zsc-stat { flex:1 1 calc(50% - 10px); }
	/* Pills scroll horizontally rather than crowd. */
	.zds-orders-typefilter.zsc-pillbar { flex-wrap:nowrap; overflow-x:auto; -webkit-overflow-scrolling:touch; padding-bottom:4px; }
	.zds-orders-typefilter.zsc-pillbar .zsc-pill { white-space:nowrap; }
}

/* Price paid (USD kept) + local-currency helper line (§8) */
.zinn-showcase-price { font-size:12.5px; color:#5a4408; margin:2px 0 0; font-weight:600; }
.zinn-showcase-price .zsc-price-eq { color:#8a7a5f; font-weight:600; margin-left:4px; }

/* Accessibility: clear keyboard focus on all interactive showcase elements */
.zinn-showcase-section a:focus-visible,
.zinn-showcase-more:focus-visible,
.zinn-showcase-card a.zinn-showcase-sample-link:focus-visible {
	outline:3px solid #8a6410; outline-offset:2px; border-radius:6px;
}

/* ── Public cards: mobile (small phones) ─────────────────────────── */
@media (max-width:600px) {
	.zinn-showcase-section { margin:24px 0; }
	.zinn-showcase-head { padding:15px 16px; }
	.zinn-showcase-title { font-size:19px; }
	.zinn-showcase-lead { font-size:13px; }
	.zinn-showcase-card { padding:15px 15px 14px; border-radius:12px; }
	.zinn-showcase-badges { gap:6px; }
	.zinn-showcase-badge, .zinn-showcase-type { font-size:11px; }
	.zinn-showcase-text { font-size:13.5px; }
	.zinn-showcase-card a.zinn-showcase-sample-link { width:100%; box-sizing:border-box; justify-content:center; }
	.zinn-showcase-more { width:100%; box-sizing:border-box; }
}