/* ==========================================================================
   TrulyGood Affiliates — affiliate dashboard
   Plugin-owned `tgaffd-` prefix. Visual port of the customer-portal
   components (css/trulygood-components.css, later override block
   ~11880–12600, which wins the cascade), NOT class-name reuse: this page
   does not load trulygood-components.css, so reused names would inherit
   nothing and only collide with the theme's global resets.
   ========================================================================== */

:root {
	--tgaffd-green: #23A74A;
	--tgaffd-green-dark: #1E9340;
	--tgaffd-blue: #2B4AA0;
	--tgaffd-dark: #1A1A1A;
	--tgaffd-ink: #0A0A0A;
	--tgaffd-bg: #FDFBF7;
	--tgaffd-muted: #888888;
	--tgaffd-border: #E8E4DF;
	--tgaffd-soft: #F0FAF4;
	--tgaffd-grid: #F0F0F0;
	--tgaffd-error: #DC0032;
	--tgaffd-warn-bg: #FFF4ED;
	--tgaffd-warn: #B84A00;
	--tgaffd-font: 'Nunito Sans', -apple-system, BlinkMacSystemFont, sans-serif;
	--tgaffd-display: 'Montserrat', 'Nunito Sans', sans-serif;
}

* { box-sizing: border-box; }

html, body { margin: 0; padding: 0; }

body {
	background: var(--tgaffd-bg);
	font-family: var(--tgaffd-font);
	color: var(--tgaffd-ink);
	font-size: 15px;
	line-height: 1.55;
}

.tgaffd-icon { flex-shrink: 0; }

/* ── Top bar (portal: .tgm-portal-top-nav, css/trulygood-components.css:11816) ── */
.tgaffd-topbar {
	position: sticky;
	top: 0;
	z-index: 100;
	background: #fff;
	border-bottom: 1px solid #EFEFEF;
	box-shadow: 0 1px 4px rgba(0, 0, 0, 0.06);
}
.tgaffd-topbar-inner {
	max-width: 1100px;
	margin: 0 auto;
	padding: 0 24px;
	height: 64px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
}
.tgaffd-logo { display: flex; align-items: center; text-decoration: none; }
.tgaffd-logo-img { height: 44px; width: auto; display: block; border-radius: 4px; }
.tgaffd-topbar-name {
	font-family: var(--tgaffd-display);
	font-weight: 800;
	font-size: 15px;
	color: var(--tgaffd-ink);
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	max-width: 40vw;
}
.tgaffd-signout {
	font-family: var(--tgaffd-font);
	font-weight: 600;
	font-size: 14px;
	color: var(--tgaffd-error);
	text-decoration: none;
	display: inline-flex;
	align-items: center;
	gap: 6px;
}
.tgaffd-signout:hover { text-decoration: underline; }

/* ── Tab bar (portal: top-nav links :11841 + bottom nav :11884–11954).
   Rendered ONCE; CSS repositions it from sticky-top to fixed-bottom. ── */
.tgaffd-tabs {
	position: sticky;
	top: 64px;
	z-index: 99;
	background: #fff;
	border-bottom: 1px solid #EFEFEF;
}
.tgaffd-tabs-inner {
	max-width: 1100px;
	margin: 0 auto;
	padding: 0 24px;
	display: flex;
	align-items: center;
	gap: 4px;
	overflow-x: auto;
}
.tgaffd-tab {
	font-family: var(--tgaffd-font);
	font-weight: 600;
	font-size: 14px;
	color: var(--tgaffd-ink);
	background: none;
	border: none;
	border-bottom: 2px solid transparent;
	cursor: pointer;
	padding: 0 14px;
	line-height: 52px;
	display: inline-flex;
	align-items: center;
	gap: 8px;
	white-space: nowrap;
	transition: color 200ms ease, border-color 200ms ease;
}
.tgaffd-tab:hover { color: var(--tgaffd-green); }
.tgaffd-tab[aria-selected="true"] {
	font-family: var(--tgaffd-display);
	font-weight: 800;
	color: var(--tgaffd-green);
	border-bottom-color: var(--tgaffd-green);
}
.tgaffd-tab:focus-visible {
	outline: 2px solid var(--tgaffd-green);
	outline-offset: -2px;
	border-radius: 4px;
}

