/* ==========================================================================
   CaniVita Apotheke — Signatur-Element: die Spezimen-Karte
   Eine Karte im Stil eines Labor- bzw. Apotheken-Etiketts: gestrichelte
   Kontur, gestanztes "Loch" oben links (wie an einer Anhänge-Etikette),
   Mono-Schrift für Kennzahlen. Wird für Produkte, Nährwerte und Zitate
   verwendet.
   ========================================================================== */

.cv-specimen {
	position: relative;
	border: 1px dashed var(--wp--preset--color--stone);
	border-radius: 2px;
	padding: var(--wp--preset--spacing--30);
	transition: transform 0.25s ease, border-color 0.25s ease;
}

.cv-specimen::before {
	content: "";
	position: absolute;
	top: 14px;
	left: 14px;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--wp--preset--color--void);
	border: 1px solid var(--wp--preset--color--stone);
}

.cv-specimen:hover {
	border-color: var(--wp--preset--color--amber);
	transform: rotate(-0.4deg) translateY(-2px);
}

/* Editor: dieselbe Optik als Block-Style "Spezimen-Karte" für core/group */
.is-style-specimen-card {
	position: relative;
	border: 1px dashed var(--wp--preset--color--stone);
	border-radius: 2px;
	padding: var(--wp--preset--spacing--30);
}

.is-style-specimen-card::before {
	content: "";
	position: absolute;
	top: 14px;
	left: 14px;
	width: 7px;
	height: 7px;
	border-radius: 50%;
	background: var(--wp--preset--color--void);
	border: 1px solid var(--wp--preset--color--stone);
}

@media (prefers-reduced-motion: reduce) {
	.cv-specimen {
		transition: none;
	}
	.cv-specimen:hover {
		transform: none;
	}
}

/* ==========================================================================
   Buttons — "Outline"-Variante (sekundärer CTA neben dem Amber-Button)
   ========================================================================== */

.wp-block-button.is-style-outline .wp-block-button__link {
	border: 1px solid var(--wp--preset--color--stone);
	color: var(--wp--preset--color--bone);
	background: transparent;
	font-family: var(--wp--preset--font-family--mono);
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
	border-color: var(--wp--preset--color--amber);
	color: var(--wp--preset--color--amber);
}

/* ==========================================================================
   Navigation — dezente Amber-Unterstreichung beim Hover
   ========================================================================== */

.wp-block-navigation-item__content:hover {
	color: var(--wp--preset--color--amber) !important;
}

/* ==========================================================================
   Fokus-Sichtbarkeit (Barrierefreiheit)
   ========================================================================== */

a:focus-visible,
button:focus-visible,
.wp-block-button__link:focus-visible {
	outline: 2px solid var(--wp--preset--color--amber);
	outline-offset: 2px;
}

/* ==========================================================================
   Feineinstellungen Typografie
   ========================================================================== */

body {
	-webkit-font-smoothing: antialiased;
}

::selection {
	background: var(--wp--preset--color--amber);
	color: var(--wp--preset--color--void-deep);
}