/* Base Colors */
.bg-white {
    background: var(--bgl-white) !important;
    --alpha-color: var(--bgl-white);
}

.color-white {
    color: var(--bgl-white) !important;
}

.bg-input-white input,
.bg-input-white textarea,
.bg-input-white .selectinput-btn {
    background: var(--bgl-white) !important;
}

.border-white {
    border-color: var(--bgl-white) !important;
}

.color-input-white input {
    color: var(--bgl-white) !important;
}

/* Black */
.bg-black {
    background: var(--bgl-black) !important;
    --alpha-color: var(--bgl-black);
}

.color-black {
    color: var(--bgl-black) !important;
}

.bg-input-black input,
.bg-input-black textarea,
.bg-input-black .selectinput-btn {
    background: var(--bgl-black) !important;
}

.border-black {
    border-color: var(--bgl-black) !important;
}

.color-input-black input {
    color: var(--bgl-black) !important;
}

/* Black Tint */
.bg-black-tint {
    background: var(--bgl-black-tint) !important;
    --alpha-color: var(--bgl-black-tint);
}

.color-black-tint {
    color: var(--bgl-black-tint) !important;
}

.bg-input-black-tint input,
.bg-input-black-tint textarea,
.bg-input-black-tint .selectinput-btn {
    background: var(--bgl-black-tint) !important;
}

.border-black-tint {
    border-color: var(--bgl-black-tint) !important;
}

.color-input-black-tint input {
    color: var(--bgl-black-tint) !important;
}

/* Primary */
.bg-primary {
    background: var(--bgl-primary) !important;
    --alpha-color: var(--bgl-primary);
}

.color-primary {
    color: var(--bgl-primary) !important;
}

.bg-input-primary input,
.bg-input-primary textarea,
.bg-input-primary .selectinput-btn {
    background: var(--bgl-primary) !important;
}

.border-primary {
    border-color: var(--bgl-primary) !important;
}

.color-input-primary input {
    color: var(--bgl-primary) !important;
}

/* Primary Tint */
.bg-primary-tint {
    background: var(--bgl-primary-tint) !important;
    --alpha-color: var(--bgl-primary-tint);
}

.color-primary-tint {
    color: var(--bgl-primary-tint) !important;
}

.bg-input-primary-tint input,
.bg-input-primary-tint textarea,
.bg-input-primary-tint .selectinput-btn {
    background: var(--bgl-primary-tint) !important;
}

.border-primary-tint {
    border-color: var(--bgl-primary-tint) !important;
}

.color-input-primary-tint input {
    color: var(--bgl-primary-tint) !important;
}

/* Primary Light */
.bg-primary-light {
    background: var(--bgl-primary-light) !important;
    --alpha-color: var(--bgl-primary-light);
}

.color-primary-light {
    color: var(--bgl-primary-light) !important;
}

.bg-input-primary-light input,
.bg-input-primary-light textarea,
.bg-input-primary-light .selectinput-btn {
    background: var(--bgl-primary-light) !important;
}

.border-primary-light {
    border-color: var(--bgl-primary-light) !important;
}

.color-input-primary-light input {
    color: var(--bgl-primary-light) !important;
}

/* Blue */
.bg-blue {
    background: var(--bgl-blue) !important;
    --alpha-color: var(--bgl-blue);
}

.color-blue {
    color: var(--bgl-blue) !important;
}

.bg-input-blue input,
.bg-input-blue textarea,
.bg-input-blue .selectinput-btn {
    background: var(--bgl-blue) !important;
}

.border-blue {
    border-color: var(--bgl-blue) !important;
}

.color-input-blue input {
    color: var(--bgl-blue) !important;
}

/* Blue Tint */
.bg-blue-tint {
    background: var(--bgl-blue-tint) !important;
    --alpha-color: var(--bgl-blue-tint);
}

.color-blue-tint {
    color: var(--bgl-blue-tint) !important;
}

.bg-input-blue-tint input,
.bg-input-blue-tint textarea,
.bg-input-blue-tint .selectinput-btn {
    background: var(--bgl-blue-tint) !important;
}

.border-blue-tint {
    border-color: var(--bgl-blue-tint) !important;
}

.color-input-blue-tint input {
    color: var(--bgl-blue-tint) !important;
}

/* Blue Dark */
.bg-blue-dark {
    background: var(--bgl-blue-dark) !important;
    --alpha-color: var(--bgl-blue-dark);
}

.color-blue-dark {
    color: var(--bgl-blue-dark) !important;
}

.bg-input-blue-dark input,
.bg-input-blue-dark textarea,
.bg-input-blue-dark .selectinput-btn {
    background: var(--bgl-blue-dark) !important;
}

.border-blue-dark {
    border-color: var(--bgl-blue-dark) !important;
}

.color-input-blue-dark input {
    color: var(--bgl-blue-dark) !important;
}

/* Blue Light */
.bg-blue-light {
    background: var(--bgl-blue-light) !important;
    --alpha-color: var(--bgl-blue-light);
}

.color-blue-light {
    color: var(--bgl-blue-light) !important;
}

.bg-input-blue-light input,
.bg-input-blue-light textarea,
.bg-input-blue-light .selectinput-btn {
    background: var(--bgl-blue-light) !important;
}

.border-blue-light {
    border-color: var(--bgl-blue-light) !important;
}

.color-input-blue-light input {
    color: var(--bgl-blue-light) !important;
}

/* Green */
.bg-green {
    background: var(--bgl-green) !important;
    --alpha-color: var(--bgl-green);
}

.color-green {
    color: var(--bgl-green) !important;
}

.bg-input-green input,
.bg-input-green textarea,
.bg-input-green .selectinput-btn {
    background: var(--bgl-green) !important;
}

.border-green {
    border-color: var(--bgl-green) !important;
}

.color-input-green input {
    color: var(--bgl-green) !important;
}

/* Green Light */
.bg-green-light {
    background: var(--bgl-green-light) !important;
    --alpha-color: var(--bgl-green-light);
}

.color-green-light {
    color: var(--bgl-green-light) !important;
}

.bg-input-green-light input,
.bg-input-green-light textarea,
.bg-input-green-light .selectinput-btn {
    background: var(--bgl-green-light) !important;
}

.border-green-light {
    border-color: var(--bgl-green-light) !important;
}

.color-input-green-light input {
    color: var(--bgl-green-light) !important;
}

/* Red */
.bg-red {
    background: var(--bgl-red) !important;
    --alpha-color: var(--bgl-red);
}

.color-red {
    color: var(--bgl-red) !important;
}

.bg-input-red input,
.bg-input-red textarea,
.bg-input-red .selectinput-btn {
    background: var(--bgl-red) !important;
}

.border-red {
    border-color: var(--bgl-red) !important;
}

.color-input-red input {
    color: var(--bgl-red) !important;
}

/* Red Tint */
.bg-red-tint {
    background: var(--bgl-red-tint) !important;
    --alpha-color: var(--bgl-red-tint);
}

.color-red-tint {
    color: var(--bgl-red-tint) !important;
}

.bg-input-red-tint input,
.bg-input-red-tint textarea,
.bg-input-red-tint .selectinput-btn {
    background: var(--bgl-red-tint) !important;
}

.border-red-tint {
    border-color: var(--bgl-red-tint) !important;
}

.color-input-red-tint input {
    color: var(--bgl-red-tint) !important;
}

/* Red Light */
.bg-red-light {
    background: var(--bgl-red-light) !important;
    --alpha-color: var(--bgl-red-light);
}

.color-red-light {
    color: var(--bgl-red-light) !important;
}

.bg-input-red-light input,
.bg-input-red-light textarea,
.bg-input-red-light .selectinput-btn {
    background: var(--bgl-red-light) !important;
}

.border-red-light {
    border-color: var(--bgl-red-light) !important;
}

.color-input-red-light input {
    color: var(--bgl-red-light) !important;
}

/* Yellow */
.bg-yellow {
    background: var(--bgl-yellow) !important;
    --alpha-color: var(--bgl-yellow);
}

.color-yellow {
    color: var(--bgl-yellow) !important;
}

.bg-input-yellow input,
.bg-input-yellow textarea,
.bg-input-yellow .selectinput-btn {
    background: var(--bgl-yellow) !important;
}

.border-yellow {
    border-color: var(--bgl-yellow) !important;
}

.color-input-yellow input {
    color: var(--bgl-yellow) !important;
}

/* Yellow Light */
.bg-yellow-light {
    background: var(--bgl-yellow-light) !important;
    --alpha-color: var(--bgl-yellow-light);
}

.color-yellow-light {
    color: var(--bgl-yellow-light) !important;
}

.bg-input-yellow-light input,
.bg-input-yellow-light textarea,
.bg-input-yellow-light .selectinput-btn {
    background: var(--bgl-yellow-light) !important;
}

.border-yellow-light {
    border-color: var(--bgl-yellow-light) !important;
}

.color-input-yellow-light input {
    color: var(--bgl-yellow-light) !important;
}

/* Purple */
.bg-purple {
    background: var(--bgl-purple) !important;
    --alpha-color: var(--bgl-purple);
}

.color-purple {
    color: var(--bgl-purple) !important;
}

.bg-input-purple input,
.bg-input-purple textarea,
.bg-input-purple .selectinput-btn {
    background: var(--bgl-purple) !important;
}

.border-purple {
    border-color: var(--bgl-purple) !important;
}

.color-input-purple input {
    color: var(--bgl-purple) !important;
}

/* Purple Light */
.bg-purple-light {
    background: var(--bgl-purple-light) !important;
    --alpha-color: var(--bgl-purple-light);
}

.color-purple-light {
    color: var(--bgl-purple-light) !important;
}

.bg-input-purple-light input,
.bg-input-purple-light textarea,
.bg-input-purple-light .selectinput-btn {
    background: var(--bgl-purple-light) !important;
}

.border-purple-light {
    border-color: var(--bgl-purple-light) !important;
}

.color-input-purple-light input {
    color: var(--bgl-purple-light) !important;
}

/* Brown */
.bg-brown {
    background: var(--bgl-brown) !important;
    --alpha-color: var(--bgl-brown);
}

.color-brown {
    color: var(--bgl-brown) !important;
}

.bg-input-brown input,
.bg-input-brown textarea,
.bg-input-brown .selectinput-btn {
    background: var(--bgl-brown) !important;
}

.border-brown {
    border-color: var(--bgl-brown) !important;
}

.color-input-brown input {
    color: var(--bgl-brown) !important;
}

/* Brown Light */
.bg-brown-light {
    background: var(--bgl-brown-light) !important;
    --alpha-color: var(--bgl-brown-light);
}

.color-brown-light {
    color: var(--bgl-brown-light) !important;
}

.bg-input-brown-light input,
.bg-input-brown-light textarea,
.bg-input-brown-light .selectinput-btn {
    background: var(--bgl-brown-light) !important;
}

.border-brown-light {
    border-color: var(--bgl-brown-light) !important;
}

.color-input-brown-light input {
    color: var(--bgl-brown-light) !important;
}

/* Orange */
.bg-orange {
    background: var(--bgl-orange) !important;
    --alpha-color: var(--bgl-orange);
}

.color-orange {
    color: var(--bgl-orange) !important;
}

.bg-input-orange input,
.bg-input-orange textarea,
.bg-input-orange .selectinput-btn {
    background: var(--bgl-orange) !important;
}

.border-orange {
    border-color: var(--bgl-orange) !important;
}

.color-input-orange input {
    color: var(--bgl-orange) !important;
}

/* Orange Light */
.bg-orange-light {
    background: var(--bgl-orange-light) !important;
    --alpha-color: var(--bgl-orange-light);
}

.color-orange-light {
    color: var(--bgl-orange-light) !important;
}

.bg-input-orange-light input,
.bg-input-orange-light textarea,
.bg-input-orange-light .selectinput-btn {
    background: var(--bgl-orange-light) !important;
}

.border-orange-light {
    border-color: var(--bgl-orange-light) !important;
}

.color-input-orange-light input {
    color: var(--bgl-orange-light) !important;
}

/* Turquoise */
.bg-turquoise {
    background: var(--bgl-turquoise) !important;
    --alpha-color: var(--bgl-turquoise);
}

.color-turquoise {
    color: var(--bgl-turquoise) !important;
}

.bg-input-turquoise input,
.bg-input-turquoise textarea,
.bg-input-turquoise .selectinput-btn {
    background: var(--bgl-turquoise) !important;
}

.border-turquoise {
    border-color: var(--bgl-turquoise) !important;
}

.color-input-turquoise input {
    color: var(--bgl-turquoise) !important;
}

/* Turquoise Light */
.bg-turquoise-light {
    background: var(--bgl-turquoise-light) !important;
    --alpha-color: var(--bgl-turquoise-light);
}

.color-turquoise-light {
    color: var(--bgl-turquoise-light) !important;
}

.bg-input-turquoise-light input,
.bg-input-turquoise-light textarea,
.bg-input-turquoise-light .selectinput-btn {
    background: var(--bgl-turquoise-light) !important;
}

.border-turquoise-light {
    border-color: var(--bgl-turquoise-light) !important;
}

.color-input-turquoise-light input {
    color: var(--bgl-turquoise-light) !important;
}

/* Pink */
.bg-pink {
    background: var(--bgl-pink) !important;
    --alpha-color: var(--bgl-pink);
}

.color-pink {
    color: var(--bgl-pink) !important;
}

.bg-input-pink input,
.bg-input-pink textarea,
.bg-input-pink .selectinput-btn {
    background: var(--bgl-pink) !important;
}

.border-pink {
    border-color: var(--bgl-pink) !important;
}

.color-input-pink input {
    color: var(--bgl-pink) !important;
}

