/* ------------------------------------------------------------------- 
 HOVER BG COLOR 
--------------------------------------------------------------------- */

.hover\:bg-tailwind-white:hover {
    background: white;
}


/* COOL GREY */
.hover\:bg-gray-cool-050:hover {
    background: var(--gray-cool-050);
}

.hover\:bg-gray-cool-100:hover {
    background: var(--gray-cool-100);
}

.hover\:bg-gray-cool-200:hover {
    background: var(--gray-cool-200);
}

.hover\:bg-gray-cool-300:hover {
    background: var(--gray-cool-300);
}

.hover\:bg-gray-cool-400:hover {
    background: var(--gray-cool-400);
}

.hover\:bg-gray-cool-500:hover {
    background: var(--gray-cool-500);
}

.hover\:bg-gray-cool-600:hover {
    background: var(--gray-cool-600);
}

.hover\:bg-gray-cool-700:hover {
    background: var(--gray-cool-700);
}

.hover\:bg-gray-cool-800:hover {
    background: var(--gray-cool-800);
}

.hover\:bg-gray-cool-900:hover {
    background: var(--gray-cool-900);
}

/* VIVID BLUE */

.hover\:bg-blue-vivid-050:hover {
    background: var(--blue-vivid-050);
}

.hover\:bg-blue-vivid-100:hover {
    background: var(--blue-vivid-100);
}

.hover\:bg-blue-vivid-200:hover {
    background: var(--blue-vivid-200);
}

.hover\:bg-blue-vivid-300:hover {
    background: var(--blue-vivid-300);
}

.hover\:bg-blue-vivid-400:hover {
    background: var(--blue-vivid-400);
}

.hover\:bg-blue-vivid-500:hover {
    background: var(--blue-vivid-500);
}

.hover\:bg-blue-vivid-600:hover {
    background: var(--blue-vivid-600);
}

.hover\:bg-blue-vivid-700:hover {
    background: var(--blue-vivid-700);
}

.hover\:bg-blue-vivid-800:hover {
    background: var(--blue-vivid-800);
}

.hover\:bg-blue-vivid-900:hover {
    background: var(--blue-vivid-900);
}


/* CYAN BLUE */

.hover\:bg-cyan-vivid-050:hover {
    background: var(--cyan-vivid-050);
}

.hover\:bg-cyan-vivid-100:hover {
    background: var(--cyan-vivid-100);
}

.hover\:bg-cyan-vivid-200:hover {
    background: var(--cyan-vivid-200);
}

.hover\:bg-cyan-vivid-300:hover {
    background: var(--cyan-vivid-300);
}

.hover\:bg-cyan-vivid-400:hover {
    background: var(--cyan-vivid-400);
}

.hover\:bg-cyan-vivid-500:hover {
    background: var(--cyan-vivid-500);
}

.hover\:bg-cyan-vivid-600:hover {
    background: var(--cyan-vivid-600);
}

.hover\:bg-cyan-vivid-700:hover {
    background: var(--cyan-vivid-700);
}

.hover\:bg-cyan-vivid-800:hover {
    background: var(--cyan-vivid-800);
}

.hover\:bg-cyan-vivid-900:hover {
    background: var(--cyan-vivid-900);
}

/* ORANGE VIVID */

.hover\:bg-orange-vivid-050:hover {
    background: var(--orange-vivid-050);
}

.hover\:bg-orange-vivid-100:hover {
    background: var(--orange-vivid-100);
}

.hover\:bg-orange-vivid-200:hover {
    background: var(--orange-vivid-200);
}

.hover\:bg-orange-vivid-300:hover {
    background: var(--orange-vivid-300);
}

.hover\:bg-orange-vivid-400:hover {
    background: var(--orange-vivid-400);
}

.hover\:bg-orange-vivid-500:hover {
    background: var(--orange-vivid-500);
}

