:root {
    --background-color-menu-dark: #9da3f8;
    --background-navigation-light:#dee0fd;
    --background-color-menu-light: #ffffff;
    --background-color-logo: #ffffff;
    --background-color-button: #6bd6cc;
    --icon-brand-menu:#000000;
    --text-color-menu: #8e8fa0;
    --text-color-menu-selected: #353535;
    --text-color-overall: #ffffff;
    --color-icon: #ffffff;
    --color-hover-icon: #9070BB;
    --color-sub-icon: #ffffff;
    --color-atyl-text: #9da3f8;

    --font-family: "Poppins";
    --background-color-overall: #9da3f8;
    --background-header-card: #7b75a1;
    --color-header-card: #ffffff;
    --color-header-desc: #ffffff;
    --background-item-menu-selected: #9da3f8;
    --background-item-menu: #ffffff;
    --background-notif-icon : #a90e69;
    --text-color-link-blue: #24428F;

    --background-dialog: #efefef;
    --text-dialog: #55aba3;

    --background-row-even: #f7f8fa;
    --background-row-odd: #050cc30f;

    --btn-submit: #6BD6CC;
    /*
    --text-color-menu: #2D0A5C;
    --color-icon: #2D0A5C;
    --color-sub-icon: #5c5e81;
    */
}
body {
    font-family: var(--font-family);
    background: var(--background-color-overall) !important;
}
.kt-header__topbar .kt-header__topbar-item {
    position: relative;
}
.notif-icon {
    position: absolute;
    bottom: 9px;
    right: 0px;
    background-color: var(--background-notif-icon);
    padding: 1px 7px 0px 7px;
    color: white;
    font-size: 10px;
    font-weight: 600;
    border-radius: 20px;
    pointer-events: none;
}
.kt-aside {
    background-color: var(--background-color-menu-light) !important;
}
@media (min-width: 1025px){
    .kt-aside__brand {
        background-color: var(--background-color-logo) !important;
    }
    .kt-aside__brand-logo img {
        width: 100%;
    }
    .kt-aside__brand .kt-aside__brand-tools .kt-aside__brand-aside-toggler svg g [fill] {
        fill: var(--icon-brand-menu) !important;
    }
    .kt-aside--minimize .kt-aside-menu .kt-menu__nav>.kt-menu__item>.kt-menu__link>.kt-menu__link-icon {
        color: #545454;
        margin-left: -5px;
    }
    .kt-aside--minimize .kt-aside-menu .kt-menu__nav>.kt-menu__item.kt-menu__item--active>.kt-menu__link>.kt-menu__link-icon, .kt-aside--minimize .kt-aside-menu .kt-menu__nav>.kt-menu__item.kt-menu__item--here>.kt-menu__link>.kt-menu__link-icon {
        color:white;
    }
    
}
@media (min-width: 1025px) and (max-width: 1280px){
    
    .dossier-page-categorie{
        height: 50vh !important;
    }
}
@media (max-width: 1024px) {
    .kt-header-mobile {
        background-color: var(--background-color-logo);
    }

    kt-subheader {
        margin-bottom: 20px;
    }
    .btn {
        font-size: 0.8vw !important;
    }
    .dossier-page-categorie{
        height: 50vh !important;
    }
}
@media (max-width: 880px){
    .col-cus-12{
        flex: 0 0 100%;
        max-width: 100%;
    }
}
    
.kt-login.kt-login--v1 .kt-login__wrapper {
    background-color: var(--background-color-overall) !important;
}
kt-login h3, kt-login span, kt-login label, kt-login input {
    color: white !important;
}
input:-internal-autofill-selected {
    background-color: transparent !important;
}
.kt-aside-menu {
    background-color: var(--background-color-menu-light) !important;
}

.kt-aside-menu .kt-menu__nav>.kt-menu__item.kt-menu__item--active>.kt-menu__heading,
.kt-aside-menu .kt-menu__nav>.kt-menu__item.kt-menu__item--active>.kt-menu__link {
    background-color: var(--background-color-menu-light) !important;
}