/* Pink Light */
.bg-pink-light {
    background: var(--bgl-pink-light) !important;
    --alpha-color: var(--bgl-pink-light);
}

.color-pink-light {
    color: var(--bgl-pink-light) !important;
}

.bg-input-pink-light input,
.bg-input-pink-light textarea,
.bg-input-pink-light .selectinput-btn {
    background: var(--bgl-pink-light) !important;
}

.border-pink-light {
    border-color: var(--bgl-pink-light) !important;
}

.color-input-pink-light input {
    color: var(--bgl-pink-light) !important;
}

/* Gray */
.bg-gray {
    background: var(--bgl-gray) !important;
    --alpha-color: var(--bgl-gray);
}

.color-gray {
    color: var(--bgl-gray) !important;
}

.bg-input-gray input,
.bg-input-gray textarea,
.bg-input-gray .selectinput-btn {
    background: var(--bgl-gray) !important;
}

.border-gray {
    border-color: var(--bgl-gray) !important;
}

.color-input-gray input {
    color: var(--bgl-gray) !important;
}

/* Gray Light */
.bg-gray-light {
    background: var(--bgl-gray-light) !important;
    --alpha-color: var(--bgl-gray-light);
}

.color-gray-light {
    color: var(--bgl-gray-light) !important;
}

.bg-input-gray-light input,
.bg-input-gray-light textarea,
.bg-input-gray-light .selectinput-btn {
    background: var(--bgl-gray-light) !important;
}

.border-gray-light {
    border-color: var(--bgl-gray-light) !important;
}

.color-input-gray-light input {
    color: var(--bgl-gray-light) !important;
}

/* Gray Tint */
.bg-gray-tint {
    background: var(--bgl-gray-tint) !important;
    --alpha-color: var(--bgl-gray-tint);
}

.color-gray-tint {
    color: var(--bgl-gray-tint) !important;
}

.bg-input-gray-tint input,
.bg-input-gray-tint textarea,
.bg-input-gray-tint .selectinput-btn {
    background: var(--bgl-gray-tint) !important;
}

.border-gray-tint {
    border-color: var(--bgl-gray-tint) !important;
}

.color-input-gray-tint input {
    color: var(--bgl-gray-tint) !important;
}

/* Additional System Colors */
.bg-bg {
    background: var(--bgl-bg) !important;
    --alpha-color: var(--bgl-bg);
}

.color-bg {
    color: var(--bgl-bg) !important;
}

.bg-input-bg input,
.bg-input-bg textarea,
.bg-input-bg .selectinput-btn {
    background: var(--bgl-bg) !important;
}

.border-bg {
    border-color: var(--bgl-bg) !important;
}

.color-input-bg input {
    color: var(--bgl-bg) !important;
}

.bg-popup {
    background: var(--bgl-popup-bg) !important;
    --alpha-color: var(--bgl-popup-bg);
}

.color-popup {
    color: var(--bgl-popup-bg) !important;
}

.bg-input-popup input,
.bg-input-popup textarea,
.bg-input-popup .selectinput-btn {
    background: var(--bgl-popup-bg) !important;
}

.border-popup {
    border-color: var(--bgl-popup-bg) !important;
}

.color-input-popup input {
    color: var(--bgl-popup-bg) !important;
}

/* Transparent and Special Colors */
.bg-transparent {
    background: transparent !important;
    --alpha-color: transparent;
}

.color-transparent {
    color: transparent !important;
}

.bg-inherit {
    background: inherit !important;
    --alpha-color: inherit;
}

.color-inherit {
    color: inherit !important;
}

.bg-input-transparent input,
.bg-input-transparent textarea,
.bg-input-transparent .selectinput-btn {
    background: transparent !important;
}

.border-transparent {
    border-color: transparent !important;
}

.color-input-transparent input {
    color: transparent !important;
}

/* Color Variations - 10% */
.bg-blue-10 {
    background: var(--bgl-blue-10) !important;
    --alpha-color: var(--bgl-blue-10);
}

.color-blue-10 {
    color: var(--bgl-blue-10) !important;
}

.bg-input-blue-10 input,
.bg-input-blue-10 textarea,
.bg-input-blue-10 .selectinput-btn {
    background: var(--bgl-blue-10) !important;
    --alpha-color: var(--bgl-blue-10);
}

.border-blue-10 {
    border-color: var(--bgl-blue-10) !important;
}

.color-input-blue-10 input {
    color: var(--bgl-blue-10) !important;
}

.bg-green-10 {
    background: var(--bgl-green-10) !important;
    --alpha-color: var(--bgl-green-10);
}

.color-green-10 {
    color: var(--bgl-green-10) !important;
}

.bg-input-green-10 input,
.bg-input-green-10 textarea,
.bg-input-green-10 .selectinput-btn {
    background: var(--bgl-green-10) !important;
    --alpha-color: var(--bgl-green-10);
}

.border-green-10 {
    border-color: var(--bgl-green-10) !important;
}

.color-input-green-10 input {
    color: var(--bgl-green-10) !important;
}

.bg-red-10 {
    background: var(--bgl-red-10) !important;
    --alpha-color: var(--bgl-red-10);
}

.color-red-10 {
    color: var(--bgl-red-10) !important;
}

.bg-input-red-10 input,
.bg-input-red-10 textarea,
.bg-input-red-10 .selectinput-btn {
    background: var(--bgl-red-10) !important;
    --alpha-color: var(--bgl-red-10);
}

.border-red-10 {
    border-color: var(--bgl-red-10) !important;
}

.color-input-red-10 input {
    color: var(--bgl-red-10) !important;
}

.bg-yellow-10 {
    background: var(--bgl-yellow-10) !important;
    --alpha-color: var(--bgl-yellow-10);
}

.color-yellow-10 {
    color: var(--bgl-yellow-10) !important;
}

.bg-input-yellow-10 input,
.bg-input-yellow-10 textarea,
.bg-input-yellow-10 .selectinput-btn {
    background: var(--bgl-yellow-10) !important;
    --alpha-color: var(--bgl-yellow-10);
}

.border-yellow-10 {
    border-color: var(--bgl-yellow-10) !important;
}

.color-input-yellow-10 input {
    color: var(--bgl-yellow-10) !important;
}

.bg-purple-10 {
    background: var(--bgl-purple-10) !important;
    --alpha-color: var(--bgl-purple-10);
}

.color-purple-10 {
    color: var(--bgl-purple-10) !important;
}

.bg-input-purple-10 input,
.bg-input-purple-10 textarea,
.bg-input-purple-10 .selectinput-btn {
    background: var(--bgl-purple-10) !important;
    --alpha-color: var(--bgl-purple-10);
}

.border-purple-10 {
    border-color: var(--bgl-purple-10) !important;
}

.color-input-purple-10 input {
    color: var(--bgl-purple-10) !important;
}

.bg-brown-10 {
    background: var(--bgl-brown-10) !important;
    --alpha-color: var(--bgl-brown-10);
}

.color-brown-10 {
    color: var(--bgl-brown-10) !important;
}

.bg-input-brown-10 input,
.bg-input-brown-10 textarea,
.bg-input-brown-10 .selectinput-btn {
    background: var(--bgl-brown-10) !important;
    --alpha-color: var(--bgl-brown-10);
}

.border-brown-10 {
    border-color: var(--bgl-brown-10) !important;
}

.color-input-brown-10 input {
    color: var(--bgl-brown-10) !important;
}

.bg-orange-10 {
    background: var(--bgl-orange-10) !important;
    --alpha-color: var(--bgl-orange-10);
}

.color-orange-10 {
    color: var(--bgl-orange-10) !important;
}

.bg-input-orange-10 input,
.bg-input-orange-10 textarea,
.bg-input-orange-10 .selectinput-btn {
    background: var(--bgl-orange-10) !important;
    --alpha-color: var(--bgl-orange-10);
}

.border-orange-10 {
    border-color: var(--bgl-orange-10) !important;
}

.color-input-orange-10 input {
    color: var(--bgl-orange-10) !important;
}

.bg-turquoise-10 {
    background: var(--bgl-turquoise-10) !important;
    --alpha-color: var(--bgl-turquoise-10);
}

.color-turquoise-10 {
    color: var(--bgl-turquoise-10) !important;
}

.bg-input-turquoise-10 input,
.bg-input-turquoise-10 textarea,
.bg-input-turquoise-10 .selectinput-btn {
    background: var(--bgl-turquoise-10) !important;
    --alpha-color: var(--bgl-turquoise-10);
}

.border-turquoise-10 {
    border-color: var(--bgl-turquoise-10) !important;
}

.color-input-turquoise-10 input {
    color: var(--bgl-turquoise-10) !important;
}

.bg-gray-10 {
    background: var(--bgl-gray-10) !important;
    --alpha-color: var(--bgl-gray-10);
}

.color-gray-10 {
    color: var(--bgl-gray-10) !important;
}

.bg-input-gray-10 input,
.bg-input-gray-10 textarea,
.bg-input-gray-10 .selectinput-btn {
    background: var(--bgl-gray-10) !important;
    --alpha-color: var(--bgl-gray-10);
}

.border-gray-10 {
    border-color: var(--bgl-gray-10) !important;
}

.color-input-gray-10 input {
    color: var(--bgl-gray-10) !important;
}

.bg-black-10 {
    background: var(--bgl-black-10) !important;
    --alpha-color: var(--bgl-black-10);
}

.color-black-10 {
    color: var(--bgl-black-10) !important;
}

.bg-input-black-10 input,
.bg-input-black-10 textarea,
.bg-input-black-10 .selectinput-btn {
    background: var(--bgl-black-10) !important;
    --alpha-color: var(--bgl-black-10);
}

.border-black-10 {
    border-color: var(--bgl-black-10) !important;
}

.color-input-black-10 input {
    color: var(--bgl-black-10) !important;
}

.bg-pink-10 {
    background: var(--bgl-pink-10) !important;
    --alpha-color: var(--bgl-pink-10);
}

.color-pink-10 {
    color: var(--bgl-pink-10) !important;
}

.bg-input-pink-10 input,
.bg-input-pink-10 textarea,
.bg-input-pink-10 .selectinput-btn {
    background: var(--bgl-pink-10) !important;
    --alpha-color: var(--bgl-pink-10);
}

.border-pink-10 {
    border-color: var(--bgl-pink-10) !important;
}

.color-input-pink-10 input {
    color: var(--bgl-pink-10) !important;
}

/* Color Variations - 20% */
.bg-blue-20 {
    background: var(--bgl-blue-20) !important;
    --alpha-color: var(--bgl-blue-20);
}

.color-blue-20 {
    color: var(--bgl-blue-20) !important;
}

.bg-input-blue-20 input,
.bg-input-blue-20 textarea,
.bg-input-blue-20 .selectinput-btn {
    background: var(--bgl-blue-20) !important;
    --alpha-color: var(--bgl-blue-20);
}

.border-blue-20 {
    border-color: var(--bgl-blue-20) !important;
}

.color-input-blue-20 input {
    color: var(--bgl-blue-20) !important;
}

.bg-green-20 {
    background: var(--bgl-green-20) !important;
    --alpha-color: var(--bgl-green-20);
}

.color-green-20 {
    color: var(--bgl-green-20) !important;
}

.bg-input-green-20 input,
.bg-input-green-20 textarea,
.bg-input-green-20 .selectinput-btn {
    background: var(--bgl-green-20) !important;
    --alpha-color: var(--bgl-green-20);
}

.border-green-20 {
    border-color: var(--bgl-green-20) !important;
}

.color-input-green-20 input {
    color: var(--bgl-green-20) !important;
}

.bg-red-20 {
    background: var(--bgl-red-20) !important;
    --alpha-color: var(--bgl-red-20);
}

.color-red-20 {
    color: var(--bgl-red-20) !important;
}

.bg-input-red-20 input,
.bg-input-red-20 textarea,
.bg-input-red-20 .selectinput-btn {
    background: var(--bgl-red-20) !important;
    --alpha-color: var(--bgl-red-20);
}

.border-red-20 {
    border-color: var(--bgl-red-20) !important;
}

.color-input-red-20 input {
    color: var(--bgl-red-20) !important;
}

.bg-yellow-20 {
    background: var(--bgl-yellow-20) !important;
    --alpha-color: var(--bgl-yellow-20);
}

.color-yellow-20 {
    color: var(--bgl-yellow-20) !important;
}

.bg-input-yellow-20 input,
.bg-input-yellow-20 textarea,
.bg-input-yellow-20 .selectinput-btn {
    background: var(--bgl-yellow-20) !important;
    --alpha-color: var(--bgl-yellow-20);
}

.border-yellow-20 {
    border-color: var(--bgl-yellow-20) !important;
}

.color-input-yellow-20 input {
    color: var(--bgl-yellow-20) !important;
}

.bg-purple-20 {
    background: var(--bgl-purple-20) !important;
    --alpha-color: var(--bgl-purple-20);
}

.color-purple-20 {
    color: var(--bgl-purple-20) !important;
}

.bg-input-purple-20 input,
.bg-input-purple-20 textarea,
.bg-input-purple-20 .selectinput-btn {
    background: var(--bgl-purple-20) !important;
    --alpha-color: var(--bgl-purple-20);
}

.border-purple-20 {
    border-color: var(--bgl-purple-20) !important;
}

.color-input-purple-20 input {
    color: var(--bgl-purple-20) !important;
}

.bg-brown-20 {
    background: var(--bgl-brown-20) !important;
    --alpha-color: var(--bgl-brown-20);
}

.color-brown-20 {
    color: var(--bgl-brown-20) !important;
}