.hover\:bg-orange-vivid-600:hover {
    background: var(--orange-vivid-600);
}

.hover\:bg-orange-vivid-700:hover {
    background: var(--orange-vivid-700);
}

.hover\:bg-orange-vivid-800:hover {
    background: var(--orange-vivid-800);
}

.hover\:bg-orange-vivid-900:hover {
    background: var(--orange-vivid-900);
}

/* RED VIVID */

.hover\:bg-red-vivid-050:hover {
    background: var(--red-vivid-050);
}

.hover\:bg-red-vivid-100:hover {
    background: var(--red-vivid-100);
}

.hover\:bg-red-vivid-200:hover {
    background: var(--red-vivid-200);
}

.hover\:bg-red-vivid-300:hover {
    background: var(--red-vivid-300);
}

.hover\:bg-red-vivid-400:hover {
    background: var(--red-vivid-400);
}

.hover\:bg-red-vivid-500:hover {
    background: var(--red-vivid-500);
}

.hover\:bg-red-vivid-600:hover {
    background: var(--red-vivid-600);
}

.hover\:bg-red-vivid-700:hover {
    background: var(--red-vivid-700);
}

.hover\:bg-red-vivid-800:hover {
    background: var(--red-vivid-800);
}

.hover\:bg-red-vivid-900:hover {
    background: var(--red-vivid-900);
}

/* YELLOW VIVID */

.hover\:bg-yellow-vivid-050:hover {
    background: var(--yellow-vivid-050);
}

.hover\:bg-yellow-vivid-100:hover {
    background: var(--yellow-vivid-100);
}

.hover\:bg-yellow-vivid-200:hover {
    background: var(--yellow-vivid-200);
}

.hover\:bg-yellow-vivid-300:hover {
    background: var(--yellow-vivid-300);
}

.hover\:bg-yellow-vivid-400:hover {
    background: var(--yellow-vivid-400);
}

.hover\:bg-yellow-vivid-500:hover {
    background: var(--yellow-vivid-500);
}

.hover\:bg-yellow-vivid-600:hover {
    background: var(--yellow-vivid-600);
}

.hover\:bg-yellow-vivid-700:hover {
    background: var(--yellow-vivid-700);
}

.hover\:bg-yellow-vivid-800:hover {
    background: var(--yellow-vivid-800);
}

.hover\:bg-yellow-vivid-900:hover {
    background: var(--yellow-vivid-900);
}


/*TAILWIND TEAL */
.hover\:bg-tailwind-teal-050:hover {
    background: var(--tailwind-teal-050);
}

.hover\:bg-tailwind-teal-100:hover {
    background: var(--tailwind-teal-100);
}

.hover\:bg-tailwind-teal-200:hover {
    background: var(--tailwind-teal-200);
}

.hover\:bg-tailwind-teal-300:hover {
    background: var(--tailwind-teal-300);
}

.hover\:bg-tailwind-teal-400:hover {
    background: var(--tailwind-teal-400);
}

.hover\:bg-tailwind-teal-500:hover {
    background: var(--tailwind-teal-500);
}

.hover\:bg-tailwind-teal-600:hover {
    background: var(--tailwind-teal-600);
}

.hover\:bg-tailwind-teal-700:hover {
    background: var(--tailwind-teal-700);
}

.hover\:bg-tailwind-teal-800:hover {
    background: var(--tailwind-teal-800);
}

.hover\:bg-tailwind-teal-900:hover {
    background: var(--tailwind-teal-900);
}


/* TAILWIND SLATE */
.hover\:bg-tailwind-slate-050:hover {
    background: var(--tailwind-slate-050);
}

.hover\:bg-tailwind-slate-100:hover {
    background: var(--tailwind-slate-100);
}

.hover\:bg-tailwind-slate-200:hover {
    background: var(--tailwind-slate-200);
}

.hover\:bg-tailwind-slate-300:hover {
    background: var(--tailwind-slate-300);
}