/* ── Body column (portal: .tg-portal-body :6204, 1100px) ── */
.tgaffd-body {
	max-width: 1100px;
	margin: 0 auto;
	padding: 24px 24px 96px;
}

/* ── Tab panels (portal: .tg-portal-tab :6211) ── */
.tgaffd-panel { display: none; }
.tgaffd-panel.active { display: block; }

/* ── Greeting / status strip (portal: .tg-portal-status-strip :11962) ── */
.tgaffd-strip {
	background: #fff;
	border-radius: 12px;
	padding: 20px 24px;
	margin-bottom: 20px;
}
.tgaffd-strip-inner {
	display: flex;
	justify-content: space-between;
	align-items: center;
	flex-wrap: wrap;
	gap: 12px;
}
.tgaffd-greeting {
	font-family: var(--tgaffd-display);
	font-weight: 800;
	font-size: 26px;
	color: var(--tgaffd-ink);
	display: flex;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
	margin: 0;
}

/* Badge (portal: .tg-sub-badge :11983) */
.tgaffd-badge {
	display: inline-block;
	font-family: var(--tgaffd-font);
	font-weight: 700;
	font-size: 12px;
	background: rgba(35, 167, 74, 0.1);
	color: var(--tgaffd-green);
	border-radius: 20px;
	padding: 3px 10px;
}
.tgaffd-badge--pending { background: var(--tgaffd-warn-bg); color: var(--tgaffd-warn); }
.tgaffd-badge--active { background: rgba(35, 167, 74, 0.1); color: var(--tgaffd-green); }
.tgaffd-badge--suspended,
.tgaffd-badge--clawback { background: rgba(220, 0, 50, 0.08); color: var(--tgaffd-error); }
.tgaffd-badge--cancelled,
.tgaffd-badge--void,
.tgaffd-badge--terminated,
.tgaffd-badge--rejected { background: #F2F2F0; color: #666; }
.tgaffd-badge--paid { background: #F0F4FF; color: var(--tgaffd-blue); }
.tgaffd-badge--earned,
.tgaffd-badge--threshold_met { background: #EDFAF2; color: #1A6B35; }
.tgaffd-badge--warn { background: var(--tgaffd-warn-bg); color: var(--tgaffd-warn); }

/* Hero figure: the ONE hero number on the page (lifetime earned) */
.tgaffd-hero {
	text-align: right;
}
.tgaffd-hero-figure {
	font-family: var(--tgaffd-font);
	font-weight: 700;
	font-size: 48px;
	line-height: 1;
	color: var(--tgaffd-green);
}
.tgaffd-hero-label {
	font-size: 12px;
	font-weight: 600;
	text-transform: uppercase;
	letter-spacing: 0.08em;
	color: var(--tgaffd-muted);
	margin-top: 4px;
}

/* ── Cards (portal: .tg-portal-card :12065) ── */
.tgaffd-card {
	background: #fff;
	border-radius: 12px;
	padding: 24px;
	margin-bottom: 20px;
}
.tgaffd-card-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 20px;
	gap: 16px;
	flex-wrap: wrap;
}
.tgaffd-card-title {
	font-family: var(--tgaffd-display);
	font-weight: 800;
	font-size: 20px;
	color: var(--tgaffd-ink);
	margin: 0 0 4px;
}
.tgaffd-card-sub {
	font-family: var(--tgaffd-font);
	font-size: 13px;
	color: var(--tgaffd-muted);
	margin: 0;
}

/* ── KPI stat tiles ── */
.tgaffd-stats {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 12px;
}
@media (min-width: 768px) {
	.tgaffd-stats { grid-template-columns: repeat(5, 1fr); }
}
.tgaffd-stat {
	background: #fff;
	border-radius: 12px;
	padding: 16px;
	display: flex;
	flex-direction: column;
	gap: 4px;
}
.tgaffd-stat-top {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
}
.tgaffd-stat-icon { color: var(--tgaffd-muted); opacity: 0.6; }
.tgaffd-stat-value {
	font-size: 22px;
	font-weight: 700;
	color: var(--tgaffd-ink);
	font-variant-numeric: proportional-nums;
}
.tgaffd-stat-value--money { color: var(--tgaffd-green); }
.tgaffd-stat-label {
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--tgaffd-muted);
}
.tgaffd-stat-sub {
	font-size: 12px;
	color: var(--tgaffd-muted);
	line-height: 1.35;
}

/* ── Buttons: 100px pills (theme convention) ── */
.tgaffd-btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	background: var(--tgaffd-green);
	color: #fff;
	border: none;
	padding: 12px 24px;
	border-radius: 100px;
	font-family: var(--tgaffd-font);
	font-weight: 700;
	font-size: 14px;
	cursor: pointer;
	text-decoration: none;
	transition: background 150ms ease, transform 100ms ease;
}
.tgaffd-btn:hover { background: var(--tgaffd-green-dark); }
.tgaffd-btn:active { transform: translateY(1px); }
.tgaffd-btn--secondary {
	background: #fff;
	color: var(--tgaffd-ink);
	border: 1px solid var(--tgaffd-border);
}
.tgaffd-btn--secondary:hover { background: #FAFAFA; color: var(--tgaffd-ink); }
.tgaffd-btn--sm { padding: 8px 16px; font-size: 13px; }
.tgaffd-btn:disabled { opacity: 0.5; cursor: default; }

/* Action rows (portal: .tg-portal-action-btn :12224, incl. chevron + 44px min-height) */
.tgaffd-action-btn {
	display: flex;
	align-items: center;
	gap: 16px;
	padding: 16px 20px;
	min-height: 44px;
	border: 1px solid var(--tgaffd-grid);
	border-radius: 12px;
	background: #fff;
	cursor: pointer;
	text-decoration: none;
	transition: background 200ms ease;
	text-align: left;
	width: 100%;
	color: inherit;
	font: inherit;
}
.tgaffd-action-btn:hover,
.tgaffd-action-btn:focus {
	background: #FAFAFA;
	outline: none;
}
.tgaffd-action-btn .tgaffd-icon { color: var(--tgaffd-green); }
.tgaffd-action-btn strong {
	display: block;
	font-weight: 700;
	font-size: 15px;
	color: var(--tgaffd-ink);
	margin-bottom: 2px;
}
.tgaffd-action-btn span {
	font-size: 13px;
	color: var(--tgaffd-muted);
}
.tgaffd-action-btn::after {
	content: '';
	width: 16px;
	height: 16px;
	background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23CCCCCC' viewBox='0 0 256 256'%3E%3Cpath d='M181.66,133.66l-80,80A8,8,0,0,1,88,208V48a8,8,0,0,1,13.66-5.66l80,80A8,8,0,0,1,181.66,133.66Z'%3E%3C/path%3E%3C/svg%3E");
	background-size: contain;
	background-repeat: no-repeat;
	margin-left: auto;
	flex-shrink: 0;
}

/* ── Tracking link block ── */
.tgaffd-code {
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
	font-size: 20px;
	font-weight: 700;
	letter-spacing: 0.05em;
}
.tgaffd-code-row {
	display: flex;
	align-items: center;
	gap: 12px;
	flex-wrap: wrap;
}
.tgaffd-url-box {
	font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
	font-size: 13px;
	background: var(--tgaffd-bg);
	border: 1px solid var(--tgaffd-border);
	border-radius: 8px;
	padding: 10px 14px;
	word-break: break-all;
	margin: 12px 0;
}
.tgaffd-share-qr {
	display: flex;
	gap: 24px;
	align-items: flex-start;
	flex-wrap: wrap;
}
.tgaffd-qr img {
	display: block;
	width: 160px;
	height: 160px;
	border: 1px solid var(--tgaffd-border);
	border-radius: 8px;
}
.tgaffd-qr a {
	display: inline-flex;
	align-items: center;
	gap: 6px;
	margin-top: 10px;
	font-size: 13px;
	font-weight: 600;
	color: var(--tgaffd-green);
	text-decoration: none;
}
.tgaffd-qr a:hover { text-decoration: underline; }

/* ── Tables ── */
.tgaffd-table-wrap { overflow-x: auto; }
table.tgaffd-table {
	width: 100%;
	border-collapse: collapse;
	font-size: 14px;
}
table.tgaffd-table th {
	text-align: left;
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--tgaffd-muted);
	padding: 8px 10px;
	border-bottom: 2px solid var(--tgaffd-border);
	white-space: nowrap;
}
table.tgaffd-table td {
	padding: 10px;
	border-bottom: 1px solid var(--tgaffd-grid);
	vertical-align: middle;
}
table.tgaffd-table td.tgaffd-num {
	font-variant-numeric: tabular-nums;
	white-space: nowrap;
}
table.tgaffd-table.is-fetching tbody { opacity: 0.4; }

