/* html,
body {
  height: 100%;
  padding: 0;
  margin: 0;
  overflow: hidden;
}

.gantt_marker {
  background-color: rgba(255, 0, 0, 0.8);
}
.gantt_marker.today {
  background: #ffb121;
}

.gantt_task_link.start_to_start .gantt_line_wrapper div {
  background-color: #dd5640;
}
.gantt_task_link.start_to_start:hover .gantt_line_wrapper div {
  box-shadow: 0 0 5px 0px #dd5640;
}
.gantt_task_link.finish_to_start .gantt_line_wrapper div {
  background-color: #7576ba;
}
.gantt_task_link.finish_to_finish .gantt_line_wrapper div {
  background-color: #55d822;
}

.gantt_grid_scale .gantt_grid_head_cell,
.gantt_task .gantt_task_scale .gantt_scale_cell {
  font-weight: bold;
  font-size: 14px;
  color: rgba(0, 0, 0, 0.7);
}

.resource_marker div {
  width: 28px;
  height: 28px;
  line-height: 29px;
  display: inline-block;
  border-radius: 15px;
  color: #fff;
  margin: 3px;
}
.resource_marker.workday_ok div {
  background: #51c185;
}
.resource_marker.workday_over div {
  background: #ff8686;
}

.owner-label {
  width: 20px;
  height: 20px;
  line-height: 20px;
  font-size: 12px;
  display: inline-block;
  border: 1px solid #cccccc;
  border-radius: 25px;
  background: #e6e6e6;
  color: #6f6f6f;
  margin: 0 3px;
  font-weight: bold;
}

.gantt_tooltip {
  font-size: 13px;
  line-height: 16px;
}

.gantt_task_progress {
  text-align: left;
  padding-left: 10px;
  box-sizing: border-box;
  color: white;
  font-weight: bold;
}

.weekend {
  background: #f0dfe5 !important;
}

.gantt_task_row .gantt_task_line.deadline-task {
  border-left: 6px solid #ef4444 !important;
}
.gantt_task_row .gantt_task_line.deadline-task::after {
  content: "⚑";
  position: absolute;
  top: -10px;
  right: -10px;
  background: #ef4444;
  color: white;
  border-radius: 50%;
  width: 22px;
  height: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  font-weight: bold;
  z-index: 100;
  box-shadow: 0 3px 8px rgba(239, 68, 68, 0.4);
}

.gantt_task_row .gantt_task_line.constraint-task {
  border-right: 5px solid #f59e0b !important;
}

.gantt_task_row .gantt_task_line.has-baseline .gantt_task_progress::before {
  content: "Planned";
  position: absolute;
  left: 8px;
  top: 3px;
  font-size: 10px;
  color: #10b981;
  font-weight: 600;
  background: rgba(16, 185, 129, 0.2);
  padding: 1px 4px;
  border-radius: 3px;
}

.gantt_task_content {
  position: absolute;
  white-space: nowrap;
  overflow: visible !important;
  z-index: 5;
}
.task-label {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}
.deadline-badge {
  background: #ef4444;
  color: white;
  border-radius: 50%;
  width: 16px;
  height: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  font-weight: bold;
}

html,
body {
  height: 100%;
  padding: 0;
  margin: 0;
  overflow: hidden;
}

.gantt_marker {
  background-color: rgba(255, 0, 0, 0.8) !important;
}
.gantt_marker.today {
  background: #ffb121 !important;
}
.gantt_task_link.start_to_start .gantt_line_wrapper div {
  background-color: var(--accent-primary, #dd5640) !important;
}
.gantt_task_link.start_to_start:hover .gantt_line_wrapper div {
  box-shadow: 0 0 5px 0px var(--accent-primary, #dd5640) !important;
}
.gantt_task_link.finish_to_start .gantt_line_wrapper div {
  background-color: var(--accent-radio, #7576ba) !important;
}
.gantt_task_link.finish_to_finish .gantt_line_wrapper div {
  background-color: var(--success, #55d822) !important;
}

.gantt_grid_scale .gantt_grid_head_cell,
.gantt_task .gantt_task_scale .gantt_scale_cell {
  font-weight: bold;
  font-size: 14px;
  color: var(--text-main, rgba(0, 0, 0, 0.7)) !important;
}

.resource_marker div {
  width: 28px;
  height: 28px;
  line-height: 29px;
  display: inline-block;
  border-radius: 15px;
  color: var(--badge-text-light, #fff) !important;
  margin: 3px;
}
.resource_marker.workday_ok div {
  background: var(--success, #51c185) !important;
}
.resource_marker.workday_over div {
  background: var(--deadline, #ff8686) !important;
}

.owner-label {
  width: 20px;
  height: 20px;
  line-height: 20px;
  font-size: 12px;
  display: inline-block;
  border: 1px solid var(--text-weak, #cccccc) !important;
  border-radius: 25px;
  background: var(--surface-ctrl, #e6e6e6) !important;
  color: var(--text-muted, #6f6f6f) !important;
  margin: 0 3px;
  font-weight: bold;
}

.gantt_tooltip {
  font-size: 13px;
  line-height: 16px;
}

.gantt_task_progress {
  text-align: left;
  padding-left: 10px;
  box-sizing: border-box;
  color: white;
  font-weight: bold;
}

.weekend {
  background: color-mix(
    in srgb,
    var(--grid-line) 40% 85%,
    transparent
  ) !important;
}

.gantt_task_row .gantt_task_line.deadline-task {
  border-left: 6px solid var(--deadline, #ef4444) !important;
}
.gantt_task_row .gantt_task_line.deadline-task::after {
  content: "⚑";
  position: absolute;
  top: -10px;
  right: -10px;
  background: var(--deadline, #ef4444) !important;
  color: var(--badge-text-light, white) !important;
  border-radius: 50%;
  width: 22px;
  height: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  font-weight: bold;
  z-index: 100;
  box-shadow: 0 3px 8px
    color-mix(in srgb, var(--deadline) 100%, transparent 40%) !important;
}

.gantt_task_row .gantt_task_line.constraint-task {
  border-right: 5px solid var(--constraint, #f59e0b) !important;
}

.gantt_task_row .gantt_task_line.has-baseline .gantt_task_progress::before {
  content: "Planned";
  position: absolute;
  left: 8px;
  top: 3px;
  font-size: 10px;
  color: var(--success, #10b981) !important;
  font-weight: 600;
  background: color-mix(in srgb, var(--success) 20%) !important;
  padding: 1px 4px;
  border-radius: 3px;
}

.gantt_task_content {
  position: absolute;
  white-space: nowrap;
  overflow: visible !important;
  z-index: 5;
}

.task-label {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.deadline-badge {
  background: var(--deadline, #ef4444) !important;
  color: var(--badge-text-light, white) !important;
  border-radius: 50%;
  width: 16px;
  height: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  font-weight: bold;
} */

