/* Custom background & text colors for base Cassiopeia */
.footer {
  background-color: #1a1a1a;
  color: #ffffff;
  padding: 0.5rem 0;
  height: 160px; 
  }

/* Arrange multiple footer modules into responsive columns */
.footer .container-component {
  display: flex;
  flex-wrap: wrap;
  gap: 0.7rem;
  justify-content: space-between;
  height: 160px;
}

.footer .grid-child {
  flex: 1 1 220px; /* Wraps into multi-column layouts on wider screens */
  height: 100px;
}

.radius {
	padding: 3px;
	border-radius: 6px;
	background-color: #e7e9e7;
}

.green {
color: #038a17;
}

.guestmenu {
background-color: orange;
padding: 5px;
border: 2px solid #43484b;
}


/* Target the radio options container */
#jform_com_fields_my_local_experience_is_related_to fieldset,
.host-radio-columns .controls {
  display: grid;
  grid-template-columns: repeat(3, 1fr); /* Creates 3 equal columns */
  gap: 12px 20px;                         /* Row gap and Column gap */
  align-items: center;
}

/* Optional: Ensure labels and inputs fit neatly */
#jform_com_fields_my_local_experience_is_related_to fieldset .form-check,
.host-radio-columns .controls label {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 0;
}

/* Responsive adjustment for small mobile screens */
@media (max-width: 576px) {
  #jform_com_fields_my_local_experience_is_related_to fieldset,
  .host-radio-columns .controls {
    grid-template-columns: repeat(1, 1fr); /* Collapse to 1 column on mobile */
  }
}