/* ==========================================================
   OVREN Calendar – Gantt
   Base CSS (ABS défaut) + GRID opt-in
   + V0.9.1 : labels missions à gauche + segments tooltips
   ========================================================== */



/* Variables & base */
.ovren-gantt{
  --ovren-label-width: 260px;
  --ovren-row-h: 34px;
  --ovren-bar-h: 18px;
  --ovren-mission-h: 16px;

  /* V0.9.1 */
  --ovren-mission-label-indent: 16px; /* indentation sous le projet */
  --ovren-mission-gap: 6px;           /* doit matcher row-gap/espacement missions */
}

.ovren-gantt *{ box-sizing:border-box; }

.ovren-gantt-scroll{ overflow:auto; }
.ovren-gantt-grid{ min-width:100%; }

/* ==========================================================
   Layout général
   ========================================================== */

.ovren-gantt-head,
.ovren-gantt-row{
  display:grid;
  grid-template-columns: var(--ovren-label-width) 1fr;
  align-items: stretch;
}

/* Labels (header + rows) */
.ovren-gantt-head-label,
.ovren-gantt-row-label{
  padding: 8px 10px;
  display:flex;
  gap: 6px;
  margin: 0;
  line-height: 1.2;
}

/* >>> alignement TOP du contenu label */
.ovren-gantt-head-label,
.ovren-gantt-row-label{
  align-items: flex-start;
  padding-top: 10px;
  padding-bottom: 6px;
}

.ovren-gantt-head-units-wrap{
  border-bottom: 1px solid rgba(0,0,0,.08);
}

/* ==========================================================
   Header (mois / unités)
   ========================================================== */

.ovren-gantt-head-months{
  display:grid;
  grid-auto-flow: column;
  grid-template-columns: repeat(var(--ovren-units-count), var(--ovren-unit-width));
}

.ovren-gantt-head-month{
  padding: 6px 8px;
  font-size: 12px;
  color: #666;
  white-space: nowrap;
  border-right: 1px solid rgba(0,0,0,.06);
}

.ovren-gantt-head-units{
  display:grid;
  grid-auto-flow: column;
  grid-template-columns: repeat(var(--ovren-units-count), var(--ovren-unit-width));
}

.ovren-gantt-unit{
  height: 28px;
  display:flex;
  align-items:center;
  justify-content:center;
  font-size: 12px;
  color:#444;
  border-right: 1px solid rgba(0,0,0,.06);
}

/* ==========================================================
   Rows / borders propres
   ========================================================== */

.ovren-gantt-body{ display:block; }

/* Border unique et continue sur toute la row */
.ovren-gantt-row{
  min-height: var(--ovren-row-h);
  border-bottom: 1px solid rgba(0,0,0,.06);
}

.ovren-gantt-row-track{
  border-bottom: 0;
}

/* Track neutre (ABS par défaut) */
.ovren-gantt-row-track{
  position:relative;
  min-height: var(--ovren-row-h);
}

/* ==========================================================
   V0.9.1 : colonne label wrap (projet + labels missions)
   ========================================================== */

.ovren-gantt-row-labelwrap{
  padding: 0;          /* on laisse .ovren-gantt-row-label gérer son padding */
  display:block;
}

/* Liste des labels mission (sous le projet, alignée avec missions dans track) */
.ovren-gantt-mission-labels{
  display:block;
  margin-top: calc(var(--ovren-bar-h) + 6px); /* aligné avec margin-top missions ABS */
  padding: 6px 10px 10px 10px;               /* match padding missions */
}

/* 1 label mission = 1 ligne, même hauteur que mission */
.ovren-gantt-mission-label{
  height: var(--ovren-mission-h);
  display:flex;
  align-items:center;
  font-size: 12px;
  color:#1b1b1b;
  white-space: nowrap;
  overflow:hidden;
  text-overflow: ellipsis;

  padding-left: var(--ovren-mission-label-indent);
  margin-bottom: var(--ovren-mission-gap);
}

.ovren-gantt-mission-label:last-child{
  margin-bottom: 0;
}

a.ovren-gantt-mission-label{
  color:#1b1b1b;
  text-decoration:none;
}
a.ovren-gantt-mission-label:hover{
  text-decoration: underline;
}

/* ==========================================================
   Barres projets
   ========================================================== */

.ovren-gantt-bar{
  grid-row: 1;
  height: var(--ovren-bar-h);
  border-radius: 6px;
  background:#2d6cdf;
  opacity:.95;
  overflow:hidden;
  display:flex;
  align-items:center;
  padding: 0 8px;
  min-width:0;
}