.bg-input-brown-20 input,
.bg-input-brown-20 textarea,
.bg-input-brown-20 .selectinput-btn {
    background: var(--bgl-brown-20) !important;
    --alpha-color: var(--bgl-brown-20);
}

.border-brown-20 {
    border-color: var(--bgl-brown-20) !important;
}

.color-input-brown-20 input {
    color: var(--bgl-brown-20) !important;
}

.bg-orange-20 {
    background: var(--bgl-orange-20) !important;
    --alpha-color: var(--bgl-orange-20);
}

.color-orange-20 {
    color: var(--bgl-orange-20) !important;
}

.bg-input-orange-20 input,
.bg-input-orange-20 textarea,
.bg-input-orange-20 .selectinput-btn {
    background: var(--bgl-orange-20) !important;
    --alpha-color: var(--bgl-orange-20);
}

.border-orange-20 {
    border-color: var(--bgl-orange-20) !important;
}

.color-input-orange-20 input {
    color: var(--bgl-orange-20) !important;
}

.bg-turquoise-20 {
    background: var(--bgl-turquoise-20) !important;
    --alpha-color: var(--bgl-turquoise-20);
}

.color-turquoise-20 {
    color: var(--bgl-turquoise-20) !important;
}

.bg-input-turquoise-20 input,
.bg-input-turquoise-20 textarea,
.bg-input-turquoise-20 .selectinput-btn {
    background: var(--bgl-turquoise-20) !important;
    --alpha-color: var(--bgl-turquoise-20);
}

.border-turquoise-20 {
    border-color: var(--bgl-turquoise-20) !important;
}

.color-input-turquoise-20 input {
    color: var(--bgl-turquoise-20) !important;
}

.bg-gray-20 {
    background: var(--bgl-gray-20) !important;
    --alpha-color: var(--bgl-gray-20);
}

.color-gray-20 {
    color: var(--bgl-gray-20) !important;
}

.bg-input-gray-20 input,
.bg-input-gray-20 textarea,
.bg-input-gray-20 .selectinput-btn {
    background: var(--bgl-gray-20) !important;
    --alpha-color: var(--bgl-gray-20);
}

.border-gray-20 {
    border-color: var(--bgl-gray-20) !important;
}

.color-input-gray-20 input {
    color: var(--bgl-gray-20) !important;
}

.bg-black-20 {
    background: var(--bgl-black-20) !important;
    --alpha-color: var(--bgl-black-20);
}

.color-black-20 {
    color: var(--bgl-black-20) !important;
}

.bg-input-black-20 input,
.bg-input-black-20 textarea,
.bg-input-black-20 .selectinput-btn {
    background: var(--bgl-black-20) !important;
    --alpha-color: var(--bgl-black-20);
}

.border-black-20 {
    border-color: var(--bgl-black-20) !important;
}

.color-input-black-20 input {
    color: var(--bgl-black-20) !important;
}

.bg-pink-20 {
    background: var(--bgl-pink-20) !important;
    --alpha-color: var(--bgl-pink-20);
}

.color-pink-20 {
    color: var(--bgl-pink-20) !important;
}

.bg-input-pink-20 input,
.bg-input-pink-20 textarea,
.bg-input-pink-20 .selectinput-btn {
    background: var(--bgl-pink-20) !important;
    --alpha-color: var(--bgl-pink-20);
}

.border-pink-20 {
    border-color: var(--bgl-pink-20) !important;
}

.color-input-pink-20 input {
    color: var(--bgl-pink-20) !important;
}

/* Color Variations - 30% */
.bg-blue-30 {
    background: var(--bgl-blue-30) !important;
    --alpha-color: var(--bgl-blue-30);
}

.color-blue-30 {
    color: var(--bgl-blue-30) !important;
}

.bg-input-blue-30 input,
.bg-input-blue-30 textarea,
.bg-input-blue-30 .selectinput-btn {
    background: var(--bgl-blue-30) !important;
    --alpha-color: var(--bgl-blue-30);
}

.border-blue-30 {
    border-color: var(--bgl-blue-30) !important;
}

.color-input-blue-30 input {
    color: var(--bgl-blue-30) !important;
}

.bg-green-30 {
    background: var(--bgl-green-30) !important;
    --alpha-color: var(--bgl-green-30);
}

.color-green-30 {
    color: var(--bgl-green-30) !important;
}

.bg-input-green-30 input,
.bg-input-green-30 textarea,
.bg-input-green-30 .selectinput-btn {
    background: var(--bgl-green-30) !important;
    --alpha-color: var(--bgl-green-30);
}

.border-green-30 {
    border-color: var(--bgl-green-30) !important;
}

.color-input-green-30 input {
    color: var(--bgl-green-30) !important;
}

.bg-red-30 {
    background: var(--bgl-red-30) !important;
    --alpha-color: var(--bgl-red-30);
}

.color-red-30 {
    color: var(--bgl-red-30) !important;
}

.bg-input-red-30 input,
.bg-input-red-30 textarea,
.bg-input-red-30 .selectinput-btn {
    background: var(--bgl-red-30) !important;
    --alpha-color: var(--bgl-red-30);
}

.border-red-30 {
    border-color: var(--bgl-red-30) !important;
}

.color-input-red-30 input {
    color: var(--bgl-red-30) !important;
}

.bg-yellow-30 {
    background: var(--bgl-yellow-30) !important;
    --alpha-color: var(--bgl-yellow-30);
}

.color-yellow-30 {
    color: var(--bgl-yellow-30) !important;
}

.bg-input-yellow-30 input,
.bg-input-yellow-30 textarea,
.bg-input-yellow-30 .selectinput-btn {
    background: var(--bgl-yellow-30) !important;
    --alpha-color: var(--bgl-yellow-30);
}

.border-yellow-30 {
    border-color: var(--bgl-yellow-30) !important;
}

.color-input-yellow-30 input {
    color: var(--bgl-yellow-30) !important;
}

.bg-purple-30 {
    background: var(--bgl-purple-30) !important;
    --alpha-color: var(--bgl-purple-30);
}

.color-purple-30 {
    color: var(--bgl-purple-30) !important;
}

.bg-input-purple-30 input,
.bg-input-purple-30 textarea,
.bg-input-purple-30 .selectinput-btn {
    background: var(--bgl-purple-30) !important;
    --alpha-color: var(--bgl-purple-30);
}

.border-purple-30 {
    border-color: var(--bgl-purple-30) !important;
}

.color-input-purple-30 input {
    color: var(--bgl-purple-30) !important;
}

.bg-brown-30 {
    background: var(--bgl-brown-30) !important;
    --alpha-color: var(--bgl-brown-30);
}

.color-brown-30 {
    color: var(--bgl-brown-30) !important;
}

.bg-input-brown-30 input,
.bg-input-brown-30 textarea,
.bg-input-brown-30 .selectinput-btn {
    background: var(--bgl-brown-30) !important;
    --alpha-color: var(--bgl-brown-30);
}

.border-brown-30 {
    border-color: var(--bgl-brown-30) !important;
}

.color-input-brown-30 input {
    color: var(--bgl-brown-30) !important;
}

.bg-orange-30 {
    background: var(--bgl-orange-30) !important;
    --alpha-color: var(--bgl-orange-30);
}

.color-orange-30 {
    color: var(--bgl-orange-30) !important;
}

.bg-input-orange-30 input,
.bg-input-orange-30 textarea,
.bg-input-orange-30 .selectinput-btn {
    background: var(--bgl-orange-30) !important;
    --alpha-color: var(--bgl-orange-30);
}

.border-orange-30 {
    border-color: var(--bgl-orange-30) !important;
}

.color-input-orange-30 input {
    color: var(--bgl-orange-30) !important;
}

.bg-turquoise-30 {
    background: var(--bgl-turquoise-30) !important;
    --alpha-color: var(--bgl-turquoise-30);
}

.color-turquoise-30 {
    color: var(--bgl-turquoise-30) !important;
}

.bg-input-turquoise-30 input,
.bg-input-turquoise-30 textarea,
.bg-input-turquoise-30 .selectinput-btn {
    background: var(--bgl-turquoise-30) !important;
    --alpha-color: var(--bgl-turquoise-30);
}

.border-turquoise-30 {
    border-color: var(--bgl-turquoise-30) !important;
}

.color-input-turquoise-30 input {
    color: var(--bgl-turquoise-30) !important;
}

.bg-gray-30 {
    background: var(--bgl-gray-30) !important;
    --alpha-color: var(--bgl-gray-30);
}

.color-gray-30 {
    color: var(--bgl-gray-30) !important;
}

.bg-input-gray-30 input,
.bg-input-gray-30 textarea,
.bg-input-gray-30 .selectinput-btn {
    background: var(--bgl-gray-30) !important;
    --alpha-color: var(--bgl-gray-30);
}

.border-gray-30 {
    border-color: var(--bgl-gray-30) !important;
}

.color-input-gray-30 input {
    color: var(--bgl-gray-30) !important;
}

.bg-black-30 {
    background: var(--bgl-black-30) !important;
    --alpha-color: var(--bgl-black-30);
}

.color-black-30 {
    color: var(--bgl-black-30) !important;
}

.bg-input-black-30 input,
.bg-input-black-30 textarea,
.bg-input-black-30 .selectinput-btn {
    background: var(--bgl-black-30) !important;
    --alpha-color: var(--bgl-black-30);
}

.border-black-30 {
    border-color: var(--bgl-black-30) !important;
}

.color-input-black-30 input {
    color: var(--bgl-black-30) !important;
}

.bg-pink-30 {
    background: var(--bgl-pink-30) !important;
    --alpha-color: var(--bgl-pink-30);
}

.color-pink-30 {
    color: var(--bgl-pink-30) !important;
}

.bg-input-pink-30 input,
.bg-input-pink-30 textarea,
.bg-input-pink-30 .selectinput-btn {
    background: var(--bgl-pink-30) !important;
    --alpha-color: var(--bgl-pink-30);
}

.border-pink-30 {
    border-color: var(--bgl-pink-30) !important;
}

.color-input-pink-30 input {
    color: var(--bgl-pink-30) !important;
}

/* Color Variations - 40% & 50% */
/* 40% */
.bg-blue-40 {
    background: var(--bgl-blue-40) !important;
    --alpha-color: var(--bgl-blue-40);
}

.color-blue-40 {
    color: var(--bgl-blue-40) !important;
}

.bg-input-blue-40 input,
.bg-input-blue-40 textarea,
.bg-input-blue-40 .selectinput-btn {
    background: var(--bgl-blue-40) !important;
    --alpha-color: var(--bgl-blue-40);
}

.border-blue-40 {
    border-color: var(--bgl-blue-40) !important;
}

.color-input-blue-40 input {
    color: var(--bgl-blue-40) !important;
}

.bg-green-40 {
    background: var(--bgl-green-40) !important;
    --alpha-color: var(--bgl-green-40);
}

.color-green-40 {
    color: var(--bgl-green-40) !important;
}

.bg-input-green-40 input,
.bg-input-green-40 textarea,
.bg-input-green-40 .selectinput-btn {
    background: var(--bgl-green-40) !important;
    --alpha-color: var(--bgl-green-40);
}

.border-green-40 {
    border-color: var(--bgl-green-40) !important;
}

.color-input-green-40 input {
    color: var(--bgl-green-40) !important;
}

.bg-red-40 {
    background: var(--bgl-red-40) !important;
    --alpha-color: var(--bgl-red-40);
}

.color-red-40 {
    color: var(--bgl-red-40) !important;
}

.bg-input-red-40 input,
.bg-input-red-40 textarea,
.bg-input-red-40 .selectinput-btn {
    background: var(--bgl-red-40) !important;
    --alpha-color: var(--bgl-red-40);
}

.border-red-40 {
    border-color: var(--bgl-red-40) !important;
}

.color-input-red-40 input {
    color: var(--bgl-red-40) !important;
}

.bg-yellow-40 {
    background: var(--bgl-yellow-40) !important;
    --alpha-color: var(--bgl-yellow-40);
}

.color-yellow-40 {
    color: var(--bgl-yellow-40) !important;
}

.bg-input-yellow-40 input,
.bg-input-yellow-40 textarea,
.bg-input-yellow-40 .selectinput-btn {
    background: var(--bgl-yellow-40) !important;
    --alpha-color: var(--bgl-yellow-40);
}

.border-yellow-40 {
    border-color: var(--bgl-yellow-40) !important;
}

.color-input-yellow-40 input {
    color: var(--bgl-yellow-40) !important;
}

.bg-purple-40 {
    background: var(--bgl-purple-40) !important;
    --alpha-color: var(--bgl-purple-40);
}

.color-purple-40 {
    color: var(--bgl-purple-40) !important;
}

.bg-input-purple-40 input,
.bg-input-purple-40 textarea,
.bg-input-purple-40 .selectinput-btn {
    background: var(--bgl-purple-40) !important;
    --alpha-color: var(--bgl-purple-40);
}

.border-purple-40 {
    border-color: var(--bgl-purple-40) !important;
}

.color-input-purple-40 input {
    color: var(--bgl-purple-40) !important;
}

.bg-brown-40 {
    background: var(--bgl-brown-40) !important;
    --alpha-color: var(--bgl-brown-40);
}

.color-brown-40 {
    color: var(--bgl-brown-40) !important;
}

.bg-input-brown-40 input,
.bg-input-brown-40 textarea,
.bg-input-brown-40 .selectinput-btn {
    background: var(--bgl-brown-40) !important;
    --alpha-color: var(--bgl-brown-40);
}

.border-brown-40 {
    border-color: var(--bgl-brown-40) !important;
}

.color-input-brown-40 input {
    color: var(--bgl-brown-40) !important;
}

