/******************************************************************************************************************************/
/*                                                                                                                            */
/*                                                              FANCYTREE                                                      */
/*                                                                                                                            */
/******************************************************************************************************************************/

/* Nouvelles classes pour l'alternance contrôlée des lignes */
table.fancytree-ext-table tbody tr.row-even:not(.fancytree-active):not(.fancytree-selected) {
  background-color: rgba(255, 255, 255, 0.5);
}

#treetable {
  width: 100%;
  min-height: calc(100% - 50px);
}

span.fancytree-title {
  margin-top: 8px;
  font-family: var(--font-title);
  font-weight: 500;
  letter-spacing: 0.3px;
  transition: color 0.2s ease;
  outline: none;
  text-wrap: nowrap;
}

table.fancytree-ext-table {
  width: 100%;
  border-collapse: collapse;
  border: 1px solid var(--tertiary-color);
  border-radius: 5px;
  caption-side: bottom;
  font-family: var(--font-title);
  color: var(--tertiary-color);
  box-shadow: 2px 2px 0 var(--primary-color);
  margin-top: 50px;
  /* background: rgba(255, 255, 255, 0.5); */
}

table.fancytree-ext-table tr,
table.fancytree-ext-table td {
  transition: all 0.2s ease;
  border-color: transparent !important;
  border: 0 !important;
}

/* Support scrolling  */
div.fancytree-grid-container {
  width: 100%;
  height: 100%;
  min-height: 60vh;
  border: 1px solid var(--tertiary-color);
  background: rgba(255, 255, 255, 0.02);
  box-shadow: inset 1px 1px 3px rgba(0, 0, 0, 0.1);
  border-left: 5px solid;
  overflow: hidden auto;
  transition: all 0.2s ease;
  border-top-left-radius: 25px;
  border-bottom-left-radius: 25px;
  outline: 10px solid var(--primary-color);
  outline-offset: -2px;
  scrollbar-color: var(--accent-color);
}

div.fancytree-grid-container:focus,
div.fancytree-grid-container:focus-visible,
div.fancytree-grid-container:focus-within,
div.fancytree-grid-container:active {
  border-left: 10px solid;
  margin-left: -5px;
  outline-offset: -5px;
}

/* Ext-grid breaks if another extension hides rows. */
table.fancytree-ext-grid tbody tr.fancytree-hide {
  display: table-row;
}

/* Set alternating row colors (define BEFORE standard css). */
/* Règle désactivée pour permettre une alternance des lignes via JavaScript */
/* table.fancytree-ext-table tbody tr:nth-child(even){
    background-color: #fafafa;
  } */

table.fancytree-ext-table thead th.parent-path {
  text-align: left;
  display: none;
}

table.fancytree-ext-table td:nth-child(2) {
  width: 50px;
}

table.fancytree-ext-table td:nth-child(4) {
  text-align: right;
}

table.fancytree-ext-table td:nth-child(5) {
  text-align: center;
}

/* Amélioration des icônes et expanders */
table.fancytree-ext-table span.fancytree-expander {
  color: var(--shadow-color, var(--accent-color));
  font-weight: bold;
  transition: all 0.2s ease;
  cursor: pointer;
  font-size: 14px;
  line-height: 30px;
  display: inline-block;
  width: 10px;
  height: 30px;
  text-align: center;
  vertical-align: middle;
  margin-left: -2px;
  background-position: unset;
  background-image: none;
}

table.fancytree-ext-table span.fancytree-node:hover span.fancytree-expander {
  color: var(--shadow-color);
}

/* Chevrons Unicode pour les expanders */
table.fancytree-ext-table span.fancytree-expander:before {
  content: "▶";
  /* Triangle vers la droite (fermé) */
  display: inline-block;
  transition: transform 0.2s ease;
}

/* Triangle vers le bas (ouvert) */
table.fancytree-ext-table tr.fancytree-expanded>td>span.fancytree-node>span.fancytree-expander:before {
  content: "▼";
  /* Triangle vers le bas (ouvert) */
}

/* Expander plus foncé quand l'élément est ouvert */
table.fancytree-ext-table tr.fancytree-expanded>td>span.fancytree-node>span.fancytree-expander {
  color: rgba(255, 255, 255, 0.5);
  margin-left: -20px;
  margin-right: 10px;
}

/* Pas d'expander pour les nœuds sans enfants */
table.fancytree-ext-table tr:not(.fancytree-has-children)>td>span.fancytree-node>span.fancytree-expander {
  display: none;
}

/* Icônes des nœuds */
table.fancytree-ext-table span.fancytree-icon {
  margin-right: 6px;
  transition: opacity 0.2s ease;
}


/* Nœuds généraux */
table.fancytree-ext-table span.fancytree-node {
  display: inline-flex;
  box-sizing: border-box;
  transition: all 0.2s ease;
  width: auto !important;
  padding: 0 10px 0px 0px;
  background: white !important;
  border-radius: 10px;
  flex-wrap: nowrap;

}

table.fancytree-ext-table tbody span.fancytree-node,
table.fancytree-ext-table tbody span.fancytree-node:hover {
  border: 1px solid var(--shadow-color, --primary-color);
}

