.w-10 { width: 10% !important; }
.w-20 { width: 20% !important; }
.w-30 { width: 30% !important; }
.w-40 { width: 40% !important; }
.w-50 { width: 50% !important; }
.w-60 { width: 60% !important; }
.w-70 { width: 70% !important; }
.w-80 { width: 80% !important; }
.w-90 { width: 90% !important; }
.w-100 { width: 100% !important; }

.h-10 { height: 10% !important; }
.h-20 { height: 20% !important; }
.h-30 { height: 30% !important; }
.h-40 { height: 40% !important; }
.h-50 { height: 50% !important; }
.h-60 { height: 60% !important; }
.h-70 { height: 70% !important; }
.h-80 { height: 80% !important; }
.h-90 { height: 90% !important; }
.h-100 { height: 100% !important; }

.vw-10 { width: 10vw !important; }
.vw-20 { width: 20vw !important; }
.vw-30 { width: 30vw !important; }
.vw-40 { width: 40vw !important; }
.vw-50 { width: 50vw !important; }
.vw-60 { width: 60vw !important; }
.vw-70 { width: 70vw !important; }
.vw-80 { width: 80vw !important; }
.vw-90 { width: 90vw !important; }
.vw-100 { width: 100vw !important; }

.vh-10 { height: 10vh !important; }
.vh-20 { height: 20vh !important; }
.vh-30 { height: 30vh !important; }
.vh-40 { height: 40vh !important; }
.vh-50 { height: 50vh !important; }
.vh-60 { height: 60vh !important; }
.vh-70 { height: 70vh !important; }
.vh-80 { height: 80vh !important; }
.vh-90 { height: 90vh !important; }
.vh-100 { height: 100vh !important; }


/* Font sizes */
.fs-7 { font-size: 0.875rem !important; }
.fs-8 { font-size: 0.75rem !important; }
.fs-9 { font-size: 0.625rem !important; }

/* Buttons */
.btn-primary {
	background-color: var(--color-accent) !important;
	border-color: var(--color-accent) !important;
	color: var(--color-secondary) !important;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.show > .btn-primary.dropdown-toggle {
	background-color: var(--color-primary) !important;
	border-color: var(--color-accent) !important;
	color: var(--color-secondary) !important;
}

.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.show > .btn-primary.dropdown-toggle {
	box-shadow: 0 0 0 0.25rem color-mix(in srgb, var(--color-accent) 35%, transparent) !important;
}

.btn-primary:disabled,
.btn-primary.disabled {
	background-color: var(--color-accent) !important;
	border-color: var(--color-accent) !important;
	color: var(--color-secondary) !important;
	opacity: 0.65;
}

.btn-sm {
	padding: 0.3rem 0.75rem !important;
	font-size: 0.875rem !important;
	line-height: 1.25 !important;
	border-radius: 0.25rem !important;
}

.btn-xxl {
	padding: 1rem 2.5rem !important;
	font-size: 1.75rem !important;
	line-height: 1.2 !important;
	border-radius: 0.5rem !important;
}