.hover\:bg-tailwind-slate-400:hover {
    background: var(--tailwind-slate-400);
}

.hover\:bg-tailwind-slate-500:hover {
    background: var(--tailwind-slate-500);
}

.hover\:bg-tailwind-slate-600:hover {
    background: var(--tailwind-slate-600);
}

.hover\:bg-tailwind-slate-700:hover {
    background: var(--tailwind-slate-700);
}

.hover\:bg-tailwind-slate-800:hover {
    background: var(--tailwind-slate-800);
}

.hover\:bg-tailwind-slate-900:hover {
    background: var(--tailwind-slate-900);
}

.hover\:bg-tailwind-slate-950:hover {
    background: var(--tailwind-slate-950);
}


/* TAILWIND BLUE */
.hover\:bg-tailwind-blue-050:hover {
    background: var(--tailwind-blue-050);
}

.hover\:bg-tailwind-blue-100:hover {
    background: var(--tailwind-blue-100);
}

.hover\:bg-tailwind-blue-200:hover {
    background: var(--tailwind-blue-200);
}

.hover\:bg-tailwind-blue-300:hover {
    background: var(--tailwind-blue-300);
}

.hover\:bg-tailwind-blue-400:hover {
    background: var(--tailwind-blue-400);
}

.hover\:bg-tailwind-blue-500:hover {
    background: var(--tailwind-blue-500);
}

.hover\:bg-tailwind-blue-600:hover {
    background: var(--tailwind-blue-600);
}

.hover\:bg-tailwind-blue-700:hover {
    background: var(--tailwind-blue-700);
}

.hover\:bg-tailwind-blue-800:hover {
    background: var(--tailwind-blue-800);
}

.hover\:bg-tailwind-blue-900:hover {
    background: var(--tailwind-blue-900);
}

.hover\:bg-tailwind-blue-950:hover {
    background: var(--tailwind-blue-950);
}

/* TAILWIND RED */
.hover\:bg-tailwind-red-050:hover {
    background: var(--tailwind-red-050);
}

.hover\:bg-tailwind-red-100:hover {
    background: var(--tailwind-red-100);
}

.hover\:bg-tailwind-red-200:hover {
    background: var(--tailwind-red-200);
}

.hover\:bg-tailwind-red-300:hover {
    background: var(--tailwind-red-300);
}

.hover\:bg-tailwind-red-400:hover {
    background: var(--tailwind-red-400);
}

.hover\:bg-tailwind-red-500:hover {
    background: var(--tailwind-red-500);
}

.hover\:bg-tailwind-red-600:hover {
    background: var(--tailwind-red-600);
}

.hover\:bg-tailwind-red-700:hover {
    background: var(--tailwind-red-700);
}

.hover\:bg-tailwind-red-800:hover {
    background: var(--tailwind-red-800);
}

.hover\:bg-tailwind-red-900:hover {
    background: var(--tailwind-red-900);
}

.hover\:bg-tailwind-red-950:hover {
    background: var(--tailwind-red-950);
}

/* TAILWIND VIOLET */
.hover\:bg-tailwind-violet-050:hover {
    background: var(--tailwind-violet-050);
}

.hover\:bg-tailwind-violet-100:hover {
    background: var(--tailwind-violet-100);
}

.hover\:bg-tailwind-violet-200:hover {
    background: var(--tailwind-violet-200);
}

.hover\:bg-tailwind-violet-300:hover {
    background: var(--tailwind-violet-300);
}

.hover\:bg-tailwind-violet-400:hover {
    background: var(--tailwind-violet-400);
}

.hover\:bg-tailwind-violet-500:hover {
    background: var(--tailwind-violet-500);
}

.hover\:bg-tailwind-violet-600:hover {
    background: var(--tailwind-violet-600);
}

.hover\:bg-tailwind-violet-700:hover {
    background: var(--tailwind-violet-700);
}

