/*
 * Huisstijl van TIFA voor de knoppen van deze plugin.
 *
 * Twee dingen verdienen uitleg.
 *
 * 1. De selectors staan met een dubbele klasse (.tqk-button.tqk-button). Dat is
 *    geen typefout: WooCommerce' eigen regel `.woocommerce a.button` is
 *    specifieker dan een enkele klasse en zou anders winnen — daar kwam het
 *    paars vandaan.
 * 2. Op de drie kleureigenschappen staat !important, zodat ook een thema dat
 *    later inlaadt er niet overheen gaat. De waarden zelf zijn variabelen, dus
 *    je kunt de kleuren nog steeds in één regel bijstellen:
 *
 *        :root { --tqk-ink: #1a1a1a; --tqk-accent: #b8974a; }
 *
 *    in Weergave → Aanpassen → Extra CSS.
 */
:root{
	--tqk-ink:#171717;
	--tqk-on-ink:#ffffff;
	--tqk-accent:#a8873c;
	--tqk-on-accent:#ffffff;
	--tqk-radius:2px;
}

a.tqk-button.tqk-button,
button.tqk-button.tqk-button,
.woocommerce a.tqk-button.tqk-button,
.woocommerce button.tqk-button.tqk-button{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	padding:.95rem 1.9rem;
	background-color:var(--tqk-ink) !important;
	border:2px solid var(--tqk-ink) !important;
	color:var(--tqk-on-ink) !important;
	border-radius:var(--tqk-radius);
	font-weight:700;
	line-height:1.2;
	text-align:center;
	text-decoration:none;
	cursor:pointer;
	transition:background-color .15s ease,border-color .15s ease,color .15s ease;
}

a.tqk-button.tqk-button:hover,
a.tqk-button.tqk-button:focus,
button.tqk-button.tqk-button:hover,
button.tqk-button.tqk-button:focus,
.woocommerce a.tqk-button.tqk-button:hover,
.woocommerce a.tqk-button.tqk-button:focus,
.woocommerce button.tqk-button.tqk-button:hover,
.woocommerce button.tqk-button.tqk-button:focus{
	background-color:var(--tqk-accent) !important;
	border-color:var(--tqk-accent) !important;
	color:var(--tqk-on-accent) !important;
	text-decoration:none;
}

a.tqk-button.tqk-button:focus-visible,
button.tqk-button.tqk-button:focus-visible{
	outline:2px solid var(--tqk-accent);
	outline-offset:3px;
}

/* Tweede knop: dezelfde familie, minder nadruk. */
a.tqk-button-secondary.tqk-button-secondary,
button.tqk-button-secondary.tqk-button-secondary,
.woocommerce a.tqk-button-secondary.tqk-button-secondary,
.woocommerce button.tqk-button-secondary.tqk-button-secondary{
	padding:.55rem 1.1rem;
	background-color:transparent !important;
	color:var(--tqk-ink) !important;
	font-size:.9em;
}

a.tqk-button-secondary.tqk-button-secondary:hover,
a.tqk-button-secondary.tqk-button-secondary:focus,
.woocommerce a.tqk-button-secondary.tqk-button-secondary:hover,
.woocommerce a.tqk-button-secondary.tqk-button-secondary:focus{
	background-color:var(--tqk-accent) !important;
	border-color:var(--tqk-accent) !important;
	color:var(--tqk-on-accent) !important;
}

a.tqk-configure-button.tqk-configure-button{
	margin-top:1rem;
}