:root{
  --brown-900:#4e2a12; --brown-800:#6d3b19; --brown-700:#915024;
  --brown-600:#b86a2e; --wood-bg:#f6efe6;
}
.bg-brown{ background: var(--brown-800)!important; }
.text-brown-800{ color: var(--brown-800)!important; }
.text-brown-700{ color: var(--brown-700)!important; }
.text-brown-600{ color: var(--brown-600)!important; }
.bg-wood{ background: var(--wood-bg); }
.btn-brown{ background: var(--brown-700); color:#fff; border-radius:14px; padding:.7rem 1.1rem; }
.btn-brown:hover{ filter:brightness(1.05); color:#fff; }
.btn-wood-outline{ border:2px solid var(--brown-600); color:var(--brown-800); border-radius:14px; }
img.card-img-top{ object-fit:cover; height:220px; }

/* ===== Extensiones para Auth usando tu paleta ===== */
.section-hero{
  background: linear-gradient(180deg, var(--brown-800) 0%, var(--brown-700) 100%);
  color:#fff;
  padding: 32px 0 24px;
  border-bottom: 1px solid rgba(0,0,0,.06);
}

.auth-bg{
  background: radial-gradient(1200px 420px at 8% -10%, #fff 0, #fff 30%, var(--wood-bg) 100%);
  min-height: calc(100vh - 56px); /* ajusta si tu navbar es más alta */
}

.card-wood{
  border: 1px solid rgba(0,0,0,.06);
  border-radius: 14px;
  box-shadow: 0 6px 18px rgba(0,0,0,.08);
  background:#fff;
}

/* Inputs y selects con ring en tu tono café */
.form-control, .form-select{
  border-color: rgba(0,0,0,.15);
  background-color:#fff;
}
.form-control:focus, .form-select:focus{
  border-color: var(--brown-600);
  box-shadow: 0 0 0 .2rem rgba(184,106,46,.25); /* brown-600 translúcido */
}

/* Links con color del tema */
.link-brown{ color: var(--brown-700); }
.link-brown:hover{ color: var(--brown-800); }

/* Títulos consistentes */
.page-title{ font-weight:700; letter-spacing:.2px; }