.bg-orange-40 {
    background: var(--bgl-orange-40) !important;
    --alpha-color: var(--bgl-orange-40);
}

.color-orange-40 {
    color: var(--bgl-orange-40) !important;
}

.bg-input-orange-40 input,
.bg-input-orange-40 textarea,
.bg-input-orange-40 .selectinput-btn {
    background: var(--bgl-orange-40) !important;
    --alpha-color: var(--bgl-orange-40);
}

.border-orange-40 {
    border-color: var(--bgl-orange-40) !important;
}

.color-input-orange-40 input {
    color: var(--bgl-orange-40) !important;
}

.bg-turquoise-40 {
    background: var(--bgl-turquoise-40) !important;
    --alpha-color: var(--bgl-turquoise-40);
}

.color-turquoise-40 {
    color: var(--bgl-turquoise-40) !important;
}

.bg-input-turquoise-40 input,
.bg-input-turquoise-40 textarea,
.bg-input-turquoise-40 .selectinput-btn {
    background: var(--bgl-turquoise-40) !important;
    --alpha-color: var(--bgl-turquoise-40);
}

.border-turquoise-40 {
    border-color: var(--bgl-turquoise-40) !important;
}

.color-input-turquoise-40 input {
    color: var(--bgl-turquoise-40) !important;
}

.bg-gray-40 {
    background: var(--bgl-gray-40) !important;
    --alpha-color: var(--bgl-gray-40);
}

.color-gray-40 {
    color: var(--bgl-gray-40) !important;
}

.bg-input-gray-40 input,
.bg-input-gray-40 textarea,
.bg-input-gray-40 .selectinput-btn {
    background: var(--bgl-gray-40) !important;
    --alpha-color: var(--bgl-gray-40);
}

.border-gray-40 {
    border-color: var(--bgl-gray-40) !important;
}

.color-input-gray-40 input {
    color: var(--bgl-gray-40) !important;
}

.bg-black-40 {
    background: var(--bgl-black-40) !important;
    --alpha-color: var(--bgl-black-40);
}

.color-black-40 {
    color: var(--bgl-black-40) !important;
}

.bg-input-black-40 input,
.bg-input-black-40 textarea,
.bg-input-black-40 .selectinput-btn {
    background: var(--bgl-black-40) !important;
    --alpha-color: var(--bgl-black-40);
}

.border-black-40 {
    border-color: var(--bgl-black-40) !important;
}

.color-input-black-40 input {
    color: var(--bgl-black-40) !important;
}

.bg-pink-40 {
    background: var(--bgl-pink-40) !important;
    --alpha-color: var(--bgl-pink-40);
}

.color-pink-40 {
    color: var(--bgl-pink-40) !important;
}

.bg-input-pink-40 input,
.bg-input-pink-40 textarea,
.bg-input-pink-40 .selectinput-btn {
    background: var(--bgl-pink-40) !important;
    --alpha-color: var(--bgl-pink-40);
}

.border-pink-40 {
    border-color: var(--bgl-pink-40) !important;
}

.color-input-pink-40 input {
    color: var(--bgl-pink-40) !important;
}

/* Color Variations - 50% */
.bg-blue-50 {
    background: var(--bgl-blue-50) !important;
    --alpha-color: var(--bgl-blue-50);
}

.color-blue-50 {
    color: var(--bgl-blue-50) !important;
}

.bg-input-blue-50 input,
.bg-input-blue-50 textarea,
.bg-input-blue-50 .selectinput-btn {
    background: var(--bgl-blue-50) !important;
    --alpha-color: var(--bgl-blue-50);
}

.border-blue-50 {
    border-color: var(--bgl-blue-50) !important;
}

.color-input-blue-50 input {
    color: var(--bgl-blue-50) !important;
}

.bg-green-50 {
    background: var(--bgl-green-50) !important;
    --alpha-color: var(--bgl-green-50);
}

.color-green-50 {
    color: var(--bgl-green-50) !important;
}

.bg-input-green-50 input,
.bg-input-green-50 textarea,
.bg-input-green-50 .selectinput-btn {
    background: var(--bgl-green-50) !important;
    --alpha-color: var(--bgl-green-50);
}

.border-green-50 {
    border-color: var(--bgl-green-50) !important;
}

.color-input-green-50 input {
    color: var(--bgl-green-50) !important;
}

.bg-red-50 {
    background: var(--bgl-red-50) !important;
    --alpha-color: var(--bgl-red-50);
}

.color-red-50 {
    color: var(--bgl-red-50) !important;
}

.bg-input-red-50 input,
.bg-input-red-50 textarea,
.bg-input-red-50 .selectinput-btn {
    background: var(--bgl-red-50) !important;
    --alpha-color: var(--bgl-red-50);
}

.border-red-50 {
    border-color: var(--bgl-red-50) !important;
}

.color-input-red-50 input {
    color: var(--bgl-red-50) !important;
}

.bg-yellow-50 {
    background: var(--bgl-yellow-50) !important;
    --alpha-color: var(--bgl-yellow-50);
}

.color-yellow-50 {
    color: var(--bgl-yellow-50) !important;
}

.bg-input-yellow-50 input,
.bg-input-yellow-50 textarea,
.bg-input-yellow-50 .selectinput-btn {
    background: var(--bgl-yellow-50) !important;
    --alpha-color: var(--bgl-yellow-50);
}

.border-yellow-50 {
    border-color: var(--bgl-yellow-50) !important;
}

.color-input-yellow-50 input {
    color: var(--bgl-yellow-50) !important;
}

.bg-purple-50 {
    background: var(--bgl-purple-50) !important;
    --alpha-color: var(--bgl-purple-50);
}

.color-purple-50 {
    color: var(--bgl-purple-50) !important;
}

.bg-input-purple-50 input,
.bg-input-purple-50 textarea,
.bg-input-purple-50 .selectinput-btn {
    background: var(--bgl-purple-50) !important;
    --alpha-color: var(--bgl-purple-50);
}

.border-purple-50 {
    border-color: var(--bgl-purple-50) !important;
}

.color-input-purple-50 input {
    color: var(--bgl-purple-50) !important;
}

.bg-brown-50 {
    background: var(--bgl-brown-50) !important;
    --alpha-color: var(--bgl-brown-50);
}

.color-brown-50 {
    color: var(--bgl-brown-50) !important;
}

.bg-input-brown-50 input,
.bg-input-brown-50 textarea,
.bg-input-brown-50 .selectinput-btn {
    background: var(--bgl-brown-50) !important;
    --alpha-color: var(--bgl-brown-50);
}

.border-brown-50 {
    border-color: var(--bgl-brown-50) !important;
}

.color-input-brown-50 input {
    color: var(--bgl-brown-50) !important;
}

.bg-orange-50 {
    background: var(--bgl-orange-50) !important;
    --alpha-color: var(--bgl-orange-50);
}

.color-orange-50 {
    color: var(--bgl-orange-50) !important;
}

.bg-input-orange-50 input,
.bg-input-orange-50 textarea,
.bg-input-orange-50 .selectinput-btn {
    background: var(--bgl-orange-50) !important;
    --alpha-color: var(--bgl-orange-50);
}

.border-orange-50 {
    border-color: var(--bgl-orange-50) !important;
}

.color-input-orange-50 input {
    color: var(--bgl-orange-50) !important;
}

.bg-turquoise-50 {
    background: var(--bgl-turquoise-50) !important;
    --alpha-color: var(--bgl-turquoise-50);
}

.color-turquoise-50 {
    color: var(--bgl-turquoise-50) !important;
}

.bg-input-turquoise-50 input,
.bg-input-turquoise-50 textarea,
.bg-input-turquoise-50 .selectinput-btn {
    background: var(--bgl-turquoise-50) !important;
    --alpha-color: var(--bgl-turquoise-50);
}

.border-turquoise-50 {
    border-color: var(--bgl-turquoise-50) !important;
}

.color-input-turquoise-50 input {
    color: var(--bgl-turquoise-50) !important;
}

.bg-gray-50 {
    background: var(--bgl-gray-50) !important;
    --alpha-color: var(--bgl-gray-50);
}

.color-gray-50 {
    color: var(--bgl-gray-50) !important;
}

.bg-input-gray-50 input,
.bg-input-gray-50 textarea,
.bg-input-gray-50 .selectinput-btn {
    background: var(--bgl-gray-50) !important;
    --alpha-color: var(--bgl-gray-50);
}

.border-gray-50 {
    border-color: var(--bgl-gray-50) !important;
}

.color-input-gray-50 input {
    color: var(--bgl-gray-50) !important;
}

.bg-black-50 {
    background: var(--bgl-black-50) !important;
    --alpha-color: var(--bgl-black-50);
}

.color-black-50 {
    color: var(--bgl-black-50) !important;
}

.bg-input-black-50 input,
.bg-input-black-50 textarea,
.bg-input-black-50 .selectinput-btn {
    background: var(--bgl-black-50) !important;
    --alpha-color: var(--bgl-black-50);
}

.border-black-50 {
    border-color: var(--bgl-black-50) !important;
}

.color-input-black-50 input {
    color: var(--bgl-black-50) !important;
}

.bg-pink-50 {
    background: var(--bgl-pink-50) !important;
    --alpha-color: var(--bgl-pink-50);
}

.color-pink-50 {
    color: var(--bgl-pink-50) !important;
}

.bg-input-pink-50 input,
.bg-input-pink-50 textarea,
.bg-input-pink-50 .selectinput-btn {
    background: var(--bgl-pink-50) !important;
    --alpha-color: var(--bgl-pink-50);
}

.border-pink-50 {
    border-color: var(--bgl-pink-50) !important;
}

.color-input-pink-50 input {
    color: var(--bgl-pink-50) !important;
}

/* Color Variations - 60%, 70%, 80%, 90% */
/* 60% */
.bg-blue-60 {
    background: var(--bgl-blue-60) !important;
    --alpha-color: var(--bgl-blue-60);
}

.color-blue-60 {
    color: var(--bgl-blue-60) !important;
}

.bg-input-blue-60 input,
.bg-input-blue-60 textarea,
.bg-input-blue-60 .selectinput-btn {
    background: var(--bgl-blue-60) !important;
    --alpha-color: var(--bgl-blue-60);
}

.border-blue-60 {
    border-color: var(--bgl-blue-60) !important;
}

.color-input-blue-60 input {
    color: var(--bgl-blue-60) !important;
}

.bg-green-60 {
    background: var(--bgl-green-60) !important;
    --alpha-color: var(--bgl-green-60);
}

.color-green-60 {
    color: var(--bgl-green-60) !important;
}

.bg-input-green-60 input,
.bg-input-green-60 textarea,
.bg-input-green-60 .selectinput-btn {
    background: var(--bgl-green-60) !important;
    --alpha-color: var(--bgl-green-60);
}

.border-green-60 {
    border-color: var(--bgl-green-60) !important;
}

.color-input-green-60 input {
    color: var(--bgl-green-60) !important;
}

.bg-red-60 {
    background: var(--bgl-red-60) !important;
    --alpha-color: var(--bgl-red-60);
}

.color-red-60 {
    color: var(--bgl-red-60) !important;
}

.bg-input-red-60 input,
.bg-input-red-60 textarea,
.bg-input-red-60 .selectinput-btn {
    background: var(--bgl-red-60) !important;
    --alpha-color: var(--bgl-red-60);
}

.border-red-60 {
    border-color: var(--bgl-red-60) !important;
}

.color-input-red-60 input {
    color: var(--bgl-red-60) !important;
}

.bg-yellow-60 {
    background: var(--bgl-yellow-60) !important;
    --alpha-color: var(--bgl-yellow-60);
}

.color-yellow-60 {
    color: var(--bgl-yellow-60) !important;
}

.bg-input-yellow-60 input,
.bg-input-yellow-60 textarea,
.bg-input-yellow-60 .selectinput-btn {
    background: var(--bgl-yellow-60) !important;
    --alpha-color: var(--bgl-yellow-60);
}

.border-yellow-60 {
    border-color: var(--bgl-yellow-60) !important;
}

.color-input-yellow-60 input {
    color: var(--bgl-yellow-60) !important;
}

.bg-purple-60 {
    background: var(--bgl-purple-60) !important;
    --alpha-color: var(--bgl-purple-60);
}

.color-purple-60 {
    color: var(--bgl-purple-60) !important;
}

.bg-input-purple-60 input,
.bg-input-purple-60 textarea,
.bg-input-purple-60 .selectinput-btn {
    background: var(--bgl-purple-60) !important;
    --alpha-color: var(--bgl-purple-60);
}

.border-purple-60 {
    border-color: var(--bgl-purple-60) !important;
}

.color-input-purple-60 input {
    color: var(--bgl-purple-60) !important;
}

.bg-brown-60 {
    background: var(--bgl-brown-60) !important;
    --alpha-color: var(--bgl-brown-60);
}

.color-brown-60 {
    color: var(--bgl-brown-60) !important;
}

.bg-input-brown-60 input,
.bg-input-brown-60 textarea,
.bg-input-brown-60 .selectinput-btn {
    background: var(--bgl-brown-60) !important;
    --alpha-color: var(--bgl-brown-60);
}

.border-brown-60 {
    border-color: var(--bgl-brown-60) !important;
}

.color-input-brown-60 input {
    color: var(--bgl-brown-60) !important;
}

.bg-orange-60 {
    background: var(--bgl-orange-60) !important;
    --alpha-color: var(--bgl-orange-60);
}

.color-orange-60 {
    color: var(--bgl-orange-60) !important;
}

.bg-input-orange-60 input,
.bg-input-orange-60 textarea,
.bg-input-orange-60 .selectinput-btn {
    background: var(--bgl-orange-60) !important;
    --alpha-color: var(--bgl-orange-60);
}