/* Pagination */
.tgaffd-pagination {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	margin-top: 14px;
	flex-wrap: wrap;
}
.tgaffd-pagination-info { font-size: 13px; color: var(--tgaffd-muted); }
.tgaffd-pagination-btns { display: flex; gap: 8px; }

/* Filter pills (panel convention, pill radius) */
.tgaffd-pills {
	display: flex;
	gap: 8px;
	flex-wrap: wrap;
	margin: 0 0 14px;
}
.tgaffd-pill {
	padding: 6px 16px;
	border-radius: 100px;
	border: 1px solid var(--tgaffd-border);
	background: #fff;
	font-family: var(--tgaffd-font);
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
	color: var(--tgaffd-muted);
	text-decoration: none;
}
.tgaffd-pill:hover { color: var(--tgaffd-ink); }
.tgaffd-pill.active {
	background: var(--tgaffd-dark);
	color: #fff;
	border-color: var(--tgaffd-dark);
}

/* ── Meter ── */
.tgaffd-meter-labels {
	display: flex;
	justify-content: space-between;
	gap: 12px;
	font-size: 13px;
	color: var(--tgaffd-muted);
	margin-top: 8px;
	flex-wrap: wrap;
}
.tgaffd-meter-labels strong { color: var(--tgaffd-ink); }

