/*================================================================================
	Item Name: Vuexy - Vuejs, HTML & Laravel Admin Dashboard Template
	Version: 2.0
	Author: PIXINVENT
	Author URL: http://www.themeforest.net/user/pixinvent
================================================================================

NOTE:
------
PLACE HERE YOUR OWN SCSS CODES AND IF NEEDED, OVERRIDE THE STYLES FROM THE OTHER STYLESHEETS.
WE WILL RELEASE FUTURE UPDATES SO IN ORDER TO NOT OVERWRITE YOUR STYLES IT'S BETTER LIKE THIS.  */

:root {
	--cs-red: #E21D28; /*#2f3848;*/
	--cs-white: #FFFFFF;
	--cs-orange: darkorange;
  }

.blockquote {
	font-size: 14px;
}

.text-primary {
    color: var(--cs-red) !important;
}

.brand-text {
	color: var(--cs-red) !important;
}

.blockquote.border-left-primary {
    border-left: 1px solid var(--cs-red);
}

.btn-primary {
    border-color: var(--cs-red) !important;
    background-color: var(--cs-red) !important;
    color: #FFFFFF !important;
}

.btn-flat-primary {
    background-color: transparent;
    color: var(--cs-red);
}

.btn-primary:focus, .btn-primary:active, .btn-primary.active {
    color: #FFFFFF;
    background-color: var(--cs-red) !important;
}

.badge.badge-light-primary {
    background-color: rgba(226, 29, 40, 0.12);
    color: var(--cs-red) !important;
}

.alert-primary {
    background:  #A2A5A8 !important; /*rgba(226, 29, 40, 0.12) !important;*/
    color: var(--cs-white) !important;
}


.custom-control-input:not(:disabled):checked ~ .custom-control-label::before {
	background-color : var(--cs-red) !important;
	border-color : var(--cs-red) !important;
}

.custom-control-input:not(:disabled):active ~ .custom-control-label::before {
background-color : var(--cs-red) !important;
border-color : var(--cs-red) !important;
}

.custom-control-input:disabled:checked ~ .custom-control-label::before {
	background-color : var(--cs-red) !important;
	border-color : var(--cs-red) !important;
}

.custom-control-input:disabled:active ~ .custom-control-label::before {
background-color : var(--cs-red) !important;
border-color : var(--cs-red) !important;
}

.bg-light-primary {
    /* background: rgba(226, 29, 40, 0.12) !important; */
    background: rgba(130, 134, 138, 0.05) !important; 
    color: var(--cs-red) !important;
}

.card-header-epp {
    /* background: var(--cs-red) !important;  */
    background: rgba(226, 29, 40, 1) !important; 
    color: var(--cs-white) !important;

}

.btn-outline-primary {
    border: 1px solid var(--cs-red) !important;
    background-color: transparent;
    color: var(--cs-red);
}

.btn-outline-primary:hover:not(.disabled):not(:disabled) {
    background: rgba(226, 29, 40, 0.1) !important; 
    color: var(--cs-red);
}

.btn-outline-white {
    border: 1px solid var(--cs-white) !important;
    background-color: var(--cs-white);
    color: var(--cs-red);
}

.btn-outline-white:hover:not(.disabled) {
    background: var(--cs-white) !important; 
    color: var(--cs-red);
}

.badge-primary {
    color: #FFFFFF;
    background-color: var(--cs-red) !important;
    font-size: 120%;
}

.card-red {
    background-color: var(--cs-red) !important;
}

.badge-white {
    color: var(--cs-red) !important;
    background-color: white !important;
}

.mb-15, .my-15 {
    margin-bottom: 0.15rem !important;
}

.card-profile .card-body {
    position: relative;
    padding: 2rem 2.3rem 1.5rem 2.3rem;
}

.badge-indicateur-primary {
    color: #FFFFFF;
    background-color: var(--cs-red) !important;
    font-size: 130%;
}

.badge-indicateur-secondary {
    color: white;
    background-color: #A2A5A8 !important;
    font-size: 130%;
}