/* Nœuds avec enfants */
table.fancytree-ext-table tr.fancytree-has-children>td>span.fancytree-node {
  --shadow-color: var(--accent-color);
  --border-left-color: var(--accent-color);
  font-weight: 600;
  color: var(--primary-color);
  width: auto;
  border-radius: 10px;
  padding: 5px 0;
  padding-right: 30px;
  background-color: var(--accent-color-clear);
  border-left: 5px solid var(--border-left-color);
  box-shadow: -1px 1px 0 var(--shadow-color);
  position: relative;
  display: inline-flex;
}

/* Dégradé elliptique coloré pour les ruisseaux */
table.fancytree-ext-table tr.fancytree-has-children:not(:first-child)>td>span.fancytree-node::before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: radial-gradient(ellipse at center bottom, var(--stream-color) 0%, transparent 100%);
  border-radius: 100% 100% 20px 20px;
  transition: all 0.3s ease-in-out;
  pointer-events: none;
  opacity: 0.5;
  height: 10%;
}

table.fancytree-ext-table tr.fancytree-has-children:not(:first-child)>td>span.fancytree-node:hover::before,
table.fancytree-ext-table tr.fancytree-has-children.fancytree-expanded>td>span.fancytree-node::before {
  height: 50% !important;
  opacity: 0.2 !important;
}


/* Icône toggle à droite du titre pour les nœuds avec enfants (sauf la racine) */
table.fancytree-ext-table tr.fancytree-has-children:not(:first-child)>td>span.fancytree-node:after {
  content: "\f07b";
  /* fa-folder (dossier fermé) */
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  position: absolute;
  right: 8px;
  top: 50%;
  transform: translateY(-50%);
  font-size: 12px;
  color: var(--shadow-color, var(--accent-color));
  opacity: 0.7;
  transition: all 0.2s ease;
}

/* Couleur du dossier au hover pour les ruisseaux */
/* table.fancytree-ext-table tr.fancytree-has-children:not(:first-child)>td>span.fancytree-node:hover:after {
  color: var(--stream-color, var(--shadow-color, var(--accent-color)));
  opacity: 0.9;
} */

/* Icône toggle-on quand le nœud est ouvert (sauf la racine) */
table.fancytree-ext-table tr.fancytree-has-children:not(:first-child).fancytree-expanded>td>span.fancytree-node:after {
  content: "\f07c";
  /* fa-folder-open (dossier ouvert) */
  color: var(--shadow-color, var(--accent-color-hover));
  opacity: 1;
}

/* Couleur du dossier ouvert au hover pour les ruisseaux */
/* table.fancytree-ext-table tr.fancytree-has-children:not(:first-child).fancytree-expanded>td>span.fancytree-node:hover:after {
  color: var(--stream-color, var(--shadow-color, var(--accent-color-hover)));
  opacity: 1;
} */

/* Nœuds avec enfants Hover */
table.fancytree-ext-table tr.fancytree-has-children>td>span.fancytree-node:hover {
  --shadow-color: var(--accent-color-select);
  --border-left-color: var(--accent-color-select);
  background-color: var(--accent-color-clear);
  box-shadow: -2px 2px 0 var(--shadow-color);
  border-left: 5px solid var(--border-left-color);
}

table.fancytree-ext-table tr.fancytree-active>td>span.fancytree-node:hover .fancytree-expander::before,
table.fancytree-ext-table tr.fancytree-active>td>span.fancytree-node:hover .fancytree-expander::after {
  color: var(--shadow-color, var(--primary-color));
}

/* Nœuds avec enfants OUVERTS */
table.fancytree-ext-table:focus tr.fancytree-has-children.fancytree-expanded>td>span.fancytree-node {
  box-shadow: -20px 1px 0 var(--shadow-color), 20px 1px 0 var(--shadow-color);
}

/* Nœuds avec enfants OUVERTS */
table.fancytree-ext-table tr.fancytree-has-children.fancytree-expanded>td>span.fancytree-node {
  --shadow-color: var(--primary-color);
  --border-left-color: var(--primary-color);
  background-color: white;
  border-left: 1px solid var(--border-left-color);
  box-shadow: -20px 1px 0 var(--shadow-color), 6px 1px 0 var(--shadow-color);
}

/* Nœuds avec enfants OUVERTS au HOVER */
table.fancytree-ext-table tr.fancytree-has-children.fancytree-expanded>td>span.fancytree-node:hover {
  background-color: white !important;
  border-left: 1px solid var(--border-left-color) !important;
  box-shadow: -20px 1px 0 var(--shadow-color), 6px 1px 0 var(--shadow-color) !important;
}

/* Expander des Nœuds avec enfants OUVERTS */
table.fancytree-ext-table tr.fancytree-has-children.fancytree-expanded>td>span.fancytree-node span.fancytree-expander {
  margin-left: -17px;
}

table.fancytree-ext-table tr.fancytree-has-children.fancytree-expanded>td>span.fancytree-node span.fancytree-expander::before {
  transition: color .2s ease;
}

/* Expander Nœuds avec enfants OUVERTS au HOVER */
table.fancytree-ext-table tr.fancytree-has-children.fancytree-expanded>td>span.fancytree-node:hover span.fancytree-expander {
  margin-left: -17px;
}