/* ── Empty states (portal: .tg-portal-empty-state :6705) ── */
.tgaffd-empty {
	text-align: center;
	padding: 48px 24px;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 14px;
}
.tgaffd-empty .tgaffd-icon { color: var(--tgaffd-ink); opacity: 0.12; }
.tgaffd-empty h3 {
	font-family: var(--tgaffd-display);
	font-weight: 800;
	font-size: 18px;
	color: var(--tgaffd-ink);
	margin: 0;
}
.tgaffd-empty p {
	font-size: 14px;
	color: var(--tgaffd-ink);
	opacity: 0.5;
	margin: 0;
	max-width: 420px;
}

/* ── Feedback (portal: .tg-portal-feedback :6532) ── */
.tgaffd-feedback {
	margin-top: 16px;
	padding: 12px 16px;
	border-radius: 8px;
	font-size: 14px;
	font-weight: 500;
}
.tgaffd-feedback--success { background: var(--tgaffd-soft); color: var(--tgaffd-green); }
.tgaffd-feedback--error { background: #FFF0F0; color: var(--tgaffd-error); }
.tgaffd-feedback--info { background: #F0F4FF; color: var(--tgaffd-blue); }

/* Info note */
.tgaffd-note {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	padding: 12px 14px;
	background: var(--tgaffd-bg);
	border: 1px solid var(--tgaffd-border);
	border-radius: 8px;
	font-size: 13px;
	color: var(--tgaffd-ink);
	margin: 12px 0;
}
.tgaffd-note .tgaffd-icon { color: var(--tgaffd-muted); margin-top: 1px; }
.tgaffd-note p { margin: 0; }
.tgaffd-note--warn { background: var(--tgaffd-warn-bg); border-color: #F3D08A; }
.tgaffd-note--warn .tgaffd-icon { color: var(--tgaffd-warn); }

/* ── Kit: captions ── */
.tgaffd-caption {
	border: 1px solid var(--tgaffd-border);
	border-radius: 12px;
	padding: 16px;
	margin-bottom: 12px;
}
.tgaffd-caption-label {
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.06em;
	color: var(--tgaffd-muted);
	margin-bottom: 8px;
}
.tgaffd-caption-text {
	font-size: 14px;
	line-height: 1.55;
	white-space: pre-wrap;
	margin-bottom: 12px;
}

/* Share buttons */
.tgaffd-share-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
	gap: 10px;
}

/* Kit file grid: repeat(auto-fill, minmax(160px, 1fr)) cards */
.tgaffd-kit-grid {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
	gap: 12px;
}
.tgaffd-kit-file {
	border: 1px solid var(--tgaffd-border);
	border-radius: 12px;
	padding: 14px;
	display: flex;
	flex-direction: column;
	gap: 8px;
	background: #fff;
}
.tgaffd-kit-thumb {
	width: 100%;
	aspect-ratio: 1 / 1;
	border-radius: 8px;
	background: var(--tgaffd-bg);
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	color: var(--tgaffd-muted);
}
.tgaffd-kit-thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}
.tgaffd-kit-name {
	font-size: 13px;
	font-weight: 600;
	word-break: break-all;
	line-height: 1.35;
}
.tgaffd-kit-meta {
	display: flex;
	align-items: center;
	gap: 8px;
	font-size: 12px;
	color: var(--tgaffd-muted);
}

/* ── Charts ── */
.tgaffd-chart { width: 100%; }
.tgaffd-chart svg { display: block; }
.tgaffd-chart-table details { margin-top: 10px; }
.tgaffd-chart-table summary {
	cursor: pointer;
	font-size: 13px;
	font-weight: 600;
	color: var(--tgaffd-green);
}

/* ── Account form ── */
.tgaffd-form-grid {
	display: grid;
	grid-template-columns: 1fr;
	gap: 14px;
}
@media (min-width: 768px) {
	.tgaffd-form-grid { grid-template-columns: 1fr 1fr; }
	.tgaffd-form-grid .tgaffd-span2 { grid-column: span 2; }
}
.tgaffd-field label {
	display: block;
	font-size: 12px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: var(--tgaffd-muted);
	margin-bottom: 6px;
}
.tgaffd-field input[type="text"],
.tgaffd-field input[type="email"],
.tgaffd-field input[type="url"],
.tgaffd-field input[type="tel"],
.tgaffd-field textarea,
.tgaffd-field select {
	width: 100%;
	padding: 11px 14px;
	border: 1px solid var(--tgaffd-border);
	border-radius: 8px;
	font-size: 15px;
	font-family: inherit;
	background: #fff;
	transition: border-color 150ms ease, box-shadow 150ms ease;
}
.tgaffd-field input:focus,
.tgaffd-field textarea:focus,
.tgaffd-field select:focus {
	outline: none;
	border-color: var(--tgaffd-green);
	box-shadow: 0 0 0 3px rgba(35, 167, 74, 0.12);
}
.tgaffd-field textarea { resize: vertical; }
.tgaffd-field .tgaffd-desc {
	font-size: 12px;
	color: var(--tgaffd-muted);
	margin-top: 4px;
}
.tgaffd-field-error {
	font-size: 12px;
	font-weight: 600;
	color: var(--tgaffd-error);
	margin-top: 4px;
}
.tgaffd-readonly {
	display: flex;
	flex-direction: column;
	gap: 2px;
	padding: 11px 0;
}
.tgaffd-readonly-value { font-size: 15px; font-weight: 600; }
.tgaffd-readonly-why { font-size: 12px; color: var(--tgaffd-muted); }
.tgaffd-fieldset {
	border: 1px solid var(--tgaffd-border);
	border-radius: 12px;
	padding: 18px;
	margin: 0 0 18px;
}
.tgaffd-fieldset legend {
	font-family: var(--tgaffd-display);
	font-weight: 800;
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: var(--tgaffd-muted);
	padding: 0 8px;
}
.tgaffd-bank-display {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
	gap: 12px;
	margin-bottom: 14px;
}
.tgaffd-bank-item { font-size: 14px; }
.tgaffd-bank-item .l {
	font-size: 11px;
	font-weight: 700;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: var(--tgaffd-muted);
}
.tgaffd-bank-item .v { font-variant-numeric: tabular-nums; }
.tgaffd-bank-form { display: none; margin-top: 6px; }
.tgaffd-bank-form.is-open { display: block; }

/* ── Modal overlay (portal: .tgm-modal-overlay :8913) ── */
.tgaffd-modal-overlay {
	position: fixed;
	inset: 0;
	background: rgba(0, 0, 0, 0.5);
	z-index: 9999;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
}
.tgaffd-modal-box {
	background: #fff;
	border-radius: 12px;
	padding: 28px;
	max-width: 480px;
	width: 100%;
	position: relative;
	max-height: 90vh;
	overflow-y: auto;
}
.tgaffd-modal-close {
	position: absolute;
	top: 14px;
	right: 14px;
	background: none;
	border: none;
	font-size: 22px;
	cursor: pointer;
	color: var(--tgaffd-muted);
	line-height: 1;
	padding: 4px;
}

/* ── Sources list ── */
.tgaffd-sources {
	display: flex;
	flex-direction: column;
	gap: 8px;
}
.tgaffd-source-row {
	display: flex;
	align-items: center;
	gap: 10px;
	font-size: 14px;
}
.tgaffd-source-bar {
	height: 8px;
	border-radius: 4px;
	background: var(--tgaffd-blue);
	opacity: 0.85;
	min-width: 4px;
}
.tgaffd-source-host { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tgaffd-source-count { color: var(--tgaffd-muted); font-variant-numeric: tabular-nums; }

/* ── Unauthorised / access screen ── */
.tgaffd-access {
	min-height: 100vh;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 24px;
}
.tgaffd-access-card {
	background: #fff;
	border-radius: 16px;
	padding: 36px;
	max-width: 460px;
	width: 100%;
	box-shadow: 0 12px 40px rgba(26, 26, 26, 0.08);
	text-align: center;
}
.tgaffd-access-card h1 {
	font-family: var(--tgaffd-display);
	font-weight: 800;
	font-size: 22px;
	margin: 16px 0 8px;
}
.tgaffd-access-card p { color: var(--tgaffd-muted); margin: 0 0 20px; }
.tgaffd-access-logo { height: 48px; width: auto; }
.tgaffd-access-form {
	display: flex;
	flex-direction: column;
	gap: 10px;
	margin-top: 8px;
}
.tgaffd-access-form input[type="email"] {
	padding: 12px 14px;
	border: 1px solid var(--tgaffd-border);
	border-radius: 100px;
	font-size: 15px;
	font-family: inherit;
	text-align: center;
}
.tgaffd-access-form input[type="email"]:focus {
	outline: none;
	border-color: var(--tgaffd-green);
	box-shadow: 0 0 0 3px rgba(35, 167, 74, 0.12);
}

/* ── Mobile: tab bar to the bottom (portal: .tgm-portal-bottom-nav :11884) ── */
@media (max-width: 767px) {
	.tgaffd-tabs {
		position: fixed;
		top: auto;
		bottom: 0;
		left: 0;
		right: 0;
		z-index: 1000;
		background: #fff;
		border-top: 1px solid #EFEFEF;
		border-bottom: none;
		padding-bottom: env(safe-area-inset-bottom);
	}
	.tgaffd-tabs-inner {
		padding: 0 8px;
		overflow-x: visible;
	}
	.tgaffd-tab {
		flex: 1;
		flex-direction: column;
		justify-content: center;
		gap: 4px;
		line-height: 1.2;
		padding: 8px 2px;
		font-size: 10px;
		font-weight: 500;
		border-bottom: none;
		color: var(--tgaffd-muted);
	}
	.tgaffd-tab .tgaffd-icon { width: 22px; height: 22px; }
	.tgaffd-tab[aria-selected="true"] {
		color: var(--tgaffd-green);
		font-family: var(--tgaffd-font);
		font-weight: 700;
	}
	.tgaffd-body { padding: 16px 16px 96px; }
	.tgaffd-hero { text-align: left; }
	.tgaffd-greeting { font-size: 22px; }
}

/* ── Reduced motion: no transitions anywhere on this page ── */
@media (prefers-reduced-motion: reduce) {
	.tgaffd-tab,
	.tgaffd-btn,
	.tgaffd-action-btn,
	.tgaffd-field input,
	.tgaffd-field textarea,
	.tgaffd-field select {
		transition: none;
	}
}
