/* gt-header.css — стили единой шапки (см. gt-header.js).
   Все селекторы с префиксом gt- : страницы имеют собственные .nav/.appbar/header,
   пересечение классов сломало бы их вёрстку. */

.gt-header {
  display: flex;
  flex-direction: column;
  gap: 12px;
  /* Глубокий градиент + тёплый золотой отсвет — как в кабинете */
  background:
    radial-gradient(ellipse 900px 320px at 8% -40%, rgba(184, 138, 62, 0.22), transparent 60%),
    radial-gradient(ellipse 700px 260px at 95% 130%, rgba(74, 138, 114, 0.25), transparent 65%),
    linear-gradient(135deg, #226050 0%, #1f5141 45%, #143528 100%);
  border-bottom: 1px solid rgba(184, 138, 62, 0.45);
  box-shadow: 0 10px 30px -18px rgba(18, 47, 36, 0.55);
  padding: 12px max(20px, calc(50vw - 550px)) 10px;
  font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
  position: relative;
}
/* Единственная живая деталь: по золотой hairline снизу изредка пробегает блик */
.gt-header::after {
  content: ''; position: absolute; left: 0; right: 0; bottom: -1px;
  height: 1px; z-index: 2; pointer-events: none;
  background: linear-gradient(90deg,
    transparent 0%, transparent 42%,
    rgba(240, 205, 130, 0.9) 50%,
    transparent 58%, transparent 100%);
  background-repeat: no-repeat;
  background-size: 300% 100%;
  animation: gtHairlineGlint 11s ease-in-out infinite;
}
@keyframes gtHairlineGlint {
  0%, 72%, 100% { background-position: 170% 0; }
  86%           { background-position: -70% 0; }
}
@media (prefers-reduced-motion: reduce) {
  .gt-header::after { animation: none; opacity: 0; }
}
.gt-header-top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
}
.gt-logo {
  display: inline-flex;
  align-items: center;
  gap: 10px;
  font-weight: 600;
  font-size: 17px;
  letter-spacing: -0.01em;
  text-decoration: none;
  padding: 6px 12px;
  margin: -6px -12px;
  border-radius: 10px;
  transition: background 0.15s;
}
.gt-logo:hover { background: rgba(255, 255, 255, 0.12); }
.gt-logo-mark { width: 30px; height: 30px; flex-shrink: 0; display: inline-block; color: #fff; }
.gt-logo-mark svg { width: 100%; height: 100%; display: block; }
.gt-gen, .gt-tw { color: #fff; }
.gt-dot { color: rgba(255, 255, 255, 0.55); margin: 0 2px; font-weight: 400; }

.gt-login, .gt-company {
  display: inline-flex;
  align-items: center;
  padding: 8px 16px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  transition: 0.15s;
}
.gt-login { background: #fff; color: #1f5141; }
.gt-login:hover { background: #eaf3ee; }
.gt-company { background: #ccfbf1; color: #0f766e; }
.gt-company:hover { background: #b6f3e6; }

.gt-product-nav {
  display: flex;
  align-items: center;
  gap: 6px;
  /* ПРОКРУТКИ ЗДЕСЬ БЫТЬ НЕ ДОЛЖНО. Любой overflow, отличный от visible, делает
     неvisible и вторую ось — и выпадающий список «Полезные сервисы» срезался по
     нижней границе панели (в DOM открыт, на экране не виден). На узких экранах
     пункты переносим на вторую строку вместо горизонтальной прокрутки. */
  flex-wrap: wrap;
  row-gap: 8px;
}
/* «Мои тендеры» больше НЕ прижимается к правому краю (было margin-left:auto).
   Между ней и остальными пилюлями зияла пустота почти в половину ряда — это и
   читалось как кривая вёрстка, хотя сами коробки выровнены идеально (замер на
   проде: height 36.15 и top 60.15 у всех пяти). Просто чуть больший отступ. */
.gt-pn-right { margin-left: 16px; }

.gt-pn-item {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 7px 14px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 600;
  /* ОБЯЗАТЕЛЬНО ОБА. Класс висит и на <a>, и на <button>, а кнопка НЕ наследует
     ни font-family (падала на системный Arial), ни line-height (по умолчанию
     normal). Из-за этого «Полезные сервисы» была на 3px ниже соседних пилюль
     и другим шрифтом — ряд выглядел кривым. */
  font-family: inherit;
  line-height: 1.55;
  color: rgba(255, 255, 255, 0.85);
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.16);
  text-decoration: none;
  white-space: nowrap;
  flex-shrink: 0;
  transition: 0.15s;
}
.gt-pn-item svg { width: 15px; height: 15px; flex-shrink: 0; opacity: 0.92; }
.gt-pn-item:hover { background: rgba(255, 255, 255, 0.18); color: #fff; transform: translateY(-1px); }
.gt-pn-item.active {
  background: #fff; color: #1f5141; border-color: #fff;
  box-shadow: 0 6px 18px -8px rgba(11, 33, 25, 0.55);
}
.gt-pn-item.active svg { opacity: 1; }
.gt-pn-soon { cursor: default; opacity: 0.75; }
.gt-pn-soon:hover { background: rgba(255, 255, 255, 0.08); color: rgba(255, 255, 255, 0.85); }
.gt-pn-badge {
  font-size: 9px;
  font-weight: 700;
  letter-spacing: 0.05em;
  text-transform: uppercase;
  background: #b88a3e;
  color: #fff;
  border-radius: 6px;
  padding: 2px 6px;
  line-height: 1.3;
}

@media (max-width: 700px) {
  .gt-pn-item { padding: 6px 10px; font-size: 12px; }
  .gt-logo { font-size: 15px; }
}

/* Подстрока под шапкой — для страничной служебной инфы (счётчик базы на /search) */
.gt-subbar {
  max-width: 1140px;
  margin: 0 auto;
  padding: 10px 20px 0;
  font-size: 12px;
  color: #6b6357;
}

/* ── Выпадающий список «Полезные сервисы» ────────────────────────────────
   Мелкие утилиты живут здесь, чтобы шапка не распухала с каждой новой. */
.gt-tools-wrap { position: relative; display: inline-flex; flex-shrink: 0; }
.gt-tools-btn { cursor: pointer; }
.gt-caret { font-size: 10px; opacity: 0.7; }
.gt-tools-menu {
  display: none;
  position: absolute;
  top: calc(100% + 8px);
  left: 0;
  z-index: 60;
  min-width: 290px;
  background: #fff;
  border: 1px solid #e7e3da;
  border-radius: 14px;
  box-shadow: 0 20px 44px -18px rgba(18, 47, 36, 0.4);
  padding: 6px;
}
.gt-tools-wrap.open .gt-tools-menu { display: block; }
.gt-tool {
  display: flex;
  align-items: flex-start;
  gap: 11px;
  padding: 10px 12px;
  border-radius: 10px;
  text-decoration: none;
  color: #1a1a1a;
  transition: background 0.12s;
}
.gt-tool:hover { background: #f3f0e8; }
.gt-tool.active { background: #dde9e2; }
.gt-tool-soon { opacity: 0.6; cursor: default; }
.gt-tool-soon:hover { background: transparent; }
/* Иконка сервиса — зелёный SVG в мягкой зелёной плашке (единый стиль с кабинетом) */
.gt-tool-ico {
  display: inline-flex; align-items: center; justify-content: center;
  width: 32px; height: 32px; border-radius: 9px;
  background: #dde9e2; flex-shrink: 0; margin-top: 1px;
}
.gt-tool-ico svg { display: block; width: 18px; height: 18px; color: #1f5141; }
.gt-tool b { display: block; font-size: 14px; font-weight: 600; }
.gt-tool-desc { display: block; font-size: 12.5px; color: #6b6357; margin-top: 1px; }

@media (max-width: 700px) {
  /* Кнопка на узком экране стоит СЛЕВА, поэтому привязка меню к её правому
     краю (right: 0) уводила список за левую границу экрана и срезала текст.
     Держимся левого края кнопки и не даём вылезти за пределы экрана. */
  .gt-tools-menu {
    left: 0;
    right: auto;
    min-width: 0;
    width: max-content;
    max-width: calc(100vw - 32px);
  }
}
