/* purple */
.text-purple {
    color: #6f42c1 !important
}
.bg-purple{
    background-color: #6f42c1 !important
}
.border-purple{
    border-color: #6f42c1 !important;
}
.bg-purple.badge-label::before{
    border-right-color: #6f42c1 !important;
}
.btn-purple{
    color: #fff;
    background-color: #6f42c1 !important;
    border-color: #6f42c1 !important;
}
.btn-outline-purple{
    color: #6f42c1 !important;
    border-color: #6f42c1 !important;  
}
.btn-outline-purple:hover{
    color: #fff;
    background-color: #6f42c1 !important;
    border-color: #6f42c1 !important;  
}

.btn-check:active+.btn-outline-purple:focus, .btn-check:checked+.btn-outline-purple:focus, .btn-outline-purple.active:focus, .btn-outline-purple.dropdown-toggle.show:focus, .btn-outline-purple:active:focus {
    box-shadow: 0 0 0 0 rgb(111, 66, 193, .5) !important;
}
.btn-check:active+.btn-outline-purple, .btn-check:checked+.btn-outline-purple, .btn-outline-purple.active, .btn-outline-purple.dropdown-toggle.show, .btn-outline-purple:active {
    color: #fff;
    background-color: #6f42c1 !important;
    border-color: #6f42c1 !important;
}

/* pink */
.text-pink{
    color: #e83e8c !important;
}
.bg-pink{
    background-color: #e83e8c !important; 
}
.border-pink{
    border-color: #e83e8c !important;
}
.bg-pink.badge-label::before{
    border-right-color: #e83e8c !important;
}
.btn-pink{
    color: #fff;
    background-color: #e83e8c !important;
    border-color: #e83e8c !important;
}
.btn-outline-pink{
    color: #e83e8c !important;
    border-color: #e83e8c !important;  
}
.btn-outline-pink:hover{
    color: #fff;
    background-color: #e83e8c !important;
    border-color: #e83e8c !important;  
}

.btn-check:active+.btn-outline-pink:focus, .btn-check:checked+.btn-outline-pink:focus, .btn-outline-pink.active:focus, .btn-outline-pink.dropdown-toggle.show:focus, .btn-outline-pink:active:focus {
    box-shadow: 0 0 0 0 rgb(232, 62, 140, .5) !important;
}
.btn-check:active+.btn-outline-pink, .btn-check:checked+.btn-outline-pink, .btn-outline-pink.active, .btn-outline-pink.dropdown-toggle.show, .btn-outline-pink:active {
    color: #fff;
    background-color: #e83e8c !important;
    border-color: #e83e8c !important;
}

/* indigo */
.text-indigo{
    color: #6610f2 !important;
}
.bg-indigo{
    background-color: #6610f2 !important; 
}
.border-indigo{
    border-color: #6610f2 !important;
}
.bg-indigo.badge-label::before{
    border-right-color: #6610f2 !important;
}
.btn-indigo{
    color: #fff;
    background-color: #6610f2 !important;
    border-color: #6610f2 !important;
}
.btn-outline-indigo{
    color: #6610f2 !important;
    border-color: #6610f2 !important;  
}
.btn-outline-indigo:hover{
    color: #fff;
    background-color: #6610f2 !important;
    border-color: #6610f2 !important;  
}

.btn-check:active+.btn-outline-indigo:focus, .btn-check:checked+.btn-outline-indigo:focus, .btn-outline-indigo.active:focus, .btn-outline-indigo.dropdown-toggle.show:focus, .btn-outline-indigo:active:focus {
    box-shadow: 0 0 0 0 rgb(102, 16, 242, .5) !important;
}
.btn-check:active+.btn-outline-indigo, .btn-check:checked+.btn-outline-indigo, .btn-outline-indigo.active, .btn-outline-indigo.dropdown-toggle.show, .btn-outline-indigo:active {
    color: #fff;
    background-color: #6610f2 !important;
    border-color: #6610f2 !important;
}