/* Gantt-specific styles ONLY - no controls overlap */
html,
body {
  height: 100%;
  padding: 0;
  margin: 0;
  overflow: hidden;
}

/* Markers */
.gantt_marker {
  background-color: rgba(
    255,
    0,
    0,
    0.8
  ) !important; /* Keep semi-transparent red for visibility */
}
.gantt_marker.today {
  background: #ffb121 !important; /* Distinct yellow-orange, non-semantic */
}

/* Link colors - using semantic accents or DHTMLX vars */
.gantt_task_link.start_to_start .gantt_line_wrapper div {
  background-color: var(--accent-primary, #dd5640) !important;
}
.gantt_task_link.start_to_start:hover .gantt_line_wrapper div {
  box-shadow: 0 0 5px 0px var(--accent-primary, #dd5640) !important;
}
.gantt_task_link.finish_to_start .gantt_line_wrapper div {
  background-color: var(--accent-radio, #7576ba) !important;
}
.gantt_task_link.finish_to_finish .gantt_line_wrapper div {
  background-color: var(--success, #55d822) !important;
}

/* Grid/scale */
.gantt_grid_scale .gantt_grid_head_cell,
.gantt_task .gantt_task_scale .gantt_scale_cell {
  font-weight: bold;
  font-size: 14px;
  color: var(--text-main, rgba(0, 0, 0, 0.7)) !important;
}

/* Resources */
.resource_marker div {
  width: 28px;
  height: 28px;
  line-height: 29px;
  display: inline-block;
  border-radius: 15px;
  color: var(--badge-text-light, #fff) !important;
  margin: 3px;
}
.resource_marker.workday_ok div {
  background: var(--success, #51c185) !important;
}
.resource_marker.workday_over div {
  background: var(--deadline, #ff8686) !important;
}

.owner-label {
  width: 20px;
  height: 20px;
  line-height: 20px;
  font-size: 12px;
  display: inline-block;
  border: 1px solid var(--text-weak, #cccccc) !important;
  border-radius: 25px;
  background: var(--surface-ctrl, #e6e6e6) !important;
  color: var(--text-muted, #6f6f6f) !important;
  margin: 0 3px;
  font-weight: bold;
}

.gantt_tooltip {
  font-size: 13px;
  line-height: 16px;
}

.gantt_task_progress {
  text-align: left;
  padding-left: 10px;
  box-sizing: border-box;
  color: white;
  font-weight: bold;
}

.weekend {
  background: var(--weekend-bg, #f0dfe5) !important;
}

/* DEADLINES - fixed visibility */
.gantt_task_row .gantt_task_line.deadline-task {
  border-left: 6px solid var(--deadline, #ef4444) !important;
}
.gantt_task_row .gantt_task_line.deadline-task::after {
  content: "⚑";
  position: absolute;
  top: -10px;
  right: -10px;
  background: var(--deadline, #ef4444) !important;
  color: var(--badge-text-light, white) !important;
  border-radius: 50%;
  width: 22px;
  height: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  font-weight: bold;
  z-index: 100;
  box-shadow: 0 3px 8px
    color-mix(in srgb, var(--deadline) 100%, transparent 40%) !important;
}

/* CONSTRAINTS */
.gantt_task_row .gantt_task_line.constraint-task {
  border-right: 5px solid var(--constraint, #f59e0b) !important;
}

/* BASELINES */
.gantt_task_row .gantt_task_line.has-baseline .gantt_task_progress::before {
  content: "Planned";
  position: absolute;
  left: 8px;
  top: 3px;
  font-size: 10px;
  color: var(--success, #10b981) !important;
  font-weight: 600;
  background: color-mix(in srgb, var(--success) 20%) !important;
  padding: 1px 4px;
  border-radius: 3px;
}

/* FIX: Task content visibility */
.gantt_task_content {
  position: absolute;
  white-space: nowrap;
  overflow: visible !important;
  z-index: 5;
}

.task-label {
  display: inline-flex;
  align-items: center;
  gap: 4px;
}

.deadline-badge {
  background: var(--deadline, #ef4444) !important;
  color: var(--badge-text-light, white) !important;
  border-radius: 50%;
  width: 16px;
  height: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 10px;
  font-weight: bold;
}