/* DramaScope — header fit patch
   Цель: убрать перекрытие верхнего меню и поиска, сохранить адаптив. */

#root > div > nav > div {
  max-width: none !important;
  width: 100% !important;
  gap: 8px !important;
  padding: 0 24px !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
}

/* Логотип: компактнее, не сжимается */
#root > div > nav > div > button:first-child {
  flex-shrink: 0 !important;
}
/* height задан inline в JSX — не переопределяем здесь */

/* Меню: реально ужимается, ничего не клиппится визуально */
#root > div > nav > div > div:nth-child(2) {
  flex: 1 1 0% !important;
  min-width: 0 !important;
  overflow: visible !important;
  gap: 2px !important;
}
#root > div > nav > div > div:nth-child(2) > button {
  padding: 5px 8px !important;
  font-size: 13px !important;
  letter-spacing: .1px !important;
}

/* Правая группа: фиксированная ширина, всегда сверху */
#root > div > nav > div > div:last-child {
  flex-shrink: 0 !important;
  gap: 6px !important;
  position: relative;
  z-index: 2;
}

/* Поиск: уже и непрозрачнее, ничего за ним не просвечивает */
.ds-topsearch {
  margin-right: 0 !important;
  padding: 6px 6px 6px 16px !important;
  background: rgba(255, 255, 255, 0.08) !important;
  border: none !important;
  box-shadow: none !important;
  border-radius: 24px !important;
}
.ds-topsearch input {
  width: 150px !important;
  font-size: 13px !important;
}

/* Кнопки правой группы (язык, иконки) — компактнее */
#root > div > nav > div > div:last-child > div > button {
  padding: 5px 8px !important;
  font-size: 11px !important;
}

/* Адаптив */
@media (max-width: 1280px) {
  .ds-topsearch input { width: 120px !important; }
  #root > div > nav > div > div:nth-child(2) > button {
    padding: 5px 6px !important;
    font-size: 12px !important;
  }
}
/* Центральное меню скрываем только при реальной нехватке места */
@media (max-width: 1100px) {
  #root > div > nav > div > div:nth-child(2) { display: none !important; }
}