table.fancytree-ext-table tr.fancytree-has-children.fancytree-expanded>td>span.fancytree-node:hover span.fancytree-expander::before {
  color: var(--accent-color-clear);
}


/* Effet spécial quand le parent ET l'enfant sont en hover */
table.fancytree-ext-table tr.fancytree-has-children:hover>td>span.fancytree-node:hover {
  background-color: rgb(225, 225, 225);
  box-shadow: -13px 1px 0 var(--shadow-color), 6px 1px 0 var(--shadow-color);
  border-left: 0px solid var(--border-left-color);
}


tr#ft_data>td>span.fancytree-node,
tr#ft_data:hover>td>span.fancytree-node {
  box-shadow: -20px 1px 0 var(--shadow-color), 6px 1px 0 var(--shadow-color);
  border-left: 1px solid var(--border-left-color) !important;
}

/* Nœuds feuilles */
table.fancytree-ext-table tr.fancytree-lazy:not(.fancytree-has-children)>td>span.fancytree-node {
  color: var(--tertiary-color);
  font-weight: 400;
}

table.fancytree-ext-table tbody ui.ui-state-active,
table.fancytree-ext-table tbody tr.fancytree-active,
table.fancytree-ext-table tbody tr.row-is-active {
  background-color: var(--accent-color-select);
}

table.fancytree-ext-table tbody tr.fancytree-active:hover,
table.fancytree-ext-table tbody tr.fancytree-selected:hover {
  background-color: var(--accent-color-select);
}

/* table.fancytree-ext-table tbody tr.fancytree-active:hover,
table.fancytree-ext-table tbody tr.fancytree-selected:hover{
  box-shadow: -2px 2px 0 var(--primary-color);
  border-radius: 3px;
} */

/* table.fancytree-ext-table tbody ui.ui-state-active span.fancytree-expander,
table.fancytree-ext-table tbody tr.fancytree-active:hover span.fancytree-expander,
table.fancytree-ext-table tbody tr.fancytree-selected:hover span.fancytree-expander,
table.fancytree-ext-table tbody ui.ui-state-active span.fancytree-title,
table.fancytree-ext-table tbody tr.fancytree-active:hover span.fancytree-title,
table.fancytree-ext-table tbody tr.fancytree-selected:hover span.fancytree-title {
  text-shadow: 1px 1px 0 var(--primary-color);
} */

.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,
a.ui-button:active,
.ui-button:active,
.ui-button.ui-state-active:hover {
  border: 1px solid #aaaaaa;
  background: none;
  font-weight: normal;
  color: white;
}

/* 
table.fancytree-ext-table.fancytree-treefocus tbody tr.fancytree-active {
  background-color: var(--accent-color) !important;
} */

.ui-state-active span.fancytree-title {
  color: white;
}

/* custom alignment (class is set by row template) */
td.alignCenter {
  text-align: center;
}

td.alignRight {
  text-align: right;
}

/* Amélioration du focus et de l'accessibilité */
table.fancytree-ext-table:focus {
  outline: 2px solid var(--secondary-color);
  outline-offset: 2px;
  border-radius: 5px;
}

/* Background plus foncé pour les lignes ouvertes NON focus*/
table.fancytree-ext-table tbody tr.fancytree-expanded:not(#ft_data) {
  background-color: rgba(137, 173, 203, 0.3) !important;
}

/* */
table.fancytree-ext-table tbody tr.fancytree-expanded>td>span.fancytree-node {
  --shadow-color: var(--accent-color);
  --border-left-color: var(--accent-color);
  border-left: 5px solid var(--border-left-color);
  box-shadow: -1px 1px 0 var(--shadow-color);
}

/* Background spécial pour les lignes ouvertes ET en focus */
/* table.fancytree-ext-table.fancytree-treefocus tbody tr.fancytree-expanded {
  background-color: var(--accent-color-clear);
} */

/* Background au hover le tr */
.table.fancytree-ext-table tbody tr:hover {
  background-color: var(--accent-color-clear);
}

/* Indentation visuelle améliorée */
table.fancytree-ext-table td:first-child {
  padding-left: 8px;
  position: relative;
}

/* Réduire l'indentation uniquement pour les fiches (sans enfants) */
table.fancytree-ext-table tr:not(.fancytree-has-children) td:first-child {
  padding-left: 4px;
}

/* Scrollbar personnalisée pour le conteneur */
div.fancytree-grid-container::-webkit-scrollbar {
  width: 8px;
}

div.fancytree-grid-container::-webkit-scrollbar-track {
  background: rgba(0, 0, 0, 0.1);
  border-radius: 4px;
}

div.fancytree-grid-container::-webkit-scrollbar-thumb {
  background: var(--accent-color);
  border-radius: 4px;
  box-shadow: 1px 1px 0 var(--primary-color);
}

div.fancytree-grid-container::-webkit-scrollbar-thumb:hover {
  background: var(--accent-color-hover);
}

/* Style spécial pour le premier élément (racine) - PRIORITÉ ABSOLUE */