.hover\:bg-tailwind-violet-800:hover {
    background: var(--tailwind-violet-800);
}

.hover\:bg-tailwind-violet-900:hover {
    background: var(--tailwind-violet-900);
}

.hover\:bg-tailwind-violet-950:hover {
    background: var(--tailwind-violet-950);
}
/* TAILWIND GREEN */
.hover\:bg-tailwind-green-050:hover {
    background: var(--tailwind-green-050);
}

.hover\:bg-tailwind-green-100:hover {
    background: var(--tailwind-green-100);
}

.hover\:bg-tailwind-green-200:hover {
    background: var(--tailwind-green-200);
}

.hover\:bg-tailwind-green-300:hover {
    background: var(--tailwind-green-300);
}

.hover\:bg-tailwind-green-400:hover {
    background: var(--tailwind-green-400);
}

.hover\:bg-tailwind-green-500:hover {
    background: var(--tailwind-green-500);
}

.hover\:bg-tailwind-green-600:hover {
    background: var(--tailwind-green-600);
}

.hover\:bg-tailwind-green-700:hover {
    background: var(--tailwind-green-700);
}

.hover\:bg-tailwind-green-800:hover {
    background: var(--tailwind-green-800);
}

.hover\:bg-tailwind-green-900:hover {
    background: var(--tailwind-green-900);
}

.hover\:bg-tailwind-green-950:hover {
    background: var(--tailwind-green-950);
}
/* ------------------------------------------------------------------- 
 HOVER TEXT COLOR 
--------------------------------------------------------------------- */

.hover\:text-tailwind-white:hover {
    color: white;
}

.hover\:text-gray-cool-050:hover {
    color: var(--gray-cool-050);
}

.hover\:text-gray-cool-100:hover {
    color: var(--gray-cool-100);
}

.hover\:text-gray-cool-200:hover {
    color: var(--gray-cool-200);
}

.hover\:text-gray-cool-300:hover {
    color: var(--gray-cool-300);
}

.hover\:text-gray-cool-400:hover {
    color: var(--gray-cool-400);
}

.hover\:text-gray-cool-500:hover {
    color: var(--gray-cool-500);
}

.hover\:text-gray-cool-600:hover {
    color: var(--gray-cool-600);
}

.hover\:text-gray-cool-700:hover {
    color: var(--gray-cool-700);
}

.hover\:text-gray-cool-800:hover {
    color: var(--gray-cool-800);
}

.hover\:text-gray-cool-900:hover {
    color: var(--gray-cool-900);
}


/* VIVID BLUE */

.hover\:text-blue-vivid-050:hover {
    color: var(--blue-vivid-050);
}

.hover\:text-blue-vivid-100:hover {
    color: var(--blue-vivid-100);
}

.hover\:text-blue-vivid-200:hover {
    color: var(--blue-vivid-200);
}

.hover\:text-blue-vivid-300:hover {
    color: var(--blue-vivid-300);
}

.hover\:text-blue-vivid-400:hover {
    color: var(--blue-vivid-400);
}

.hover\:text-blue-vivid-500:hover {
    color: var(--blue-vivid-500);
}

.hover\:text-blue-vivid-600:hover {
    color: var(--blue-vivid-600);
}

.hover\:text-blue-vivid-700:hover {
    color: var(--blue-vivid-700);
}

.hover\:text-blue-vivid-800:hover {
    color: var(--blue-vivid-800);
}

.hover\:text-blue-vivid-900:hover {
    color: var(--blue-vivid-900);
}


/* CYAN BLUE */

.hover\:text-cyan-vivid-050:hover {
    color: var(--cyan-vivid-050);
}

.hover\:text-cyan-vivid-100:hover {
    color: var(--cyan-vivid-100);
}

.hover\:text-cyan-vivid-200:hover {
    color: var(--cyan-vivid-200);
}

