/* Help centre. Uses the theme's tokens; falls back to sensible defaults. */
body.tcgsup-page .tcgsf-entry { max-width: none; }
.tcgsup { max-width: 1040px; margin: 0 auto; line-height: 1.6; color: var( --tcgsf-ink, #24242c ); }
.tcgsup a { color: var( --tcgsf-primary, #206464 ); }
.tcgsup h2 { margin: 2em 0 .6em; font-size: 1.35em; }
.tcgsup-lede { font-size: 1.1em; margin: 0 0 1.2em; color: var( --tcgsf-ink-soft, #454550 ); }
.tcgsup-crumbs { font-size: .9em; color: var( --tcgsf-muted, #62626e ); margin: 0 0 12px; }
.tcgsup-crumbs a { color: inherit; }

/* search */
.tcgsup-search { display: flex; gap: 8px; margin: 0 0 8px; }
.tcgsup-search input { flex: 1 1 auto; min-width: 0; padding: 12px 16px; font-size: 1.05em; border: 1px solid var( --tcgsf-border, #dfe3ef ); border-radius: 10px; background: var( --tcgsf-surface, #fff ); color: inherit; }
.tcgsup-search--inline { margin: 0 0 6px; }
.tcgsup-results { margin: 0 0 20px; border: 1px solid var( --tcgsf-border, #dfe3ef ); border-radius: 10px; background: var( --tcgsf-surface, #fff ); overflow: hidden; }
.tcgsup-results a { display: flex; gap: 10px; align-items: baseline; padding: 10px 14px; border-top: 1px solid var( --tcgsf-border, #eee ); color: inherit; text-decoration: none; }
.tcgsup-results a:first-child { border-top: 0; }
.tcgsup-results a:hover { background: var( --tcgsf-surface-alt, #f6f7f9 ); }
.tcgsup-results p { margin: 0; padding: 12px 14px; color: var( --tcgsf-muted, #62626e ); }
.tcgsup-noresult { color: var( --tcgsf-muted, #62626e ); margin: 0 0 12px; }
.tcgsup-tag { display: inline-block; padding: 1px 8px; border-radius: 999px; font-size: .72em; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; flex: 0 0 auto; }
.tcgsup-tag--buyer { background: #e3f1f0; color: #206464; }
.tcgsup-tag--seller { background: #fdf0d5; color: #8a4b08; }

/* hub */
.tcgsup-split { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; margin: 22px 0 8px; }
.tcgsup-side { display: flex; flex-direction: column; gap: 6px; padding: 26px 26px 22px; border-radius: 14px; border: 1px solid var( --tcgsf-border, #dfe3ef ); background: var( --tcgsf-surface, #fff ); color: inherit; text-decoration: none; transition: transform .15s, box-shadow .15s; }
.tcgsup-side:hover { transform: translateY( -2px ); box-shadow: 0 10px 30px rgba( 0, 0, 0, .08 ); }
.tcgsup-side strong { font-size: 1.5em; font-family: var( --tcgsf-font-head, inherit ); }
.tcgsup-side span:not(.tcgsup-side__kicker) { color: var( --tcgsf-ink-soft, #454550 ); }
.tcgsup-side em { font-style: normal; font-weight: 700; margin-top: 8px; color: var( --tcgsf-primary, #206464 ); }
.tcgsup-side__kicker { font-size: .78em; font-weight: 700; text-transform: uppercase; letter-spacing: .06em; color: var( --tcgsf-muted, #62626e ); }
.tcgsup-side--buyer { border-top: 5px solid #206464; }
.tcgsup-side--seller { border-top: 5px solid #c47a00; }
.tcgsup-popular { display: grid; grid-template-columns: 1fr 1fr; gap: 8px 18px; }
.tcgsup-popular a { display: flex; gap: 10px; align-items: baseline; padding: 10px 0; border-bottom: 1px solid var( --tcgsf-border, #eee ); color: inherit; text-decoration: none; font-weight: 600; }
.tcgsup-popular a:hover { color: var( --tcgsf-primary, #206464 ); }
.tcgsup-contact-cta { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin: 32px 0 18px; padding: 20px 24px; border-radius: 12px; background: var( --tcgsf-primary-soft, #e3f1f0 ); }
.tcgsup-contact-cta strong { display: block; font-size: 1.1em; }
.tcgsup-contact-cta span { color: var( --tcgsf-ink-soft, #454550 ); }
.tcgsup-links { font-size: .92em; color: var( --tcgsf-muted, #62626e ); }

/* faq pages */
.tcgsup-layout { display: grid; grid-template-columns: 220px minmax( 0, 1fr ); gap: 32px; align-items: start; margin-top: 8px; }
.tcgsup-toc { position: sticky; top: calc( var( --tcgsf-header-height, 76px ) + 16px ); font-size: .93em; }
.tcgsup-toc strong { display: block; margin: 0 0 6px; text-transform: uppercase; font-size: .78em; letter-spacing: .05em; color: var( --tcgsf-muted, #62626e ); }
.tcgsup-toc ul { list-style: none; margin: 0 0 14px; padding: 0; }
.tcgsup-toc li a { display: block; padding: 6px 0; color: inherit; text-decoration: none; border-left: 2px solid transparent; padding-left: 10px; }
.tcgsup-toc li a:hover, .tcgsup-toc li a.is-active { border-left-color: var( --tcgsf-primary, #206464 ); color: var( --tcgsf-primary, #206464 ); }
.tcgsup-toc__contact { width: 100%; text-align: center; }
.tcgsup-topic { margin: 0 0 28px; scroll-margin-top: calc( var( --tcgsf-header-height, 76px ) + 12px ); }
.tcgsup-topic h2 { margin: 0 0 8px; padding-bottom: 6px; border-bottom: 2px solid var( --tcgsf-border, #eee ); }
.tcgsup-topic__intro { margin: 0 0 12px; padding: 12px 16px; border-left: 4px solid var( --tcgsf-primary, #206464 ); background: var( --tcgsf-primary-soft, #eef2fa ); border-radius: 0 8px 8px 0; }
.tcgsup-item { margin: 0 0 8px; border: 1px solid var( --tcgsf-border, #e3e3e3 ); border-radius: 10px; background: var( --tcgsf-surface, #fff ); scroll-margin-top: calc( var( --tcgsf-header-height, 76px ) + 12px ); }
.tcgsup-item[open] { border-color: #b9c9d6; }
.tcgsup-item summary { display: flex; justify-content: space-between; gap: 12px; padding: 12px 16px; font-weight: 600; cursor: pointer; list-style: none; }
.tcgsup-item summary::-webkit-details-marker { display: none; }
.tcgsup-item summary::after { content: '+'; flex: 0 0 auto; font-weight: 700; color: var( --tcgsf-primary, #206464 ); }
.tcgsup-item[open] summary::after { content: '–'; }
.tcgsup-item__body { padding: 0 16px 14px; }
.tcgsup-item__body > :first-child { margin-top: 0; }
.tcgsup-item__body > :last-child { margin-bottom: 0; }
.tcgsup-item mark { background: #fff3b0; padding: 0 2px; }

/* contact */
.tcgsup-contact__grid { display: grid; grid-template-columns: minmax( 0, 1fr ) 300px; gap: 28px; align-items: start; }
.tcgsup-form { padding: 22px 24px; border: 1px solid var( --tcgsf-border, #dfe3ef ); border-radius: 14px; background: var( --tcgsf-surface, #fff ); }
.tcgsup-form label { display: block; margin: 0 0 14px; font-weight: 600; font-size: .95em; }
.tcgsup-form label small { font-weight: 400; color: var( --tcgsf-muted, #62626e ); }
.tcgsup-form input[type=text], .tcgsup-form input[type=email], .tcgsup-form select, .tcgsup-form textarea { display: block; width: 100%; margin-top: 5px; padding: 10px 12px; font: inherit; font-weight: 400; border: 1px solid var( --tcgsf-border, #dfe3ef ); border-radius: 8px; background: var( --tcgsf-surface, #fff ); color: inherit; }
.tcgsup-form input[type=file] { display: block; margin-top: 6px; font-weight: 400; }
.tcgsup-form .required { color: #b21127; }
.tcgsup-row { display: grid; grid-template-columns: 1fr 1fr; gap: 0 16px; }
.tcgsup-who { border: 0; padding: 0; margin: 0 0 16px; display: flex; flex-wrap: wrap; gap: 8px 18px; }
.tcgsup-who legend { font-weight: 700; margin-bottom: 8px; }
.tcgsup-who label { display: inline-flex; align-items: center; gap: 6px; margin: 0; font-weight: 500; cursor: pointer; }
.tcgsup-hp { position: absolute; left: -9999px; }
.tcgsup-form__actions { display: flex; align-items: center; gap: 14px; margin: 6px 0 0; }
.tcgsup-form__status { font-weight: 600; }
.tcgsup-form__status.is-error { color: #b21127; }
.tcgsup-form__status.is-success { color: #0f6b3f; }
.tcgsup-form__fine { margin: 10px 0 0; font-size: .82em; color: var( --tcgsf-muted, #62626e ); }
.tcgsup-form.is-done > *:not(.tcgsup-done) { display: none; }
.tcgsup-done { padding: 12px 0; }
.tcgsup-done strong { display: block; font-size: 1.2em; margin-bottom: 6px; }
.tcgsup-contact__aside { display: flex; flex-direction: column; gap: 12px; }
.tcgsup-card { padding: 16px 18px; border-radius: 12px; background: var( --tcgsf-surface-alt, #f6f7f9 ); font-size: .93em; }
.tcgsup-card strong { display: block; margin-bottom: 6px; }
.tcgsup-card p, .tcgsup-card ul { margin: 0; }
.tcgsup-card ul { padding-left: 18px; }
.tcgsup-card--warn { background: #fff7e6; border-left: 4px solid #c47a00; }

@media ( max-width: 820px ) {
	.tcgsup-split, .tcgsup-popular, .tcgsup-row, .tcgsup-contact__grid { grid-template-columns: 1fr; }
	.tcgsup-layout { grid-template-columns: 1fr; gap: 16px; }
	.tcgsup-toc { position: static; display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
	.tcgsup-toc strong { flex-basis: 100%; }
	.tcgsup-toc ul { display: contents; }
	.tcgsup-toc li a { padding: 6px 12px; border: 1px solid var( --tcgsf-border, #dfe3ef ); border-radius: 999px; }
	.tcgsup-toc__contact { width: auto; margin-top: 6px; }
	.tcgsup-contact-cta { flex-direction: column; align-items: flex-start; }
	.tcgsup-form { padding: 18px 16px; }
}

/* Dark mode: these two carried hard-coded light backgrounds under light
   text, so the "delivered order" card and search highlights were unreadable. */
:root[data-tcgsf-theme='dark'] .tcgsup-card--warn { background: var( --tcgsf-warn-soft, #34280e ); border-left-color: var( --tcgsf-warn, #e5b45a ); }
:root[data-tcgsf-theme='dark'] .tcgsup-item mark { background: #5a4a14; color: #fff; }
:root[data-tcgsf-theme='dark'] .tcgsup-tag--buyer { background: #14302f; color: #8adbd7; }
:root[data-tcgsf-theme='dark'] .tcgsup-tag--seller { background: #3a2d10; color: #f0c45c; }
@media ( max-width: 640px ) { .tcgsup-form input[type=text], .tcgsup-form input[type=email], .tcgsup-form select, .tcgsup-form textarea, .tcgsup-search input { font-size: 16px; } }