table.fancytree-ext-table tbody tr:first-child,
table.fancytree-ext-table.focus tbody tr:first-child,
table.fancytree-ext-table tbody tr:first-child:hover {
  --border-left-color: var(--primary-color);
  border-left: 5px solid var(--border-left-color) !important;
  font-weight: 700 !important;
  height: 50px !important;
  color: var(--primary-color) !important;
  background-color: var(--accent-color-hover) !important;
  transform: none !important;
  position: absolute;
  z-index: 1000;
  width: 100%;
  top: 0;
  left: 0;
  right: 0;
}


table.fancytree-ext-table tbody tr:first-child.active {
  --border-left-color: var(--primary-color);
  border-left: 5px solid var(--border-left-color) !important;
  font-weight: 700 !important;
  height: 50px !important;
  color: var(--primary-color) !important;
  background-color: var(--accent-color-hover);
  transform: none !important;
  position: absolute;
  z-index: 1000;
  width: 100%;
  top: 0;
  left: 0;
  right: 0;
}


/* Bouton toggle global séparé */
.global-collapse-toggle {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: var(--primary-color);
  border: 1px solid var(--accent-color);
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  font-size: 14px;
  color: var(--accent-color);
  opacity: 0.8;
  cursor: pointer;
  transition: all 0.3s ease;
  padding: 8px 12px;
  border-radius: 6px;
  z-index: 10;

  background-color: white;
  --border-left-color: var(--primary-color);
  border-left: 5px solid var(--border-left-color);
  box-shadow: -1px 1px 0 var(--primary-color);
}

.global-collapse-toggle:hover {
  opacity: 1;
  background-color: white;
  box-shadow: -3px 3px 0 var(--primary-color);
  border-left: 5px solid var(--border-left-color);
}


.global-collapse-toggle:before {
  content: "\f422";
  /* fa-compress-alt (FA5) / alias en FA6 */
}

/* État ON du bouton toggle */
.global-collapse-toggle.active:before {
  content: "\f424";
  /* fa-expand-alt (FA5) / alias en FA6 */
}

.global-collapse-toggle.active {
  color: var(--accent-color-hover);
  opacity: 1;
  background-color: var(--accent-color-clear);
  border-color: var(--accent-color-hover);
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.15);
}

/* État désactivé du bouton toggle */
.global-collapse-toggle.disabled {
  color: var(--tertiary-color);
  opacity: 0.4;
  background-color: rgba(128, 128, 128, 0.1);
  border-color: var(--tertiary-color);
  box-shadow: none;
}

.global-collapse-toggle.disabled:hover {
  opacity: 0.4;
  background-color: rgba(128, 128, 128, 0.1);
  border-color: var(--tertiary-color);
  box-shadow: none;
}

/* Position relative pour le span node de la racine */
table.fancytree-ext-table tbody tr:first-child span.fancytree-node {
  position: relative;
  padding-left: 10px;
  padding-right: 20px;
}

/* Empêcher la fermeture du premier élément */
table.fancytree-ext-table tbody tr:first-child>td>span.fancytree-node>span.fancytree-expander {
  display: none !important;
}

/* Style du titre pour la racine - PRIORITÉ ABSOLUE */
table.fancytree-ext-table tbody tr:first-child span.fancytree-title {
  color: var(--primary-color) !important;
  font-weight: 700 !important;
  text-shadow: 1px 1px 0 var(--accent-color-clear) !important;
  transition: color 0.2s ease;
  cursor: pointer;
}

/* Curseur pour la racine selon l'état du toggle */
table.fancytree-ext-table tbody tr:first-child .global-collapse-toggle.disabled~span.fancytree-title {
  cursor: default;
}

/* Hover sur le titre de la racine */
table.fancytree-ext-table tbody tr:first-child span.fancytree-title:hover {
  color: var(--accent-color-hover) !important;
}

/* Empêcher la sélection de la racine - PRIORITÉ ABSOLUE */
table.fancytree-ext-table tbody tr:first-child.fancytree-active,
table.fancytree-ext-table tbody tr:first-child.fancytree-selected {
  background-color: var(--accent-color-hover) !important;
  color: var(--primary-color) !important;
  box-shadow: none;
  transform: none;
  outline: 2px solid var(--tertiary-color);
}

/* Style du titre pour la racine sélectionnée - PRIORITÉ ABSOLUE */
table.fancytree-ext-table tbody tr:first-child.fancytree-active span.fancytree-title,
table.fancytree-ext-table tbody tr:first-child.fancytree-selected span.fancytree-title {
  color: var(--primary-color) !important;
  text-shadow: 1px 1px 0 var(--accent-color-clear);
}

/* ✅ Styles pour les nœuds colorés avec transitions */
table.fancytree-ext-table span.fancytree-title {
  transition: all 0.3s ease;
  position: relative;
}

/* ✅ Effet de brillance au survol */
table.fancytree-ext-table span.fancytree-title:hover {
  transform: translateX(2px);
}