.hover\:text-cyan-vivid-300:hover {
    color: var(--cyan-vivid-300);
}

.hover\:text-cyan-vivid-400:hover {
    color: var(--cyan-vivid-400);
}

.hover\:text-cyan-vivid-500:hover {
    color: var(--cyan-vivid-500);
}

.hover\:text-cyan-vivid-600:hover {
    color: var(--cyan-vivid-600);
}

.hover\:text-cyan-vivid-700:hover {
    color: var(--cyan-vivid-700);
}

.hover\:text-cyan-vivid-800:hover {
    color: var(--cyan-vivid-800);
}

.hover\:text-cyan-vivid-900:hover {
    color: var(--cyan-vivid-900);
}



/* ORANGE VIVID */

.hover\:text-orange-vivid-050:hover {
    color: var(--orange-vivid-050);
}

.hover\:text-orange-vivid-100:hover {
    color: var(--orange-vivid-100);
}

.hover\:text-orange-vivid-200:hover {
    color: var(--orange-vivid-200);
}

.hover\:text-orange-vivid-300:hover {
    color: var(--orange-vivid-300);
}

.hover\:text-orange-vivid-400:hover {
    color: var(--orange-vivid-400);
}

.hover\:text-orange-vivid-500:hover {
    color: var(--orange-vivid-500);
}

.hover\:text-orange-vivid-600:hover {
    color: var(--orange-vivid-600);
}

.hover\:text-orange-vivid-700:hover {
    color: var(--orange-vivid-700);
}

.hover\:text-orange-vivid-800:hover {
    color: var(--orange-vivid-800);
}

.hover\:text-orange-vivid-900:hover {
    color: var(--orange-vivid-900);
}

/* RED VIVID */

.hover\:text-red-vivid-050:hover {
    color: var(--red-vivid-050);
}

.hover\:text-red-vivid-100:hover {
    color: var(--red-vivid-100);
}

.hover\:text-red-vivid-200:hover {
    color: var(--red-vivid-200);
}

.hover\:text-red-vivid-300:hover {
    color: var(--red-vivid-300);
}

.hover\:text-red-vivid-400:hover {
    color: var(--red-vivid-400);
}

.hover\:text-red-vivid-500:hover {
    color: var(--red-vivid-500);
}

.hover\:text-red-vivid-600:hover {
    color: var(--red-vivid-600);
}

.hover\:text-red-vivid-700:hover {
    color: var(--red-vivid-700);
}

.hover\:text-red-vivid-800:hover {
    color: var(--red-vivid-800);
}

.hover\:text-red-vivid-900:hover {
    color: var(--red-vivid-900);
}

/* YELLOW VIVID */

.hover\:text-yellow-vivid-050:hover {
    color: var(--yellow-vivid-050);
}

.hover\:text-yellow-vivid-100:hover {
    color: var(--yellow-vivid-100);
}

.hover\:text-yellow-vivid-200:hover {
    color: var(--yellow-vivid-200);
}

.hover\:text-yellow-vivid-300:hover {
    color: var(--yellow-vivid-300);
}

.hover\:text-yellow-vivid-400:hover {
    color: var(--yellow-vivid-400);
}

.hover\:text-yellow-vivid-500:hover {
    color: var(--yellow-vivid-500);
}

.hover\:text-yellow-vivid-600:hover {
    color: var(--yellow-vivid-600);
}

.hover\:text-yellow-vivid-700:hover {
    color: var(--yellow-vivid-700);
}

.hover\:text-yellow-vivid-800:hover {
    color: var(--yellow-vivid-800);
}

.hover\:text-yellow-vivid-900:hover {
    color: var(--yellow-vivid-900);
}


/*TAILWIND TEAL */
.hover\:text-tailwind-teal-050:hover {
    color: var(--tailwind-teal-050);
}

.hover\:text-tailwind-teal-100:hover {
    color: var(--tailwind-teal-100);
}

