/* Buttons – drei Varianten. Werte aus Theme-Einstellungen → Buttons, sonst Theme-Farben
   (folgen damit automatisch dem dunklen Modus und den Flächen). */
.pws-btn {
	--bg: var(--pws-btn1-bg, var(--pws-c-primary)); --fg: var(--pws-btn1-fg, var(--pws-c-bg)); --bd: var(--pws-btn1-bd, var(--pws-c-primary));
	--hbg: var(--pws-btn1-hbg, var(--pws-c-accent)); --hfg: var(--pws-btn1-hfg, var(--pws-c-on-accent, #0C0C0C)); --hbd: var(--pws-btn1-hbd, var(--pws-c-accent));
	--r: var(--pws-btn1-radius, 999px); --py: var(--pws-btn1-py, 15px); --px: var(--pws-btn1-px, 28px);
	--fs: var(--pws-btn1-fs, 15px); --fw: var(--pws-btn1-fw, 600);
	display: inline-flex; align-items: center; justify-content: center; gap: .5em;
	/* Rahmen als innerer Schatten statt border: Hintergrund und Rahmen werden in einem Schritt gezeichnet,
	   so entsteht bei krummen Pixelpositionen keine feine Linie zwischen Rahmen und Füllung. */
	--bw: 1.5px;
	padding: calc(var(--py) + var(--bw)) calc(var(--px) + var(--bw)); border: 0; border-radius: var(--r);
	background: var(--bg); color: var(--fg); box-shadow: inset 0 0 0 var(--bw) var(--bd);
	font: var(--fw) var(--fs)/1.2 var(--pws-font, inherit); text-decoration: none;
	cursor: pointer; transition: background-color .2s, color .2s, box-shadow .2s, transform .2s;
	background-clip: padding-box; -webkit-font-smoothing: antialiased;
}
.pws-btn:hover, .pws-btn:focus-visible { background: var(--hbg); color: var(--hfg); box-shadow: inset 0 0 0 var(--bw) var(--hbd); }
.pws-btn:focus-visible { outline: 2px solid var(--pws-c-primary, #0C0C0C); outline-offset: 3px; }
.pws-btn:active { transform: translateY(1px); }

.pws-btn--2 {
	--bg: var(--pws-btn2-bg, transparent); --fg: var(--pws-btn2-fg, var(--pws-c-primary)); --bd: var(--pws-btn2-bd, var(--pws-c-primary));
	--hbg: var(--pws-btn2-hbg, var(--pws-c-primary)); --hfg: var(--pws-btn2-hfg, var(--pws-c-bg)); --hbd: var(--pws-btn2-hbd, var(--pws-c-primary));
	--r: var(--pws-btn2-radius, 999px); --py: var(--pws-btn2-py, 15px); --px: var(--pws-btn2-px, 28px);
	--fs: var(--pws-btn2-fs, 15px); --fw: var(--pws-btn2-fw, 600);
}
.pws-btn--3 {
	--bg: var(--pws-btn3-bg, transparent); --fg: var(--pws-btn3-fg, var(--pws-c-primary)); --bd: var(--pws-btn3-bd, transparent);
	--hbg: var(--pws-btn3-hbg, transparent); --hfg: var(--pws-btn3-hfg, var(--pws-c-primary)); --hbd: var(--pws-btn3-hbd, transparent);
	--r: var(--pws-btn3-radius, 0px); --py: var(--pws-btn3-py, 4px); --px: var(--pws-btn3-px, 0px);
	--fs: var(--pws-btn3-fs, 15px); --fw: var(--pws-btn3-fw, 600);
	text-decoration: underline; text-underline-offset: .35em; text-decoration-thickness: 2px; text-decoration-color: var(--pws-hl, #D4F518);
}
.pws-btn--3:hover { text-decoration-thickness: 4px; }
/* Auf Lime: Hover nicht Lime auf Lime, sondern Weiß */
.pws-surface--accent .pws-btn:not(.pws-btn--2):not(.pws-btn--3) { --hbg: var(--pws-paper, #fff); --hfg: var(--pws-ink, #0C0C0C); --hbd: var(--pws-paper, #fff); }