/* HR Ecoplatform — Welcome-тур (4 спота)
   Подключается через base.html. Активируется window.HRTour.start(). */

.hrtour-backdrop {
  position: fixed;
  inset: 0;
  background: rgba(15, 23, 42, 0.55);
  z-index: 10100;
  pointer-events: auto;
  transition: opacity .15s;
}

.hrtour-spotlight {
  position: fixed;
  z-index: 10101;
  pointer-events: none;
  border-radius: 12px;
  box-shadow: 0 0 0 9999px rgba(15, 23, 42, 0.55), 0 0 0 3px #0F7A3E, 0 8px 24px rgba(0,0,0,.15);
  transition: top .25s ease, left .25s ease, width .25s ease, height .25s ease;
  background: transparent;
}

.hrtour-tip {
  position: fixed;
  z-index: 10102;
  background: #fff;
  color: #18181B;
  border-radius: 12px;
  padding: 18px 20px 14px;
  width: min(360px, 92vw);
  box-shadow: 0 14px 40px rgba(0,0,0,.18);
  transition: top .25s ease, left .25s ease;
}

.hrtour-tip-title {
  font-size: 14px;
  font-weight: 600;
  letter-spacing: -0.01em;
  margin: 0 0 6px;
  color: #18181B;
}

.hrtour-tip-body {
  font-size: 13px;
  line-height: 1.55;
  color: #52525B;
  margin: 0 0 14px;
}

.hrtour-tip-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
}

.hrtour-tip-step {
  font-size: 11.5px;
  color: #A1A1AA;
  font-variant-numeric: tabular-nums;
}

.hrtour-tip-actions {
  display: flex;
  gap: 6px;
}

.hrtour-btn {
  border: 0;
  border-radius: 6px;
  padding: 7px 14px;
  font-size: 12.5px;
  font-weight: 500;
  cursor: pointer;
  font-family: inherit;
}

.hrtour-btn-skip {
  background: transparent;
  color: #71717A;
}
.hrtour-btn-skip:hover { color: #18181B; }

.hrtour-btn-next {
  background: #0F7A3E;
  color: #fff;
}
.hrtour-btn-next:hover { background: #0c6231; }

.hrtour-tip::before {
  content: '';
  position: absolute;
  width: 0;
  height: 0;
  border: 8px solid transparent;
}
.hrtour-tip.from-bottom::before {
  top: -16px;
  left: 24px;
  border-bottom-color: #fff;
}
.hrtour-tip.from-top::before {
  bottom: -16px;
  left: 24px;
  border-top-color: #fff;
}
.hrtour-tip.from-left::before {
  right: -16px;
  top: 24px;
  border-left-color: #fff;
}
.hrtour-tip.from-right::before {
  left: -16px;
  top: 24px;
  border-right-color: #fff;
}
