/* Geo Social Share – Frontend. Farben kommen aus Inline-CSS-Variablen (Einstellungen). */

/* Hinweis: Die eigentlichen Werte kommen aus dem Inline-:root (Einstellungen).
   Hier nur Fallbacks via var(..., default) – NICHT auf .geo-share deklarieren,
   sonst würde der Einstellungswert überschrieben. */
.geo-share {
	margin: 1.6em 0;
}

.geo-share__heading {
	display: block;
	font-size: .72rem;
	font-weight: 600;
	letter-spacing: .06em;
	text-transform: uppercase;
	color: #767676;
	margin-bottom: .7em;
}

.geo-share__list {
	display: flex;
	flex-wrap: wrap;
	gap: .5em;
	margin: 0;
	padding: 0;
	list-style: none;
}

.geo-share__btn {
	display: inline-flex;
	align-items: center;
	gap: .55em;
	padding: .75em 1.25em;
	border: 0;
	border-radius: 8px;
	background: var(--geoshare-accent, #df1746);
	color: var(--geoshare-text, #fff);
	font-size: 1rem;
	font-weight: 500;
	line-height: 1.2;
	cursor: pointer;
	text-decoration: none;
	appearance: none;
	transition: background .15s ease, transform .1s ease, box-shadow .15s ease, opacity .15s ease;
}

.geo-share__btn svg {
	width: var(--geoshare-icon, 16px);
	height: var(--geoshare-icon, 16px);
	flex: 0 0 auto;
}

.geo-share__btn:hover,
.geo-share__btn:focus-visible {
	background: var(--geoshare-hover, #b81339);
	color: var(--geoshare-text, #fff);
	transform: translateY(-1px);
	box-shadow: 0 3px 9px rgba(0, 0, 0, .16);
}

.geo-share__btn:active { transform: translateY(0); }

/* --- Stile --- */
.geo-share--style-outline .geo-share__btn {
	background: transparent;
	color: var(--geoshare-accent, #df1746);
	box-shadow: inset 0 0 0 1px currentColor;
}
.geo-share--style-outline .geo-share__btn:hover,
.geo-share--style-outline .geo-share__btn:focus-visible {
	background: var(--geoshare-accent, #df1746);
	color: var(--geoshare-text, #fff);
	box-shadow: 0 3px 9px rgba(0, 0, 0, .16);
}

.geo-share--style-mono .geo-share__btn {
	background: var(--geoshare-brand, var(--geoshare-accent, #df1746));
	color: #fff;
}
.geo-share--style-mono .geo-share__btn:hover,
.geo-share--style-mono .geo-share__btn:focus-visible {
	filter: brightness(.92);
}

/* --- Formen --- */
.geo-share--shape-round .geo-share__btn { border-radius: 6px; }
.geo-share--shape-pill .geo-share__btn { border-radius: 999px; }
.geo-share--shape-square .geo-share__btn { border-radius: 0; }

/* Icon-only auf kleinen Screens (Name ausblenden) */
@media (max-width: 600px) {
	.geo-share--inline .geo-share__name {
		position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0);
	}
	.geo-share--inline .geo-share__btn { padding: .5em; }
}

/* --- Floating-Leiste --- */
.geo-share--floating {
	position: fixed;
	top: 50%;
	transform: translateY(-50%);
	z-index: 9990;
	margin: 0;
}
.geo-share--floating.geo-share--left { left: 0; }
.geo-share--floating.geo-share--right { right: 0; }
.geo-share--floating .geo-share__list { flex-direction: column; gap: 2px; }
.geo-share--floating .geo-share__name {
	position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0);
}
.geo-share--floating .geo-share__btn { padding: .55em; border-radius: 0; box-shadow: none; }
.geo-share--floating .geo-share__btn:hover { transform: none; }
.geo-share--floating.geo-share--left .geo-share__btn { border-radius: 0 6px 6px 0; }
.geo-share--floating.geo-share--right .geo-share__btn { border-radius: 6px 0 0 6px; }

@media (max-width: 782px) {
	.geo-share--floating {
		top: auto; bottom: 0; left: 0; right: 0; transform: none; width: 100%;
	}
	.geo-share--floating .geo-share__list { flex-direction: row; justify-content: center; }
	.geo-share--floating .geo-share__btn { border-radius: 0 !important; flex: 1; justify-content: center; }
}

/* Toast beim Kopieren */
.geo-share-toast {
	position: fixed;
	bottom: 24px;
	left: 50%;
	transform: translateX(-50%);
	background: #222;
	color: #fff;
	padding: .6em 1.1em;
	border-radius: 6px;
	font-size: .85rem;
	z-index: 10000;
	opacity: 0;
	transition: opacity .2s ease;
	pointer-events: none;
}
.geo-share-toast.is-visible { opacity: 1; }
