/* Tour highlight sau đăng ký (port từ codm-creators first-login-tour.scss). Trên navbar + popup (z 1000) vì tour chỉ chạy khi không có popup mở và shield chặn click. */
.first-login-tour { position: fixed; inset: 0; z-index: 1200; font-family: "svn-agency-fb-bold", sans-serif; }
.first-login-tour button { font-family: inherit; }
.first-login-tour__shield { position: absolute; inset: 0; }
/* Nền tối = box-shadow khổng lồ của spotlight → vùng target vẫn sáng rõ qua "lỗ". */
.first-login-tour__spotlight {
  position: fixed; border-radius: 12px; border: 2px solid #ffd049; pointer-events: none;
  box-shadow: 0 0 0 9999px rgba(0, 0, 0, 0.7), 0 0 24px 4px rgba(255, 208, 73, 0.6);
  transition: top .25s ease, left .25s ease, width .25s ease, height .25s ease;
  animation: first-login-tour-pulse 1.6s ease-in-out infinite;
}
.first-login-tour__card {
  position: fixed; box-sizing: border-box; padding: 20px 22px 16px; background: #fff; color: #1a1a1a;
  border-radius: 16px; box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45);
}
.first-login-tour__card--in { animation: first-login-tour-in .2s ease-out; }
.first-login-tour__head { display: flex; align-items: center; justify-content: space-between; }
.first-login-tour__dots { display: flex; gap: 6px; }
.first-login-tour__dot { width: 8px; height: 8px; border-radius: 50%; background: #e3e3e3; }
.first-login-tour__dot--active { background: #f4c542; }
.first-login-tour__close { border: 0; background: none; font-size: 24px; line-height: 1; color: #555; cursor: pointer; padding: 0 2px; }
.first-login-tour__count { margin-top: 12px; font-size: 13px; color: #888; }
.first-login-tour__title { margin: 6px 0 8px; font-size: 22px; font-weight: 700; letter-spacing: .02em; color: #342f86; }
.first-login-tour__body { margin: 0; font-size: 15px; line-height: 1.55; color: #444; font-family: Arial, Helvetica, sans-serif; }
.first-login-tour__footer { display: flex; justify-content: space-between; align-items: center; margin-top: 16px; padding-top: 12px; border-top: 1px solid #eee; }
.first-login-tour__ghost { border: 0; background: none; color: #888; font-size: 15px; cursor: pointer; padding: 6px 4px; }
.first-login-tour__primary { border: 0; border-radius: 999px; padding: 8px 24px; background: #ffd049; color: #1a1a1a; font-size: 16px; font-weight: 700; cursor: pointer; }
.first-login-tour__primary:hover { background: #f4c542; }
@keyframes first-login-tour-pulse {
  0%, 100% { box-shadow: 0 0 0 9999px rgba(0, 0, 0, 0.7), 0 0 16px 2px rgba(255, 208, 73, 0.45); }
  50% { box-shadow: 0 0 0 9999px rgba(0, 0, 0, 0.7), 0 0 32px 8px rgba(255, 208, 73, 0.8); }
}
@keyframes first-login-tour-in { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: none; } }