/* ✅ Animation d'apparition pour les nouveaux nœuds */
@keyframes nodeAppear {
  from {
    opacity: 0;
    transform: translateX(-10px);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}

.fancytree-node {
  animation: nodeAppear 0.3s ease-out;
}

span.fancytree-title {
  color: inherit !important;
  font-weight: bold;
}

/* ✅ SYSTÈME DE COULEURS PAR NIVEAU D'ENJEU */

/* Enjeu très faible - Vert clair */
.fancytree-node[data-type="enjeu-1"],
.fancytree-node[data-type="enjeu-tres-faible"] {
  color: #4caf50 !important;
  --shadow-color: #4caf50 !important;
  --border-left-color: #4caf50 !important;
}

/* Enjeu faible - Vert */
.fancytree-node[data-type="enjeu-2"],
.fancytree-node[data-type="enjeu-faible"] {
  color: #8bc34a !important;
  --shadow-color: #8bc34a !important;
  --border-left-color: #8bc34a !important;
}

/* Enjeu moyen - Jaune-Orange */
.fancytree-node[data-type="enjeu-3"],
.fancytree-node[data-type="enjeu-moyen"] {
  color: #ff9800 !important;
  --shadow-color: #ff9800 !important;
  --border-left-color: #ff9800 !important;
}

/* Enjeu fort - Orange */
.fancytree-node[data-type="enjeu-4"],
.fancytree-node[data-type="enjeu-fort"] {
  color: #ff5722 !important;
  --shadow-color: #ff5722 !important;
  --border-left-color: #ff5722 !important;
}

/* Enjeu très fort - Rouge-Orange */
.fancytree-node[data-type="enjeu-5"],
.fancytree-node[data-type="enjeu-tres-fort"] {
  color: #f44336 !important;
  --shadow-color: #f44336 !important;
  --border-left-color: #f44336 !important;
}

/* Enjeu critique - Rouge foncé */
.fancytree-node[data-type="enjeu-6"],
.fancytree-node[data-type="enjeu-critique"] {
  color: #d32f2f !important;
  --shadow-color: #d32f2f !important;
  --border-left-color: #d32f2f !important;
}

/* ✅ ENFANTS DES NIVEAUX D'ENJEU : Héritent de la couleur de leur parent */

/* Enfants du niveau 1 (très faible) - Héritent du vert clair */
.fancytree-node[data-type="enjeu-1-child"] {
  color: #4caf50 !important;
  --shadow-color: #4caf50 !important;
  --border-left-color: #4caf50 !important;
}

/* Enfants du niveau 2 (faible) - Héritent du vert */
.fancytree-node[data-type="enjeu-2-child"] {
  color: #8bc34a !important;
  --shadow-color: #8bc34a !important;
  --border-left-color: #8bc34a !important;
}

/* Enfants du niveau 3 (moyen) - Héritent du jaune-orange */
.fancytree-node[data-type="enjeu-3-child"] {
  color: #ff9800 !important;
  --shadow-color: #ff9800 !important;
  --border-left-color: #ff9800 !important;
}

/* Enfants du niveau 4 (fort) - Héritent de l'orange */
.fancytree-node[data-type="enjeu-4-child"] {
  color: #ff5722 !important;
  --shadow-color: #ff5722 !important;
  --border-left-color: #ff5722 !important;
}

/* Enfants du niveau 5 (très fort) - Héritent du rouge-orange */
.fancytree-node[data-type="enjeu-5-child"] {
  color: #f44336 !important;
  --shadow-color: #f44336 !important;
  --border-left-color: #f44336 !important;
}

/* Enfants du niveau 6 (critique) - Héritent du rouge foncé */
.fancytree-node[data-type="enjeu-6-child"] {
  color: #d32f2f !important;
  --shadow-color: #d32f2f !important;
  --border-left-color: #d32f2f !important;
}

/* ✅ SYSTÈME DE COULEURS RESPECTANT LA CHARTE GRAPHIQUE EXISTANTE */

/* Nœuds de base - Couleur par défaut */
.fancytree-node:not([data-type]),
.fancytree-node[data-type=""] {
  color: var(--tertiary-color) !important;
  --shadow-color: var(--tertiary-color) !important;
  --border-left-color: var(--tertiary-color) !important;
}

/* 🎯 COULEURS DES OMBRES ET BORDURES PAR TYPE DE NŒUD */

/* Géométries - Rouge adouci (nœud entier pour icônes ET texte) */
.fancytree-node[data-type="geometries"],
.fancytree-node[data-type="origins"],
.fancytree-node[data-type="axes"],
.fancytree-node[data-type="areas"],
.fancytree-node[data-type="notes"],
/* Notes */
.fancytree-node[data-type="origin"],
.fancytree-node[data-type="axe"],
.fancytree-node[data-type="area"],
.fancytree-node[data-type="note"],
/* Note individuelle */
.fancytree-node[data-type="geometry"],
.fancytree-node[data-type="stream_geometry"] {
  color: rgb(255, 75, 75) !important;
}

/* Assurer que le texte reste rouge pour les géométries (au cas où) */
.fancytree-node[data-type="geometries"] span.fancytree-title,
.fancytree-node[data-type="origins"] span.fancytree-title,
.fancytree-node[data-type="axes"] span.fancytree-title,
.fancytree-node[data-type="areas"] span.fancytree-title,
.fancytree-node[data-type="notes"] span.fancytree-title,
.fancytree-node[data-type="origin"] span.fancytree-title,
.fancytree-node[data-type="axe"] span.fancytree-title,
.fancytree-node[data-type="area"] span.fancytree-title,
.fancytree-node[data-type="note"] span.fancytree-title,
.fancytree-node[data-type="geometry"] span.fancytree-title,
.fancytree-node[data-type="stream_geometry"] span.fancytree-title {
  color: rgb(255, 75, 75) !important;
}

/* Fiches (sans enfants) des géométries - Bordure rouge */
table.fancytree-ext-table tr:not(.fancytree-has-children) .fancytree-node[data-type="origin"],
table.fancytree-ext-table tr:not(.fancytree-has-children) .fancytree-node[data-type="axe"],
table.fancytree-ext-table tr:not(.fancytree-has-children) .fancytree-node[data-type="area"],
table.fancytree-ext-table tr:not(.fancytree-has-children) .fancytree-node[data-type="note"],
table.fancytree-ext-table tr:not(.fancytree-has-children) .fancytree-node[data-type="geometry"],
table.fancytree-ext-table tr:not(.fancytree-has-children) .fancytree-node[data-type="stream_geometry"] {
  --shadow-color: rgb(255, 75, 75) !important;
  border-color: rgb(255, 75, 75) !important;
}

/* Sites - Bleu-gris sobre harmonisé avec la charte graphique */
.fancytree-node[data-type="site"],
.fancytree-node[data-type="sites"] {
  color: #5a6c7d !important;
  --shadow-color: #5a6c7d !important;
  --border-left-color: #5a6c7d !important;
}

/* 🎯 RUSSEAUX COUVERTS - Couleurs dynamiques basées sur StreamColorManager */
.fancytree-node[data-type^="stream-"] {
  /* Les couleurs sont appliquées dynamiquement via JavaScript */
  /* Ce sélecteur permet de cibler tous les nœuds de type stream-* */
  transition: all 0.3s ease;
}

/* Branches - Utilise la couleur d'accent existante */
.fancytree-node[data-type="stream_branch"],
.fancytree-node[data-type="branch"],
.fancytree-node[data-type="branches"] {
  color: var(--accent-color) !important;
  --shadow-color: var(--accent-color) !important;
  --border-left-color: var(--accent-color) !important;
}

/* Sections - Utilise la couleur secondaire existante */
.fancytree-node[data-type="stream_section"],
.fancytree-node[data-type="section"],
.fancytree-node[data-type="sections"] {
  color: var(--secondary-color) !important;
  --shadow-color: var(--secondary-color) !important;
  --border-left-color: var(--secondary-color) !important;
}

/* Profondeurs - Bleu profond/cyan foncé */
.fancytree-node[data-type="stream_depth"],
.fancytree-node[data-type="depth"],
.fancytree-node[data-type="depths"] {
  color: #2980b9 !important;
  --shadow-color: #2980b9 !important;
  --border-left-color: #2980b9 !important;
}

/* Structures/Ouvrages - Gris-bleu */
.fancytree-node[data-type="stream_structure"],
.fancytree-node[data-type="structure"],
.fancytree-node[data-type="structures"] {
  color: #6c7a89 !important;
  --shadow-color: #6c7a89 !important;
  --border-left-color: #6c7a89 !important;
}

/* Courbes - Vert-bleu/Teal */
.fancytree-node[data-type="stream_curve"],
.fancytree-node[data-type="curve"],
.fancytree-node[data-type="curves"] {
  color: #16a085 !important;
  --shadow-color: #16a085 !important;
  --border-left-color: #16a085 !important;
}

/* Aires - Utilise la couleur d'accent clear existante avec contraste */
.fancytree-node[data-type="stream_area"],
.fancytree-node[data-type="area"],
.fancytree-node[data-type="areas"],
.fancytree-node[data-type="section-area"],
.fancytree-node[data-type="curve-area"],
.fancytree-node[data-type="depth-area"],
.fancytree-node[data-type="structure-area"] {
  color: var(--tertiary-color) !important;
  --shadow-color: var(--tertiary-color) !important;
  --border-left-color: var(--tertiary-color) !important;
}

/* Origines - Utilise la couleur primaire existante */
.fancytree-node[data-type="stream_origin"],
.fancytree-node[data-type="origin"],
.fancytree-node[data-type="origins"] {
  color: var(--primary-color) !important;
  --shadow-color: var(--primary-color) !important;
  --border-left-color: var(--primary-color) !important;
}

/* Axes - Utilise la couleur tertiaire existante */
.fancytree-node[data-type="stream_axe"],
.fancytree-node[data-type="axe"],
.fancytree-node[data-type="axes"] {
  color: var(--tertiary-color) !important;
  --shadow-color: var(--tertiary-color) !important;
  --border-left-color: var(--tertiary-color) !important;
}

/* Gestion tarifaire (Types de travaux) - Bleu-vert discret */
.fancytree-node[data-type="stream-works-types"],
.fancytree-node[data-type="stream-works-type"] {
  color: #4a9a8a !important;
  --shadow-color: #4a9a8a !important;
  --border-left-color: #4a9a8a !important;
}

/* Gestion des relevés - Couleur discrète */
.fancytree-node[data-type="stream-controls"],
.fancytree-node[data-type="stream-control"] {
  color: #6b7fa8 !important;
  --shadow-color: #6b7fa8 !important;
  --border-left-color: #6b7fa8 !important;
}

/* Gestion des couches - Couleur discrète */
.fancytree-node[data-type="layers"],
.fancytree-node[data-type="layer"] {
  color: #8b6fa8 !important;
  --shadow-color: #8b6fa8 !important;
  --border-left-color: #8b6fa8 !important;
}

/* Altérations - Bleu profond (comme Profondeurs) */
.fancytree-node[data-type="alteration"],
.fancytree-node[data-type="alterations"],
.fancytree-node[data-type="alteration-reference"],
.fancytree-node[data-type="alteration_state"],
.fancytree-node[data-type="alteration_states"] {
  color: #2980b9 !important;
  --shadow-color: #2980b9 !important;
  --border-left-color: #2980b9 !important;
}

/* Photos - Utilise la couleur d'accent select existante */
.fancytree-node[data-type="picture"],
.fancytree-node[data-type="section-pictures"],
.fancytree-node[data-type="stream-pictures"],
.fancytree-node[data-type="structure-pictures"],
.fancytree-node[data-type="alteration-pictures"] {
  color: var(--accent-color-select) !important;
  --shadow-color: var(--accent-color-select) !important;
  --border-left-color: var(--accent-color-select) !important;
}

/* Problèmes/Issues - Utilise la couleur d'accent existante */
.fancytree-node[data-type="issue"],
.fancytree-node[data-type="issues"],
.fancytree-node[data-type="issue-site"],
.fancytree-node[data-type="issue-level"] {
  color: var(--accent-color) !important;
  --shadow-color: var(--accent-color) !important;
  --border-left-color: var(--accent-color) !important;
}

/* Nœuds de base (streams, etc.) - Couleur par défaut */
.fancytree-node[data-type="stream"],
.fancytree-node[data-type="streams"] {
  color: var(--tertiary-color) !important;
  --shadow-color: var(--tertiary-color) !important;
  --border-left-color: var(--tertiary-color) !important;
}

/* 🎯 NIVEAUX D'ENJEU - COULEURS SPÉCIFIQUES */

/* Enjeu très faible - Vert clair */
.fancytree-node[data-type="enjeu-1"],
.fancytree-node[data-type="enjeu-tres-faible"] {
  color: #4caf50 !important;
  --shadow-color: #4caf50 !important;
  --border-left-color: #4caf50 !important;
}

/* Enjeu faible - Vert moyen */
.fancytree-node[data-type="enjeu-2"],
.fancytree-node[data-type="enjeu-faible"] {
  color: #8bc34a !important;
  --shadow-color: #8bc34a !important;
  --border-left-color: #8bc34a !important;
}

/* Enjeu moyen - Orange */
.fancytree-node[data-type="enjeu-3"],
.fancytree-node[data-type="enjeu-moyen"] {
  color: #ff9800 !important;
  --shadow-color: #ff9800 !important;
  --border-left-color: #ff9800 !important;
}

/* Enjeu fort - Orange foncé */
.fancytree-node[data-type="enjeu-4"],
.fancytree-node[data-type="enjeu-fort"] {
  color: #ff5722 !important;
  --shadow-color: #ff5722 !important;
  --border-left-color: #ff5722 !important;
}

/* Enjeu très fort - Rouge */
.fancytree-node[data-type="enjeu-5"],
.fancytree-node[data-type="enjeu-tres-fort"] {
  color: #f44336 !important;
  --shadow-color: #f44336 !important;
  --border-left-color: #f44336 !important;
}

/* Enjeu critique - Rouge foncé */
.fancytree-node[data-type="enjeu-6"],
.fancytree-node[data-type="enjeu-critique"] {
  color: #d32f2f !important;
  --shadow-color: #d32f2f !important;
  --border-left-color: #d32f2f !important;
}

/* 🎯 ENFANTS DES NIVEAUX D'ENJEU - HÉRITENT DES COULEURS PARENT */

/* Enfants du niveau 1 (très faible) - Héritent du vert clair */
.fancytree-node[data-type="enjeu-1-child"] {
  color: #4caf50 !important;
  --shadow-color: #4caf50 !important;
  --border-left-color: #4caf50 !important;
}

/* Enfants du niveau 2 (faible) - Héritent du vert moyen */
.fancytree-node[data-type="enjeu-2-child"] {
  color: #8bc34a !important;
  --shadow-color: #8bc34a !important;
  --border-left-color: #8bc34a !important;
}

/* Enfants du niveau 3 (moyen) - Héritent de l'orange */
.fancytree-node[data-type="enjeu-3-child"] {
  color: #ff9800 !important;
  --shadow-color: #ff9800 !important;
  --border-left-color: #ff9800 !important;
}

/* Enfants du niveau 4 (fort) - Héritent de l'orange foncé */
.fancytree-node[data-type="enjeu-4-child"] {
  color: #ff5722 !important;
  --shadow-color: #ff5722 !important;
  --border-left-color: #ff5722 !important;
}

/* Enfants du niveau 5 (très fort) - Héritent du rouge */
.fancytree-node[data-type="enjeu-5-child"] {
  color: #f44336 !important;
  --shadow-color: #f44336 !important;
  --border-left-color: #f44336 !important;
}

/* Enfants du niveau 6 (critique) - Héritent du rouge foncé */
.fancytree-node[data-type="enjeu-6-child"] {
  color: #d32f2f !important;
  --shadow-color: #d32f2f !important;
  --border-left-color: #d32f2f !important;
}

/* 🎯 PASTILLE DE MODIFICATION - NOUVELLE FONCTIONNALITÉ */

/* Style pour la pastille de modification dans le TD du FancyTree */
.fancytree-node+.modification-badge {
  display: inline-block;
  background: #ff6b6b;
  color: white;
  border-radius: 50%;
  width: 18px;
  height: 18px;
  text-align: center;
  line-height: 18px;
  font-size: 11px;
  font-weight: bold;
  margin-left: 12px;
  animation: pulse 2s infinite;
  vertical-align: middle;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
  cursor: pointer;
  transition: all 0.3s ease;
  position: relative;
  z-index: 10;
}

/* Animation de pulsation pour attirer l'attention */
@keyframes pulse {
  0% {
    transform: scale(1);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
  }

  50% {
    transform: scale(1.15);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
  }

  100% {
    transform: scale(1);
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.3);
  }
}

