/* Bootstrap Additions */

/* Opacity classes from 0.10 to 0.90 in increments of 0.05 */
.op-90 { opacity: 0.90!important; }
.op-85 { opacity: 0.85!important; }
.op-80 { opacity: 0.80!important; }
.op-75 { opacity: 0.75!important; }
.op-70 { opacity: 0.70!important; }
.op-65 { opacity: 0.65!important; }
.op-60 { opacity: 0.60!important; }
.op-55 { opacity: 0.55!important; }
.op-50 { opacity: 0.50!important; }
.op-45 { opacity: 0.45!important; }
.op-40 { opacity: 0.40!important; }
.op-35 { opacity: 0.35!important; }
.op-30 { opacity: 0.30!important; }
.op-25 { opacity: 0.25!important; }
.op-20 { opacity: 0.20!important; }
.op-15 { opacity: 0.15!important; }
.op-10 { opacity: 0.10!important; }
.op-0 { opacity: 0.0!important; }

/* Font size classes from 2rem to 0.5rem */
.fs-200 { font-size: 2rem!important; }
.fs-175 { font-size: 1.75rem!important; }
.fs-150 { font-size: 1.5rem!important; }
.fs-125 { font-size: 1.25rem!important; }
.fs-120 { font-size: 1.2rem!important; }
.fs-115 { font-size: 1.15rem!important; }
.fs-110 { font-size: 1.1rem!important; }
.fs-105 { font-size: 1.05rem!important; }
.fs-100 { font-size: 1rem!important; }
.fs-95 { font-size: 0.95rem!important; }
.fs-90 { font-size: 0.9rem!important; }
.fs-85 { font-size: 0.85rem!important; }
.fs-80 { font-size: 0.8rem!important; }
.fs-75 { font-size: 0.75rem!important; }
.fs-70 { font-size: 0.7rem!important; }
.fs-65 { font-size: 0.65rem!important; }
.fs-60 { font-size: 0.6rem!important; }
.fs-55 { font-size: 0.55rem!important; }
.fs-50 { font-size: 0.5rem!important; }
.fs-45 { font-size: 0.45rem!important; }
.fs-40 { font-size: 0.4rem!important; }
.fs-35 { font-size: 0.35rem!important; }
.fs-30 { font-size: 0.3rem!important; }
.fs-25 { font-size: 0.25rem!important; }
.fs-20 { font-size: 0.2rem!important; }

/* Whitespace utility classes */
.nowrap {
	white-space: nowrap;
}

.text-nowrap {
	white-space: nowrap;
}

/* Misc */
.hidden {
	visibility: hidden;
}

/* Reset text-transform to none for normal casing */
.text-sentencecase {
	text-transform: unset!important;
}

/* More Buttons */
/* These classes use CSS variables to create dynamic button styles based on the Bootstrap color palette.
	You can customize the --btn-base variable to change the base color of the button, and the other variables
	will adjust accordingly for hover, active, and disabled states.

	Ex: class="btn btn-dynamic btn-blue" will create a button with the blue color
	scheme, while class="btn btn-dynamic btn-red" will create a button with the red color scheme. You can also create your own custom color classes by defining new --btn-base values.
*/
.btn-dynamic {
	--btn-base: var(--bs-dark);
	--btn-hover-mix: 80%;
	--btn-active-mix: 70%;

    --bs-btn-color: #fff;
    --bs-btn-bg: var(--btn-base);
    --bs-btn-border-color: var(--btn-base);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: color-mix(in oklch, var(--btn-base) var(--btn-hover-mix), black);
    --bs-btn-hover-border-color: color-mix(in oklch, var(--btn-base) var(--btn-hover-mix), black);
    --bs-btn-focus-shadow-rgb: 228, 128, 60;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: color-mix(in oklch, var(--btn-base) var(--btn-active-mix), black);
    --bs-btn-active-border-color: color-mix(in oklch, var(--btn-base) var(--btn-active-mix), black);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: #fff;
    --bs-btn-disabled-bg: color-mix(in oklch, var(--btn-base) 50%, black);
    --bs-btn-disabled-border-color: color-mix(in oklch, var(--btn-base) 50%, black);
}

.btn-outline-dynamic {
	--btn-base: var(--bs-dark);
    --bs-btn-color: var(--btn-base);
    --bs-btn-border-color: var(--btn-base);
    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg: var(--btn-base);
    --bs-btn-hover-border-color: var(--btn-base);
    --bs-btn-focus-shadow-rgb: 92, 184, 92;
    --bs-btn-active-color: #fff;
    --bs-btn-active-bg: var(--btn-base);
    --bs-btn-active-border-color: var(--btn-base);
    --bs-btn-active-shadow: inset 0 3px 5px rgba(0, 0, 0, 0.125);
    --bs-btn-disabled-color: var(--btn-base);
    --bs-btn-disabled-bg: transparent;
    --bs-btn-disabled-border-color: var(--btn-base);
    --bs-gradient: none;
}

.btn-blue {
	--btn-base: var(--bs-blue);
}

.btn-indigo {
	--btn-base: var(--bs-indigo);
}

.btn-purple {
	--btn-base: var(--bs-purple);
}

.btn-pink {
	--btn-base: var(--bs-pink);
}

.btn-red {
	--btn-base: var(--bs-red);
}

.btn-orange {
	--btn-base: var(--bs-orange);
}

