@import url('https://fonts.googleapis.com/css?family=Karma');
@import url('https://fonts.googleapis.com/css?family=Abril+Fatface');
@import url('https://fonts.googleapis.com/css?family=Cinzel:400,700,900');

@font-face{
  font-family:"bnpp_sansregular";
  src:url("/assets/fonts/bnpp_sans-webfont.woff2") format("woff2"),url("/assets/fonts/bnpp_sans-webfont.woff") format("woff");
  font-weight:normal;
  font-style:normal
}

@font-face{
  font-family:"bnpp_expanded";
  font-style:normal;
  font-weight:normal;
  src:url("/assets/fonts/BNPP_Expanded_Sans.ttf") format("truetype");
}

@font-face{
  font-family:"bnpp_expanded";
  font-style:normal;
  font-weight:bold;
  src:url("/assets/fonts/BNPP_Expanded_Sans_Bold.ttf") format("truetype");
}

@font-face{
  font-family:"bnpp_expanded";
  font-style:normal;
  font-weight:200;
  src:url("/assets/fonts/BNPP_Expanded_Sans_Light.ttf") format("truetype");
}

/*************************************/
/*                                   */
/*    Partie: Pages Connexion        */
/*                                   */
/*************************************/
.spcls-1{
  fill:none;
  stroke:#dbaf56;
  stroke-linecap:round;
  stroke-linejoin:round;
}

.spcls-2{
  fill:#dbaf56;
}
.col {
 -ms-flex-preferred-size: auto !important;
 flex-basis: auto !important;
}
/* Elements generaux */
 /* Couleur du background des pages de connexions */
.screen-height {
 /* height: 100vh; /* a deplacer */
  background-color: #ffffff;
}

/* Definition du cadre des formulaires des pages de connexion */
.login-container {
  border: 2px solid #386caa; /* Definition du trait du cadre du formulaire au milieu de la page login */
  background-color: #ffffff; /* Couleur du background du cadre de formulaire des pages de connexions */
}

/* Elements de la Page de selection */
/* Couleur du titre du formulaire */
.login-container .policeColor {
  color: #292b2c;
}

/* Couleurs des Elements du bouton selection */
/*.login-container .bouttonColor {*/
  /*background-color: var(--bouton-background-color); !* Couleur du background du bouton *!*/
  /*color: var(--bouton-title-color); !* Couleur de la police du texte du bouton *!*/
  /*border-color: var(--bouton-border-color); !* Couleur de la bordure du bouton *!*/
/*}*/
/* Elements commun des pages de connexion par certificats et par identifiant/mot de passe */
/* Couleur de la police des elements du formulaire */
.login-container .PoliceLogin {
  color: #292b2c;
}
/* Couleur du titre du formulaire */
.login-container .titleLogin {
  color: #292b2c;
}

/* Definition des boutons */
/* Bouton Annulation*/
/*.login-container .cancelBoutton {*/
  /*background-color: #fff; !* Couleur du background *!*/
  /*color: #292b2c; !*Couleur de la police *!*/
  /*border-color: #eceeef; !*couleur de la bordure *!*/
/*}*/
/* Bouton Connexion Activée */
/*.login-container .connexionBoutton {*/
  /*background-color: #386caa; !* Couleur du background *!*/
  /*color: white; !* Couleur de la police *!*/
  /*border-color: #386caa; !* Couleur de la bordure *!*/
/*}*/

/* Element de la page de connexion Identifiant/Mot de passe */

/* Couleur du lien hypertexte pour le mot de passe perdu */
.login-container .passwordlost {
  color: #386caa;
}

/* Elements du formulaire Mot de passe perdu */
/* Couleur de la police des elements du formulaire */
.PoliceIdentifiant {
  color: #292b2c;
}
/* Couleur du texte explicatif */
.labelPasswordLost {
  color: #292b2c;
}

/* Elements page connexion par certificat */
/* Couleur d'affichage du certificat */
.span-color {
  color: #4885CD;
}

/*************************************/
/*                                   */
/* Partie: Elements commun pour      */
/* toutes les pages de l'application */
/*                                   */
/*************************************/
body {
  padding-right: 0 !important;
  overflow-x: hidden;
}

img {
  border: 0;
}

html {
  -webkit-font-smoothing: antialiased !important;
}

 /* couleur du background + couleur des Polices par défaut */
 /* Toutes les couleurs doivent être identiques */
html, body, cw-safe-list-page {
  background-color: #ffffff !important; /* couleur du background */
  color: #000000; /*couleur par defaut de la police pour l'application*/
}
.main-body {
  background-color: #ffffff !important; /*couleur du background pour la safe page*/
}
.action-icons {
  background-color: #ffffff !important; /*couleur du background pour la barre des bouttons d'actions*/
}
.navbar {
  background-color: #ffffff !important; /*couleur du background pour la barre de recherche*/
}
.navbar .input-group > div, .navbar .input-group > input {
  background-color: #ffffff !important; /*couleur des input de la barre de recherche*/
  color: #292b2c; /*couleur de la police des inputs de la barre de recherche*/
}
.search-icon{
  color: #000000; /*couleur de l'icone de recherche dans la barre de recherche*/
}

/* Menu Deconexion/profil */
.toggle-btn {
  background-color: transparent; /* Couleur du background */
}
.toggle-btn .name {
  color: #292b2c; /* Couleur de la police du menu */
}

/* Cercle des avatars Client */
.avatar {
  background-color: #386caa; /* Couleur du background */
  color: #ffffff; /* couleur de la police */
}

/*************************************/
/*                                   */
/*     Partie: Salle des Coffres     */
/*                                   */
/*************************************/

/* Definition des bordures et background des coffres */
/* Epaisseur + couleur + background*/
.safe {
  border: 1px solid #eceeef;
  background-color: #ffffff;
}