.hover\:text-tailwind-teal-200:hover {
    color: var(--tailwind-teal-200);
}

.hover\:text-tailwind-teal-300:hover {
    color: var(--tailwind-teal-300);
}

.hover\:text-tailwind-teal-400:hover {
    color: var(--tailwind-teal-400);
}

.hover\:text-tailwind-teal-500:hover {
    color: var(--tailwind-teal-500);
}

.hover\:text-tailwind-teal-600:hover {
    color: var(--tailwind-teal-600);
}

.hover\:text-tailwind-teal-700:hover {
    color: var(--tailwind-teal-700);
}

.hover\:text-tailwind-teal-800:hover {
    color: var(--tailwind-teal-800);
}

.hover\:text-tailwind-teal-900:hover {
    color: var(--tailwind-teal-900);
}

/* TAILWIND SLATE */
.hover\:text-tailwind-slate-050:hover {
    color: var(--tailwind-slate-050);
}

.hover\:text-tailwind-slate-100:hover {
    color: var(--tailwind-slate-100);
}

.hover\:text-tailwind-slate-200:hover {
    color: var(--tailwind-slate-200);
}

.hover\:text-tailwind-slate-300:hover {
    color: var(--tailwind-slate-300);
}

.hover\:text-tailwind-slate-400:hover {
    color: var(--tailwind-slate-400);
}

.hover\:text-tailwind-slate-500:hover {
    color: var(--tailwind-slate-500);
}

.hover\:text-tailwind-slate-600:hover {
    color: var(--tailwind-slate-600);
}

.hover\:text-tailwind-slate-700:hover {
    color: var(--tailwind-slate-700);
}

.hover\:text-tailwind-slate-800:hover {
    color: var(--tailwind-slate-800);
}

.hover\:text-tailwind-slate-900:hover {
    color: var(--tailwind-slate-900);
}

.hover\:text-tailwind-slate-950:hover {
    color: var(--tailwind-slate-950);
}

/* TAILWIND SLATE */
.hover\:text-tailwind-blue-050:hover {
    color: var(--tailwind-blue-050);
}

.hover\:text-tailwind-blue-100:hover {
    color: var(--tailwind-blue-100);
}

.hover\:text-tailwind-blue-200:hover {
    color: var(--tailwind-blue-200);
}

.hover\:text-tailwind-blue-300:hover {
    color: var(--tailwind-blue-300);
}

.hover\:text-tailwind-blue-400:hover {
    color: var(--tailwind-blue-400);
}

.hover\:text-tailwind-blue-500:hover {
    color: var(--tailwind-blue-500);
}

.hover\:text-tailwind-blue-600:hover {
    color: var(--tailwind-blue-600);
}

.hover\:text-tailwind-blue-700:hover {
    color: var(--tailwind-blue-700);
}

.hover\:text-tailwind-blue-800:hover {
    color: var(--tailwind-blue-800);
}

.hover\:text-tailwind-blue-900:hover {
    color: var(--tailwind-blue-900);
}

.hover\:text-tailwind-blue-950:hover {
    color: var(--tailwind-blue-950);
}


/* TAILWIND RED */
.hover\:text-tailwind-red-050:hover {
    color: var(--tailwind-red-050);
}

.hover\:text-tailwind-red-100:hover {
    color: var(--tailwind-red-100);
}

.hover\:text-tailwind-red-200:hover {
    color: var(--tailwind-red-200);
}

.hover\:text-tailwind-red-300:hover {
    color: var(--tailwind-red-300);
}

.hover\:text-tailwind-red-400:hover {
    color: var(--tailwind-red-400);
}

.hover\:text-tailwind-red-500:hover {
    color: var(--tailwind-red-500);
}

.hover\:text-tailwind-red-600:hover {
    color: var(--tailwind-red-600);
}

.hover\:text-tailwind-red-700:hover {
    color: var(--tailwind-red-700);
}

