/* Also take a look at GenerateCustomCss function in utils.js */

.c_no_x_scrollbar{
	overflow-x: hidden !important;
}

.c_no_y_scrollbar{
	overflow-y: hidden !important;
}

/* Suprisingly, Bootstrap 5 doesn't have class to justify text */
.c_text-justify{
	text-align: justify;
}

.c_text-red{
    color: red;
}

.c_text-teal {
    color: #00D8C9;
}

.c_text-sky-blue{
    color: #00A2E8;
}

.c_text-brown{
    color: #6E483A;
}

.c_text-money{
    color: #588373;
}

.c_text-royal-blue{
    color: #2751AB;
}

.c_text-silver{
    color: #BEBEBE;
}

.c_bg{
    background-color: var(--c,#F1F5F9);
}

.c_card-float:hover{
    transform: translateY(-10px) scale(1.05);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
}

.c_card-float-no-shadow:hover{
    transform: translateY(-10px) scale(1.05);
}


/* Make changing hover color accessible from inline css */
.c_hover:hover{
    background-color: var(--c,#F1F5F9);
}

.c_hover-text:hover{
    color: var(--c,#F1F5F9);
}

.c_pointer{
    cursor: pointer;
}

.c_ratio-16-9{
    aspect-ratio: 16 / 9;
}

.c_background-img{
    background: url("../img/loginBackground/background4.jpg");
    color: white;
    @media (min-width: 1366px){
        background-size: 100%;
    }
}

.c_text-invert{
    color: white;
    mix-blend-mode: difference;
}

.c_transparency {
    opacity: var(--o, 0.5);
}

.c_square{
    width: var(--s, 34px);
    height: var(--s, 34px);
}