.kt-aside .kt-aside-menu>.kt-menu__nav .kt-menu__item>.kt-menu__link:not(.kt-menu__link--active):not(.kt-menu__link--here):not(.kt-menu__link--hover) [class*=" flaticon2-"],
.kt-aside .kt-aside-menu>.kt-menu__nav .kt-menu__item>.kt-menu__link:not(.kt-menu__link--active):not(.kt-menu__link--here):not(.kt-menu__link--hover) [class^=flaticon2-] {
    color: #545e7b;
}

.kt-aside-menu .kt-menu__nav>.kt-menu__item>.kt-menu__heading .kt-menu__link-text,
.kt-aside-menu .kt-menu__nav>.kt-menu__item>.kt-menu__link .kt-menu__link-text {
    color: var(--text-color-menu);
}

.kt-aside-menu .kt-menu__nav>.kt-menu__item:not(.kt-menu__item--parent):not(.kt-menu__item--open):not(.kt-menu__item--here):not(.kt-menu__item--active):hover>.kt-menu__heading,
.kt-aside-menu .kt-menu__nav>.kt-menu__item:not(.kt-menu__item--parent):not(.kt-menu__item--open):not(.kt-menu__item--here):not(.kt-menu__item--active):hover>.kt-menu__link {
    background-color: var(--background-color-menu-light) !important;
    
}
.kt-aside-menu .kt-menu__nav>.kt-menu__item.kt-menu__item--here>.kt-menu__heading, .kt-aside-menu .kt-menu__nav>.kt-menu__item.kt-menu__item--here>.kt-menu__link {
    background-color: var(--background-item-menu-selected) !important;
    box-shadow: 2px 3px 4px 0px #dedede;
    border-bottom-right-radius: 20px;
}
.kt-aside-menu .kt-menu__nav>.kt-menu__item.kt-menu__item--open>.kt-menu__heading, .kt-aside-menu .kt-menu__nav>.kt-menu__item.kt-menu__item--open>.kt-menu__link {
    background-color: var(--background-color-menu-light) !important;
}

.kt-aside-menu .kt-menu__nav>.kt-menu__item.kt-menu__item--active>.kt-menu__heading .kt-menu__link-icon, .kt-aside-menu .kt-menu__nav>.kt-menu__item.kt-menu__item--active>.kt-menu__link .kt-menu__link-icon {
    color: white;
}

.kt-aside-menu .kt-menu__nav>.kt-menu__item .kt-menu__submenu .kt-menu__item.kt-menu__item--open>.kt-menu__heading, .kt-aside-menu .kt-menu__nav>.kt-menu__item .kt-menu__submenu .kt-menu__item.kt-menu__item--open>.kt-menu__link {
    background-color: var(--background-color-menu-light) !important;
}
.kt-aside-menu .kt-menu__nav>.kt-menu__item .kt-menu__submenu .kt-menu__item:not(.kt-menu__item--parent):not(.kt-menu__item--open):not(.kt-menu__item--here):not(.kt-menu__item--active):hover>.kt-menu__heading, .kt-aside-menu .kt-menu__nav>.kt-menu__item .kt-menu__submenu .kt-menu__item:not(.kt-menu__item--parent):not(.kt-menu__item--open):not(.kt-menu__item--here):not(.kt-menu__item--active):hover>.kt-menu__link {
    background-color: white;
}
.kt-aside-menu .kt-menu__nav>.kt-menu__item .kt-menu__submenu .kt-menu__item.kt-menu__item--open>.kt-menu__heading, .kt-aside-menu .kt-menu__nav>.kt-menu__item .kt-menu__submenu .kt-menu__item.kt-menu__item--open>.kt-menu__link {
    background-color: var(--background-color-menu-light) !important;
}
.kt-aside-menu .kt-menu__nav>.kt-menu__item .kt-menu__submenu .kt-menu__item.kt-menu__item--active>.kt-menu__heading, .kt-aside-menu .kt-menu__nav>.kt-menu__item .kt-menu__submenu .kt-menu__item.kt-menu__item--active>.kt-menu__link {
    background-color: var(--background-color-menu-light) !important;
}
.kt-aside-menu .kt-menu__nav>.kt-menu__item .kt-menu__submenu .kt-menu__item>.kt-menu__heading .kt-menu__link-text, .kt-aside-menu .kt-menu__nav>.kt-menu__item .kt-menu__submenu .kt-menu__item>.kt-menu__link .kt-menu__link-text {
    color: var(--text-color-menu);
}
.kt-aside-menu .kt-menu__nav>.kt-menu__item .kt-menu__submenu .kt-menu__item.kt-menu__item--here>.kt-menu__heading, .kt-aside-menu .kt-menu__nav>.kt-menu__item .kt-menu__submenu .kt-menu__item.kt-menu__item--here>.kt-menu__link {
    background-color: var(--background-color-menu-light) !important;
}

