@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400&display=swap');

.fihan-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  padding: 10px 24px;
  font-family: 'IBM Plex Mono', ui-monospace, monospace;
  font-size: 15px;
  font-weight: 400;
  line-height: 1;
  border: 1px solid transparent;
  background: transparent;
  cursor: pointer;
  transition: background-color 120ms ease, color 120ms ease, border-color 120ms ease;
}

.fihan-btn:disabled {
  cursor: not-allowed;
}

.fihan-btn--icon-only {
  padding: 10px 16px;
}

.fihan-btn .fihan-btn__icon {
  display: inline-block;
  width: 14.51px;
  height: 10.4px;
  flex-shrink: 0;
}

.fihan-btn .fihan-btn__icon svg {
  display: block;
  width: 100%;
  height: 100%;
}

/* ─── PRIMARY ─────────────────────────────────────────────── */
.fihan-btn--primary {
  background: #14CC52;
  color: #202224;
}
.fihan-btn--primary:hover:not(:disabled),
.fihan-btn--primary.is-hover {
  background: #159139;
  color: #202224;
}
.fihan-btn--primary:active:not(:disabled),
.fihan-btn--primary.is-press {
  background: #163B21;
  color: #DAF2E2;
}
.fihan-btn--primary:disabled {
  background: #333536;
  color: #757677;
}

/* ─── SECONDARY ──────────────────────────────────────────── */
.fihan-btn--secondary {
  background: #202224;
  color: #DAF2E2;
  border-color: #494B4B;
}
.fihan-btn--secondary:hover:not(:disabled),
.fihan-btn--secondary.is-hover {
  background: #43464A;
  color: #DAF2E2;
  border-color: #494B4B;
}
.fihan-btn--secondary:active:not(:disabled),
.fihan-btn--secondary.is-press {
  background: #D7D9DB;
  color: #2E332F;
  border-color: transparent;
}
.fihan-btn--secondary:disabled {
  background: #202224;
  color: #494B4B;
  border-color: transparent;
}

/* ─── GHOST ──────────────────────────────────────────────── */
.fihan-btn--ghost {
  background: transparent;
  color: #14CC52;
}
.fihan-btn--ghost:hover:not(:disabled),
.fihan-btn--ghost.is-hover {
  background: #163B21;
  color: #14CC52;
}
.fihan-btn--ghost:active:not(:disabled),
.fihan-btn--ghost.is-press {
  background: #14CC52;
  color: #202224;
}
.fihan-btn--ghost:disabled {
  background: transparent;
  color: #5F6061;
}