.hover\:text-tailwind-red-800:hover {
    color: var(--tailwind-red-800);
}

.hover\:text-tailwind-red-900:hover {
    color: var(--tailwind-red-900);
}

.hover\:text-tailwind-red-950:hover {
    color: var(--tailwind-red-950);
}

/* TAILWIND VIOLET */
.hover\:text-tailwind-violet-050:hover {
    color: var(--tailwind-violet-050);
}

.hover\:text-tailwind-violet-100:hover {
    color: var(--tailwind-violet-100);
}

.hover\:text-tailwind-violet-200:hover {
    color: var(--tailwind-violet-200);
}

.hover\:text-tailwind-violet-300:hover {
    color: var(--tailwind-violet-300);
}

.hover\:text-tailwind-violet-400:hover {
    color: var(--tailwind-violet-400);
}

.hover\:text-tailwind-violet-500:hover {
    color: var(--tailwind-violet-500);
}

.hover\:text-tailwind-violet-600:hover {
    color: var(--tailwind-violet-600);
}

.hover\:text-tailwind-violet-700:hover {
    color: var(--tailwind-violet-700);
}

.hover\:text-tailwind-violet-800:hover {
    color: var(--tailwind-violet-800);
}

.hover\:text-tailwind-violet-900:hover {
    color: var(--tailwind-violet-900);
}

.hover\:text-tailwind-violet-950:hover {
    color: var(--tailwind-violet-950);
}
/* TAILWIND GREEN */
.hover\:text-tailwind-green-050:hover {
    color: var(--tailwind-green-050);
}

.hover\:text-tailwind-green-100:hover {
    color: var(--tailwind-green-100);
}

.hover\:text-tailwind-green-200:hover {
    color: var(--tailwind-green-200);
}

.hover\:text-tailwind-green-300:hover {
    color: var(--tailwind-green-300);
}

.hover\:text-tailwind-green-400:hover {
    color: var(--tailwind-green-400);
}

.hover\:text-tailwind-green-500:hover {
    color: var(--tailwind-green-500);
}

.hover\:text-tailwind-green-600:hover {
    color: var(--tailwind-green-600);
}

.hover\:text-tailwind-green-700:hover {
    color: var(--tailwind-green-700);
}

.hover\:text-tailwind-green-800:hover {
    color: var(--tailwind-green-800);
}

.hover\:text-tailwind-green-900:hover {
    color: var(--tailwind-green-900);
}

.hover\:text-tailwind-green-950:hover {
    color: var(--tailwind-green-950);
}


/* ------------------------------------------------------------------- 
 HOVER SHADOW COLORS

 Note: shadows should use rgb colors to be able to apply opacity.
    For example: --rgb-blue-vivid-500

--------------------------------------------------------------------- */

.hover\:shadow-blue-vivid-050:hover {
    --tw-shadow-color: var(--rgb-blue-vivid-050);
}

.hover\:shadow-blue-vivid-100:hover {
    --tw-shadow-color: var(--rgb-blue-vivid-100);
}

.hover\:shadow-blue-vivid-200:hover {
    --tw-shadow-color: var(--rgb-blue-vivid-200);
}

.hover\:shadow-blue-vivid-300:hover {
    --tw-shadow-color: var(--rgb-blue-vivid-300);
}

.hover\:shadow-blue-vivid-400:hover {
    --tw-shadow-color: var(--rgb-blue-vivid-400);
}

.hover\:shadow-blue-vivid-500:hover {
    --tw-shadow-color: var(--rgb-blue-vivid-500);
}

.hover\:shadow-blue-vivid-600:hover {
    --tw-shadow-color: var(--rgb-blue-vivid-600);
}

.hover\:shadow-blue-vivid-700:hover {
    --tw-shadow-color: var(--rgb-blue-vivid-700);
}