.border-orange-60 {
    border-color: var(--bgl-orange-60) !important;
}

.color-input-orange-60 input {
    color: var(--bgl-orange-60) !important;
}

.bg-turquoise-60 {
    background: var(--bgl-turquoise-60) !important;
    --alpha-color: var(--bgl-turquoise-60);
}

.color-turquoise-60 {
    color: var(--bgl-turquoise-60) !important;
}

.bg-input-turquoise-60 input,
.bg-input-turquoise-60 textarea,
.bg-input-turquoise-60 .selectinput-btn {
    background: var(--bgl-turquoise-60) !important;
    --alpha-color: var(--bgl-turquoise-60);
}

.border-turquoise-60 {
    border-color: var(--bgl-turquoise-60) !important;
}

.color-input-turquoise-60 input {
    color: var(--bgl-turquoise-60) !important;
}

.bg-gray-60 {
    background: var(--bgl-gray-60) !important;
    --alpha-color: var(--bgl-gray-60);
}

.color-gray-60 {
    color: var(--bgl-gray-60) !important;
}

.bg-input-gray-60 input,
.bg-input-gray-60 textarea,
.bg-input-gray-60 .selectinput-btn {
    background: var(--bgl-gray-60) !important;
    --alpha-color: var(--bgl-gray-60);
}

.border-gray-60 {
    border-color: var(--bgl-gray-60) !important;
}

.color-input-gray-60 input {
    color: var(--bgl-gray-60) !important;
}

.bg-black-60 {
    background: var(--bgl-black-60) !important;
    --alpha-color: var(--bgl-black-60);
}

.color-black-60 {
    color: var(--bgl-black-60) !important;
}

.bg-input-black-60 input,
.bg-input-black-60 textarea,
.bg-input-black-60 .selectinput-btn {
    background: var(--bgl-black-60) !important;
    --alpha-color: var(--bgl-black-60);
}

.border-black-60 {
    border-color: var(--bgl-black-60) !important;
}

.color-input-black-60 input {
    color: var(--bgl-black-60) !important;
}

.bg-pink-60 {
    background: var(--bgl-pink-60) !important;
    --alpha-color: var(--bgl-pink-60);
}

.color-pink-60 {
    color: var(--bgl-pink-60) !important;
}

.bg-input-pink-60 input,
.bg-input-pink-60 textarea,
.bg-input-pink-60 .selectinput-btn {
    background: var(--bgl-pink-60) !important;
    --alpha-color: var(--bgl-pink-60);
}

.border-pink-60 {
    border-color: var(--bgl-pink-60) !important;
}

.color-input-pink-60 input {
    color: var(--bgl-pink-60) !important;
}

/* 70% */
.bg-blue-70 {
    background: var(--bgl-blue-70) !important;
    --alpha-color: var(--bgl-blue-70);
}

.color-blue-70 {
    color: var(--bgl-blue-70) !important;
}

.bg-input-blue-70 input,
.bg-input-blue-70 textarea,
.bg-input-blue-70 .selectinput-btn {
    background: var(--bgl-blue-70) !important;
    --alpha-color: var(--bgl-blue-70);
}

.border-blue-70 {
    border-color: var(--bgl-blue-70) !important;
}

.color-input-blue-70 input {
    color: var(--bgl-blue-70) !important;
}

.bg-green-70 {
    background: var(--bgl-green-70) !important;
    --alpha-color: var(--bgl-green-70);
}

.color-green-70 {
    color: var(--bgl-green-70) !important;
}

.bg-input-green-70 input,
.bg-input-green-70 textarea,
.bg-input-green-70 .selectinput-btn {
    background: var(--bgl-green-70) !important;
    --alpha-color: var(--bgl-green-70);
}

.border-green-70 {
    border-color: var(--bgl-green-70) !important;
}

.color-input-green-70 input {
    color: var(--bgl-green-70) !important;
}

.bg-red-70 {
    background: var(--bgl-red-70) !important;
    --alpha-color: var(--bgl-red-70);
}

.color-red-70 {
    color: var(--bgl-red-70) !important;
}

.bg-input-red-70 input,
.bg-input-red-70 textarea,
.bg-input-red-70 .selectinput-btn {
    background: var(--bgl-red-70) !important;
    --alpha-color: var(--bgl-red-70);
}

.border-red-70 {
    border-color: var(--bgl-red-70) !important;
}

.color-input-red-70 input {
    color: var(--bgl-red-70) !important;
}

.bg-yellow-70 {
    background: var(--bgl-yellow-70) !important;
    --alpha-color: var(--bgl-yellow-70);
}

.color-yellow-70 {
    color: var(--bgl-yellow-70) !important;
}

.bg-input-yellow-70 input,
.bg-input-yellow-70 textarea,
.bg-input-yellow-70 .selectinput-btn {
    background: var(--bgl-yellow-70) !important;
    --alpha-color: var(--bgl-yellow-70);
}

.border-yellow-70 {
    border-color: var(--bgl-yellow-70) !important;
}

.color-input-yellow-70 input {
    color: var(--bgl-yellow-70) !important;
}

.bg-purple-70 {
    background: var(--bgl-purple-70) !important;
    --alpha-color: var(--bgl-purple-70);
}

.color-purple-70 {
    color: var(--bgl-purple-70) !important;
}

.bg-input-purple-70 input,
.bg-input-purple-70 textarea,
.bg-input-purple-70 .selectinput-btn {
    background: var(--bgl-purple-70) !important;
    --alpha-color: var(--bgl-purple-70);
}

.border-purple-70 {
    border-color: var(--bgl-purple-70) !important;
}

.color-input-purple-70 input {
    color: var(--bgl-purple-70) !important;
}

.bg-brown-70 {
    background: var(--bgl-brown-70) !important;
    --alpha-color: var(--bgl-brown-70);
}

.color-brown-70 {
    color: var(--bgl-brown-70) !important;
}

.bg-input-brown-70 input,
.bg-input-brown-70 textarea,
.bg-input-brown-70 .selectinput-btn {
    background: var(--bgl-brown-70) !important;
    --alpha-color: var(--bgl-brown-70);
}

.border-brown-70 {
    border-color: var(--bgl-brown-70) !important;
}

.color-input-brown-70 input {
    color: var(--bgl-brown-70) !important;
}

.bg-orange-70 {
    background: var(--bgl-orange-70) !important;
    --alpha-color: var(--bgl-orange-70);
}

.color-orange-70 {
    color: var(--bgl-orange-70) !important;
}

.bg-input-orange-70 input,
.bg-input-orange-70 textarea,
.bg-input-orange-70 .selectinput-btn {
    background: var(--bgl-orange-70) !important;
    --alpha-color: var(--bgl-orange-70);
}

.border-orange-70 {
    border-color: var(--bgl-orange-70) !important;
}

.color-input-orange-70 input {
    color: var(--bgl-orange-70) !important;
}

.bg-turquoise-70 {
    background: var(--bgl-turquoise-70) !important;
    --alpha-color: var(--bgl-turquoise-70);
}

.color-turquoise-70 {
    color: var(--bgl-turquoise-70) !important;
}

.bg-input-turquoise-70 input,
.bg-input-turquoise-70 textarea,
.bg-input-turquoise-70 .selectinput-btn {
    background: var(--bgl-turquoise-70) !important;
    --alpha-color: var(--bgl-turquoise-70);
}

.border-turquoise-70 {
    border-color: var(--bgl-turquoise-70) !important;
}

.color-input-turquoise-70 input {
    color: var(--bgl-turquoise-70) !important;
}

.bg-gray-70 {
    background: var(--bgl-gray-70) !important;
    --alpha-color: var(--bgl-gray-70);
}

.color-gray-70 {
    color: var(--bgl-gray-70) !important;
}

.bg-input-gray-70 input,
.bg-input-gray-70 textarea,
.bg-input-gray-70 .selectinput-btn {
    background: var(--bgl-gray-70) !important;
    --alpha-color: var(--bgl-gray-70);
}

.border-gray-70 {
    border-color: var(--bgl-gray-70) !important;
}

.color-input-gray-70 input {
    color: var(--bgl-gray-70) !important;
}

.bg-black-70 {
    background: var(--bgl-black-70) !important;
    --alpha-color: var(--bgl-black-70);
}

.color-black-70 {
    color: var(--bgl-black-70) !important;
}

.bg-input-black-70 input,
.bg-input-black-70 textarea,
.bg-input-black-70 .selectinput-btn {
    background: var(--bgl-black-70) !important;
    --alpha-color: var(--bgl-black-70);
}

.border-black-70 {
    border-color: var(--bgl-black-70) !important;
}

.color-input-black-70 input {
    color: var(--bgl-black-70) !important;
}

.bg-pink-70 {
    background: var(--bgl-pink-70) !important;
    --alpha-color: var(--bgl-pink-70);
}

.color-pink-70 {
    color: var(--bgl-pink-70) !important;
}

.bg-input-pink-70 input,
.bg-input-pink-70 textarea,
.bg-input-pink-70 .selectinput-btn {
    background: var(--bgl-pink-70) !important;
    --alpha-color: var(--bgl-pink-70);
}

.border-pink-70 {
    border-color: var(--bgl-pink-70) !important;
}

.color-input-pink-70 input {
    color: var(--bgl-pink-70) !important;
}

/* Color Variations - 80% */
.bg-blue-80 {
    background: var(--bgl-blue-80) !important;
    --alpha-color: var(--bgl-blue-80);
}

.color-blue-80 {
    color: var(--bgl-blue-80) !important;
}

.bg-input-blue-80 input,
.bg-input-blue-80 textarea,
.bg-input-blue-80 .selectinput-btn {
    background: var(--bgl-blue-80) !important;
    --alpha-color: var(--bgl-blue-80);
}

.border-blue-80 {
    border-color: var(--bgl-blue-80) !important;
}

.color-input-blue-80 input {
    color: var(--bgl-blue-80) !important;
}

.bg-green-80 {
    background: var(--bgl-green-80) !important;
    --alpha-color: var(--bgl-green-80);
}

.color-green-80 {
    color: var(--bgl-green-80) !important;
}

.bg-input-green-80 input,
.bg-input-green-80 textarea,
.bg-input-green-80 .selectinput-btn {
    background: var(--bgl-green-80) !important;
    --alpha-color: var(--bgl-green-80);
}

.border-green-80 {
    border-color: var(--bgl-green-80) !important;
}

.color-input-green-80 input {
    color: var(--bgl-green-80) !important;
}

.bg-red-80 {
    background: var(--bgl-red-80) !important;
    --alpha-color: var(--bgl-red-80);
}

.color-red-80 {
    color: var(--bgl-red-80) !important;
}

.bg-input-red-80 input,
.bg-input-red-80 textarea,
.bg-input-red-80 .selectinput-btn {
    background: var(--bgl-red-80) !important;
    --alpha-color: var(--bgl-red-80);
}

.border-red-80 {
    border-color: var(--bgl-red-80) !important;
}

.color-input-red-80 input {
    color: var(--bgl-red-80) !important;
}

.bg-yellow-80 {
    background: var(--bgl-yellow-80) !important;
    --alpha-color: var(--bgl-yellow-80);
}

.color-yellow-80 {
    color: var(--bgl-yellow-80) !important;
}

.bg-input-yellow-80 input,
.bg-input-yellow-80 textarea,
.bg-input-yellow-80 .selectinput-btn {
    background: var(--bgl-yellow-80) !important;
    --alpha-color: var(--bgl-yellow-80);
}

.border-yellow-80 {
    border-color: var(--bgl-yellow-80) !important;
}

.color-input-yellow-80 input {
    color: var(--bgl-yellow-80) !important;
}

.bg-purple-80 {
    background: var(--bgl-purple-80) !important;
    --alpha-color: var(--bgl-purple-80);
}

.color-purple-80 {
    color: var(--bgl-purple-80) !important;
}

.bg-input-purple-80 input,
.bg-input-purple-80 textarea,
.bg-input-purple-80 .selectinput-btn {
    background: var(--bgl-purple-80) !important;
    --alpha-color: var(--bgl-purple-80);
}

.border-purple-80 {
    border-color: var(--bgl-purple-80) !important;
}

.color-input-purple-80 input {
    color: var(--bgl-purple-80) !important;
}

.bg-brown-80 {
    background: var(--bgl-brown-80) !important;
    --alpha-color: var(--bgl-brown-80);
}

.color-brown-80 {
    color: var(--bgl-brown-80) !important;
}

.bg-input-brown-80 input,
.bg-input-brown-80 textarea,
.bg-input-brown-80 .selectinput-btn {
    background: var(--bgl-brown-80) !important;
    --alpha-color: var(--bgl-brown-80);
}

.border-brown-80 {
    border-color: var(--bgl-brown-80) !important;
}

.color-input-brown-80 input {
    color: var(--bgl-brown-80) !important;
}

.bg-orange-80 {
    background: var(--bgl-orange-80) !important;
    --alpha-color: var(--bgl-orange-80);
}

.color-orange-80 {
    color: var(--bgl-orange-80) !important;
}

.bg-input-orange-80 input,
.bg-input-orange-80 textarea,
.bg-input-orange-80 .selectinput-btn {
    background: var(--bgl-orange-80) !important;
    --alpha-color: var(--bgl-orange-80);
}

.border-orange-80 {
    border-color: var(--bgl-orange-80) !important;
}

.color-input-orange-80 input {
    color: var(--bgl-orange-80) !important;
}

.bg-turquoise-80 {
    background: var(--bgl-turquoise-80) !important;
    --alpha-color: var(--bgl-turquoise-80);
}

.color-turquoise-80 {
    color: var(--bgl-turquoise-80) !important;
}