.kt-aside-menu .kt-menu__nav>.kt-menu__item.kt-menu__item--active>.kt-menu__heading .kt-menu__link-text, .kt-aside-menu .kt-menu__nav>.kt-menu__item.kt-menu__item--active>.kt-menu__link .kt-menu__link-text{
    color: white;
}
.kt-aside-menu .kt-menu__nav>.kt-menu__item:not(.kt-menu__item--parent):not(.kt-menu__item--open):not(.kt-menu__item--here):not(.kt-menu__item--active):hover>.kt-menu__heading .kt-menu__link-text, .kt-aside-menu .kt-menu__nav>.kt-menu__item:not(.kt-menu__item--parent):not(.kt-menu__item--open):not(.kt-menu__item--here):not(.kt-menu__item--active):hover>.kt-menu__link .kt-menu__link-text {
    color: var(--text-color-menu-selected) !important;
}
.kt-aside-menu .kt-menu__nav>.kt-menu__item>.kt-menu__link {
    background-color: var(--background-item-menu) !important;
    margin-left: 10px;
    margin-right: 5px;
}
.kt-aside-menu .kt-menu__nav>.kt-menu__item:not(:first-child)>.kt-menu__link {
    margin-top: 5px;
}
.kt-aside .kt-aside-menu {
 margin: 0px !important;
}
.kt-menu__nav {
    padding: 0px !important;
}
.kt-subheader {
    background-color : var(--background-header-card) !important;
    padding-left: 0px !important;
}
.kt-subheader__title, .kt-subheader__desc{
    color: var(--color-header-card) !important;
}
.kt-subheader__desc{
    color: var(--color-header-desc) !important;
}
.kt-header .kt-header__topbar .kt-header__topbar-item .kt-header__topbar-icon svg g [fill]{
    fill: #575757 !important;
}
mat-card-header {
    border-bottom: 1px solid #cecece;
    color: var(--background-color-overall) !important;
}
app-form-atyl mat-card-header{
    border-bottom: 1px solid #cecece;
    /* color: var(--text-dialog) !important; */
    color:  var(--background-color-menu-dark) !important;


}
.header-card{
    margin-left: -16px;
    margin-top: -16px !important;
    margin-right: -16px;
    padding: 16px 16px 0px 16px;
    background-color: var(--background-header-card);
    color : var(--color-header-card);
}
mat-card-content {
    padding: 20px 20px 5px 20px;
}
mat-list-item:not(:last-child) .mat-list-item-content {
	border-bottom: 1px solid #e8e8e8;
}
.btn-outline-atyl{
   /* color: #f1f1f1 !important;*/
    color: #000000 !important;
  /*  border-color: #d2d6c0 !important;*/
    border: 1px solid #FFFFFF !important;
}
.btn-outline-card-atyl{
    color: grey !important;
    border-color: #d2d6c0 !important;

}
.btn-primary-atyl{
    background-color: var(--background-color-button) !important;
    border-color: var(--background-color-button) !important;
   /*/ color: #fff !important;*/
    color: #000000 !important;
}

