.btn {
display: inline-flex;
align-items: center;
gap: 0.45rem;
padding: 0.5rem 1rem;
border-radius: var(--radius);
font-size: 0.85rem;
font-weight: 500;
border: 1px solid transparent;
transition: all var(--transition);
white-space: nowrap;
line-height: 1.4;
cursor: pointer;
font: inherit;
}
.btn-primary {
background: var(--accent);
color: #fff;
border-color: var(--accent);
}
.btn-primary:hover {
background: var(--accent-hover);
border-color: var(--accent-hover);
}
.btn-secondary {
background: var(--bg-input);
color: var(--text-main);
border-color: var(--border-light);
}
.btn-secondary:hover {
background: var(--bg-hover);
}
.btn-danger {
background: var(--danger-light);
color: var(--danger);
border-color: rgba(239, 68, 68, 0.25);
}
.btn-danger:hover {
background: var(--danger);
color: #fff;
border-color: var(--danger);
}
.btn-ghost {
background: transparent;
color: var(--text-muted);
border-color: transparent;
padding: 0.4rem 0.6rem;
}
.btn-ghost:hover {
background: var(--bg-hover);
color: var(--text-main);
}
.btn-sm { padding: 0.3rem 0.65rem; font-size: 0.78rem; }
.btn-icon {
width: 32px;
height: 32px;
padding: 0;
justify-content: center;
}
.logout-form {
margin: 0;
}
.logout-button {
border: none;
outline: none;
font: inherit;
cursor: pointer;
}
button.topbar-user {
border: none;
outline: none;
font: inherit;
cursor: pointer;
}
a.topbar-user {
text-decoration: none;
}