.bg-input-turquoise-80 input,
.bg-input-turquoise-80 textarea,
.bg-input-turquoise-80 .selectinput-btn {
    background: var(--bgl-turquoise-80) !important;
    --alpha-color: var(--bgl-turquoise-80);
}

.border-turquoise-80 {
    border-color: var(--bgl-turquoise-80) !important;
}

.color-input-turquoise-80 input {
    color: var(--bgl-turquoise-80) !important;
}

.bg-gray-80 {
    background: var(--bgl-gray-80) !important;
    --alpha-color: var(--bgl-gray-80);
}

.color-gray-80 {
    color: var(--bgl-gray-80) !important;
}

.bg-input-gray-80 input,
.bg-input-gray-80 textarea,
.bg-input-gray-80 .selectinput-btn {
    background: var(--bgl-gray-80) !important;
    --alpha-color: var(--bgl-gray-80);
}

.border-gray-80 {
    border-color: var(--bgl-gray-80) !important;
}

.color-input-gray-80 input {
    color: var(--bgl-gray-80) !important;
}

.bg-black-80 {
    background: var(--bgl-black-80) !important;
    --alpha-color: var(--bgl-black-80);
}

.color-black-80 {
    color: var(--bgl-black-80) !important;
}

.bg-input-black-80 input,
.bg-input-black-80 textarea,
.bg-input-black-80 .selectinput-btn {
    background: var(--bgl-black-80) !important;
    --alpha-color: var(--bgl-black-80);
}

.border-black-80 {
    border-color: var(--bgl-black-80) !important;
}

.color-input-black-80 input {
    color: var(--bgl-black-80) !important;
}

.bg-pink-80 {
    background: var(--bgl-pink-80) !important;
    --alpha-color: var(--bgl-pink-80);
}

.color-pink-80 {
    color: var(--bgl-pink-80) !important;
}

.bg-input-pink-80 input,
.bg-input-pink-80 textarea,
.bg-input-pink-80 .selectinput-btn {
    background: var(--bgl-pink-80) !important;
    --alpha-color: var(--bgl-pink-80);
}

.border-pink-80 {
    border-color: var(--bgl-pink-80) !important;
}

.color-input-pink-80 input {
    color: var(--bgl-pink-80) !important;
}

/* Color Variations - 90% */
.bg-blue-90 {
    background: var(--bgl-blue-90) !important;
    --alpha-color: var(--bgl-blue-90);
}

.color-blue-90 {
    color: var(--bgl-blue-90) !important;
}

.bg-input-blue-90 input,
.bg-input-blue-90 textarea,
.bg-input-blue-90 .selectinput-btn {
    background: var(--bgl-blue-90) !important;
    --alpha-color: var(--bgl-blue-90);
}

.border-blue-90 {
    border-color: var(--bgl-blue-90) !important;
}

.color-input-blue-90 input {
    color: var(--bgl-blue-90) !important;
}

.bg-green-90 {
    background: var(--bgl-green-90) !important;
    --alpha-color: var(--bgl-green-90);
}

.color-green-90 {
    color: var(--bgl-green-90) !important;
}

.bg-input-green-90 input,
.bg-input-green-90 textarea,
.bg-input-green-90 .selectinput-btn {
    background: var(--bgl-green-90) !important;
    --alpha-color: var(--bgl-green-90);
}

.border-green-90 {
    border-color: var(--bgl-green-90) !important;
}

.color-input-green-90 input {
    color: var(--bgl-green-90) !important;
}

.bg-red-90 {
    background: var(--bgl-red-90) !important;
    --alpha-color: var(--bgl-red-90);
}

.color-red-90 {
    color: var(--bgl-red-90) !important;
}

.bg-input-red-90 input,
.bg-input-red-90 textarea,
.bg-input-red-90 .selectinput-btn {
    background: var(--bgl-red-90) !important;
    --alpha-color: var(--bgl-red-90);
}

.border-red-90 {
    border-color: var(--bgl-red-90) !important;
}

.color-input-red-90 input {
    color: var(--bgl-red-90) !important;
}

.bg-yellow-90 {
    background: var(--bgl-yellow-90) !important;
    --alpha-color: var(--bgl-yellow-90);
}

.color-yellow-90 {
    color: var(--bgl-yellow-90) !important;
}

.bg-input-yellow-90 input,
.bg-input-yellow-90 textarea,
.bg-input-yellow-90 .selectinput-btn {
    background: var(--bgl-yellow-90) !important;
    --alpha-color: var(--bgl-yellow-90);
}

.border-yellow-90 {
    border-color: var(--bgl-yellow-90) !important;
}

.color-input-yellow-90 input {
    color: var(--bgl-yellow-90) !important;
}

.bg-purple-90 {
    background: var(--bgl-purple-90) !important;
    --alpha-color: var(--bgl-purple-90);
}

.color-purple-90 {
    color: var(--bgl-purple-90) !important;
}

.bg-input-purple-90 input,
.bg-input-purple-90 textarea,
.bg-input-purple-90 .selectinput-btn {
    background: var(--bgl-purple-90) !important;
    --alpha-color: var(--bgl-purple-90);
}

.border-purple-90 {
    border-color: var(--bgl-purple-90) !important;
}

.color-input-purple-90 input {
    color: var(--bgl-purple-90) !important;
}

.bg-brown-90 {
    background: var(--bgl-brown-90) !important;
    --alpha-color: var(--bgl-brown-90);
}

.color-brown-90 {
    color: var(--bgl-brown-90) !important;
}

.bg-input-brown-90 input,
.bg-input-brown-90 textarea,
.bg-input-brown-90 .selectinput-btn {
    background: var(--bgl-brown-90) !important;
    --alpha-color: var(--bgl-brown-90);
}

.border-brown-90 {
    border-color: var(--bgl-brown-90) !important;
}

.color-input-brown-90 input {
    color: var(--bgl-brown-90) !important;
}

.bg-orange-90 {
    background: var(--bgl-orange-90) !important;
    --alpha-color: var(--bgl-orange-90);
}

.color-orange-90 {
    color: var(--bgl-orange-90) !important;
}

.bg-input-orange-90 input,
.bg-input-orange-90 textarea,
.bg-input-orange-90 .selectinput-btn {
    background: var(--bgl-orange-90) !important;
    --alpha-color: var(--bgl-orange-90);
}

.border-orange-90 {
    border-color: var(--bgl-orange-90) !important;
}

.color-input-orange-90 input {
    color: var(--bgl-orange-90) !important;
}

.bg-turquoise-90 {
    background: var(--bgl-turquoise-90) !important;
    --alpha-color: var(--bgl-turquoise-90);
}

.color-turquoise-90 {
    color: var(--bgl-turquoise-90) !important;
}

.bg-input-turquoise-90 input,
.bg-input-turquoise-90 textarea,
.bg-input-turquoise-90 .selectinput-btn {
    background: var(--bgl-turquoise-90) !important;
    --alpha-color: var(--bgl-turquoise-90);
}

.border-turquoise-90 {
    border-color: var(--bgl-turquoise-90) !important;
}

.color-input-turquoise-90 input {
    color: var(--bgl-turquoise-90) !important;
}

.bg-gray-90 {
    background: var(--bgl-gray-90) !important;
    --alpha-color: var(--bgl-gray-90);
}

.color-gray-90 {
    color: var(--bgl-gray-90) !important;
}

.bg-input-gray-90 input,
.bg-input-gray-90 textarea,
.bg-input-gray-90 .selectinput-btn {
    background: var(--bgl-gray-90) !important;
    --alpha-color: var(--bgl-gray-90);
}

.border-gray-90 {
    border-color: var(--bgl-gray-90) !important;
}

.color-input-gray-90 input {
    color: var(--bgl-gray-90) !important;
}

.bg-black-90 {
    background: var(--bgl-black-90) !important;
    --alpha-color: var(--bgl-black-90);
}

.color-black-90 {
    color: var(--bgl-black-90) !important;
}

.bg-input-black-90 input,
.bg-input-black-90 textarea,
.bg-input-black-90 .selectinput-btn {
    background: var(--bgl-black-90) !important;
    --alpha-color: var(--bgl-black-90);
}

.border-black-90 {
    border-color: var(--bgl-black-90) !important;
}

.color-input-black-90 input {
    color: var(--bgl-black-90) !important;
}

.bg-pink-90 {
    background: var(--bgl-pink-90) !important;
    --alpha-color: var(--bgl-pink-90);
}

.color-pink-90 {
    color: var(--bgl-pink-90) !important;
}

.bg-input-pink-90 input,
.bg-input-pink-90 textarea,
.bg-input-pink-90 .selectinput-btn {
    background: var(--bgl-pink-90) !important;
    --alpha-color: var(--bgl-pink-90);
}

.border-pink-90 {
    border-color: var(--bgl-pink-90) !important;
}

.color-input-pink-90 input {
    color: var(--bgl-pink-90) !important;
}

/* Color Variations - 100%, 110%, 120%, 130% */
/* 100% */
.bg-blue-100 {
    background: var(--bgl-blue-100) !important;
    --alpha-color: var(--bgl-blue-100);
}

.color-blue-100 {
    color: var(--bgl-blue-100) !important;
}

.bg-input-blue-100 input,
.bg-input-blue-100 textarea,
.bg-input-blue-100 .selectinput-btn {
    background: var(--bgl-blue-100) !important;
    --alpha-color: var(--bgl-blue-100);
}

.border-blue-100 {
    border-color: var(--bgl-blue-100) !important;
}

.color-input-blue-100 input {
    color: var(--bgl-blue-100) !important;
}

.bg-green-100 {
    background: var(--bgl-green-100) !important;
    --alpha-color: var(--bgl-green-100);
}

.color-green-100 {
    color: var(--bgl-green-100) !important;
}

.bg-input-green-100 input,
.bg-input-green-100 textarea,
.bg-input-green-100 .selectinput-btn {
    background: var(--bgl-green-100) !important;
    --alpha-color: var(--bgl-green-100);
}

.border-green-100 {
    border-color: var(--bgl-green-100) !important;
}

.color-input-green-100 input {
    color: var(--bgl-green-100) !important;
}

.bg-red-100 {
    background: var(--bgl-red-100) !important;
    --alpha-color: var(--bgl-red-100);
}

.color-red-100 {
    color: var(--bgl-red-100) !important;
}

.bg-input-red-100 input,
.bg-input-red-100 textarea,
.bg-input-red-100 .selectinput-btn {
    background: var(--bgl-red-100) !important;
    --alpha-color: var(--bgl-red-100);
}

.border-red-100 {
    border-color: var(--bgl-red-100) !important;
}

.color-input-red-100 input {
    color: var(--bgl-red-100) !important;
}

.bg-yellow-100 {
    background: var(--bgl-yellow-100) !important;
    --alpha-color: var(--bgl-yellow-100);
}

.color-yellow-100 {
    color: var(--bgl-yellow-100) !important;
}

.bg-input-yellow-100 input,
.bg-input-yellow-100 textarea,
.bg-input-yellow-100 .selectinput-btn {
    background: var(--bgl-yellow-100) !important;
    --alpha-color: var(--bgl-yellow-100);
}

.border-yellow-100 {
    border-color: var(--bgl-yellow-100) !important;
}

.color-input-yellow-100 input {
    color: var(--bgl-yellow-100) !important;
}

.bg-purple-100 {
    background: var(--bgl-purple-100) !important;
    --alpha-color: var(--bgl-purple-100);
}

.color-purple-100 {
    color: var(--bgl-purple-100) !important;
}

.bg-input-purple-100 input,
.bg-input-purple-100 textarea,
.bg-input-purple-100 .selectinput-btn {
    background: var(--bgl-purple-100) !important;
    --alpha-color: var(--bgl-purple-100);
}

.border-purple-100 {
    border-color: var(--bgl-purple-100) !important;
}

.color-input-purple-100 input {
    color: var(--bgl-purple-100) !important;
}

.bg-brown-100 {
    background: var(--bgl-brown-100) !important;
    --alpha-color: var(--bgl-brown-100);
}

.color-brown-100 {
    color: var(--bgl-brown-100) !important;
}

.bg-input-brown-100 input,
.bg-input-brown-100 textarea,
.bg-input-brown-100 .selectinput-btn {
    background: var(--bgl-brown-100) !important;
    --alpha-color: var(--bgl-brown-100);
}

.border-brown-100 {
    border-color: var(--bgl-brown-100) !important;
}

.color-input-brown-100 input {
    color: var(--bgl-brown-100) !important;
}

.bg-orange-100 {
    background: var(--bgl-orange-100) !important;
    --alpha-color: var(--bgl-orange-100);
}

.color-orange-100 {
    color: var(--bgl-orange-100) !important;
}

.bg-input-orange-100 input,
.bg-input-orange-100 textarea,
.bg-input-orange-100 .selectinput-btn {
    background: var(--bgl-orange-100) !important;
    --alpha-color: var(--bgl-orange-100);
}

.border-orange-100 {
    border-color: var(--bgl-orange-100) !important;
}

.color-input-orange-100 input {
    color: var(--bgl-orange-100) !important;
}

.bg-turquoise-100 {
    background: var(--bgl-turquoise-100) !important;
    --alpha-color: var(--bgl-turquoise-100);
}

.color-turquoise-100 {
    color: var(--bgl-turquoise-100) !important;
}

.bg-input-turquoise-100 input,
.bg-input-turquoise-100 textarea,
.bg-input-turquoise-100 .selectinput-btn {
    background: var(--bgl-turquoise-100) !important;
    --alpha-color: var(--bgl-turquoise-100);
}

.border-turquoise-100 {
    border-color: var(--bgl-turquoise-100) !important;
}

