/* =================================================================
   Air theme — экран ТРЕКИНГА (per-screen стили).
   База — перенос ДОСЛОВНО из variant-01-air-service/css/screens/tracking.css.
   В конце ДОПИСАНО (не из базового файла):
   1) адаптив трекинга — извлечён из шаблонного 90-responsive.css (все @media,
      split смешанных групп .receive/.tracking);
   2) .air-tracking-page{background:var(--bg)} — роль .screen[data-screen=tracking]
      из 02-screen-base (Э0 не переносил): фон страницы = серый body, белые карточки поверх;
   3) AIR-NAV: .tracking-download{text-decoration:none} — в шаблоне это <button>, у нас PDF
      стал <a> (иначе браузерное подчёркивание).
   ================================================================= */

.screen[data-screen="tracking"] {
  padding: 0;
}

.tracking-shell {
  animation: scFade 0.4s ease;
  max-width: 1224px;
  margin: 0 auto;
  padding: 56px 22px 80px;
  color: var(--text);
}

.tracking-card {
  max-width: 760px;
  margin-right: auto;
  margin-left: auto;
  background: #fff;
  border: 1px solid var(--border-soft);
  border-radius: 24px;
  box-shadow: 0 10px 30px rgba(28, 58, 110, 0.06);
}

.tracking-search-card {
  padding: 40px;
}

.tracking-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 60px;
  height: 60px;
  margin-bottom: 20px;
  color: var(--blue);
  background: #eaf1fe;
  border-radius: 16px;
}

.tracking-search-card h1 {
  margin: 0 0 8px;
  color: var(--text);
  font-size: 30px;
  font-weight: 800;
  line-height: 1.15;
  letter-spacing: 0;
}

.tracking-search-card .tracking-lead {
  margin: 0 0 24px;
  color: var(--muted-alt);
  font-size: 16px;
  line-height: 1.45;
}

.tracking-search-form {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
}

.tracking-search-form input {
  flex: 1 1 0;
  min-width: 220px;
  height: 56px;
  padding: 16px;
  color: var(--text);
  font-size: 16px;
  font-weight: 400;
  letter-spacing: 0;
  background: #fff;
  border: 1.5px solid var(--border);
  border-radius: 14px;
}

.tracking-search-form input.is-invalid {
  border-color: var(--red);
  box-shadow: 0 0 0 4px rgba(224, 36, 59, 0.12);
}

.tracking-check {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex: 0 0 auto;
  min-height: 56px;
  gap: 9px;
  padding: 16px 28px;
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  background: var(--blue);
  border: 0;
  border-radius: 14px;
  box-shadow: 0 10px 24px rgba(44, 107, 237, 0.28);
}

.tracking-check:hover {
  background: var(--blue-hover);
}

.tracking-result-card {
  display: none;
  margin-top: 22px;
  padding: 34px;
  animation: scRise 0.35s ease;
}

.tracking-result-card.is-visible {
  display: block;
}

.tracking-result-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding-bottom: 20px;
  margin-bottom: 24px;
  border-bottom: 1px solid #edf1f7;
}

.tracking-result-head p {
  margin: 0 0 4px;
  color: var(--subtle);
  font-size: 13px;
  font-weight: 600;
}

.tracking-result-head h2 {
  margin: 0;
  color: var(--text);
  font-size: 22px;
  font-weight: 800;
  line-height: 1.16;
  letter-spacing: 0;
}

.tracking-status-pill {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 9px 16px;
  color: #157f54;
  font-size: 14px;
  font-weight: 700;
  background: #e2f5ec;
  border-radius: 10px;
}

.tracking-status-pill i {
  width: 8px;
  height: 8px;
  background: var(--green);
  border-radius: 50%;
}

.tracking-timeline {
  position: relative;
  display: grid;
  gap: 22px;
}

.tracking-timeline-line {
  position: absolute;
  top: 8px;
  bottom: 8px;
  left: 15px;
  width: 2px;
  background: #d6e8dc;
}

.tracking-step {
  position: relative;
  z-index: 1;
  display: flex;
  gap: 16px;
  align-items: flex-start;
}

.tracking-step-marker {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  width: 32px;
  height: 32px;
  color: #fff;
  background: var(--green);
  border-radius: 50%;
}

.tracking-step b {
  display: block;
  margin: 0 0 2px;
  color: var(--text);
  font-size: 16px;
  font-weight: 700;
  line-height: 1.25;
}

.tracking-step p {
  margin: 0;
  color: var(--subtle);
  font-size: 14px;
  font-weight: 600;
  line-height: 1.35;
}

.tracking-download {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-top: 26px;
  padding: 13px 20px;
  color: var(--blue);
  font-size: 15px;
  font-weight: 700;
  background: #eaf1fe;
  border: 0;
  border-radius: 12px;
}

.tracking-download:hover {
  background: #dfeaff;
}

/* =================================================================
   ДОПИСАНО к базе (НЕ из шаблонного screens/tracking.css)
   ================================================================= */

/* Фон страницы: роль .screen[data-screen="tracking"]{padding:0} + фон от body (--bg).
   Белые .tracking-card поверх серого --bg. */
.air-tracking-page {
  background: var(--bg);
}

/* AIR-NAV: PDF-«кнопка» шаблона (<button>) у нас стала ссылкой <a> — гасим подчёркивание. */
.tracking-download {
  text-decoration: none;
}

/* Кнопка «Проверить» НЕАКТИВНА, пока поле номера пустое (требование владельца, Э2 — в шаблоне этого нет).
   Серверно ставим disabled при пустом номере, JS (screens/tracking.js) синхронизирует при вводе. */
.tracking-check:disabled {
  opacity: 0.5;
  box-shadow: none;
  cursor: not-allowed;
}

.tracking-check:disabled:hover {
  background: var(--blue); /* гасим hover-смену цвета у неактивной */
}

/* Адаптив трекинга — извлечён из шаблонного 90-responsive.css (порядок как в источнике).
   Группы со смешанными экранами разбиты — оставлены только tracking-селекторы. */

/* источник: @media(min-width:721px) and (max-width:1180px) — из группы
   .receive-shell, .receive-result-shell, .tracking-shell{…} берём только .tracking-shell */
@media (min-width: 721px) and (max-width: 1180px) {
  .tracking-shell {
    width: min(100%, 964px);
    max-width: 964px;
    margin-right: auto;
    margin-left: auto;
  }
}

/* источник: @media(max-width:720px) — все tracking-правила, включая ОБА .tracking-search-card+.tracking-result-card */
@media (max-width: 720px) {
  .tracking-shell {
    padding: 28px 14px 70px;
  }

  .tracking-search-card,
  .tracking-result-card {
    padding: 26px 20px;
    border-radius: 22px;
  }

  .tracking-search-card h1 {
    font-size: 28px;
  }

  .tracking-search-form {
    display: grid;
  }

  .tracking-search-form input,
  .tracking-check {
    width: 100%;
  }

  .tracking-result-head {
    align-items: flex-start;
  }
}