/* WB Design System — WPBakery Button Override
 * Overrides vc_btn to match wb-button sizing, weight, and brand colors.
 *
 * WPBakery specificity reference:
 *   Base:  .vc_general.vc_btn3                          → (0,2,0)
 *   Color: .vc_btn3.vc_btn3-color-X.vc_btn3-style-flat  → (0,3,0)
 *   Hover: above + :hover                               → (0,3,1)
 *
 * Our selectors use (0,3,0)+ to reliably override.
 */

/* -- Base reset  (0,3,0) -------------------------------------------------- */
.vc_general.vc_btn3.wb-vc-btn {
	border: 0.125rem solid transparent;
	border-radius: var(--wb-border-radius, 15px);
	font-weight: 600;
	line-height: 1.4;
	transition: all 0.2s;
	background-image: none;
	box-shadow: none;
	text-transform: none;
}

.vc_general.vc_btn3.wb-vc-btn:hover,
.vc_general.vc_btn3.wb-vc-btn:focus,
.vc_general.vc_btn3.wb-vc-btn:active {
	border-width: 0.125rem;
	background-image: none;
	box-shadow: none;
}

/* -- Sizes (match wb-button scale)  (0,4,0) ------------------------------- */
.vc_general.vc_btn3.wb-vc-btn.vc_btn3-size-xs {
	padding: 0.25rem 0.75rem;
	font-size: 0.75rem;
}

.vc_general.vc_btn3.wb-vc-btn.vc_btn3-size-sm {
	padding: 0.375rem 1rem;
	font-size: 0.8125rem;
}

.vc_general.vc_btn3.wb-vc-btn.vc_btn3-size-md {
	padding: 0.625rem 1.5rem;
	font-size: 0.9375rem;
}

.vc_general.vc_btn3.wb-vc-btn.vc_btn3-size-lg {
	padding: 0.75rem 2rem;
	font-size: 1rem;
}

/* -- Brand Colors  (0,4,0) ------------------------------------------------ */

/* Grau */
.vc_general.vc_btn3.wb-vc-btn.vc_btn3-color-wb-grau {
	background-color: var(--wb-grau, #727575);
	border-color: var(--wb-grau, #727575);
	color: #fff;
}

.vc_general.vc_btn3.wb-vc-btn.vc_btn3-color-wb-grau:hover,
.vc_general.vc_btn3.wb-vc-btn.vc_btn3-color-wb-grau:focus,
.vc_general.vc_btn3.wb-vc-btn.vc_btn3-color-wb-grau:active {
	background-color: var(--wb-grau, #727575);
	border-color: var(--wb-grau, #727575);
	color: #fff;
	opacity: 0.85;
}

/* Rot */
.vc_general.vc_btn3.wb-vc-btn.vc_btn3-color-wb-rot {
	background-color: var(--wb-rot, #DF4238);
	border-color: var(--wb-rot, #DF4238);
	color: #fff;
}

.vc_general.vc_btn3.wb-vc-btn.vc_btn3-color-wb-rot:hover,
.vc_general.vc_btn3.wb-vc-btn.vc_btn3-color-wb-rot:focus,
.vc_general.vc_btn3.wb-vc-btn.vc_btn3-color-wb-rot:active {
	background-color: var(--wb-rot, #DF4238);
	border-color: var(--wb-rot, #DF4238);
	color: #fff;
	opacity: 0.85;
}

/* Blau */
.vc_general.vc_btn3.wb-vc-btn.vc_btn3-color-wb-blau {
	background-color: var(--wb-blau, #3C5F7F);
	border-color: var(--wb-blau, #3C5F7F);
	color: #fff;
}

.vc_general.vc_btn3.wb-vc-btn.vc_btn3-color-wb-blau:hover,
.vc_general.vc_btn3.wb-vc-btn.vc_btn3-color-wb-blau:focus,
.vc_general.vc_btn3.wb-vc-btn.vc_btn3-color-wb-blau:active {
	background-color: var(--wb-blau, #3C5F7F);
	border-color: var(--wb-blau, #3C5F7F);
	color: #fff;
	opacity: 0.85;
}

/* Grün */
.vc_general.vc_btn3.wb-vc-btn.vc_btn3-color-wb-gruen {
	background-color: var(--wb-gruen, #73A584);
	border-color: var(--wb-gruen, #73A584);
	color: #fff;
}

.vc_general.vc_btn3.wb-vc-btn.vc_btn3-color-wb-gruen:hover,
.vc_general.vc_btn3.wb-vc-btn.vc_btn3-color-wb-gruen:focus,
.vc_general.vc_btn3.wb-vc-btn.vc_btn3-color-wb-gruen:active {
	background-color: var(--wb-gruen, #73A584);
	border-color: var(--wb-gruen, #73A584);
	color: #fff;
	opacity: 0.85;
}

/* Orange */
.vc_general.vc_btn3.wb-vc-btn.vc_btn3-color-wb-orange {
	background-color: var(--wb-orange, #EF9351);
	border-color: var(--wb-orange, #EF9351);
	color: #fff;
}

.vc_general.vc_btn3.wb-vc-btn.vc_btn3-color-wb-orange:hover,
.vc_general.vc_btn3.wb-vc-btn.vc_btn3-color-wb-orange:focus,
.vc_general.vc_btn3.wb-vc-btn.vc_btn3-color-wb-orange:active {
	background-color: var(--wb-orange, #EF9351);
	border-color: var(--wb-orange, #EF9351);
	color: #fff;
	opacity: 0.85;
}

/* Weiß — text uses page primary color for contrast on white backgrounds */
.vc_general.vc_btn3.wb-vc-btn.vc_btn3-color-wb-weiss {
	background-color: var(--wb-white, #FFFFFF);
	border-color: var(--wb-white, #FFFFFF);
	color: var(--wb-ctx-primary);
}

.vc_general.vc_btn3.wb-vc-btn.vc_btn3-color-wb-weiss:hover,
.vc_general.vc_btn3.wb-vc-btn.vc_btn3-color-wb-weiss:focus,
.vc_general.vc_btn3.wb-vc-btn.vc_btn3-color-wb-weiss:active {
	background-color: var(--wb-white, #FFFFFF);
	border-color: var(--wb-white, #FFFFFF);
	color: var(--wb-ctx-primary);
	opacity: 0.85;
}
