/* Variabel Warna Resmi Binance Dark Mode */
:root {
  --bg-dark: #0B0E11;
  --bg-card: #1E2329;
  --bg-input: #2B3139;
  --primary-yellow: #F3BA2F;
  --success-green: #0ECB81;
  --danger-red: #F6465D;
  --text-main: #EAECEF;
  --text-muted: #707A8A;
  --border-color: #383F4B;
}

body {
  background-color: var(--bg-dark);
  color: var(--text-main);
  font-family: "Segoe UI", Roboto, "Helvetica Neue", sans-serif;
  margin: 0;
  padding: 0;
}

/* Utilitas Kustom Berdasarkan Binance Theme */
.binance-card {
  background-color: var(--bg-card);
  border: 1px solid var(--border-color);
  border-radius: 8px;
  padding: 20px;
}

.btn-binance-yellow {
  background-color: var(--primary-yellow);
  color: #0B0E11;
  font-weight: 600;
  border: none;
  padding: 10px 20px;
  border-radius: 4px;
  cursor: pointer;
  transition: opacity 0.2s;
}

.btn-binance-yellow:hover {
  opacity: 0.9;
}

.btn-binance-danger {
  background-color: var(--danger-red);
  color: #ffffff;
  font-weight: 600;
  border: none;
  padding: 10px 20px;
  border-radius: 4px;
  cursor: pointer;
}

.input-binance {
  background-color: var(--bg-input);
  border: 1px solid var(--border-color);
  color: var(--text-main);
  padding: 10px 15px;
  border-radius: 4px;
  width: 100%;
  box-sizing: border-box;
}

.input-binance:focus {
  border-color: var(--primary-yellow);
  outline: none;
}

.text-binance-yellow {
  color: var(--primary-yellow);
}

.text-binance-success {
  color: var(--success-green);
}

.text-binance-danger {
  color: var(--danger-red);
}

.text-binance-muted {
  color: var(--text-muted);
}