/* Effet hover sur la pastille */
.fancytree-node+.modification-badge:hover {
  background: #ff5252;
  transform: scale(1.2);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.5);
}

/* Style pour les pastilles dans les nœuds de différents types */
.fancytree-node[data-type="alteration"]+.modification-badge {
  background: #ff6b6b;
  /* Rouge pour les altérations */
}

.fancytree-node[data-type="issue"]+.modification-badge {
  background: #ff9800;
  /* Orange pour les enjeux */
}

.fancytree-node[data-type="site"]+.modification-badge {
  background: #2196f3;
  /* Bleu pour les sites */
}

.fancytree-node[data-type="stream"]+.modification-badge {
  background: #4caf50;
  /* Vert pour les cours d'eau */
}

/* Style pour les pastilles dans les nœuds d'enjeux */
.fancytree-node[data-type^="enjeu-"]+.modification-badge {
  background: #ff9800;
  /* Orange pour tous les niveaux d'enjeux */
}

/* Style pour les pastilles dans les nœuds enfants d'enjeux */
.fancytree-node[data-type*="-child"]+.modification-badge {
  background: #ffb74d;
  /* Orange plus clair pour les enfants d'enjeux */
}

/* Responsive : ajuster la taille sur les petits écrans */
@media (max-width: 768px) {
  .fancytree-node+.modification-badge {
    width: 16px;
    height: 16px;
    line-height: 16px;
    font-size: 10px;
    margin-left: 8px;
  }
}