.color-input-turquoise-100 input {
    color: var(--bgl-turquoise-100) !important;
}

.bg-gray-100 {
    background: var(--bgl-gray-100) !important;
    --alpha-color: var(--bgl-gray-100);
}

.color-gray-100 {
    color: var(--bgl-gray-100) !important;
}

.bg-input-gray-100 input,
.bg-input-gray-100 textarea,
.bg-input-gray-100 .selectinput-btn {
    background: var(--bgl-gray-100) !important;
    --alpha-color: var(--bgl-gray-100);
}

.border-gray-100 {
    border-color: var(--bgl-gray-100) !important;
}

.color-input-gray-100 input {
    color: var(--bgl-gray-100) !important;
}

.bg-black-100 {
    background: var(--bgl-black-100) !important;
    --alpha-color: var(--bgl-black-100);
}

.color-black-100 {
    color: var(--bgl-black-100) !important;
}

.bg-input-black-100 input,
.bg-input-black-100 textarea,
.bg-input-black-100 .selectinput-btn {
    background: var(--bgl-black-100) !important;
    --alpha-color: var(--bgl-black-100);
}

.border-black-100 {
    border-color: var(--bgl-black-100) !important;
}

.color-input-black-100 input {
    color: var(--bgl-black-100) !important;
}

.bg-pink-100 {
    background: var(--bgl-pink-100) !important;
    --alpha-color: var(--bgl-pink-100);
}

.color-pink-100 {
    color: var(--bgl-pink-100) !important;
}

.bg-input-pink-100 input,
.bg-input-pink-100 textarea,
.bg-input-pink-100 .selectinput-btn {
    background: var(--bgl-pink-100) !important;
    --alpha-color: var(--bgl-pink-100);
}

.border-pink-100 {
    border-color: var(--bgl-pink-100) !important;
}

.color-input-pink-100 input {
    color: var(--bgl-pink-100) !important;
}

/* 110% */
.bg-blue-110 {
    background: var(--bgl-blue-110) !important;
    --alpha-color: var(--bgl-blue-110);
}

.color-blue-110 {
    color: var(--bgl-blue-110) !important;
}

.bg-input-blue-110 input,
.bg-input-blue-110 textarea,
.bg-input-blue-110 .selectinput-btn {
    background: var(--bgl-blue-110) !important;
    --alpha-color: var(--bgl-blue-110);
}

.border-blue-110 {
    border-color: var(--bgl-blue-110) !important;
}

.color-input-blue-110 input {
    color: var(--bgl-blue-110) !important;
}

.bg-green-110 {
    background: var(--bgl-green-110) !important;
    --alpha-color: var(--bgl-green-110);
}

.color-green-110 {
    color: var(--bgl-green-110) !important;
}

.bg-input-green-110 input,
.bg-input-green-110 textarea,
.bg-input-green-110 .selectinput-btn {
    background: var(--bgl-green-110) !important;
    --alpha-color: var(--bgl-green-110);
}

.border-green-110 {
    border-color: var(--bgl-green-110) !important;
}

.color-input-green-110 input {
    color: var(--bgl-green-110) !important;
}

.bg-red-110 {
    background: var(--bgl-red-110) !important;
    --alpha-color: var(--bgl-red-110);
}

.color-red-110 {
    color: var(--bgl-red-110) !important;
}

.bg-input-red-110 input,
.bg-input-red-110 textarea,
.bg-input-red-110 .selectinput-btn {
    background: var(--bgl-red-110) !important;
    --alpha-color: var(--bgl-red-110);
}

.border-red-110 {
    border-color: var(--bgl-red-110) !important;
}

.color-input-red-110 input {
    color: var(--bgl-red-110) !important;
}

.bg-yellow-110 {
    background: var(--bgl-yellow-110) !important;
    --alpha-color: var(--bgl-yellow-110);
}

.color-yellow-110 {
    color: var(--bgl-yellow-110) !important;
}

.bg-input-yellow-110 input,
.bg-input-yellow-110 textarea,
.bg-input-yellow-110 .selectinput-btn {
    background: var(--bgl-yellow-110) !important;
    --alpha-color: var(--bgl-yellow-110);
}

.border-yellow-110 {
    border-color: var(--bgl-yellow-110) !important;
}

.color-input-yellow-110 input {
    color: var(--bgl-yellow-110) !important;
}

.bg-purple-110 {
    background: var(--bgl-purple-110) !important;
    --alpha-color: var(--bgl-purple-110);
}

.color-purple-110 {
    color: var(--bgl-purple-110) !important;
}

.bg-input-purple-110 input,
.bg-input-purple-110 textarea,
.bg-input-purple-110 .selectinput-btn {
    background: var(--bgl-purple-110) !important;
    --alpha-color: var(--bgl-purple-110);
}

.border-purple-110 {
    border-color: var(--bgl-purple-110) !important;
}

.color-input-purple-110 input {
    color: var(--bgl-purple-110) !important;
}

.bg-brown-110 {
    background: var(--bgl-brown-110) !important;
    --alpha-color: var(--bgl-brown-110);
}

.color-brown-110 {
    color: var(--bgl-brown-110) !important;
}

.bg-input-brown-110 input,
.bg-input-brown-110 textarea,
.bg-input-brown-110 .selectinput-btn {
    background: var(--bgl-brown-110) !important;
    --alpha-color: var(--bgl-brown-110);
}

.border-brown-110 {
    border-color: var(--bgl-brown-110) !important;
}

.color-input-brown-110 input {
    color: var(--bgl-brown-110) !important;
}

.bg-orange-110 {
    background: var(--bgl-orange-110) !important;
    --alpha-color: var(--bgl-orange-110);
}

.color-orange-110 {
    color: var(--bgl-orange-110) !important;
}

.bg-input-orange-110 input,
.bg-input-orange-110 textarea,
.bg-input-orange-110 .selectinput-btn {
    background: var(--bgl-orange-110) !important;
    --alpha-color: var(--bgl-orange-110);
}

.border-orange-110 {
    border-color: var(--bgl-orange-110) !important;
}

.color-input-orange-110 input {
    color: var(--bgl-orange-110) !important;
}

.bg-turquoise-110 {
    background: var(--bgl-turquoise-110) !important;
    --alpha-color: var(--bgl-turquoise-110);
}

.color-turquoise-110 {
    color: var(--bgl-turquoise-110) !important;
}

.bg-input-turquoise-110 input,
.bg-input-turquoise-110 textarea,
.bg-input-turquoise-110 .selectinput-btn {
    background: var(--bgl-turquoise-110) !important;
    --alpha-color: var(--bgl-turquoise-110);
}

.border-turquoise-110 {
    border-color: var(--bgl-turquoise-110) !important;
}

.color-input-turquoise-110 input {
    color: var(--bgl-turquoise-110) !important;
}

.bg-gray-110 {
    background: var(--bgl-gray-110) !important;
    --alpha-color: var(--bgl-gray-110);
}

.color-gray-110 {
    color: var(--bgl-gray-110) !important;
}

.bg-input-gray-110 input,
.bg-input-gray-110 textarea,
.bg-input-gray-110 .selectinput-btn {
    background: var(--bgl-gray-110) !important;
    --alpha-color: var(--bgl-gray-110);
}

.border-gray-110 {
    border-color: var(--bgl-gray-110) !important;
}

.color-input-gray-110 input {
    color: var(--bgl-gray-110) !important;
}

.bg-black-110 {
    background: var(--bgl-black-110) !important;
    --alpha-color: var(--bgl-black-110);
}

.color-black-110 {
    color: var(--bgl-black-110) !important;
}

.bg-input-black-110 input,
.bg-input-black-110 textarea,
.bg-input-black-110 .selectinput-btn {
    background: var(--bgl-black-110) !important;
    --alpha-color: var(--bgl-black-110);
}

.border-black-110 {
    border-color: var(--bgl-black-110) !important;
}

.color-input-black-110 input {
    color: var(--bgl-black-110) !important;
}

.bg-pink-110 {
    background: var(--bgl-pink-110) !important;
    --alpha-color: var(--bgl-pink-110);
}

.color-pink-110 {
    color: var(--bgl-pink-110) !important;
}

.bg-input-pink-110 input,
.bg-input-pink-110 textarea,
.bg-input-pink-110 .selectinput-btn {
    background: var(--bgl-pink-110) !important;
    --alpha-color: var(--bgl-pink-110);
}

.border-pink-110 {
    border-color: var(--bgl-pink-110) !important;
}

.color-input-pink-110 input {
    color: var(--bgl-pink-110) !important;
}

/* 120% */
.bg-blue-120 {
    background: var(--bgl-blue-120) !important;
    --alpha-color: var(--bgl-blue-120);
}

.color-blue-120 {
    color: var(--bgl-blue-120) !important;
}

.bg-input-blue-120 input,
.bg-input-blue-120 textarea,
.bg-input-blue-120 .selectinput-btn {
    background: var(--bgl-blue-120) !important;
    --alpha-color: var(--bgl-blue-120);
}

.border-blue-120 {
    border-color: var(--bgl-blue-120) !important;
}

.color-input-blue-120 input {
    color: var(--bgl-blue-120) !important;
}

.bg-green-120 {
    background: var(--bgl-green-120) !important;
    --alpha-color: var(--bgl-green-120);
}

.color-green-120 {
    color: var(--bgl-green-120) !important;
}

.bg-input-green-120 input,
.bg-input-green-120 textarea,
.bg-input-green-120 .selectinput-btn {
    background: var(--bgl-green-120) !important;
    --alpha-color: var(--bgl-green-120);
}

.border-green-120 {
    border-color: var(--bgl-green-120) !important;
}

.color-input-green-120 input {
    color: var(--bgl-green-120) !important;
}

.bg-red-120 {
    background: var(--bgl-red-120) !important;
    --alpha-color: var(--bgl-red-120);
}

.color-red-120 {
    color: var(--bgl-red-120) !important;
}

.bg-input-red-120 input,
.bg-input-red-120 textarea,
.bg-input-red-120 .selectinput-btn {
    background: var(--bgl-red-120) !important;
    --alpha-color: var(--bgl-red-120);
}

.border-red-120 {
    border-color: var(--bgl-red-120) !important;
}

.color-input-red-120 input {
    color: var(--bgl-red-120) !important;
}

.bg-yellow-120 {
    background: var(--bgl-yellow-120) !important;
    --alpha-color: var(--bgl-yellow-120);
}

.color-yellow-120 {
    color: var(--bgl-yellow-120) !important;
}

.bg-input-yellow-120 input,
.bg-input-yellow-120 textarea,
.bg-input-yellow-120 .selectinput-btn {
    background: var(--bgl-yellow-120) !important;
    --alpha-color: var(--bgl-yellow-120);
}

.border-yellow-120 {
    border-color: var(--bgl-yellow-120) !important;
}

.color-input-yellow-120 input {
    color: var(--bgl-yellow-120) !important;
}

.bg-purple-120 {
    background: var(--bgl-purple-120) !important;
    --alpha-color: var(--bgl-purple-120);
}

.color-purple-120 {
    color: var(--bgl-purple-120) !important;
}

.bg-input-purple-120 input,
.bg-input-purple-120 textarea,
.bg-input-purple-120 .selectinput-btn {
    background: var(--bgl-purple-120) !important;
    --alpha-color: var(--bgl-purple-120);
}

.border-purple-120 {
    border-color: var(--bgl-purple-120) !important;
}

.color-input-purple-120 input {
    color: var(--bgl-purple-120) !important;
}

.bg-brown-120 {
    background: var(--bgl-brown-120) !important;
    --alpha-color: var(--bgl-brown-120);
}

.color-brown-120 {
    color: var(--bgl-brown-120) !important;
}

.bg-input-brown-120 input,
.bg-input-brown-120 textarea,
.bg-input-brown-120 .selectinput-btn {
    background: var(--bgl-brown-120) !important;
    --alpha-color: var(--bgl-brown-120);
}

.border-brown-120 {
    border-color: var(--bgl-brown-120) !important;
}

.color-input-brown-120 input {
    color: var(--bgl-brown-120) !important;
}

.bg-orange-120 {
    background: var(--bgl-orange-120) !important;
    --alpha-color: var(--bgl-orange-120);
}

.color-orange-120 {
    color: var(--bgl-orange-120) !important;
}

.bg-input-orange-120 input,
.bg-input-orange-120 textarea,
.bg-input-orange-120 .selectinput-btn {
    background: var(--bgl-orange-120) !important;
    --alpha-color: var(--bgl-orange-120);
}

.border-orange-120 {
    border-color: var(--bgl-orange-120) !important;
}

.color-input-orange-120 input {
    color: var(--bgl-orange-120) !important;
}

.bg-turquoise-120 {
    background: var(--bgl-turquoise-120) !important;
    --alpha-color: var(--bgl-turquoise-120);
}

.color-turquoise-120 {
    color: var(--bgl-turquoise-120) !important;
}

.bg-input-turquoise-120 input,
.bg-input-turquoise-120 textarea,
.bg-input-turquoise-120 .selectinput-btn {
    background: var(--bgl-turquoise-120) !important;
    --alpha-color: var(--bgl-turquoise-120);
}

.border-turquoise-120 {
    border-color: var(--bgl-turquoise-120) !important;
}

.color-input-turquoise-120 input {
    color: var(--bgl-turquoise-120) !important;
}

.bg-gray-120 {
    background: var(--bgl-gray-120) !important;
    --alpha-color: var(--bgl-gray-120);
}

.color-gray-120 {
    color: var(--bgl-gray-120) !important;
}

.bg-input-gray-120 input,
.bg-input-gray-120 textarea,
.bg-input-gray-120 .selectinput-btn {
    background: var(--bgl-gray-120) !important;
    --alpha-color: var(--bgl-gray-120);
}

