/* Background Colors*/

/* - - - DARK - - - */

.bg-dark-100 { /* body background */
    background-color: rgb(38, 45, 51);
}
/*  */

.bg-dark-200 { /* Table body, navmenu, login page right side background */
    background-color: rgba(45, 53, 60);
}
/*  */

.bg-dark-300 {
    background-color: rgb(38, 45, 51);
}
/*  */

.bg-dark-400 { /* login page left side bg */
    background-color: rgb(22, 26, 29);
}
/*  */

.bg-dark-500 { /* table head */
    background-color: rgb(32, 37, 42);
}
/*  */

.bg-dark-600 { /* account select account box bg */
    background-color: rgb(41, 41, 41);
}
/*  */

.bg-dark-700 { /* button green dark */
    background-color: rgb(61, 165, 138);
}
/*  */


/* - - - LIGHT- - - */

.bg-light-100 { /* body background */
    background-color: rgb(245, 245, 245);
}
/*  */

.bg-light-200 { /* button green light */
    background-color: rgb(112, 216, 189);
}
/*  */

.bg-light-300 { /* button green light */
    background-color: rgb(222, 226, 230);
}
/*  */


/* - - - Other - - - */

.bg-color-50 {
    background-color: rgb(255, 255, 255);
}
/* #000000 */

.bg-color-100{
    background-color: rgb(0, 0, 0);
}
/* #000000 */

.bg-color-200 {
    --tw-bg-opacity: 1;
    background-color: rgb(0, 172, 172);
}
/*  */

.bg-color-300 { /* blue */
    background-color: rgb(0, 123, 255);
}
/*  */

.bg-color-400 { /* red */
    background-color: rgb(239, 68, 68);
}
/*  */


/* TEXT */
.text-light {
    color: rgb(255, 255, 255);
}
/*  */

.text-dark {
    color: rgba(0, 0, 0, 0.87);
}
/*  */

.text-blue {
    color: rgb(0, 123, 255);
}

.text-color-100 {
    color: rgb(207, 207, 207);
}


/* BACKGROUND HOVER */

.hover\:bg-hover-100:hover { /* account select account box hover */
    background-color: rgb(61, 165, 138);
}
/*  */

.hover\:bg-hover-200:hover { /* tob bar icon hover dark */
    background-color: rgb(55, 60, 65);
}
/*  */

.hover\:bg-hover-300:hover { /* tob bar icon hover light */
    background-color: rgb(207, 207, 207);
}
/*  */

.hover\:bg-hover-400:hover { /* navmenu item */
    background-color: rgb(32, 36, 39);
}
/*  */

.hover\:bg-hover-500:hover { /* green button */
    background-color: rgb(12, 106, 79);
}
/*  */

.hover\:bg-hover-600:hover { /* red light */
    background-color: rgb(252, 165, 165);
}
/*  */

.hover\:bg-hover-700:hover { /* red dark */
    background-color: rgb(185, 28, 28);
}
/*  */

.hover\:bg-hover-800:hover { /* light blue */
    background-color: rgb(0, 100, 200);
}
/*  */



/* COLOR */

.color-100 {
    background-color: rgb(219, 79, 74);
}
/*  */

.color-200 {
    background-color: rgb(51, 152, 255);
}
/*  */

.color-300 {
    background-color: rgba(0, 0, 0, 0.87);
}
/*  */


/* BORDER */

.border-color-400 {
    border-color: rgb(229, 231, 235)
}
/*  */

.border-color-500 {
    border-color: rgb(159, 181, 185)
}
/*  */


/* Hover Border Color Classes */

/* For hover border color 100 */
.hover\:border-color-100:hover {
    border-color: rgb(0, 100, 200); /* Custom hover color */
}

/* For hover border color 200 */
.hover\:border-color-200:hover {
    border-color: rgb(51, 152, 255); /* Original color-200 */
}

/* For hover border color 300 */
.hover\:border-color-300:hover {
    border-color: rgba(0, 0, 0, 0.87); /* Original color-300 */
}