/* ================================
   COLOR VARIABLES
================================ */
:root {
  --bg-main: #ffffff;
  --bg-soft: #f7f3e8;

  --gold-main: #d4af37;
  --gold-light: #f1d97a;
  --gold-dark: #b8962e;

  --text-main: #7a6400;
  --text-light: #ffffff;

  --shadow-gold: rgba(212, 175, 55, 0.35);
}

/* ================================
   BIT FORM CONTAINER
================================ */
.bitform,
.bit-form-wrapper {
  background-color: var(--bg-main);
  padding: 22px;
  border-radius: 14px;
  border: 2px solid var(--gold-main);
  max-width: 420px;
  margin: 40px auto;
  box-shadow: 0 10px 30px var(--shadow-gold);
}

/* ================================
   FORM TITLE
================================ */
.bitform h2,
.bitform .bf-title {
  text-align: center;
  color: var(--text-light);
  background: linear-gradient(135deg, var(--gold-main), var(--gold-light));
  padding: 14px;
  border-radius: 10px;
  margin-bottom: 20px;
}

/* ================================
   LABELS
================================ */
.bitform label {
  font-weight: bold;
  color: var(--text-main);
  margin-bottom: 6px;
  display: block;
}

/* ================================
   INPUTS
================================ */
.bitform input,
.bitform textarea,
.bitform select {
  width: 100%;
  padding: 11px;
  background-color: var(--bg-main);
  color: var(--text-main);
  border: 1.5px solid var(--gold-main);
  border-radius: 8px;
  transition: all 0.3s ease;
}

/* Focus effect */
.bitform input:focus,
.bitform textarea:focus,
.bitform select:focus {
  outline: none;
  border-color: var(--gold-dark);
  box-shadow: 0 0 10px var(--shadow-gold);
  transform: scale(1.02);
}

/* ================================
   BUTTON
================================ */
.bitform button,
.bitform input[type="submit"] {
  width: 100%;
  background: linear-gradient(135deg, var(--gold-main), var(--gold-light));
  color: var(--text-light);
  border: none;
  padding: 13px;
  font-size: 16px;
  font-weight: bold;
  border-radius: 10px;
  cursor: pointer;
  transition: all 0.3s ease;
}

.bitform button:hover {
  background: linear-gradient(135deg, var(--gold-dark), var(--gold-main));
  transform: scale(1.05);
}

/* ================================
   MOBILE
================================ */
@media (max-width: 480px) {
  .bitform {
    margin: 20px;
  }
}