/* cyan */
.text-cyan{
    color: #17a2b8 !important;
}
.bg-cyan{
    background-color: #17a2b8 !important; 
}
.border-cyan{
    border-color: #17a2b8 !important;
}
.bg-cyan.badge-label::before{
    border-right-color: #17a2b8 !important;
}
.btn-cyan{
    color: #fff;
    background-color: #17a2b8 !important;
    border-color: #17a2b8 !important;
}
.btn-outline-cyan{
    color: #17a2b8 !important;
    border-color: #17a2b8 !important;  
}
.btn-outline-cyan:hover{
    color: #fff;
    background-color: #17a2b8 !important;
    border-color: #17a2b8 !important;  
}

.btn-check:active+.btn-outline-cyan:focus, .btn-check:checked+.btn-outline-cyan:focus, .btn-outline-cyan.active:focus, .btn-outline-cyan.dropdown-toggle.show:focus, .btn-outline-cyan:active:focus {
    box-shadow: 0 0 0 0 rgb(23, 162, 184, .5) !important;
}
.btn-check:active+.btn-outline-cyan, .btn-check:checked+.btn-outline-cyan, .btn-outline-cyan.active, .btn-outline-cyan.dropdown-toggle.show, .btn-outline-cyan:active {
    color: #fff;
    background-color: #17a2b8 !important;
    border-color: #17a2b8 !important;
}

/* teal */
.text-teal{
    color: #76d87e !important;
}
.bg-teal{
    background-color: #76d87e !important; 
}
.border-teal{
    border-color: #76d87e !important;
}
.bg-teal.badge-label::before{
    border-right-color: #76d87e !important;
}
.btn-teal{
    color: #fff;
    background-color: #76d87e !important;
    border-color: #76d87e !important;
}
.btn-outline-teal{
    color: #76d87e !important;
    border-color: #76d87e !important;  
}
.btn-outline-teal:hover{
    color: #fff;
    background-color: #76d87e !important;
    border-color: #76d87e !important;  
}

.btn-check:active+.btn-outline-teal:focus, .btn-check:checked+.btn-outline-teal:focus, .btn-outline-teal.active:focus, .btn-outline-teal.dropdown-toggle.show:focus, .btn-outline-teal:active:focus {
    box-shadow: 0 0 0 0 rgb(118, 216, 126, .5) !important;
}
.btn-check:active+.btn-outline-teal, .btn-check:checked+.btn-outline-teal, .btn-outline-teal.active, .btn-outline-teal.dropdown-toggle.show, .btn-outline-teal:active {
    color: #fff;
    background-color: #76d87e !important;
    border-color: #76d87e !important;    
}


/* brown */
.text-brown{
    color: #5c1000 !important;
}
.bg-brown{
    background-color: #5c1000 !important; 
}
.border-brown{
    border-color: #5c1000 !important;
}
.bg-brown.badge-label::before{
    border-right-color: #5c1000 !important;
}
.btn-brown{
    color: #fff;
    background-color: #5c1000 !important;
    border-color: #5c1000 !important;
}
.btn-outline-brown{
    color: #5c1000 !important;
    border-color: #5c1000 !important;  
}
.btn-outline-brown:hover{
    color: #fff;
    background-color: #5c1000 !important;
    border-color: #5c1000 !important;  
}

.btn-check:active+.btn-outline-brown:focus, .btn-check:checked+.btn-outline-brown:focus, .btn-outline-brown.active:focus, .btn-outline-brown.dropdown-toggle.show:focus, .btn-outline-brown:active:focus {
    box-shadow: 0 0 0 0 rgb(92, 16, 0, .5) !important;
}
.btn-check:active+.btn-outline-brown, .btn-check:checked+.btn-outline-brown, .btn-outline-brown.active, .btn-outline-brown.dropdown-toggle.show, .btn-outline-brown:active {
    color: #fff;
    background-color: #5c1000 !important;
    border-color: #5c1000 !important;
}