.csa-tree-card { margin-bottom:18px; padding:0; overflow:hidden; }
.csa-tree-toolbar { display:flex; gap:10px; padding:16px; border-bottom:1px solid var(--csa-border); background:#fff; }
.csa-tree-toolbar input { flex:1; border:1px solid var(--csa-border); border-radius:10px; padding:11px 13px; }
.csa-tree-canvas { height:620px; background:linear-gradient(#f8fbfe,#f4f8fc); }
.csa-relation-panel { margin-top:18px; }

/* Relations familiales */
.csa-tree-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 16px 24px;
  padding: 14px 18px 18px;
  color: #60758a;
  font-size: 13px;
  align-items: center;
}
.csa-tree-legend span { display: inline-flex; align-items: center; gap: 8px; }
.csa-legend-dot { width: 12px; height: 12px; border-radius: 50%; display: inline-block; }
.csa-legend-male { background: #245f8d; }
.csa-legend-female { background: #b85f8a; }
.csa-legend-line { width: 26px; height: 0; border-top: 2px solid #9fb2c5; display: inline-block; }
.csa-legend-spouse { border-top-style: dashed; border-top-color: #d9a441; }
.csa-help-text { color: #60758a; margin-top: -4px; margin-bottom: 18px; font-size: 14px; }

/* Orientation de l'arbre */
.csa-tree-orientation-wrap {
  display:flex;
  align-items:center;
  gap:8px;
  padding:0 4px;
  color:#60758a;
  font-size:13px;
  font-weight:600;
}
.csa-tree-orientation-wrap select {
  border:1px solid var(--csa-border);
  border-radius:10px;
  padding:10px 34px 10px 12px;
  background:#fff;
  color:#26384a;
  min-width:132px;
}
.csa-legend-node {
  width:12px;
  height:12px;
  border-radius:50%;
  display:inline-block;
  border:2px solid #fff;
  box-shadow:0 0 0 1px rgba(0,0,0,.08);
}
.csa-legend-couple-node { background:#d9a441; }
.csa-legend-parent { border-top-color:#8da5bb; }

@media (max-width: 760px) {
  .csa-tree-toolbar {
    flex-wrap:wrap;
  }
  .csa-tree-toolbar input {
    flex-basis:100%;
  }
  .csa-tree-orientation-wrap {
    flex:1;
  }
  .csa-tree-canvas {
    height:560px;
  }
}

/* v1.5 - photos dans les nœuds de l'arbre */
.csa-tree-canvas { min-height: 620px; }

/* v3.1 - grands arbres (500 à 2000 membres) */
.csa-tree-toolbar-large { align-items:flex-end; flex-wrap:wrap; }
.csa-tree-search-group { display:flex; gap:8px; flex:1 1 360px; min-width:280px; }
.csa-tree-search-group input { min-width:180px; }
.csa-tree-depth-wrap { display:flex; flex-direction:column; gap:5px; color:#60758a; font-size:12px; font-weight:700; }
.csa-tree-depth-wrap select { border:1px solid var(--csa-border); border-radius:10px; padding:10px 30px 10px 10px; background:#fff; color:#26384a; }
.csa-tree-context-bar { display:flex; flex-wrap:wrap; gap:10px 22px; align-items:center; padding:10px 16px; border-bottom:1px solid var(--csa-border); background:#f8fbfe; color:#60758a; font-size:13px; }
.csa-tree-context-bar strong { color:#17345c; }
.csa-tree-tip { margin-left:auto; font-style:italic; }
@media (max-width:900px){
  .csa-tree-search-group { flex-basis:100%; }
  .csa-tree-depth-wrap,.csa-tree-orientation-wrap { flex:1 1 150px; }
  .csa-tree-tip { margin-left:0; flex-basis:100%; }
}




/* v3.5.13 - Navigation type Google Maps */
.csa-tree-card {
    overflow: hidden;
}

.csa-tree-map {
    width: 100%;
    height: 74vh;
    min-height: 680px;
    position: relative;
    overflow: hidden;
    border-top: 1px solid var(--csa-border);
    border-bottom: 1px solid var(--csa-border);
    background:
        radial-gradient(circle at 1px 1px, rgba(94,119,145,.12) 1px, transparent 1px),
        #fbfdff;
    background-size: 18px 18px;
    cursor: grab;
}

.csa-tree-map:active {
    cursor: grabbing;
}

.csa-tree-zoom-controls {
    display: inline-flex;
    align-items: center;
    gap: 6px;
}

.csa-tree-zoom-controls .csa-btn {
    min-width: 42px;
}

.csa-tree-map::after {
    content: "Déplacer : cliquer-glisser   •   Zoom : molette ou boutons + / −";
    position: absolute;
    left: 16px;
    bottom: 14px;
    z-index: 10;
    padding: 8px 11px;
    border-radius: 10px;
    background: rgba(255,255,255,.92);
    color: #5f7184;
    font-size: 12px;
    box-shadow: 0 5px 18px rgba(23,52,92,.08);
    pointer-events: none;
}

@media(max-width:900px){
    .csa-tree-map {
        height: 68vh;
        min-height: 580px;
    }
}


/* v3.5.27 - Mode d'affichage sélectionné */
.csa-tree-toolbar .csa-tree-mode-active {
    background: #17345c !important;
    border-color: #17345c !important;
    color: #fff !important;
    box-shadow: 0 0 0 3px rgba(23, 52, 92, .12);
}

.csa-tree-toolbar .csa-tree-mode-active:hover {
    background: #17345c !important;
    color: #fff !important;
}


/* v3.5.44 - Noms/prénoms en info-bulle */
.csa-tree-person-tooltip {
    position: fixed;
    z-index: 99999;
    max-width: 240px;
    padding: 8px 11px;
    border-radius: 9px;
    background: rgba(24, 40, 57, .96);
    color: #fff;
    font-size: 13px;
    font-weight: 500;
    line-height: 1.3;
    text-align: center;
    box-shadow: 0 8px 24px rgba(0,0,0,.18);
    pointer-events: none;
    white-space: normal;
}

.csa-tree-person-tooltip[hidden] {
    display: none !important;
}