/* Tour / onboarding — không định nghĩa :root ở đây (tránh ghi đè theme từ style.css). */

@keyframes tourPulse {
    0%, 100% {
        box-shadow: 0 0 0 9999px rgba(0, 0, 0, 0.7), 0 0 0 3px #479ffd;
    }
    50% {
        box-shadow: 0 0 0 9999px rgba(0, 0, 0, 0.7), 0 0 20px #479ffd;
    }
}
 
@keyframes tourFadeIn {
    from { opacity: 0; transform: translateY(-10px); }
    to { opacity: 1; transform: translateY(0); }
}
 
.tour-tip {
    background: var(--bg-card);
    font-family: Arial, sans-serif;
    min-height: 150px;
}
 
.tour-tip h3 {
    margin: 0 0 10px 0;
    color: var(--text-main);
    font-size: 16px;
}
 
.tour-content {
    margin: 10px 0 15px 0;
    color: var(--text-muted);
    font-size: 14px;
    line-height: 1.5;
    white-space: pre-line;
}
 
.tour-buttons {
    display: flex;
    gap: 10px;
    margin-bottom: 10px;
}
 
.tour-buttons button {
    padding: 8px 15px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    font-size: 14px;
    transition: all 0.2s;
}
 
.tour-skip {
    background: #f0f0f0;
    color: #666;
}
 
.tour-skip:hover {
    background: #e0e0e0;
}
 
.tour-next {
    background: #479ffd;
    color: white;
    flex: 1;
}
 
.tour-next:hover {
    background: #2586fd;
    transform: translateX(3px);
}
 
.tour-progress {
    font-size: 12px;
    color: #999;
    text-align: right;
}
 
body.tour-open {
    overflow: hidden;
}

@keyframes shake {
  0% { transform: translateX(0); }
  25% { transform: translateX(-5px); }
  50% { transform: translateX(5px); }
  75% { transform: translateX(-5px); }
  100% { transform: translateX(0); }
}