body {
  /* tag::General[] */
  /* Couleur du dégradé de l’arrière-plan du navigateur à partir du haut */
  --arriere-plan-couleur-haut: #dbdbdb;
  /* Couleur du dégradé de l’arrière-plan du navigateur à partir du bas */
  --arriere-plan-couleur-bas: #dbdbdb;
  /* Couleur de fond principale des boutons. */
  --bouton-couleur-principal: #e27301;
  /* Couleur principale de la police de caractère des boutons. */
  --bouton-couleur-principal-police: white;
  /* Couleur secondaire des boutons. */
  --bouton-couleur-secondaire: #dd9704;
  /* Couleur secondaire de la police de caractère. */
  --bouton-couleur-secondaire-police: white;
  /* Couleur barre de chargement */
  --barre-de-chargement-couleur: white;
  /* Couleur de fond d'un élément du menu */
  --bouton-couleur-menu: #f6b105;
  /* Couleur de la bordure gauche du menu */
  --bouton-couleur-menu-bordure: #e28b01;
  /* end::General[] */
  /* tag::Logo[] */
  /* Taille maximale du logo entreprise lorsque l'utilisateur n'est pas connecté */
  --longueur-max-logo-login: 50%;
  --hauteur-max-logo-login: 500px;
  /* Taille maximale du logo entreprise lorsque l'utilisateur est connecté */
  --longueur-max-logo-connecte: 150px;
  --hauteur-max-logo-connecte: 150px;
  /* end::Logo[] */
  /* tag::Histogramme[] */
  /* Les attributs suivants servent à définir la palette de couleur utilisée pour les barres empilées de l'histogramme */
  --histogramme-couleur0: #007ac5;
  --histogramme-couleur1: #ffb000;
  --histogramme-couleur2: #be0048;
  --histogramme-couleur3: #ff0048;
  --histogramme-couleur4: #382b00;
  --histogramme-couleur5: #380010;
  --histogramme-couleur6: #0d0038;
  --histogramme-couleur7: #6133ff;
  --histogramme-couleur8: #334dff;
  --histogramme-couleur9: #2d48ff;
  --histogramme-couleur10: #78eb47;
  --histogramme-couleur11: #3aa70c;
  --histogramme-couleur12: #083800;
  --histogramme-couleur13: #380010;
  --histogramme-couleur14: #007ac5;
  --histogramme-couleur15: #be0048;
  --histogramme-couleur16: #4aff6a;
  --histogramme-couleur17: #0d0038;
  --histogramme-couleur18: #4affc4;
  --histogramme-couleur19: #4ad6ff;
  --histogramme-couleur20: #007ac5;
  --histogramme-couleur21: #ffb000;
  --histogramme-couleur22: #be0048;
  --histogramme-couleur23: #ff0048;
  --histogramme-couleur24: #382b00;
  --histogramme-couleur25: #380010;
  --histogramme-couleur26: #0d0038;
  --histogramme-couleur27: #6133ff;
  --histogramme-couleur28: #334dff;
  --histogramme-couleur29: #2d48ff;
  /* end::Histogramme[] */
  /* tag::GraphiqueEnLigne[] */
  /* Couleur de la ligne de la courbe. */
  --linechart-couleur-ligne: #e28b01;
  /* Couleur du gradient sous la ligne de courbe. */
  --linechart-couleur-gradient: #f7c107;
  /* Couleur principale du pointeur lors du survol de la ligne. */
  --linechart-couleur-principal-pointeur: #c57a01;
  /* Couleur secondaire du pointeur lors du survol de la ligne. */
  --linechart-couleur-secondaire-pointeur: #e38c01;
  /* end::GraphiqueEnLigne[] */
}

/* tag::Autres[] */

/* Correspond au pied de page de l'application. */

ael-pied-de-page {
  /* Couleur de fond du pied de page. */
  --pied-couleur: #888888;
  /* Couleur de fond de la police de caractère du pied de page. */
  --pied-couleur-police: white;
}

/* Correspond aux bandeaux de titre des chapitres quand un utilisateur est connecté. */

ael-titre-chapitre {
  /* Couleur de fond des chapitres. */
  --chapitre-couleur: #f6b105;
  /* Couleur de la police des chapitres. */
  --chapitre-couleur-police: white;
}

/* Correspond au bandeau principal en haut de page. */

