/* ═══════════════════════════════════════════
   PMS — GANTT CHART
   ═══════════════════════════════════════════ */

.gantt-wrapper{padding:0;overflow:hidden}

.gantt-container{display:flex;min-height:400px}

.gantt-loading{display:flex;align-items:center;justify-content:center;width:100%;color:rgba(255,255,255,.4);gap:8px;font-size:.85rem}

/* ─── Left Panel (Labels) ─── */
.gantt-left{flex-shrink:0;width:220px;border-right:1px solid rgba(255,255,255,.06)}

.gantt-left-header{
  height:62px;display:flex;align-items:center;padding:0 16px;
  font-size:.8rem;font-weight:700;color:rgba(255,255,255,.5);
  border-bottom:1px solid rgba(255,255,255,.06);
  background:rgba(255,255,255,.02);
}

.gantt-labels{overflow:hidden}

.gantt-label{
  height:36px;display:flex;align-items:center;padding:0 16px;
  font-size:.78rem;color:rgba(255,255,255,.7);
  border-bottom:1px solid rgba(255,255,255,.03);
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}

.gantt-label-group{
  font-weight:700;color:rgba(255,255,255,.85);
  background:rgba(255,255,255,.03);
  gap:8px;font-size:.8rem;
}
.gantt-label-group i{color:rgba(255,255,255,.3);font-size:.7rem}

.gantt-label-task{padding-left:28px}

/* ─── Right Panel (Timeline) ─── */
.gantt-right{flex:1;overflow:hidden;display:flex;flex-direction:column}

.gantt-timeline-header{
  flex-shrink:0;border-bottom:1px solid rgba(255,255,255,.06);
  overflow:hidden;background:rgba(255,255,255,.02);
}

.gantt-timeline-body{
  flex:1;overflow:auto;
}
.gantt-timeline-body::-webkit-scrollbar{height:8px;width:8px}
.gantt-timeline-body::-webkit-scrollbar-track{background:rgba(255,255,255,.02)}
.gantt-timeline-body::-webkit-scrollbar-thumb{background:rgba(255,255,255,.1);border-radius:4px}
.gantt-timeline-body::-webkit-scrollbar-thumb:hover{background:rgba(255,255,255,.2)}

/* ─── Month / Day Headers ─── */
.gantt-months{display:flex;height:28px}
.gantt-month-cell{
  display:flex;align-items:center;justify-content:center;
  font-size:.7rem;font-weight:700;color:rgba(255,255,255,.5);
  border-right:1px solid rgba(255,255,255,.06);
  box-sizing:border-box;
}

.gantt-days{display:flex;height:34px}
.gantt-day-cell{
  display:flex;align-items:center;justify-content:center;
  font-size:.65rem;color:rgba(255,255,255,.35);
  border-right:1px solid rgba(255,255,255,.03);
  box-sizing:border-box;
  min-width:28px;
}
.gantt-day-cell.today{
  background:rgba(251,113,133,.15);color:#fb7185;font-weight:700;
}
.gantt-day-cell.weekend{background:rgba(255,255,255,.015)}

/* ─── Rows ─── */
.gantt-rows{position:relative}

.gantt-row{
  height:36px;position:relative;
  border-bottom:1px solid rgba(255,255,255,.03);
}

.gantt-row-group{background:rgba(255,255,255,.03)}

/* ─── Bar ─── */
.gantt-bar{
  position:absolute;top:6px;height:24px;border-radius:5px;
  display:flex;align-items:center;padding:0 8px;
  opacity:.85;transition:opacity .2s;
  min-width:8px;overflow:hidden;
  cursor:pointer;
}
.gantt-bar:hover{opacity:1}

.gantt-bar-text{
  font-size:.65rem;font-weight:600;color:#fff;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;
}

/* ─── Today Marker (red dotted line) ─── */
.gantt-today-line{
  position:absolute;top:0;bottom:0;width:0;
  border-left:2px dashed #fb7185;
  z-index:5;pointer-events:none;
  box-shadow:0 0 6px rgba(251,113,133,.3);
}

/* ─── Responsive ─── */
@media(max-width:768px){
  .gantt-left{width:120px;min-width:120px}
  .gantt-label{font-size:.68rem;padding:0 8px}
  .gantt-label-task{padding-left:14px}
  .gantt-right{-webkit-overflow-scrolling:touch}
}
@media(max-width:480px){
  .gantt-left{width:90px;min-width:90px}
  .gantt-label{font-size:.62rem;padding:0 6px}
}