.roadmap-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 16px;
}

.roadmap-title h2 {
  font-size: 16px;
  font-weight: 600;
  color: #ffffff;
  margin: 0;
}

/* ИНТЕРФЕЙС УПРАВЛЕНИЯ СЕТКОЙ */
.gantt-controls {
  display: flex;
  align-items: center;
  gap: 12px;
}

.date-inputs-container {
  display: flex;
  align-items: center;
  background-color: none;
  padding: 8px 12px;
  gap: 8px;
  border-radius: 8px;
  border: none;
}

.date-inputs-container label {
  font-size: 11px;
  font-weight: 600;
  color: var(--text-muted);
}

.date-inputs-container {
  /* background-color: var(--polyus-bg-card); */
  border: 1px solid var(--polyus-border);
  color: #fff;
  padding: 4px 6px;
  border-radius: 4px;
  cursor: pointer;
  width: auto;
}

/* Перекрашиваем текст месяцев внутри кнопок выбора дат в золото */
.date-inputs-container input[type="text"],
#project-start-display,
#project-end-display {
  color: var(--polyus-gold, #efa900) !important;
  font-weight: 400;
  background-color: var(--polyus-bg-card);
  border: 1px solid var(--polyus-border);
  padding: 4px 8px;
  border-radius: 4px;
  font-size: 12px;
  cursor: pointer;
  width: 110px;
  text-align: center;
  outline: none;
}

/* Добавим красивый эффект: при наведении мыши рамка поля тоже будет золотеть */
.date-inputs-container input[type="text"]:hover,
#project-start-display:hover,
#project-end-display:hover {
  border-color: var(--polyus-gold) !important;
}

/* ВЫПАДАЮЩЕЕ МЕНЮ МАСШТАБА */
.dropdown-container {
  position: relative;
}

.btn-scale-toggle {
  background-color: var(--polyus-bg-dark);
  border: 1px solid var(--polyus-border);
  color: var(--text-main);
  padding: 8px 14px;
  border-radius: 8px;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  display: flex;
  align-items: center;
  gap: 6px;
  transition: border-color 0.2s, color 0.2s;
}

.btn-scale-toggle:hover {
  border-color: var(--polyus-gold);
  color: var(--polyus-gold);
}

.scale-dropdown {
  position: absolute;
  right: 0;
  top: calc(100% + 6px);
  background-color: var(--polyus-bg-dark);
  border: 1px solid var(--polyus-border);
  border-radius: 8px;
  width: 160px;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.5);
  z-index: var(--gantt-z-dropdown);
  /* Изменено с 99 на переменную */
  display: none;
}

.scale-dropdown.show {
  display: block;
}

.dropdown-item {
  padding: 10px 14px;
  font-size: 12px;
  color: var(--text-main);
  cursor: pointer;
  transition: background-color 0.2s, color 0.2s;
}

.dropdown-item:hover {
  background-color: var(--polyus-bg-card);
  color: var(--polyus-gold);
}

.dropdown-item.active {
  font-weight: 700;
  color: var(--polyus-gold);
}