/* ==========================================================================
   post-job-wizard-step7.html — Шаг 8 из 9: способ связи (Figma 6:1813)
   ========================================================================== */

.wizard-body {
  background: #fff;
  padding-bottom: 6.5rem; /* room for sticky footer */
}

/* ---------- Header extras ---------- */

.header-help {
  display: flex;
  align-items: center;
  gap: .55rem;
  color: var(--ri-ink);
}

.header-help img { width: 22px; height: auto; opacity: .85; }

.header-help span { display: flex; flex-direction: column; line-height: 1.2; }
.header-help strong { font-size: .85rem; font-weight: 500; color: var(--ri-ink); }
.header-help small { font-size: .72rem; color: var(--ri-text-mute-2); font-weight: 300; }

.site-header .btn-login {
  font-size: .82rem;
  gap: .5rem;
}

/* ---------- Step tracker ---------- */

.wizard-step-label {
  color: var(--ri-gold-light);
  font-size: .82rem;
  font-weight: 500;
  margin-bottom: .4rem;
}

.wizard-steps {
  margin: 0;
  padding: 0;
  border-left: 2px solid var(--ri-line);
}

.wizard-steps__item {
  display: flex;
  align-items: flex-start;
  gap: .7rem;
  padding: .55rem 0 .55rem 1rem;
  margin-left: -2px;
  border-left: 2px solid transparent;
}