.btn-yellow {
	--btn-base: var(--bs-yellow);
}

.btn-green {
	--btn-base: var(--bs-green);
}

.btn-teal {
	--btn-base: var(--bs-teal);
}

.btn-cyan {
	--btn-base: var(--bs-cyan);
}

.btn-black {
	--btn-base: var(--bs-black);
}

.btn-white {
	--btn-base: var(--bs-white);
}

.btn-gray {
	--btn-base: var(--bs-gray);
}

.btn-gray-dark {
	--btn-base: var(--bs-gray-dark);
}

/* Bootstrap Pallette Additions */
.bg-blue { background-color: var(--bs-blue)!important; }
.bg-indigo { background-color: var(--bs-indigo)!important; }
.bg-purple { background-color: var(--bs-purple)!important; }
.bg-pink { background-color: var(--bs-pink)!important; }
.bg-red { background-color: var(--bs-red)!important; }
.bg-orange { background-color: var(--bs-orange)!important; }
.bg-yellow { background-color: var(--bs-yellow)!important; }
.bg-green { background-color: var(--bs-green)!important; }
.bg-teal { background-color: var(--bs-teal)!important; }
.bg-cyan { background-color: var(--bs-cyan)!important; }
.bg-black { background-color: var(--bs-black)!important; }
.bg-white { background-color: var(--bs-white)!important; }
.bg-gray { background-color: var(--bs-gray)!important; }
.bg-gray-dark { background-color: var(--bs-gray-dark)!important; }
.bg-gray-100 { background-color: var(--bs-gray-100)!important; }
.bg-gray-200 { background-color: var(--bs-gray-200)!important; }
.bg-gray-300 { background-color: var(--bs-gray-300)!important; }
.bg-gray-400 { background-color: var(--bs-gray-400)!important; }
.bg-gray-500 { background-color: var(--bs-gray-500)!important; }
.bg-gray-600 { background-color: var(--bs-gray-600)!important; }
.bg-gray-700 { background-color: var(--bs-gray-700)!important; }
.bg-gray-800 { background-color: var(--bs-gray-800)!important; }
.bg-gray-900 { background-color: var(--bs-gray-900)!important; }
.bg-dark { background-color: var(--bs-dark)!important; }
.bg-light { background-color: var(--bs-light)!important; }

.text-blue { color: var(--bs-blue)!important; }
.text-indigo { color: var(--bs-indigo)!important; }
.text-purple { color: var(--bs-purple)!important; }
.text-pink { color: var(--bs-pink)!important; }
.text-red { color: var(--bs-red)!important; }
.text-orange { color: var(--bs-orange)!important; }
.text-yellow { color: var(--bs-yellow)!important; }
.text-green { color: var(--bs-green)!important; }
.text-teal { color: var(--bs-teal)!important; }
.text-cyan { color: var(--bs-cyan)!important; }
.text-black { color: var(--bs-black)!important; }
.text-white { color: var(--bs-white)!important; }
.text-gray { color: var(--bs-gray)!important; }
.text-gray-dark { color: var(--bs-gray-dark)!important; }
.text-gray-100 { color: var(--bs-gray-100)!important; }
.text-gray-200 { color: var(--bs-gray-200)!important; }
.text-gray-300 { color: var(--bs-gray-300)!important; }
.text-gray-400 { color: var(--bs-gray-400)!important; }
.text-gray-500 { color: var(--bs-gray-500)!important; }
.text-gray-600 { color: var(--bs-gray-600)!important; }
.text-gray-700 { color: var(--bs-gray-700)!important; }
.text-gray-800 { color: var(--bs-gray-800)!important; }
.text-gray-900 { color: var(--bs-gray-900)!important; }
.text-dark { color: var(--bs-dark)!important; }
.text-light { color: var(--bs-light)!important; }

.border-blue { border-color: var(--bs-blue)!important; }
.border-indigo { border-color: var(--bs-indigo)!important; }
.border-purple { border-color: var(--bs-purple)!important; }
.border-pink { border-color: var(--bs-pink)!important; }
.border-red { border-color: var(--bs-red)!important; }
.border-orange { border-color: var(--bs-orange)!important; }
.border-yellow { border-color: var(--bs-yellow)!important; }
.border-green { border-color: var(--bs-green)!important; }
.border-teal { border-color: var(--bs-teal)!important; }
.border-cyan { border-color: var(--bs-cyan)!important; }
.border-black { border-color: var(--bs-black)!important; }
.border-white { border-color: var(--bs-white)!important; }
.border-gray { border-color: var(--bs-gray)!important; }
.border-gray-dark { border-color: var(--bs-gray-dark)!important; }
.border-gray-100 { border-color: var(--bs-gray-100)!important; }
.border-gray-200 { border-color: var(--bs-gray-200)!important; }
.border-gray-300 { border-color: var(--bs-gray-300)!important; }
.border-gray-400 { border-color: var(--bs-gray-400)!important; }
.border-gray-500 { border-color: var(--bs-gray-500)!important; }
.border-gray-600 { border-color: var(--bs-gray-600)!important; }
.border-gray-700 { border-color: var(--bs-gray-700)!important; }
.border-gray-800 { border-color: var(--bs-gray-800)!important; }
.border-gray-900 { border-color: var(--bs-gray-900)!important; }
.border-dark { border-color: var(--bs-dark)!important; }
.border-light { border-color: var(--bs-light)!important; }