.ovren-gantt-bar-text{
  font-size:12px;
  color:#fff;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}

/* ==========================================================
   Missions (track) — on garde ton système (ABS/GRID + --row)
   ========================================================== */

.ovren-gantt-missions{
  position:relative;
  display:grid;
  grid-template-columns: repeat(var(--ovren-units-count), var(--ovren-unit-width));
  grid-auto-rows: var(--ovren-mission-h);
  row-gap: var(--ovren-mission-gap);
  column-gap: 0;
  padding: 6px 0 10px 0;
}

/* segments = mission-bar (sans texte) */
.ovren-gantt-mission-bar{
  height: var(--ovren-mission-h);
  border-radius: 6px;
  background: rgba(45,108,223,.22);
  display:block;
  min-width:0;
  cursor: default;
}

/* si c’est un lien */
a.ovren-gantt-mission-bar{
  cursor: pointer;
}

/* (Option) hover léger pour montrer l’interactivité */
.ovren-gantt-mission-bar:hover{
  filter: brightness(0.95);
}

/* ==========================================================
   Toggle missions (sans JS)
   ========================================================== */

.ovren-gantt-toggle{ display:none; }

.ovren-gantt-row-label--toggle{
  cursor:pointer;
  user-select:none;
  display:flex;
  width:100%;
}

.ovren-gantt-row-label-count{
  font-size:12px;
  color:#777;
}

/* Cache missions si toggle off (doit gagner) */
.ovren-gantt-toggle:not(:checked) ~ .ovren-gantt-row-track .ovren-gantt-missions{
  display:none !important;
}

/* Cache aussi la liste des labels mission si toggle off */
.ovren-gantt-toggle:not(:checked) ~ .ovren-gantt-row-labelwrap .ovren-gantt-mission-labels{
  display:none !important;
}

/* ==========================================================
   MODE ABS (défaut)
   ========================================================== */

.ovren-gantt--pos-abs .ovren-gantt-row-track{
  display:block;
}

.ovren-gantt--pos-abs .ovren-gantt-bar,
.ovren-gantt--pos-abs .ovren-gantt-mission-bar{
  position:absolute;
  left: calc(var(--start) * var(--ovren-unit-width));
  width: calc(var(--span) * var(--ovren-unit-width));
}

/* ABS : missions empilées (1 mission = 1 ligne) */
.ovren-gantt--pos-abs .ovren-gantt-missions{
  display:block;
  position:relative;
  margin-top: calc(var(--ovren-bar-h) + 6px);
  height: calc(
    (var(--missions-count) * var(--ovren-mission-h)) +
    ((var(--missions-count) - 1) * var(--ovren-mission-gap))
  );
}

/* ABS : placement vertical selon --row */
.ovren-gantt--pos-abs .ovren-gantt-mission-bar{
  top: calc((var(--row) - 1) * (var(--ovren-mission-h) + var(--ovren-mission-gap)));
}

/* ==========================================================
   MODE GRID (opt-in)
   ========================================================== */

.ovren-gantt--pos-grid .ovren-gantt-row-track{
  display:grid;
  grid-template-columns: repeat(var(--ovren-units-count), var(--ovren-unit-width));
  grid-template-rows: var(--ovren-row-h) auto;
  align-items:start;
  align-content:start;
  row-gap: 6px;
}

/* Projet en haut */
.ovren-gantt--pos-grid .ovren-gantt-bar{
  position:relative;
  left:auto;
  width:auto;
  grid-row: 1;
  align-self:start;
  margin-top: 8px;
  grid-column: calc(var(--start) + 1) / span var(--span);
}

/* Missions sous le projet */
.ovren-gantt--pos-grid .ovren-gantt-missions{
  grid-row: 2;
  grid-column: 1 / -1;
  margin-top: 0;
  grid-auto-flow: row;
}

/* Segments (barres) en grille */
.ovren-gantt--pos-grid .ovren-gantt-mission-bar{
  position:relative;
  left:auto;
  width:auto;
  grid-column: calc(var(--start) + 1) / span var(--span);
  grid-row: var(--row);
}

/* Accordéon fermé : on collapse la 2e ligne */
.ovren-gantt-toggle:not(:checked) ~ .ovren-gantt-row-track{
  grid-template-rows: var(--ovren-row-h) 0;
  row-gap: 0;
}

/* ==========================================================
   Tooltip HTML (bulle propre) — V0.9.1
   ========================================================== */

/* Important : ne coupe pas les tooltips */
.ovren-gantt-row-track,
.ovren-gantt-missions{
  overflow: visible !important;
}

/* Base segment */
.ovren-gantt-mission-bar{
  position: relative;
  overflow: visible !important; /* évite le "coinçage" dans la barre */
}

/* Tooltip bubble */
.ovren-gantt-tip{
  position: absolute;
  left: 0;
  bottom: calc(100% + 8px); /* au-dessus de la barre */
  z-index: 999999;

  display: block;     /* on gère la visibilité via opacity/visibility */
  opacity: 0;
  visibility: hidden;
  transform: translateY(4px);
  transition: opacity .12s ease, transform .12s ease, visibility .12s ease;

  max-width: 360px;
  min-width: 220px;
  padding: 8px 10px;
  border-radius: 10px;

  background: rgba(20,20,20,.92);
  color: #fff;
  font-size: 12px;
  line-height: 1.25;

  white-space: normal;
  pointer-events: none;
  box-shadow: 0 10px 26px rgba(0,0,0,.22);
}

/* Affichage au hover */
.ovren-gantt-mission-bar:hover .ovren-gantt-tip{
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

/* Petite flèche */
.ovren-gantt-tip::after{
  content: "";
  position: absolute;
  left: 14px;
  top: 100%;
  width: 0;
  height: 0;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  border-top: 7px solid rgba(20,20,20,.92);
}


/* ==========================================================
   Freeze panes (Excel-like) + zebra rows + overlaps
   ========================================================== */

/* 1) Zebra: 1 row projet sur 2 */
.ovren-gantt-body .ovren-gantt-row { background: #fff; }
.ovren-gantt-body .ovren-gantt-row:nth-child(even) { background: #f9f9f9; }

/* 2) Overlaps: segments légèrement translucides, mais 100% au hover (tooltip lisible) */
.ovren-gantt-mission-bar--seg { opacity: .90; }
.ovren-gantt-mission-bar--seg:hover { opacity: 1; }

/* 3) Scroll interne (active le freeze) — au moins pour WEEK */
.ovren-gantt--scale-week .ovren-gantt-scroll{
  max-height: var(--ovren-scroll-max-h, 70vh);
  overflow: auto;
  position: relative;
  -webkit-overflow-scrolling: touch;
}

/* 4) Header sticky (mois + unités/jours figés en haut) */
.ovren-gantt--scale-week .ovren-gantt-head{
  position: sticky;
  top: 0;
  z-index: 50;
  background: #fff;
  box-shadow: 0 1px 0 rgba(0,0,0,.08);
}

/* 5) Colonne labels sticky (colonne A figée) */
.ovren-gantt--scale-week .ovren-gantt-head-label{
  position: sticky;
  left: 0;
  z-index: 60; /* au-dessus du header */
  background: #fff;
  box-shadow: 1px 0 0 rgba(0,0,0,.08);
}

.ovren-gantt--scale-week .ovren-gantt-row-labelwrap{
  position: sticky;
  left: 0;
  z-index: 40;              /* au-dessus du track */
  background: inherit;      /* garde le zebra (hérite de .ovren-gantt-row) */
  box-shadow: 1px 0 0 rgba(0,0,0,.08);
}

/* Option: si tu veux aussi le freeze sur MONTH/YEAR, décommente :
.ovren-gantt--scale-month .ovren-gantt-scroll,
.ovren-gantt--scale-year  .ovren-gantt-scroll { max-height: var(--ovren-scroll-max-h, 70vh); overflow:auto; position:relative; }
.ovren-gantt--scale-month .ovren-gantt-head,
.ovren-gantt--scale-year  .ovren-gantt-head  { position:sticky; top:0; z-index:50; background:#fff; box-shadow:0 1px 0 rgba(0,0,0,.08); }
.ovren-gantt--scale-month .ovren-gantt-head-label,
.ovren-gantt--scale-year  .ovren-gantt-head-label { position:sticky; left:0; z-index:60; background:#fff; box-shadow:1px 0 0 rgba(0,0,0,.08); }
.ovren-gantt--scale-month .ovren-gantt-row-labelwrap,
.ovren-gantt--scale-year  .ovren-gantt-row-labelwrap { position:sticky; left:0; z-index:40; background:inherit; box-shadow:1px 0 0 rgba(0,0,0,.08); }
*/


label.ovren-gantt-row-label.ovren-gantt-row-label--toggle {
    text-transform: uppercase;
    font-weight: bold;
}


/* ==========================================================
   Alignement labels missions vs bars (fix du +6px)
   ========================================================== */

/* 1) On annule le bricolage */
.ovren-gantt-mission-labels{
  margin-top: var(--ovren-bar-h) !important; /* plus de +6px */
}

/* 2) On gère l'espacement via padding, pas via margin */
.ovren-gantt-mission-labels{
  padding-top: 0 !important;
}

/* 3) Et on force la même "respiration" verticalement des deux côtés */
.ovren-gantt-row-labelwrap{
  padding-top: 0;  /* si tu as du padding qui décale la colonne gauche */
}
