/* ==========================================================================
   Buttons
   ========================================================================== */

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 0.875rem 2rem;
  font-family: 'Oswald', sans-serif;
  font-size: 1rem;
  font-weight: 500;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  border-radius: 9999px;
  transition: all var(--transition-normal);
  cursor: pointer;
  text-decoration: none;
  border: 2px solid transparent;
}

.btn-primary {
  background-color: var(--color-campfire-600);
  color: white;
  border-color: var(--color-campfire-600);
}

.btn-primary:hover {
  background-color: var(--color-campfire-500);
  border-color: var(--color-campfire-500);
  transform: scale(1.05);
}

.btn-secondary {
  background-color: transparent;
  color: white;
  border-color: white;
}

.btn-secondary:hover {
  background-color: white;
  color: var(--color-night-900);
}

.btn-outline {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.875rem 2rem;
  border: 2px solid var(--color-wilderness-600);
  border-radius: 9999px;
  color: var(--color-wilderness-600);
  background: transparent;
  font-family: 'Oswald', sans-serif;
  font-size: 0.875rem;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  text-decoration: none;
  transition: all 0.3s ease;
  cursor: pointer;
}

.btn-outline:hover {
  background-color: var(--color-wilderness-600);
  color: white;
}

/* Hero Buttons */
.btn--primary {
  background-color: #dc3626;
  color: white;
  border-color: #dc3626;
}

.btn--primary:hover {
  background-color: #ef5544;
  border-color: #ef5544;
  transform: scale(1.05);
}

.btn--outline {
  background-color: transparent;
  color: white;
  border-color: white;
}

.btn--outline:hover {
  background-color: white;
  color: #171923;
}

/* WordPress button block overrides */
.wp-block-button__link.btn-primary {
  background-color: var(--color-campfire-600) !important;
  color: white !important;
  border-radius: 9999px !important;
  padding: 0.875rem 2rem !important;
  font-family: 'Oswald', sans-serif !important;
  text-transform: uppercase !important;
  letter-spacing: 0.05em !important;
}

.wp-block-button__link.btn-primary:hover {
  background-color: var(--color-campfire-500) !important;
  transform: scale(1.05);
}