.hover\:shadow-blue-vivid-800:hover {
    --tw-shadow-color: var(--rgb-blue-vivid-800);
}

.hover\:shadow-blue-vivid-900:hover {
    --tw-shadow-color: var(--rgb-blue-vivid-900);
}



/* GRAY COOL */

.hover\:shadow-gray-cool-050:hover {
    --tw-shadow-color: var(--rgb-gray-cool-050);
}

.hover\:shadow-gray-cool-100:hover {
    --tw-shadow-color: var(--rgb-gray-cool-100);
}

.hover\:shadow-gray-cool-200:hover {
    --tw-shadow-color: var(--rgb-gray-cool-200);
}

.hover\:shadow-gray-cool-300:hover {
    --tw-shadow-color: var(--rgb-gray-cool-300);
}

.hover\:shadow-gray-cool-400:hover {
    --tw-shadow-color: var(--rgb-gray-cool-400);
}

.hover\:shadow-gray-cool-500:hover {
    --tw-shadow-color: var(--rgb-gray-cool-500);
}

.hover\:shadow-gray-cool-600:hover {
    --tw-shadow-color: var(--rgb-gray-cool-600);
}

.hover\:shadow-gray-cool-700:hover {
    --tw-shadow-color: var(--rgb-gray-cool-700);
}

.hover\:shadow-gray-cool-800:hover {
    --tw-shadow-color: var(--rgb-gray-cool-800);
}

.hover\:shadow-gray-cool-900:hover {
    --tw-shadow-color: var(--rgb-gray-cool-900);
}


/* CYAN VIVID */

.hover\:shadow-cyan-vivid-050:hover {
    --tw-shadow-color: var(--rgb-cyan-vivid-050);
}

.hover\:shadow-cyan-vivid-100:hover {
    --tw-shadow-color: var(--rgb-cyan-vivid-100);
}

.hover\:shadow-cyan-vivid-200:hover {
    --tw-shadow-color: var(--rgb-cyan-vivid-200);
}

.hover\:shadow-cyan-vivid-300:hover {
    --tw-shadow-color: var(--rgb-cyan-vivid-300);
}

.hover\:shadow-cyan-vivid-400:hover {
    --tw-shadow-color: var(--rgb-cyan-vivid-400);
}

.hover\:shadow-cyan-vivid-500:hover {
    --tw-shadow-color: var(--rgb-cyan-vivid-500);
}

.hover\:shadow-cyan-vivid-600:hover {
    --tw-shadow-color: var(--rgb-cyan-vivid-600);
}

.hover\:shadow-cyan-vivid-700:hover {
    --tw-shadow-color: var(--rgb-cyan-vivid-700);
}

.hover\:shadow-cyan-vivid-800:hover {
    --tw-shadow-color: var(--rgb-cyan-vivid-800);
}

.hover\:shadow-cyan-vivid-900:hover {
    --tw-shadow-color: var(--rgb-cyan-vivid-900);
}



/* ------------------------------------------------------------------- 
 HOVER UNDERLINE OFFSET 
--------------------------------------------------------------------- */
.hover\:underline:hover {
    text-decoration-line: underline;
}

.hover\:underline-offset-2:hover {
    text-underline-offset: 2px;
}



/* ------------------------------------------------------------------- 
  HOVER FONT-WEIGHT
---------------------------------------------------------------------- */

.hover\:font-thin:hover {
    font-weight: 100;
}

.hover\:font-extralight:hover {
    font-weight: 200;
}

.hover\:font-light:hover {
    font-weight: 300;
}

.hover\:font-normal:hover {
    font-weight: 400;
}

.hover\:font-medium:hover {
    font-weight: 500;
}

.hover\:font-semibold:hover {
    font-weight: 600;
}

.hover\:font-bold:hover {
    font-weight: 700;
}

.hover\:font-extrabold:hover {
    font-weight: 800;
}

.hover\:font-black:hover {
    font-weight: 900;
}