.wizard-steps__item div { display: flex; flex-direction: column; line-height: 1.3; }
.wizard-steps__item strong { font-size: .8rem; font-weight: 400; color: #8a8d97; }
.wizard-steps__item span { font-size: .72rem; color: #aeb1b9; font-weight: 300; }

.wizard-steps__icon,
.wizard-steps__num {
  flex-shrink: 0;
  width: 26px;
  height: 26px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-top: 1px;
}

.wizard-steps__icon img { width: 16px; height: auto; }

.wizard-steps__num {
  background: #eef0f2;
  color: #9a9da5;
  font-size: .78rem;
  font-weight: 600;
}

.wizard-steps__item.is-active {
  border-left-color: var(--ri-gold);
}

.wizard-steps__item.is-active strong { color: var(--ri-ink); font-weight: 600; }
.wizard-steps__item.is-active span { color: var(--ri-text-muted); }
.wizard-steps__item.is-active .wizard-steps__num {
  background: var(--ri-gold);
  color: #fff;
}

.wizard-steps__item.is-upcoming strong { color: #b7b9c0; }

/* ---------- Form column ---------- */

.wizard-title {
  font-size: 1.65rem;
  font-weight: 500;
  color: #232529;
  margin: 0 0 .5rem;
}

.wizard-lead {
  color: var(--ri-text-mute-2);
  font-size: .95rem;
  margin: 0 0 1.5rem;
}

.wizard-lead--small { font-size: .85rem; margin-bottom: 1rem; }

.wizard-subtitle {
  font-size: 1.05rem;
  font-weight: 500;
  color: #363840;
  margin: 2rem 0 1rem;
}

.wizard-card {
  background: #fdfdfd;
  border: 1px solid #ecedf1;
  border-radius: var(--ri-radius-sm);
  padding: 1.1rem 1.2rem;
  margin-bottom: 1rem;
}

.wizard-card--accent {
  background: #fdfefe;
  border-color: #a4ceae;
}

.wizard-card__row {
  display: flex;
  align-items: center;
  gap: .9rem;
}

.wizard-card__flagicon,
.wizard-card__check {
  width: 26px;
  height: 26px;
  flex-shrink: 0;
  border-radius: 50%;
  object-fit: cover;
}

.wizard-card__check { border-radius: 0; }

.wizard-card__body { display: flex; flex-direction: column; gap: .1rem; margin-right: auto; }
.wizard-card__body strong { font-size: .92rem; font-weight: 500; color: #3d3f45; }
.wizard-card__body small { font-size: .78rem; color: #8c8f99; font-weight: 300; }

.wizard-card__toggle { width: 40px; height: auto; flex-shrink: 0; }

.wizard-input {
  margin-top: .8rem;
  display: flex;
  align-items: center;
  gap: .6rem;
  background: #fdfdfd;
  border: 1px solid #e5e7eb;
  border-radius: 6px;
  padding: .6rem .9rem;
  font-size: .9rem;
  color: #4d4f55;
}

.wizard-input img { width: 22px; height: auto; border-radius: 3px; }

.wizard-info-note {
  display: flex;
  gap: .8rem;
  align-items: flex-start;
  background: #f3f7fd;
  border: 1px solid #eef4fc;
  border-radius: var(--ri-radius-sm);
  padding: 1rem 1.1rem;
  margin: 1.4rem 0;
}

.wizard-info-note img { width: 20px; height: auto; flex-shrink: 0; margin-top: 1px; }
.wizard-info-note strong { display: block; font-size: .85rem; color: #4a5568; margin-bottom: .2rem; }
.wizard-info-note span { font-size: .78rem; color: #838a99; font-weight: 300; }

.preview-buttons {
  display: flex;
  flex-wrap: wrap;
  gap: .7rem;
  margin-bottom: 1.5rem;
}

.preview-btn {
  display: inline-flex;
  align-items: center;
  gap: .45rem;
  border-radius: 6px;
  padding: .65rem 1rem;
  font-size: .78rem;
  font-weight: 500;
  border: 1px solid transparent;
  white-space: nowrap;
}

.preview-btn img { width: 15px; height: auto; }

.preview-btn--telegram { background: #f3f8fd; border-color: #e9f0fa; color: #5f8ed3; }
.preview-btn--phone { background: #fef9ef; border-color: #fbecd6; color: #ee9a4e; }
.preview-btn--apply { background: #f4faf5; border-color: #e7f2eb; color: #65a470; }

.wizard-tip {
  display: flex;
  gap: 1rem;
  align-items: center;
  background: #fdf9f0;
  border: 1px solid #fcf4e9;
  border-radius: var(--ri-radius-sm);
  padding: 1.1rem 1.3rem;
}

.wizard-tip img { width: 44px; height: auto; flex-shrink: 0; }
.wizard-tip strong { display: block; font-size: .8rem; color: #4c4c4b; margin-bottom: .2rem; }
.wizard-tip p { margin: 0; font-size: .74rem; color: #94959b; font-weight: 300; }

/* ---------- Job preview panel ---------- */

.preview-panel-label {
  font-size: .88rem;
  color: #575b65;
  margin-bottom: .8rem;
}

.job-preview-card {
  background: #fefefe;
  border: 7px solid #f9f9fa;
  border-radius: var(--ri-radius-md);
  padding: 1.4rem;
}

.job-preview-card hr {
  border-top: 1px solid #f1f2f4;
  margin: 1rem 0;
}

.job-preview-card__head {
  display: flex;
  align-items: center;
  gap: .8rem;
  margin-bottom: .9rem;
}

.job-preview-card__avatar { width: 46px; height: 46px; border-radius: 50%; object-fit: cover; }
.job-preview-card__head strong { display: block; font-size: .95rem; font-weight: 700; color: #454647; }
.job-preview-card__head span { font-size: .78rem; color: #828692; }

.job-preview-card__title { font-size: 1.35rem; font-weight: 600; color: #2a2b2c; margin: 0 0 .5rem; }

.job-preview-card__badge {
  display: inline-block;
  background: #e8f5ec;
  color: #5a9264;
  font-size: .74rem;
  font-weight: 500;
  border-radius: 6px;
  padding: .35rem .8rem;
}

.job-preview-card__facts { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: .7rem; }
.job-preview-card__facts li,
.job-preview-card__group li {
  display: flex;
  align-items: flex-start;
  gap: .6rem;
  font-size: .8rem;
  color: #5c5e63;
}

.job-preview-card__facts li img,
.job-preview-card__group li img { width: 16px; height: auto; margin-top: 2px; flex-shrink: 0; }

.job-preview-card__facts li small { display: block; font-size: .72rem; color: #9a9ea8; font-weight: 300; }

.job-preview-card__group h4 { font-size: .82rem; font-weight: 600; color: #5c5e67; margin: 0 0 .6rem; }
.job-preview-card__group ul { list-style: none; padding: 0; margin: 0; display: flex; flex-direction: column; gap: .55rem; }
.job-preview-card__group p { font-size: .78rem; color: #767a86; font-weight: 300; line-height: 1.5; margin: 0; }

.job-preview-card__duties { list-style: disc; padding-left: 1.1rem !important; }
.job-preview-card__duties li { display: list-item !important; font-size: .8rem; color: #52545a; padding: .1rem 0; }

.preview-buttons--card { margin-top: 1.2rem; margin-bottom: 0; }

.safety-note {
  display: flex;
  gap: .8rem;
  align-items: center;
  padding: 1rem .3rem 0;
}

.safety-note img { width: 18px; height: auto; }
.safety-note strong { display: block; font-size: .8rem; color: #5c6061; }
.safety-note span { font-size: .72rem; color: #a3a6ad; font-weight: 300; }

/* ---------- Sticky footer ---------- */

.wizard-footer {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  background: #fff;
  border-top: 1px solid #e8eaed;
  padding: 1rem 0;
  z-index: 20;
}

.wizard-footer__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 1rem;
}

.wizard-footer__privacy {
  display: flex;
  align-items: center;
  gap: .6rem;
  font-size: .8rem;
  color: #8d919c;
  margin: 0;
}

.wizard-footer__privacy img { width: 16px; height: auto; }

.wizard-footer__actions { display: flex; gap: .8rem; }

.btn-wizard-back,
.btn-wizard-next {
  display: inline-flex;
  align-items: center;
  gap: .7rem;
  border-radius: 7px;
  padding: .6rem 1.3rem;
  font-size: .8rem;
  cursor: pointer;
}

.btn-wizard-back {
  background: #fdfdfd;
  border: 2px solid #dfe2e6;
  color: #575a61;
}

.btn-wizard-back img { width: 16px; height: auto; }
.btn-wizard-back strong { display: block; font-weight: 500; font-size: .85rem; color: #575a61; }
.btn-wizard-back small { font-size: .68rem; color: #848995; font-weight: 300; }

.btn-wizard-next {
  background: #e2730a;
  border: 1px solid #efbd85;
  color: #fff;
}

.btn-wizard-next img { width: 16px; height: auto; }
.btn-wizard-next strong { display: block; font-weight: 500; font-size: .85rem; color: #fff; }
.btn-wizard-next small { font-size: .68rem; color: #f7d6b1; font-weight: 300; }

@media (max-width: 991.98px) {
  .wizard-footer__inner { justify-content: center; text-align: center; }
  .wizard-body { padding-bottom: 9rem; }
}