.border-gray-120 {
    border-color: var(--bgl-gray-120) !important;
}

.color-input-gray-120 input {
    color: var(--bgl-gray-120) !important;
}

.bg-black-120 {
    background: var(--bgl-black-120) !important;
    --alpha-color: var(--bgl-black-120);
}

.color-black-120 {
    color: var(--bgl-black-120) !important;
}

.bg-input-black-120 input,
.bg-input-black-120 textarea,
.bg-input-black-120 .selectinput-btn {
    background: var(--bgl-black-120) !important;
    --alpha-color: var(--bgl-black-120);
}

.border-black-120 {
    border-color: var(--bgl-black-120) !important;
}

.color-input-black-120 input {
    color: var(--bgl-black-120) !important;
}

.bg-pink-120 {
    background: var(--bgl-pink-120) !important;
    --alpha-color: var(--bgl-pink-120);
}

.color-pink-120 {
    color: var(--bgl-pink-120) !important;
}

.bg-input-pink-120 input,
.bg-input-pink-120 textarea,
.bg-input-pink-120 .selectinput-btn {
    background: var(--bgl-pink-120) !important;
    --alpha-color: var(--bgl-pink-120);
}

.border-pink-120 {
    border-color: var(--bgl-pink-120) !important;
}

.color-input-pink-120 input {
    color: var(--bgl-pink-120) !important;
}

/* 130% */
.bg-blue-130 {
    background: var(--bgl-blue-130) !important;
    --alpha-color: var(--bgl-blue-130);
}

.color-blue-130 {
    color: var(--bgl-blue-130) !important;
}

.bg-input-blue-130 input,
.bg-input-blue-130 textarea,
.bg-input-blue-130 .selectinput-btn {
    background: var(--bgl-blue-130) !important;
    --alpha-color: var(--bgl-blue-130);
}

.border-blue-130 {
    border-color: var(--bgl-blue-130) !important;
}

.color-input-blue-130 input {
    color: var(--bgl-blue-130) !important;
}

.bg-green-130 {
    background: var(--bgl-green-130) !important;
    --alpha-color: var(--bgl-green-130);
}

.color-green-130 {
    color: var(--bgl-green-130) !important;
}

.bg-input-green-130 input,
.bg-input-green-130 textarea,
.bg-input-green-130 .selectinput-btn {
    background: var(--bgl-green-130) !important;
    --alpha-color: var(--bgl-green-130);
}

.border-green-130 {
    border-color: var(--bgl-green-130) !important;
}

.color-input-green-130 input {
    color: var(--bgl-green-130) !important;
}

.bg-red-130 {
    background: var(--bgl-red-130) !important;
    --alpha-color: var(--bgl-red-130);
}

.color-red-130 {
    color: var(--bgl-red-130) !important;
}

.bg-input-red-130 input,
.bg-input-red-130 textarea,
.bg-input-red-130 .selectinput-btn {
    background: var(--bgl-red-130) !important;
    --alpha-color: var(--bgl-red-130);
}

.border-red-130 {
    border-color: var(--bgl-red-130) !important;
}

.color-input-red-130 input {
    color: var(--bgl-red-130) !important;
}

.bg-yellow-130 {
    background: var(--bgl-yellow-130) !important;
    --alpha-color: var(--bgl-yellow-130);
}

.color-yellow-130 {
    color: var(--bgl-yellow-130) !important;
}

.bg-input-yellow-130 input,
.bg-input-yellow-130 textarea,
.bg-input-yellow-130 .selectinput-btn {
    background: var(--bgl-yellow-130) !important;
    --alpha-color: var(--bgl-yellow-130);
}

.border-yellow-130 {
    border-color: var(--bgl-yellow-130) !important;
}

.color-input-yellow-130 input {
    color: var(--bgl-yellow-130) !important;
}

.bg-purple-130 {
    background: var(--bgl-purple-130) !important;
    --alpha-color: var(--bgl-purple-130);
}

.color-purple-130 {
    color: var(--bgl-purple-130) !important;
}

.bg-input-purple-130 input,
.bg-input-purple-130 textarea,
.bg-input-purple-130 .selectinput-btn {
    background: var(--bgl-purple-130) !important;
    --alpha-color: var(--bgl-purple-130);
}

.border-purple-130 {
    border-color: var(--bgl-purple-130) !important;
}

.color-input-purple-130 input {
    color: var(--bgl-purple-130) !important;
}

.bg-brown-130 {
    background: var(--bgl-brown-130) !important;
    --alpha-color: var(--bgl-brown-130);
}

.color-brown-130 {
    color: var(--bgl-brown-130) !important;
}

.bg-input-brown-130 input,
.bg-input-brown-130 textarea,
.bg-input-brown-130 .selectinput-btn {
    background: var(--bgl-brown-130) !important;
    --alpha-color: var(--bgl-brown-130);
}

.border-brown-130 {
    border-color: var(--bgl-brown-130) !important;
}

.color-input-brown-130 input {
    color: var(--bgl-brown-130) !important;
}

.bg-orange-130 {
    background: var(--bgl-orange-130) !important;
    --alpha-color: var(--bgl-orange-130);
}

.color-orange-130 {
    color: var(--bgl-orange-130) !important;
}

.bg-input-orange-130 input,
.bg-input-orange-130 textarea,
.bg-input-orange-130 .selectinput-btn {
    background: var(--bgl-orange-130) !important;
    --alpha-color: var(--bgl-orange-130);
}

.border-orange-130 {
    border-color: var(--bgl-orange-130) !important;
}

.color-input-orange-130 input {
    color: var(--bgl-orange-130) !important;
}

.bg-turquoise-130 {
    background: var(--bgl-turquoise-130) !important;
    --alpha-color: var(--bgl-turquoise-130);
}

.color-turquoise-130 {
    color: var(--bgl-turquoise-130) !important;
}

.bg-input-turquoise-130 input,
.bg-input-turquoise-130 textarea,
.bg-input-turquoise-130 .selectinput-btn {
    background: var(--bgl-turquoise-130) !important;
    --alpha-color: var(--bgl-turquoise-130);
}

.border-turquoise-130 {
    border-color: var(--bgl-turquoise-130) !important;
}

.color-input-turquoise-130 input {
    color: var(--bgl-turquoise-130) !important;
}

.bg-gray-130 {
    background: var(--bgl-gray-130) !important;
    --alpha-color: var(--bgl-gray-130);
}

.color-gray-130 {
    color: var(--bgl-gray-130) !important;
}

.bg-input-gray-130 input,
.bg-input-gray-130 textarea,
.bg-input-gray-130 .selectinput-btn {
    background: var(--bgl-gray-130) !important;
    --alpha-color: var(--bgl-gray-130);
}

.border-gray-130 {
    border-color: var(--bgl-gray-130) !important;
}

.color-input-gray-130 input {
    color: var(--bgl-gray-130) !important;
}

.bg-black-130 {
    background: var(--bgl-black-130) !important;
    --alpha-color: var(--bgl-black-130);
}

.color-black-130 {
    color: var(--bgl-black-130) !important;
}

.bg-input-black-130 input,
.bg-input-black-130 textarea,
.bg-input-black-130 .selectinput-btn {
    background: var(--bgl-black-130) !important;
    --alpha-color: var(--bgl-black-130);
}

.border-black-130 {
    border-color: var(--bgl-black-130) !important;
}

.color-input-black-130 input {
    color: var(--bgl-black-130) !important;
}

.bg-pink-130 {
    background: var(--bgl-pink-130) !important;
    --alpha-color: var(--bgl-pink-130);
}

.color-pink-130 {
    color: var(--bgl-pink-130) !important;
}

.bg-input-pink-130 input,
.bg-input-pink-130 textarea,
.bg-input-pink-130 .selectinput-btn {
    background: var(--bgl-pink-130) !important;
    --alpha-color: var(--bgl-pink-130);
}

.border-pink-130 {
    border-color: var(--bgl-pink-130) !important;
}

.color-input-pink-130 input {
    color: var(--bgl-pink-130) !important;
}

/* Alpha system using color-mix - works with existing bg- classes */
.alpha-10 {
    background-color: color-mix(in srgb, var(--alpha-color, var(--bgl-primary)) 10%, transparent) !important;
}

.alpha-20 {
    background-color: color-mix(in srgb, var(--alpha-color, var(--bgl-primary)) 20%, transparent) !important;
}

.alpha-30 {
    background-color: color-mix(in srgb, var(--alpha-color, var(--bgl-primary)) 30%, transparent) !important;
}

.alpha-40 {
    background-color: color-mix(in srgb, var(--alpha-color, var(--bgl-primary)) 40%, transparent) !important;
}

.alpha-50 {
    background-color: color-mix(in srgb, var(--alpha-color, var(--bgl-primary)) 50%, transparent) !important;
}

.alpha-60 {
    background-color: color-mix(in srgb, var(--alpha-color, var(--bgl-primary)) 60%, transparent) !important;
}

.alpha-70 {
    background-color: color-mix(in srgb, var(--alpha-color, var(--bgl-primary)) 70%, transparent) !important;
}

.alpha-80 {
    background-color: color-mix(in srgb, var(--alpha-color, var(--bgl-primary)) 80%, transparent) !important;
}

.alpha-90 {
    background-color: color-mix(in srgb, var(--alpha-color, var(--bgl-primary)) 90%, transparent) !important;
}

/* Update existing bg- classes to set --alpha-color */
.bg-white {
    background: var(--bgl-white) !important;
    --alpha-color: var(--bgl-white);
}

.bg-black {
    background: var(--bgl-black) !important;
    --alpha-color: var(--bgl-black);
}

.bg-primary {
    background: var(--bgl-primary) !important;
    --alpha-color: var(--bgl-primary);
}

.bg-blue {
    background: var(--bgl-blue) !important;
    --alpha-color: var(--bgl-blue);
}

.bg-green {
    background: var(--bgl-green) !important;
    --alpha-color: var(--bgl-green);
}

.bg-red {
    background: var(--bgl-red) !important;
    --alpha-color: var(--bgl-red);
}

.bg-yellow {
    background: var(--bgl-yellow) !important;
    --alpha-color: var(--bgl-yellow);
}

.bg-purple {
    background: var(--bgl-purple) !important;
    --alpha-color: var(--bgl-purple);
}

.bg-brown {
    background: var(--bgl-brown) !important;
    --alpha-color: var(--bgl-brown);
}

.bg-orange {
    background: var(--bgl-orange) !important;
    --alpha-color: var(--bgl-orange);
}

.bg-turquoise {
    background: var(--bgl-turquoise) !important;
    --alpha-color: var(--bgl-turquoise);
}

.bg-pink {
    background: var(--bgl-pink) !important;
    --alpha-color: var(--bgl-pink);
}

.bg-gray {
    background: var(--bgl-gray) !important;
    --alpha-color: var(--bgl-gray);
}

/* Alpha system using color-mix - works with existing bg- classes */
.alpha-5 {
    background-color: color-mix(in srgb, var(--alpha-color, var(--bgl-primary)) 5%, transparent) !important;
}

.alpha-10 {
    background-color: color-mix(in srgb, var(--alpha-color, var(--bgl-primary)) 10%, transparent) !important;
}

.alpha-15 {
    background-color: color-mix(in srgb, var(--alpha-color, var(--bgl-primary)) 15%, transparent) !important;
}

.alpha-20 {
    background-color: color-mix(in srgb, var(--alpha-color, var(--bgl-primary)) 20%, transparent) !important;
}

.alpha-25 {
    background-color: color-mix(in srgb, var(--alpha-color, var(--bgl-primary)) 25%, transparent) !important;
}

.alpha-30 {
    background-color: color-mix(in srgb, var(--alpha-color, var(--bgl-primary)) 30%, transparent) !important;
}

.alpha-35 {
    background-color: color-mix(in srgb, var(--alpha-color, var(--bgl-primary)) 35%, transparent) !important;
}

.alpha-40 {
    background-color: color-mix(in srgb, var(--alpha-color, var(--bgl-primary)) 40%, transparent) !important;
}

.alpha-45 {
    background-color: color-mix(in srgb, var(--alpha-color, var(--bgl-primary)) 45%, transparent) !important;
}

.alpha-50 {
    background-color: color-mix(in srgb, var(--alpha-color, var(--bgl-primary)) 50%, transparent) !important;
}

.alpha-55 {
    background-color: color-mix(in srgb, var(--alpha-color, var(--bgl-primary)) 55%, transparent) !important;
}

.alpha-60 {
    background-color: color-mix(in srgb, var(--alpha-color, var(--bgl-primary)) 60%, transparent) !important;
}

.alpha-65 {
    background-color: color-mix(in srgb, var(--alpha-color, var(--bgl-primary)) 65%, transparent) !important;
}

.alpha-70 {
    background-color: color-mix(in srgb, var(--alpha-color, var(--bgl-primary)) 70%, transparent) !important;
}

.alpha-75 {
    background-color: color-mix(in srgb, var(--alpha-color, var(--bgl-primary)) 75%, transparent) !important;
}

.alpha-80 {
    background-color: color-mix(in srgb, var(--alpha-color, var(--bgl-primary)) 80%, transparent) !important;
}

.alpha-85 {
    background-color: color-mix(in srgb, var(--alpha-color, var(--bgl-primary)) 85%, transparent) !important;
}

.alpha-90 {
    background-color: color-mix(in srgb, var(--alpha-color, var(--bgl-primary)) 90%, transparent) !important;
}

.alpha-95 {
    background-color: color-mix(in srgb, var(--alpha-color, var(--bgl-primary)) 95%, transparent) !important;
}