/* Button Styles */

.btn {
    display: inline-flex; align-items: center; gap: var(--space-6);
    padding: 5px var(--space-12); font-size: var(--font-size-md);
    font-weight: var(--font-weight-medium); border: none;
    border-radius: var(--radius-sm); cursor: pointer;
    transition: var(--transition-normal); font-family: inherit;
}

.btn-primary { background: var(--color-accent-primary); color: white; }
.btn-primary:hover { background: var(--color-accent-primary-hover); }

.btn-secondary { background: var(--color-bg-hover); color: var(--color-text-secondary); }
.btn-secondary:hover { background: var(--color-border); }

.btn-compile {
    background: linear-gradient(135deg, var(--color-accent-primary), var(--color-accent-secondary));
    color: white;
}
.btn-compile:hover { transform: translateY(-1px); box-shadow: 0 4px 12px var(--color-accent-primary-glow); }
.btn-compile:active { transform: translateY(0); }

.btn-icon { padding: 5px var(--space-10); background: var(--color-bg-hover); color: var(--color-text-secondary); }
.btn-icon:hover { background: var(--color-border); color: var(--color-text-primary); }
.btn-icon:disabled { opacity: 0.5; cursor: not-allowed; }

.btn-sm {
    padding: var(--space-4) var(--space-8); font-size: var(--font-size-base);
    background: transparent; color: var(--color-text-secondary);
}
.btn-sm:hover { background: var(--color-bg-hover); color: var(--color-text-primary); }

.btn-danger { color: var(--color-accent-danger); }
.btn-danger:hover { background: var(--color-accent-danger-bg); }

.btn-ai {
    background: linear-gradient(135deg, var(--color-accent-secondary) 0%, var(--color-accent-primary) 100%);
    color: white; border: none;
}
.btn-ai:hover {
    background: linear-gradient(135deg, var(--color-accent-secondary-hover) 0%, var(--color-accent-primary-hover) 100%);
}
.btn-ai i { margin-right: var(--space-6); }

.btn-login { background: white; color: var(--color-login-text); border: 1px solid var(--color-login-border); }
.btn-login:hover { background: var(--color-login-bg-hover); }
.btn-login i { color: var(--color-google-blue); }

.btn-google { background: var(--color-google-blue); border: none; }
.btn-google:hover { background: var(--color-google-blue-hover); }

.btn-back {
    padding: var(--space-6) var(--space-10); background: var(--color-bg-tertiary);
    border: 1px solid var(--color-border); color: var(--color-text-secondary);
}
.btn-back:hover { background: var(--color-bg-hover); color: var(--color-text-primary); }

.btn-fix-ai {
    background: var(--color-accent-primary); color: white; border: none;
    padding: var(--space-6) var(--space-12); font-size: var(--font-size-base);
    font-weight: var(--font-weight-medium); cursor: pointer; transition: var(--transition-normal);
}
.btn-fix-ai:hover { background: var(--color-accent-secondary); transform: translateY(-1px); }