.converter{
  display:grid;
  grid-template-columns:1fr auto 1fr;
  gap:15px;
  align-items:center;
}

input, select{
  margin:15px;
}

.swap-btn{
  background:#007f5f;
  border:none;
  padding:10px 17px;
  border-radius:50%;
  cursor:pointer;
  color:white;
  font-size:18px;
  transition:0.3s;
}

.swap-btn:hover{
  background:#55a630;
  transform:rotate(180deg);
}

.result-box{
  margin-top:20px;
  background:rgba(255,255,255,0.1);
  padding:15px;
  border-radius:12px;
  display:flex;
  justify-content:space-between;
  align-items:center;
}

.result{
  font-size:20px;
  font-weight:bold;
}

button.copy{
  background:#55a630;
  border:none;
  padding:8px 12px;
  border-radius:8px;
  cursor:pointer;
  color:white;
}

.history{
  margin-top:20px;
}

.history h3{
  margin-bottom:10px;
}

.history-list{
  max-height:150px;
  overflow:auto;
  background:rgba(255,255,255,0.05);
  padding:10px;
  border-radius:10px;
  font-size:14px;
}

.clear{
  margin-top:10px;
  background:#007f5f;
  border:none;
  padding:8px 12px;
  border-radius:8px;
  color:white;
  cursor:pointer;
}