/* Classe pour supprimer l'outline de FancyTree */
table.fancytree-ext-table tbody tr.fancytree-focused span.fancytree-title {
  outline: none !important;
}

/* ========================================== */
/* COULEURS POUR LES NŒUDS DE SCORING        */
/* ========================================== */

/* Scoring d'obstruction de section - Rouge-orange */
.fancytree-node[data-type="stream-section-obstruction-scoring"] {
  color: #ff5722 !important;
  --shadow-color: #ff5722 !important;
  --border-left-color: #ff5722 !important;
}

/* Scoring de section (hydro bleu + obstruction vert) - Bleu-vert (plus bleu) */
.fancytree-node[data-type="section-scoring"] {
  color: #4a9fa8 !important;
  --shadow-color: #4a9fa8 !important;
  --border-left-color: #4a9fa8 !important;
}

/* Scoring de ruisseau (hydro bleu + risque orange) - Bleu-orange/cyan chaud */
.fancytree-node[data-type="stream-scoring"] {
  color: #3da3c4 !important;
  --shadow-color: #3da3c4 !important;
  --border-left-color: #3da3c4 !important;
}

/* Fiches individuelles de notes par ruisseau - Cyan chaud */
.fancytree-node[data-type="stream-scoring-date"] {
  color: #3da3c4 !important;
  --shadow-color: #3da3c4 !important;
  --border-left-color: #3da3c4 !important;
}

