/* ---------- buttons ---------- */

button, .btn-primary, .btn-secondary, .link-btn {
  font-family: var(--mono);
  font-size: 0.85rem;
  background: transparent;
  color: var(--text);
  border: 1px solid var(--border);
  padding: 7px 14px;
  border-radius: var(--radius-sm);
  cursor: pointer;
  transition: border-color 0.15s, color 0.15s, background 0.15s;
}
button:hover, .link-btn:hover, .btn-secondary:hover {
  border-color: var(--accent);
  color: var(--accent);
}

.btn-primary {
  background: var(--accent);
  color: #1a1410;
  border-color: var(--accent);
  font-weight: 600;
}
.btn-primary:hover {
  background: var(--accent-dim);
  border-color: var(--accent-dim);
  color: #1a1410;
}

.btn-secondary {
  display: inline-block;
  text-align: center;
  /* padding y border ya vienen de la regla base de botones; aquí solo lo
     específico de la variante secondary. */
  color: var(--text-dim);
}
/* border-color (no border-bottom-color): coherente con el resto de botones,
   que cambian todo el borde en hover. El border-bottom-color era copia del
   patrón de los <a>. */
.btn-secondary:hover { border-color: var(--accent); }

input, textarea {
  font-family: var(--mono);
  background: var(--bg-warm);
  color: var(--text);
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  padding: 10px 12px;
  font-size: 0.9rem;
  width: 100%;
  transition: border-color 0.15s;
}
input:focus, textarea:focus {
  outline: none;
  border-color: var(--accent-dim);
}
textarea {
  font-size: 0.92rem;
  resize: vertical;
  min-height: 70px;
  line-height: 1.55;
}