.btn-submit-atyl{
    font-size: 0.8vw !important;
    transition: opacity .25s,transform .7s;
    position: relative;
    overflow: hidden;
    display: flex !important;
    z-index: 0;
}
.btn-submit-atyl::after{
    content: "";
    background: var(--btn-submit);
    position: absolute;
    top: 0;
    left: 0;
    width: 200%;
    height: 100%;    
    z-index: -1;
}
.btn-submit-atyl span{
  /*  color: #fff !important;*/
  color: #000000 !important;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}
.btn-submit-atyl i{
    font-size: 1vw !important;
}
.loading-container{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    z-index: 1;
    background-color: #ffffffe0;
}
.loading-container mat-spinner{
    color: var(--background-color-overall) !important;
}
.mat-progress-spinner circle, .mat-spinner circle {
    stroke: var(--background-color-overall) !important;
}
.mat-snack-bar-container{
    color: rgb(255, 255, 255);
    font-weight: 500;
    background: #b1ca35;
}

kt-assistmat > :not(mat-card) > .mat-form-field-appearance-legacy .mat-form-field-label, 
kt-mam-list > :not(mat-card) > .mat-form-field-appearance-legacy .mat-form-field-label, 
kt-eaje-list > :not(mat-card) > .mat-form-field-appearance-legacy .mat-form-field-label{
    color: rgba(255, 255, 255, 0.84) !important;
}
kt-assistmat > :not(mat-card) > input.mat-input-element, 
kt-mam-list > :not(mat-card) > input.mat-input-element, 
kt-eaje-list > :not(mat-card) > input.mat-input-element {
    color: white !important;
}

kt-assistmat > :not(mat-card) > .mat-form-field.mat-focused .mat-form-field-ripple,
kt-mam-list > :not(mat-card) > .mat-form-field.mat-focused .mat-form-field-ripple,
kt-eaje-list > :not(mat-card) > .mat-form-field.mat-focused .mat-form-field-ripple {
    background-color: #ffffff !important;
}

kt-assistmat > :not(mat-card) > .mat-form-field.mat-focused .mat-form-field-label,
kt-mam-list > :not(mat-card) > .mat-form-field.mat-focused .mat-form-field-label,
kt-eaje-list > :not(mat-card) > .mat-form-field.mat-focused .mat-form-field-ripple {
    color: white !important;
}

.select-with-bg .mat-select-arrow {
    color: rgba(255, 255, 255, 0.84) !important;
}

.select-with-bg mat-label{
    color: rgba(255, 255, 255, 0.84) !important;
}
.select-with-bg .mat-select-value {
   /* color: white;*/
     color: #000000;
}
.select-with-bg .mat-input-element {
    /*color: white;*/
    color: #000000;
}
.bg-text{
     /*color: white;*/
    color: #000000;
}
.white-text{
     /*color: white;*/
    color: #000000;
}
.kt-menu__nav{
    padding-top: 0px;
}
.container-header{
    overflow: hidden;
}

.subhead-btn{
  /*  background-color: white !important;*/
  background-color: #000000 !important;
}
mat-dialog-container {
    background-color: var(--background-dialog) !important;
    color: white !important;
}
mat-dialog-content {
    color: var(--text-dialog);
    min-height: 5vh;
}
mat-dialog-content .mat-radio-outer-circle{
    border-color: rgb(107 214 204) !important;
}
.mat-dialog-title {
    color: var(--text-dialog) !important;
    min-height: 3vh;
}
.btn {
    font-size: 0.8vw !important;
}
.align-text-top {
    vertical-align: text-top;
}
:not(.select-with-bg) .mat-form-field-outline {
    color: rgba(62, 62, 62, 0.35) !important;
}
.select-with-bg .mat-form-field-outline {
    color: rgb(226, 226, 226) !important;
}

/*PARTIE INPUT*/
.mat-form-field-appearance-outline .mat-form-field-outline-start{
    width: 20px !important;    
    border-radius: 20px 0 0 0px !important;
}
.mat-form-field-appearance-outline .mat-form-field-outline-end{
    width: 20px !important;    
    border-radius: 0 0px 20px 0 !important;
}
.mat-form-field-appearance-outline.mat-form-field-can-float.mat-form-field-should-float .mat-form-field-label{
    margin-left: 15px;
}
.mat-form-field-appearance-fill .mat-form-field-flex {
    border-radius: 20px 0px 20px 0;
    padding: .75em .75em 0 .75em;
}

table .mat-form-field-flex{
    width: 98% !important;
}
.atyl-card{
    padding-left: 12px;
    padding-right: 12px;
    height: fit-content;
    height: -moz-fit-content;
}
.inner-card{
    width: 100%;
    height: 100%;
    box-shadow: 0px 2px 5px #969696;
    padding: 15px;
    overflow: auto;
    position: relative;
}
.header-inner-card{
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.header-inner-card button{
    font-size: 0.7vw;
}
.text-atyl-color{
    color: var(--color-atyl-text);
}
.error-snackbar{
    color: white;
    background-color: red;
}
mat-row{
    min-height: 32px !important;
}
mat-row:nth-of-type(even){
    background-color: var(--background-row-even);
}
mat-row:nth-of-type(odd){
    background-color: var(--background-row-odd);
}
mat-header-cell{
    color: black !important;
    font-size: 13px !important;
}
mat-cell p{
    margin-bottom: 0.5rem !important;
    font-weight: 400;
    font-size: 13px;
}
.alert{
    padding-left: 0 !important;
    color: white !important;
}

.menu-element i{
    color: var(--background-color-button);
}
.mat-option-text{
    font-weight: 400;
}
.alert-text{
    font-weight: 600;
}
.alert-text .error{
    color: #e60e0e;
}
.dialog-text{
    color: var(--text-dialog);
}
/*HIDE SPINNER NUMBER INPUT*/
/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Firefox */
input[type=number] {
  -moz-appearance: textfield;
}

.mat-tooltip{
    font-size: 1vw !important;
    font-weight: bold;
    background-color: #d2cfca !important;
    color: black !important;
    border: 1px solid grey;
}

kt-dossier-page mat-expansion-panel[class*="mat-expanded"]{
    border: 2px solid #6bd6cc;
}

kt-dossier-page mat-expansion-panel[class*="mat-expanded"] .inner-card{
    border: 1px solid #6bd6cc;
}

.mat-form-field-suffix{
    display: flex;
    align-items: center;
    justify-items: center;
}

.mat-form-field-wrapper {
    padding-bottom: 0.34375em !important;
}
.date-form{
    display: flex;
    align-items: center;
}

/* PRINT TABLE ON SYNTHESIS */

.printTable {
    border: 1px solid #CCCCCC;
    border-collapse: collapse;
    border-left: 1px solid  var(--background-color-button) !important;;
    width: 100%;
    border-spacing: 0 12px;
  }
  
  .printTableHead {
           background-color:  var(--background-color-button) !important;;
           font-size: 12px;
           margin-top: 5px; 
           margin-bottom: 5px; 
  }
  
  .printTdLine {
          font-size: 10px;
  } 
      
  .fieldTitle {
      font-weight: bold;
      
  }
  .fieldValueRight {
      text-align: right;
      min-width: 50%;
  }
  .fieldValue {
      /*text-align: right;*/
      min-width: 50%;
  }
  
  .timepicker-overlay {
      z-index: 10000000 !important;
  }
  
  .timepicker-backdrop-overlay {
      z-index: 10000000 !important;
  }
  /* PRINT TABLE ON SYNTHESIS END */
/* MAT ELEMENT SUPLMENT */  
.mat-input-element-disabled {
	/* opacity:0.5; */
}

/* ! TESTING ! */
:root {
    --color-testing: rgba(0, 0, 0, .38)
}

:host ::ng-deep .mat-radio-button.mat-radio-disabled .mat-radio-outer-circle, 
:host ::ng-deep .mat-radio-button.mat-radio-disabled.mat-radio-checked .mat-radio-outer-circle {
    border-color: var(--color-testing) !important;
}

:host ::ng-deep .mat-radio-button.mat-radio-disabled .mat-radio-inner-circle, 
:host ::ng-deep .mat-radio-button.mat-radio-disabled .mat-radio-ripple .mat-ripple-element {
    background-color: var(--color-testing) !important;
}

:host ::ng-deep .mat-radio-button.mat-radio-disabled .mat-radio-label-content {
    color: var(--color-testing) !important;
}

:host ::ng-deep .mat-select-disabled .mat-select-value {
    color: var(--color-testing) !important;
}

:host ::ng-deep .mat-slide-toggle-bar {
    background-color: var(--color-testing) !important;
}

:host ::ng-deep .cdk-focused .mat-slider-track-background, 
:host ::ng-deep .mat-slider:hover .mat-slider-track-background {
    background-color: var(--color-testing) !important;
}

:host ::ng-deep .mat-tab-label.mat-tab-disabled, 
:host ::ng-deep .mat-tab-link.mat-tab-disabled {
    color: var(--color-testing) !important;
}

:host ::ng-deep .mat-tab-header-pagination-disabled .mat-tab-header-pagination-chevron {
    border-color: var(--color-testing) !important;
}

:host ::ng-deep .mat-option.mat-option-disabled {
    color: var(--color-testing) !important;
}

:host ::ng-deep .mat-optgroup-disabled .mat-optgroup-label {
    color: var(--color-testing) !important;
}

:host ::ng-deep .mat-badge-disabled .mat-badge-content {
    background: #b9b9b9 !important;
    color: var(--color-testing) !important;
}

:host ::ng-deep .mat-button-toggle {
    color: var(--color-testing) !important;
}

:host ::ng-deep .mat-calendar-table-header {
    color: var(--color-testing) !important;
}

:host ::ng-deep .mat-calendar-body-disabled > .mat-calendar-body-cell-content:not(.mat-calendar-body-selected) {
    color: var(--color-testing) !important;
}

:host ::ng-deep .mat-calendar-body-today:not(.mat-calendar-body-selected) {
    border-color: var(--color-testing) !important;
}

:host ::ng-deep .mat-form-field-appearance-fill.mat-form-field-disabled .mat-form-field-label {
    color: var(--color-testing) !important;
}

:host ::ng-deep .mat-form-field-appearance-outline.mat-form-field-disabled .mat-form-field-label {
    color: var(--color-testing) !important;
}

:host ::ng-deep .mat-form-field-type-mat-native-select.mat-form-field-disabled .mat-form-field-infix::after, 
:host ::ng-deep .mat-input-element:disabled {
    color: var(--color-testing) !important;
}

:host ::ng-deep .mat-menu-item[disabled], 
:host ::ng-deep .mat-menu-item[disabled]::after {
    color: var(--color-testing) !important;
}

:host ::ng-deep .mat-icon-button[disabled] .mat-paginator-decrement, 
:host ::ng-deep .mat-icon-button[disabled] .mat-paginator-first, 
:host ::ng-deep .mat-icon-button[disabled] .mat-paginator-increment, 
:host ::ng-deep .mat-icon-button[disabled] .mat-paginator-last {
    border-color: var(--color-testing) !important;
}

:host ::ng-deep .mat-slider-min-value:not(.mat-slider-thumb-label-showing).cdk-focused .mat-slider-thumb, 
:host ::ng-deep .mat-slider-min-value:not(.mat-slider-thumb-label-showing):hover .mat-slider-thumb {
    border-color: var(--color-testing) !important;
}