ael-entete {
  /* Couleur de dégradé du bandeau à partir de la gauche. */
  --bandeau-couleur-gauche: #ffffff;
  /* Couleur de dégradé du bandeau à partir de la droite. */
  --bandeau-couleur-droite: #e28b01;
  /* Couleur de la police de caractère de l'entête. */
  --entete-couleur-police: white;
}

ael-titre-application {
  /* Couleur de la police de caractère du titre de l'application sur la page de connexion. */
  --titre-couleur-police: black;
}

/* end::Autres[] */

/* tag::CssSupplementaire */

/*Compléments personnalisation OMEGA 22/09/2025*/

#aelgrd > div > ael-non-connecte > div.contenu > div > ael-grd-login-page > h3,
#aelgrd > div > ael-non-connecte > div.contenu > div > ng-component > div > form > h3,
#aelgrd > div > ael-non-connecte > div.contenu > div > ng-component > div > form > ael-field > div > input,
#aelgrd > div > ael-non-connecte > div.contenu > div > ael-oubli-mdp > div:nth-child(2) > ael-tuile > h4,
#aelgrd > div > ael-non-connecte > div.contenu > div > ael-oubli-mdp > div:nth-child(2) > ael-tuile > form > ael-field > label,
#aelgrd > div > ael-non-connecte > div.contenu > div > ael-demande-identifiants > form > ael-tuile > ael-field > div > input,
#aelgrd > div > ael-non-connecte > div.contenu > div > ael-demande-identifiants > form > ael-tuile > ael-field > div > div > input,
#contenu-tuile-connexion > ael-field > label {
  color: black;
}

div.cdk-overlay-container > div.cdk-global-overlay-wrapper > div.cdk-overlay-pane.mat-mdc-dialog-panel > mat-dialog-container > div > div > ael-popin-confirmation-suppression-compte > h1.mat-mdc-dialog-title.mdc-dialog__title.titrePopin,
div.cdk-overlay-container > div.cdk-global-overlay-wrapper > div.cdk-overlay-pane.mat-mdc-dialog-panel > mat-dialog-container > div > div > ael-popin-confirmation-suppression-compte > mat-dialog-content > form > ael-field > label,
div.cdk-overlay-container > div.cdk-global-overlay-wrapper > div.cdk-overlay-pane.mat-mdc-dialog-panel > mat-dialog-container > div > div > ael-popin-confirmation-suppression-compte > mat-dialog-content > form > ael-field > div > ael-input-password > input,
ael-changement-identifiant > form > div.container > div.gauche > ael-field > div > input,
ael-changement-identifiant > form > div.container > div.droite > label > span,
ael-changement-identifiant > form > div.container > div.gauche > ael-field > div > ael-input-password > input {
  color: black;
}

#aelgrd > div > ael-non-connecte > div.contenu > div > ael-oubli-mdp > div:nth-child(2) > ael-tuile > form > ael-field > div.contenu > input,
.onglet.active #consommations,
.onglet.active #charges,
.onglet.active #pmax,
#ouvrirPopUpPersonnalise > span,
h2,
div.cdk-overlay-container > div.cdk-global-overlay-wrapper > div > mat-dialog-container > div > div > ael-consommations-dialog > h1.mat-mdc-dialog-title,
mat-select-trigger > span,
#clientPhysique > ael-field > div > input,
#adressePostale > ael-field > div > input {
  color: black;
}

div.cdk-overlay-container > div.cdk-global-overlay-wrapper > div.cdk-overlay-pane.mat-mdc-dialog-panel > mat-dialog-container > div > div > ael-popin-confirmation-suppression-compte > mat-dialog-content > form > ael-field > label,
#aelgrd > div > ael-non-connecte > div.contenu > div > ael-demande-identifiants > form > ael-tuile:nth-child(1) > div > h4,
#aelgrd > div > ael-non-connecte > div.contenu > div > ael-demande-identifiants > div > h3,
#aelgrd > div > ael-non-connecte > div.contenu > div > ael-oubli-mdp > div > h3,
#aelgrd > div > ael-non-connecte > div.contenu > div > ael-demande-identifiants > form > ael-tuile > h4,
#aelgrd > div > ael-non-connecte > div.contenu > div > ael-demande-identifiants > form > ael-tuile > ael-field > label,
#aelgrd > div > ael-non-connecte > div.contenu > div > ael-demande-identifiants > form > ael-tuile:nth-child(4) > p,
mat-radio-button > div > label {
  color: black;
}

