/**
 * Objekt-Button — the conditional «Details» link in a Loop Grid item.
 *
 * Structure and sane defaults only. Every visual decision the client can make
 * in Elementor is written as a `{{WRAPPER}}`-scoped rule by the widget, so
 * this file never has to fight the panel: it sets what a control does not
 * cover, and gets out of the way where one does.
 */

.sh-objekt-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.5em;
	box-sizing: border-box;
	max-width: 100%;
	text-align: center;
	text-decoration: none;
	line-height: 1.2;
	transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.sh-objekt-button:hover,
.sh-objekt-button:focus {
	text-decoration: none;
}

/* The fallback is a label, not a control: nothing about it should suggest
   that clicking it will do something. */
.sh-objekt-button--static {
	cursor: default;
}

.sh-objekt-button__text {
	display: inline-block;
}

.sh-objekt-button__icon {
	display: inline-flex;
	align-items: center;
	flex: 0 0 auto;
}

.sh-objekt-button__icon svg {
	width: 1em;
	height: 1em;
	fill: currentColor;
}

/* Elementor draws the editor placeholder; on the front end it never renders. */
.sh-objekt-button-hint {
	padding: 0.75em 1em;
	border: 1px dashed currentColor;
	border-radius: 4px;
	opacity: 0.6;
	font-size: 13px;
	line-height: 1.4;
}
