/* ─────────────────────────────────────────────────────────────────────────────
   SIP GLOBAL — Buttons
   One standard size used everywhere. Modifiers only for trade/admin/danger.
───────────────────────────────────────────────────────────────────────────── */

.btn {
  display       : inline-flex;
  align-items   : center;
  justify-content: center;
  gap           : 0.5em;
  font-family   : var(--font-mono);
  font-size     : var(--text-sm);
  font-weight   : var(--weight-semibold);
  letter-spacing: 0.07em;
  text-transform: uppercase;
  height        : 44px;
  padding       : 0 1.75em;
  border-radius : var(--radius-sm);
  border        : 1px solid transparent;
  cursor        : pointer;
  transition    : background var(--transition), color var(--transition),
                  border-color var(--transition);
  white-space   : nowrap;
  line-height   : 1;
}

/* Primary — blue */
.btn--primary {
  background  : var(--color-blue);
  color       : var(--color-white);
  border-color: var(--color-blue);
}
.btn--primary:hover {
  background  : var(--color-blue-bright);
  border-color: var(--color-blue-bright);
}

/* Secondary — navy */
.btn--secondary {
  background  : var(--color-navy);
  color       : var(--color-white);
  border-color: var(--color-navy);
}
.btn--secondary:hover {
  background  : var(--color-navy-deep);
  border-color: var(--color-navy-deep);
}

/* Outline white */
.btn--outline {
  background  : transparent;
  color       : var(--color-white);
  border-color: rgba(255,255,255,0.5);
}
.btn--outline:hover {
  border-color: var(--color-white);
  background  : rgba(255,255,255,0.08);
}

/* Outline blue */
.btn--outline-blue {
  background  : transparent;
  color       : var(--color-blue);
  border-color: var(--color-blue);
}
.btn--outline-blue:hover {
  background: var(--color-blue);
  color     : var(--color-white);
}

/* Ghost */
.btn--ghost {
  background  : transparent;
  color       : var(--color-light);
  border-color: transparent;
}
.btn--ghost:hover { color: var(--color-white); }

/* Trade — compact, used in table rows */
.btn--trade {
  height      : 32px;
  padding     : 0 0.9em;
  font-size   : var(--text-xs);
  background  : transparent;
  color       : var(--color-blue-bright);
  border-color: var(--color-blue-bright);
}
.btn--trade:hover {
  background: var(--color-blue-bright);
  color     : var(--color-white);
}
.btn--trade[disabled],
.btn--trade.is-disabled {
  opacity: 0.35;
  cursor : not-allowed;
  pointer-events: none;
}

/* Danger — admin destructive */
.btn--danger {
  height      : 32px;
  padding     : 0 0.9em;
  font-size   : var(--text-xs);
  background  : transparent;
  color       : #FF4444;
  border-color: #FF4444;
}
.btn--danger:hover {
  background: #FF4444;
  color     : var(--color-white);
}

/* Full width */
.btn--full { width: 100%; }

/* Loading state */
.btn.is-loading {
  opacity       : 0.65;
  cursor        : wait;
  pointer-events: none;
}