#mon-compte > ael-tuile > ael-changement-mdp > form > h3,
ael-changement-mdp > form > div > div.gauche > ael-field > #mdp > input,
ael-changement-mdp > form > div > div.droite > ael-validateur-mot-de-passe > label > span,
ael-changement-mdp > form > div > div.droite > ael-validateur-mot-de-passe > ul > li > span,
ael-changement-mdp > form > div > div.droite > ael-validateur-mot-de-passe > ul > li > ael-icone,
#mon-compte > ael-tuile:nth-child(4) > ael-changement-mdp > form > div > div.gauche > ael-field > div > #mdp > input,
#mon-compte > ael-tuile:nth-child(4) > ael-changement-mdp > form > div > div.gauche > ael-field > div > #nouveauMdp > input,
#mon-compte > ael-tuile:nth-child(4) > ael-changement-mdp > form > div > div.gauche > ael-field > div > #confirmationNouveauMdp > input {
  color: black;
}

#contenu-tuile-connexion > ael-field:nth-child(4) > div > ael-case-a-cocher > mat-checkbox > div.mdc-form-field > div.mdc-checkbox > div.mdc-checkbox__background,
#aelgrd > div > ael-non-connecte > div.contenu > div > ng-component > div > form > div.cgu > ael-case-a-cocher > mat-checkbox > div.mdc-form-field > div.mdc-checkbox > div.mdc-checkbox__background {
  background-color: #f6b105;
  border-color: #e28b01;
}

#aelgrd > div > ael-non-connecte > div.contenu > div > ael-page-licences > h1 {
  background-color: #f6b105;
}

#lienUrlPageComparaisonConsommations,
#contenu-tuile-connexion > ael-field:nth-child(4) > div > ael-case-a-cocher > mat-checkbox > div.mdc-form-field > label > span > span,
#contenu-tuile-connexion > div.grid > div.ligne-boutons > div#creation-de-compte > span#texte-sans-compte,
div#ligne-lien-mot-de-passe-oublie > a#oubliMdp,
#demandeIdentifiants,
#aelgrd > div > ael-non-connecte > div.contenu > div > ng-component > div > form > div.cgu > a,
#aelgrd > div > ael-non-connecte > div.contenu > div > ael-page-cookie > span > div > p:nth-child(6) > a,
#aelgrd > div > ael-non-connecte > div.contenu > div > ael-page-secondaire-parametrable > span > div > ul > li > a {
  color: #d17a00;
}

#contenu-tuile-connexion > div.grid > div.ligne-boutons > div#creation-de-compte > button#creationCompte:hover {
  background-color: #e28b01;
}

#contenu-tuile-connexion > div.grid > div.ligne-boutons > button#connexion:hover,
#aelgrd > div > ael-non-connecte > div.contenu > div > ng-component > div > form > div.boutons-action > #suivant:hover,
ael-tuile.mon-compte-informations > form > div.boutons-action > div > #valider:hover,
ael-changement-identifiant > form > div.boutons-action > div > #validerIdentifiant:hover,
#mon-compte > ael-tuile:nth-child(4) > ael-changement-mdp > form > #valider-changement-mdp:hover {
  background-color: green;
}

#aelgrd > div > ael-non-connecte > div.contenu > div > ael-demande-identifiants > form > ael-tuile.tuile-boutons > div > #annuler:hover,
div.cdk-overlay-container > div.cdk-global-overlay-wrapper > div > mat-dialog-container > div > div > ael-consommations-dialog > form > mat-dialog-actions > button.bouton-annuler:hover,
div.cdk-overlay-container > div.cdk-global-overlay-wrapper > div > mat-dialog-container > div > div > ael-charge-dialog > form > mat-dialog-actions > button.bouton-annuler:hover {
  background-color: #555555;
}

#aelgrd > div > ael-non-connecte > div.contenu > div > ael-oubli-mdp > div:nth-child(2) > ael-tuile > form > div.boutons-action > button#valider:hover,
#aelgrd > div > ael-non-connecte > div.contenu > div > ael-demande-identifiants > form > ael-tuile.tuile-boutons > div > #validerDemande:hover,
div.cdk-overlay-container > div.cdk-global-overlay-wrapper > div > mat-dialog-container > div > div > ael-consommations-dialog > form > mat-dialog-actions > button#valider:hover,
div.cdk-overlay-container > div.cdk-global-overlay-wrapper > div > mat-dialog-container > div > div > ael-charge-dialog > form > mat-dialog-actions > button#valider:hover {
  background-color: green;
}

