/*********************************/
/* some-styles is for components */
/*********************************/

:root {
	--shadow-green-600:		0 0 0 0.25rem #00484069;
	--shadow-orange-600:	0 0 0 0.25rem #FFA22C69;
	--shadow-affiliate-primary:		0 0 0 0.25rem #18274f69;
	--shadow-affiliate-secondary:	0 0 0 0.25rem #845c2c69;
}


.shadow-green-600 {
	box-shadow: var(--shadow-green-600);
}

.shadow-orange-600 {
	box-shadow: var(--shadow-orange-600);
}

.shadow-affiliate-primary {
	box-shadow: var(--shadow-affiliate-primary);
}

.shadow-affiliate-secondary {
	box-shadow: var(--shadow-affiliate-secondary);
}



.btn.py-2 {
	padding-top: 12px!important;
	padding-bottom: 12px!important;
}


.btn:not([class*=btn-]):focus {
	box-shadow: var(--shadow-green-600);
}



.btn-green-600 {
	background: var(--green-600);
	color: #fff!important;
	border: 1px solid var(--green-600);
}

.btn-green-600:hover, .btn-green-600:focus {
	background: var(--green-800);
	border: 1px solid var(--green-800);
}

.btn-green-600:focus {
	border-color: var(--green-600);
	box-shadow: var(--shadow-green-600);
}



.btn-orange-600 {
	background: var(--orange-600);
	color: #fff!important;
	border: 1px solid var(--orange-600);
}

.btn-orange-600:hover, .btn-orange-600:focus {
	background: var(--orange-400);
	border: 1px solid var(--orange-400);
}

.btn-orange-600:focus {
	border-color: var(--orange-400);
	box-shadow: var(--shadow-orange-600);
}




.btn-affiliate-primary {
	background: var(--affiliate-primary);
	color: #fff!important;
	border: 1px solid var(--affiliate-primary);
}

.btn-affiliate-primary:hover, .btn-affiliate-primary:focus {
	background: var(--affiliate-secondary);
	border: 1px solid var(--affiliate-secondary);
}

.btn-affiliate-primary:focus {
	border-color: var(--affiliate-secondary);
	box-shadow: var(--shadow-affiliate-primary);
}