/* Couleur de la police du nom du coffre */
.safe .header {
  color: #292b2c;
}

/* Couleur de l'icone de coffre */
.safe-icon {
  stroke: #386caa;
  fill:white;
}

.safe-svg {
  stroke: #386caa;
  fill:white;
}
/*************************************/
/*                                   */
/*       Partie: Menu à gauche       */
/*                                   */
/*************************************/
/*Important !!!!! pour modifier la couleur du background du menu a gauche */
/* il faut modifier les paramatres 'background-color des trois classes suivantes: */
/* .leftcol le .scrollable et le .fixed */
.leftcol {
  background-color: #cde2ff;
}
.scrollable {
  background-color: #cde2ff;
  color: #000000 !important; /* Couleur des polices du menu a gauche*/
  height: 70%;
}
@media (max-height: 620px) {
  .scrollable {
    height: 63%;
  }
}

.fixed {
  background-color: #cde2ff;
}


/* Couleur des differents composant de l'arborescence du menu à gauche */
/* Couleur de l'indicateur permettant de savoir si un dossier est ouvert ou non */
.tree-row .open-indicator {
  color: #9a9a9a;
}

/* Couleur de l'indicateur permettant de savoir si un dossier est ouvert ou non quand on passe dessus*/
.tree-row .open-indicator:hover {
  color: #386caa;
}

/* Definition de la bordure du menu à gauche quand un dossier est selectionné */
.tree-row.selected::before {
  border-left: 0.3rem solid #386caa;
}

/* Couleur d'un dossier quand il est non selectionné */
.tree-row .folderActive svg path {
  fill: #9a9a9a !important;
}

/* Couleur d'un dossier quand il est sélectionné */
.tree-row.selected .folderActive svg path {
  fill: #386caa !important; /*la couleur du dossier sélectionné*/
}

/* Couleur de la police pour un dossier sélectionné */
.tree-row.selected .name {
  color: #386caa;
}

/* Couleur de la police pour un dossier non sélectionné */
.tree-row .name {
  color: #000000; /*la couleur des polices du dossier lorsqu'il n'est pas sélectionné*/
}

/* Couleur du texte "Salle des coffres" */
.safe-list-link {
  color: #1b1b1b;
}

.safe-list-link.selected .name {
  color: #386caa;
}

.safe-list-link.selected::before {
  border-left: 0.3rem solid #386caa;
}

/* Couleur de l'icone du coffre */
.icon svg {
  fill: #ccc; /* Couleur du fond de l'icone */
  stroke: #7c7c7c;/* Couleur du tour de l'icone */
}

/* Couleur du sceau du journal */
.sceauColor {
  fill: #e17676;
}

/* Boutton Ajouter , Connexion , Selection , upload ... tous les boutons de l'IHM*/
.btn-primary {
  color: #ffffff; /* Couleur de la police de ce bouton *!*/
  background-color: #203365 !important; /* Coulour du background de ce bouton *!*/
  border-color: #203365 !important; /* Definition de la bordure du bouton : Couleur *!*/
}
/* En boutton Hover */
.btn-primary:hover, .btn-primary:focus, .btn-primary:active, .btn-primary.active, .open>.dropdown-toggle.btn-primary {
  color: #ffffff; /* Couleur de la police de ce bouton *!*/
  background-color: #203365 !important;/* Coulour du background de ce bouton *!*/
  border-color: #203365 !important ; /* Definition de la bordure du bouton : Couleur *!*/
}
/*/*//*/*//*/***//***/

/* Bouton annuler secondary bouton*/
.btn-secondary{
  color: #292b2c;  /* Couleur de la police de ce bouton *!*/
  background-color: #ffffff !important; /* Coulour du background de ce bouton *!*/
  border-color: #eceeef; /* Definition de la bordure du bouton : Couleur *!*/
}
.btn-secondary:hover, .btn-secondary:focus, .btn-secondary:active, .btn-secondary.active, .open>.dropdown-toggle.btn-secondary {
  color: #000000; /* Couleur de la police de ce bouton *!*/
  background-color: #e6e5e5 !important;/* Coulour du background de ce bouton *!*/
  border-color: #cbd0d3 ; /* Definition de la bordure du bouton : Couleur *!*/
}

/* focus sur le champs de recherche dans la salle des coffres */
.form-control:focus{
  border-color: #292b2c !important;
}
/* couleur du texte membres dans la salle des coffres */
.details {
  color: #292b2c;
}
/* couleur du boutons d'actions dans le coffre */
.action-bouton{
  stroke: #386caa;
}
.actions-icon-search-page {
  stroke: #386caa;
}

/* PDF Preview */
#node-preview{
  background-color: rgba(0,32,69,0.7); /* couleur du fond lors de PDF Aperçue*/
}

.preview-actions{
  background-color: rgba(0,32,69,0.7); /* couleur du fond de la bare des boutons d'actions lors de PDF Aperçue*/
}
.actions-icon-preview {
  stroke: #ffffff;
}

.background-arrow{
  background-color: rgba(0,32,69,0.7); /* couleur du fond des 2 fléches en pdf preview*/
}

/* Modal header */
.modal-header{
  background-color: #203365 !important;  /*couleur du fond dans le modal header */
  color: #ffffff !important; /* couleur du texte dans le modal header */
}

.close{
  color: #ffffff !important;  /* couleur du bouton close dans le modal header */
}

/* couleur de la ligne selectionnée dans un tableau */
tr.selected > td{
  background-color: #7ba5df !important;  /* couleur d'une ligne selectionnée dans un tableau*/
}

/* couleur du path d'un dossier avec les fleches */
.path-police-color{
  color: #386CAA;
}