ael-tuile.mon-compte-informations > form > div.boutons-action > div > #annuler:hover,
div.cdk-overlay-container > div.cdk-global-overlay-wrapper > div.cdk-overlay-pane.mat-mdc-dialog-panel > mat-dialog-container >  div > div > ael-popin-confirmation-suppression-compte > mat-dialog-content > form  > mat-dialog-actions > #annuler:hover,
ael-changement-identifiant > form > div.boutons-action > div > #annulerIdentifiant:hover,
mat-dialog-container > div > div > ael-erreur-dialogue > mat-dialog-actions > #okBouton:hover {
  background-color: #555555;
}

#aelgrd > div > ng-component > div > div > div > ael-visualisation-pasc > ael-historique-de-mesure > div > ael-historique-de-mesure > ael-carte > mat-card > mat-card-content > ael-courbe-de-charge > ael-demande-consultation-courbe-de-charge > h2,
#ouvrirPopUpPersonnalise > span,
div#menu-conteneur > li.lien-menu.lien-actif > a > div,
div#menu-conteneur > li.lien-menu.lien-actif > a > span,
div.cdk-overlay-container > div.cdk-global-overlay-wrapper > div > mat-dialog-container > div > div > ael-charge-dialog > h1,
#mon-compte > ael-tuile.mon-compte-informations > form > h3,
#aelgrd > div > ael-non-connecte > div.contenu > div > ng-component > h3 {
  color: black;
}

ael-tuile.mon-compte-informations > form > div.boutons-action > div > #supprimer:hover,
div.cdk-overlay-container > div.cdk-global-overlay-wrapper > div.cdk-overlay-pane.mat-mdc-dialog-panel > mat-dialog-container >  div > div > ael-popin-confirmation-suppression-compte > mat-dialog-content > form  > mat-dialog-actions > #confirmerSupressionDeCompte:hover {
  background-color: red;
}

#aelgrd > div > ng-component > div > div > div > ael-visualisation-pasc > ael-historique-de-mesure > div > ael-historique-de-mesure > ael-carte > mat-card > mat-card-content > ng-component > ael-graphique-en-ligne > span#titreGraphique {
  color: #d17a00;
}

ael-tuile.mon-compte-informations > form > div.boutons-action > div > #modifier:hover,
ael-changement-identifiant > form > div.boutons-action > div > #modifierIdentifiant:hover {
  background-color: #e28b01;
}

#contenu-tuile-connexion > ael-field > div > #login,
#contenu-tuile-connexion > ael-field > div > #password > input {
  color: black;
  border-color: #e28b01;
  border-left-color: #e28b01 !important;
}

#body > div.cdk-overlay-container > div > div > div > mat-option.mat-mdc-option-active > span > span,
ael-histogramme-empile > #enteteGraphique {
  color: #e28b01;
}

a#demandeIdentifiants.lienSouligne {
  -webkit-text-decoration: underline #1a85c7;
  text-decoration: underline #e28b01;
}

#aelgrd > div > ng-component > div > ael-bandeau-adresse > div.bandeau-adresse {
  background-color: #999999;
}

i.fa-solid.fa-info-circle.fa-lg {
  color: #f39c02;
}

input.champ-de-saisie {
  border-color: #e28b01;
}

.whiteboard.page-secondaire {
  padding: 15px;
  margin-bottom: 20px;
}

.whiteboard.page-secondaire > p {
  margin: 0;
  line-height: 1.3em;
}

.whiteboard.page-secondaire > p > a {
  color: #d17a00;
}

ael-select.champ-de-selection.form-control .mat-mdc-select {
  border-color: #e28b01 !important;
}

.mat-mdc-radio-button.mat-primary {
  --mdc-radio-unselected-hover-icon-color: #dd9704 !important;
  --mdc-radio-selected-focus-icon-color: #e28b01 !important;
  --mdc-radio-selected-hover-icon-color: #e28b01 !important;
  --mdc-radio-selected-icon-color: #e28b01 !important;
  --mdc-radio-selected-pressed-icon-color: #e28b01 !important;
  --mat-radio-ripple-color: #dd9704 !important;
  --mat-radio-checked-ripple-color: #dd9704 !important;
}

button.bouton-annuler:hover,
#annuler:hover,
.mat-mdc-dialog-actions button.bouton-annuler:hover {
  background-color: #555555;
}

button.bouton-principal:hover {
  background-color: #e28b01;
}

button:disabled {
  background-color: #b4b4b4 !important;
}

/* end::CssSupplementaire */