/* ================================================================
   buttons.css
   ================================================================ */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .45rem;
  font-family: var(--body-font); font-size: .9rem; font-weight: 600;
  padding: .55rem 1.05rem; border-radius: var(--r-md);
  border: 1px solid transparent; cursor: pointer; line-height: 1.2;
  text-decoration: none; transition: background .15s, box-shadow .15s, transform .05s;
  white-space: nowrap; user-select: none;
}
.btn:hover { text-decoration: none; }
.btn:active { transform: translateY(1px); }
.btn:disabled, .btn.disabled { opacity: .55; cursor: not-allowed; }
.btn i { font-size: 1.05em; }

.btn-primary { background: var(--primary); color: #fff; }
.btn-primary:hover { background: var(--dark); }

.btn-accent { background: var(--accent); color: #fff; }
.btn-accent:hover { background: #C96A1E; }

.btn-secondary { background: var(--panel-alt); color: var(--ink); border-color: var(--border); }
.btn-secondary:hover { background: var(--border); }

.btn-ghost { background: transparent; color: var(--primary); border-color: var(--border); }
.btn-ghost:hover { background: var(--panel-alt); }

.btn-danger { background: var(--danger); color: #fff; }
.btn-danger:hover { background: #9E2D22; }

.btn-success { background: var(--success); color: #fff; }
.btn-success:hover { background: #245840; }

.btn-sm { padding: .35rem .7rem; font-size: .8rem; }
.btn-lg { padding: .75rem 1.5rem; font-size: 1rem; }
.btn-block { display: flex; width: 100%; }
.btn-icon { padding: .45rem; border-radius: var(--r-md); }

.icon-btn {
  display: inline-flex; align-items: center; justify-content: center;
  width: 34px; height: 34px; border-radius: var(--r-md);
  border: 1px solid var(--border); background: var(--panel); color: var(--muted);
  cursor: pointer; transition: .15s;
}
.icon-btn:hover { background: var(--panel-alt); color: var(--primary); text-decoration: none; }
.icon-btn.danger:hover { color: var(--danger); border-color: var(--danger); }

.btn-group { display: inline-flex; gap: .4rem; flex-wrap: wrap; }
