/* Tribe Section Critical CSS Fixes */
.tribe-section {
  position: relative !important;
  z-index: 1 !important;
  overflow: visible !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
}

.tribe-content {
  position: relative !important;
  z-index: 1 !important;
  overflow: visible !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  width: 100% !important;
}

.tribe-cards-container {
  position: relative !important;
  z-index: 1 !important;
  overflow: visible !important;
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  width: 100% !important;
}

.Frame13, .fitness-group-card {
  position: relative !important;
  z-index: 1 !important;
  overflow: visible !important;
  display: flex !important;
  flex-direction: column !important;
  width: calc(100% - 20px) !important;
  max-width: 360px !important;
  background: rgba(83, 252, 255, 0.1) !important;
  box-shadow: 1px 2px 4px rgba(73, 218, 234, 0.5) !important;
  border-radius: 8px !important;
  padding: 10px !important;
  margin: 0 auto 15px auto !important;
}

.Frame135, .group-content {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  position: relative !important;
  z-index: 1 !important;
  overflow: visible !important;
  width: 100% !important;
  align-items: center !important;
  justify-content: flex-start !important;
  gap: 10px !important;
}

.Frame5, .group-category {
  display: flex !important;
  flex-direction: row !important;
  position: relative !important;
  z-index: 1 !important;
  overflow: visible !important;
  background: #F5F5F5 !important;
  border-radius: 8px !important;
  padding: 4px 8px !important;
  align-items: center !important;
  justify-content: center !important;
}

/* Ensure buttons are clickable */
.join-button, .leave-button {
  position: relative !important;
  z-index: 10 !important;
  cursor: pointer !important;
}

/* Ensure proper stacking context */
.fitnessgroups-topnav {
  position: relative !important;
  z-index: 10 !important;
}

.fitnessgroups-root {
  position: relative !important;
  z-index: 1 !important;
  overflow: visible !important;
}

/* Fix potential positioning issues in the fitness group content */
.fitness-group-content {
  position: relative !important;
  z-index: 1 !important;
  overflow: visible !important;
}

.fitness-group-detail {
  position: relative !important;
  z-index: 1 !important;
  overflow: visible !important;
}