/* 🐾 Botões Vibrantes - Estilo Pet */

/* Roxo vibrante */
.btn-purple {
  color: #fff;
  background-color: #8E44AD;
  border-color: #8E44AD;
}
.btn-purple:hover,
.btn-purple:focus {
  background-color: #732d91;
  border-color: #732d91;
}

/* Rosa choque */
.btn-pink {
  color: #fff;
  background-color: #E91E63;
  border-color: #E91E63;
}
.btn-pink:hover,
.btn-pink:focus {
  background-color: #c2185b;
  border-color: #c2185b;
}

/* Azul céu */
.btn-sky {
  color: #fff;
  background-color: #00BFFF;
  border-color: #00BFFF;
}
.btn-sky:hover,
.btn-sky:focus {
  background-color: #0099cc;
  border-color: #0099cc;
}

/* Verde limão */
.btn-lime {
  color: #000;
  background-color: #C6FF00;
  border-color: #C6FF00;
}
.btn-lime:hover,
.btn-lime:focus {
  background-color: #aee600;
  border-color: #aee600;
}

/* Laranja */
.btn-orange {
  color: #fff;
  background-color: #FF8C00;
  border-color: #FF8C00;
}
.btn-orange:hover,
.btn-orange:focus {
  background-color: #e67e00;
  border-color: #e67e00;
}

/* Amarelo ouro */
.btn-gold {
  color: #000;
  background-color: #FFD700;
  border-color: #FFD700;
}
.btn-gold:hover,
.btn-gold:focus {
  background-color: #e6c200;
  border-color: #e6c200;
}

/* Vermelho tomate */
.btn-red {
  color: #fff;
  background-color: #FF3B30;
  border-color: #FF3B30;
}
.btn-red:hover,
.btn-red:focus {
  background-color: #e0352a;
  border-color: #e0352a;
}

/* Verde esmeralda */
.btn-emerald {
  color: #fff;
  background-color: #2ECC71;
  border-color: #2ECC71;
}
.btn-emerald:hover,
.btn-emerald:focus {
  background-color: #27ae60;
  border-color: #27ae60;
}

/* Azul marinho */
.btn-navy {
  color: #fff;
  background-color: #34495E;
  border-color: #34495E;
}
.btn-navy:hover,
.btn-navy:focus {
  background-color: #2c3e50;
  border-color: #2c3e50;
}

/* Turquesa */
.btn-turquoise {
  color: #fff;
  background-color: #1ABC9C;
  border-color: #1ABC9C;
}
.btn-turquoise:hover,
.btn-turquoise:focus {
  background-color: #16a085;
  border-color: #16a085;
}

/* Padrão base */
.btn-purple, .btn-pink, .btn-sky, .btn-lime, .btn-orange,
.btn-gold, .btn-red, .btn-emerald, .btn-navy, .btn-turquoise {
  display: inline-block;
  font-weight: 500;
  text-align: center;
  vertical-align: middle;
  user-select: none;
  border: 1px solid transparent;
  padding: 0.5rem 1rem;
  font-size: 1rem;
  line-height: 1.5;
  border-radius: 0.5rem;
  transition: all 0.2s ease-in-out;
  cursor: pointer;
}

/* 🐾 Fundos vibrantes e suaves */

/* Bege pêssego claro com degradê */
.bg-peach {
  background: linear-gradient(180deg, #FFDAB9 0%, #FFF4E8 100%);
}

/* Versão mais sutil (quase lisa) */
.bg-peach-soft {
  background: linear-gradient(180deg, #FFE7CA 0%, #FFF9F3 100%);
}

/* Bege sólido sem degradê */
.bg-peach-solid {
  background-color: #FFDAB9;
}

/* Ajuste opcional — para uso no body */
body.bg-peach,
body.bg-peach-soft {
  min-height: 100vh;
  background-attachment: fixed;
  background-repeat: no-repeat;
  background-size: cover;
}

.navbar-emerald {
  background-color: #2ECC71;
  color: #fff;
}
.navbar-emerald a {
  color: #fff !important;
}
.navbar-emerald a:hover {
  opacity: 0.85;
}
.footer-emerald {
  background-color: #27AE60;
  color: #fff;
  padding: 1rem 0;
}


/* 🐾 Fundos coloridos no mesmo tom dos botões */

/* Roxo vibrante */
.bg-purple {
  background-color: #8E44AD !important;
  color: #fff !important;
}

/* Rosa choque */
.bg-pink {
  background-color: #E91E63 !important;
  color: #fff !important;
}

/* Azul céu */
.bg-sky {
  background-color: #00BFFF !important;
  color: #fff !important;
}

/* Verde limão */
.bg-lime {
  background-color: #C6FF00 !important;
  color: #000 !important;
}

/* Laranja */
.bg-orange {
  background-color: #FF8C00 !important;
  color: #fff !important;
}

/* Amarelo ouro */
.bg-gold {
  background-color: #FFD700 !important;
  color: #000 !important;
}

/* Vermelho tomate */
.bg-red {
  background-color: #FF3B30 !important;
  color: #fff !important;
}

/* Verde esmeralda */
.bg-emerald {
  background-color: #2ECC71 !important;
  color: #fff !important;
}

/* Azul marinho */
.bg-navy {
  background-color: #34495E !important;
  color: #fff !important;
}

/* Turquesa */
.bg-turquoise {
  background-color: #1ABC9C !important;
  color: #fff !important;
}

/* ➕ Variações com degradê suave (opcional, para header/footer mais elegantes) */
.bg-purple-gradient {
  background: linear-gradient(90deg, #8E44AD, #732d91);
  color: #fff !important;
}
.bg-pink-gradient {
  background: linear-gradient(90deg, #E91E63, #c2185b);
  color: #fff !important;
}
.bg-emerald-gradient {
  background: linear-gradient(90deg, #2ECC71, #27ae60);
  color: #fff !important;
}
.bg-sky-gradient {
  background: linear-gradient(90deg, #00BFFF, #0099cc);
  color: #fff !important;
}
.bg-orange-gradient {
  background: linear-gradient(90deg, #FF8C00, #e67e00);
  color: #fff !important;
}

/* Textos em fundo colorido */
.bg-purple a, .bg-pink a, .bg-emerald a, .bg-sky a, .bg-orange a {
  color: #fff !important;
  text-decoration: none;
}
.bg-lime a, .bg-gold a {
  color: #000 !important;
}
.bg-purple a:hover, .bg-pink a:hover, .bg-emerald a:hover, .bg-sky a:hover, .bg-orange a:hover {
  opacity: 0.9;
}