/* 1. Paleta de Cores */
:root {
  --cb-primary: #2e7d32;
  /* Verde escuro */
  --cb-success: #43a047;
  /* Verde vibrante */
  --cb-warning: #fbc02d;
  /* Amarelo solar */
  --cb-danger: #e53935;
  /* Vermelho */
  --cb-info: #26c6da;
  /* Azul claro água */
  --cb-bg: #f5fff5;
  /* Fundo claro, toque de verde */
  --cb-black: #111;
  --cb-white: #fff;
  --cb-card-shadow: 0 4px 20px rgba(76, 175, 80, 0.08);
  --cb-card-radius: 20px;
}

/* 2. Fonte do App */
body,
input,
button {
  font-family: 'Nunito', 'Poppins', Arial, Helvetica, sans-serif;
  font-size: 1rem;
  color: var(--cb-black);
  background-color: var(--cb-bg);
}

.navbar {
  background: #fff;
  border-bottom: 1px solid #e0e0e0;
}

.navbar-brand img {
  height: 48px;
}

/* 3. Botões Bootstrap */
.btn-primary {
  background-color: var(--cb-primary) !important;
  border-color: var(--cb-primary) !important;
  color: var(--cb-white) !important;
  font-weight: 700;
  border-radius: 16px;
  transition: 0.2s;
}

.btn-primary:hover,
.btn-primary:focus {
  background-color: #245624 !important;
  border-color: #245624 !important;
}

.btn-success {
  background-color: var(--cb-success) !important;
  border-color: var(--cb-success) !important;
  color: var(--cb-white) !important;
  font-weight: 700;
  border-radius: 16px;
}

.btn-success:hover,
.btn-success:focus {
  background-color: #388e3c !important;
  border-color: #388e3c !important;
}

.btn-warning {
  background-color: var(--cb-warning) !important;
  border-color: var(--cb-warning) !important;
  color: var(--cb-black) !important;
  font-weight: 700;
  border-radius: 16px;
}

.btn-warning:hover,
.btn-warning:focus {
  background-color: #f9a825 !important;
  border-color: #f9a825 !important;
}

.btn-danger {
  background-color: var(--cb-danger) !important;
  border-color: var(--cb-danger) !important;
  color: var(--cb-white) !important;
  font-weight: 700;
  border-radius: 16px;
}

.btn-danger:hover,
.btn-danger:focus {
  background-color: #b71c1c !important;
  border-color: #b71c1c !important;
}

/* Botão de link customizado */
a,
.btn-link {
  color: var(--cb-info);
  text-decoration: none;
  transition: color 0.2s;
}

a:hover,
.btn-link:hover {
  color: var(--cb-success);
}

/* 4. Cards */
.card {
  border: none;
  border-radius: var(--cb-card-radius);
  box-shadow: var(--cb-card-shadow);
  background: var(--cb-white);
  transition: box-shadow 0.2s;
}

.card:hover {
  box-shadow: 0 8px 32px rgba(76, 175, 80, 0.18);
}

/* 5. Formulários */
.form-label {
  color: var(--cb-primary);
  font-weight: 600;
}

.form-control:focus {
  border-color: var(--cb-success);
  box-shadow: 0 0 0 0.2rem rgba(67, 160, 71, .10);
}

input[type="email"],
input[type="password"],
input[type="text"] {
  border-radius: 12px;
  background-color: #f8fff8;
}

/* 6. Cabeçalhos */
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: 'Poppins', Arial, Helvetica, sans-serif;
  font-weight: 700;
  color: var(--cb-primary);
  letter-spacing: 0.5px;
}

/* 7. Rodapé */
.footer {
  background: #f4f7fa;
  color: #1b5e20;
  padding: 12px 0;
  text-align: center;
  font-size: 1rem;
  flex-shrink: 0;
}

.success-card {
  max-width: 420px;
  margin: 70px auto 0 auto;
  border-radius: 20px;
  box-shadow: 0 6px 28px rgba(67, 160, 71, 0.12);
  background: #fff;
  padding: 36px 26px 32px 26px;
  text-align: center;
}

.success-icon {
  font-size: 4rem;
  color: #43a047;
  margin-bottom: 18px;
}

.success-points {
  color: #26c6da;
  font-size: 2.4rem;
  font-weight: 700;
  margin: 6px 0 16px 0;
}

.success-label {
  font-size: 1.07rem;
  color: #555;
  margin-bottom: 5px;
}

.success-value {
  font-size: 1.15rem;
  color: #222;
  font-weight: 600;
}

.btn-home {
  margin-top: 26px;
  border-radius: 16px;
  font-weight: 700;
}

.error-card {
  max-width: 400px;
  margin: 80px auto 0 auto;
  border-radius: 20px;
  box-shadow: 0 6px 28px rgba(229, 57, 53, 0.10);
  background: #fff;
  padding: 36px 26px 32px 26px;
  text-align: center;
}

.error-icon {
  font-size: 3.6rem;
  color: #e53935;
  margin-bottom: 18px;
}

.error-title {
  color: #e53935;
  font-size: 2rem;
  font-weight: 700;
}

.btn-retry {
  margin-top: 26px;
  border-radius: 16px;
  font-weight: 700;
}