

.tssd-tp[hidden] { display: none; }

/* ── Logo ─────────────────────────────────────────────────────────────────── */
.tssd-tp-logo { display: inline-block; height: 24px; width: auto; vertical-align: middle; }
.tssd-tp-logo--sm { height: 18px; }
.tssd-tp-logo--xs { height: 14px; }
.tssd-tp-logo--on-dark { display: none; }
html[data-theme="dark"] .tssd-tp-logo--on-light { display: none; }
html[data-theme="dark"] .tssd-tp-logo--on-dark { display: inline-block; }

/* ── gemeinsame Teile ─────────────────────────────────────────────────────── */
.tssd-tp { margin: 1.25em 0; }
.tssd-tp__head {
	margin: 0 0 4px;
	font-family: var(--sd-font-brand);
	font-size: var(--sd-fs-base);
	color: var(--sd-text);
}
.tssd-tp p { margin: 0 0 10px; }
.tssd-tp__actions,
.tssd-tp--about {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 10px;
}
.tssd-tp__logo { display: inline-flex; align-items: center; }

/* ── M1 — Danke-Seite: Text links, Einladung (Sterne + Logo) rechts ───────── */
.tssd-tp__row { display: flex; flex-wrap: wrap; align-items: center; gap: 16px; }
.tssd-tp__text { flex: 1 1 220px; }
.tssd-tp__text p { margin: 0; }
.tssd-tp__invite {
	display: inline-flex;
	flex-direction: column;
	align-items: center;
	gap: 6px;
	padding: 8px 12px;
	border-radius: var(--sd-radius);
	text-decoration: none;
	color: var(--sd-text);
}
.tssd-tp__invite:hover,
.tssd-tp__invite:focus-visible { background: var(--sd-surface-2); }
.tssd-tp__invite:focus-visible { outline: none; box-shadow: var(--sd-focus); }
.tssd-tp__invite-label { font-size: var(--sd-fs-sm); font-weight: var(--sd-btn-weight); color: var(--sd-link); }

/* Umriss-Sterne: eine Einladung, keine Note (Markenregeln — nie gefüllt). */
.tssd-tp-stars { display: inline-flex; gap: 4px; }
.tssd-tp-stars svg {
	width: 22px;
	height: 22px;
	fill: none;
	stroke: var(--sd-muted);
	stroke-width: 1.6;
}
.tssd-tp__invite:hover .tssd-tp-stars svg,
.tssd-tp__invite:focus-visible .tssd-tp-stars svg { stroke: var(--sd-gold-dark); }

/* ── M3 — Konto-Übersicht ─────────────────────────────────────────────────── */
.tssd-tp__dismiss { font-size: var(--sd-fs-sm); color: var(--sd-link); }

/* ── M4 — Karte unten rechts, ohne Overlay ────────────────────────────────── */
.tssd-tp--print {
	position: fixed;
	right: 16px;
	bottom: 16px;
	z-index: 90;
	width: min(360px, calc(100vw - 32px));
	margin: 0;
	padding: 14px 16px;
	box-shadow: var(--sd-shadow-lg);
}
.tssd-tp__cap {
	font-size: var(--sd-fs-xs);
	font-weight: var(--sd-btn-weight);
	text-transform: uppercase;
	letter-spacing: .04em;
	color: var(--sd-muted);
}
.tssd-tp .tssd-tp__cap { margin: 0 0 4px; }
.tssd-tp__close {
	position: absolute;
	top: 6px;
	right: 8px;
	min-width: 32px;
	min-height: 32px;
	padding: 0;
	border: 0;
	border-radius: var(--sd-radius);
	background: transparent;
	color: var(--sd-muted);
	font-size: var(--sd-fs-lg);
	line-height: 1;
	cursor: pointer;
}
.tssd-tp__close:hover,
.tssd-tp__close:focus-visible { background: var(--sd-surface-2); color: var(--sd-text); }
.tssd-tp__close:focus-visible { outline: none; box-shadow: var(--sd-focus); }

/* ── M5 — Footer: inline in der Copyright-Zeile ───────────────────────────── */
.tssd-tp-foot { white-space: nowrap; }
.tssd-tp-foot a { color: inherit; text-decoration: none; }
.tssd-tp-foot a:hover,
.tssd-tp-foot a:focus-visible { text-decoration: underline; }
.tssd-tp-foot .tssd-tp-logo { vertical-align: -2px; }