/* Fiches individuelles de notes par section - Bleu-vert (plus bleu) */
.fancytree-node[data-type="section-scoring-date"] {
  color: #4a9fa8 !important;
  --shadow-color: #4a9fa8 !important;
  --border-left-color: #4a9fa8 !important;
}

/* Scoring de risque de ruisseau - Rouge */
.fancytree-node[data-type="stream-risk-scoring"] {
  color: #f44336 !important;
  --shadow-color: #f44336 !important;
  --border-left-color: #f44336 !important;
}

/* Scoring hydraulique de ruisseau - Bleu */
.fancytree-node[data-type="stream-hydro-scoring"] {
  color: #2196f3 !important;
  --shadow-color: #2196f3 !important;
  --border-left-color: #2196f3 !important;
}

/* ========================================== */
/* ICÔNES SVG AVEC CSS MASK                   */
/* ========================================== */
/* Les icônes utilisent mask-image pour permettre la coloration via CSS */
/* La couleur est héritée automatiquement via currentColor */
/* Le mask-image est appliqué dynamiquement par JavaScript */

.fancytree-icon {
  -webkit-mask-size: contain;
  mask-size: contain;
  -webkit-mask-repeat: no-repeat;
  mask-repeat: no-repeat;
  -webkit-mask-position: center;
  mask-position: center;
  background-color: currentColor;
  /* Le mask-image sera appliqué dynamiquement par JavaScript via inline style */
}