.flex-responsive {
  display: flex;
  align-items: flex-start;
  flex-wrap: wrap;
  gap: 1.6rem;
}

/* Stack on small screens (set wide for testing) */
@media (max-width: 768px) {
  .flex-responsive.flex-responsive {
    display: flex; /* without this display-block was being set by BS */
    flex-direction: column ;
  }
  /* optional: make stacked items fill width nicely */
  .flex-responsive.flex-responsive > * {
    width: 100%;
    max-width: none;
  }
}



.gc-select {
    height: 2.1em;
    width: 8em;
    border-radius: 0.25em;
    box-shadow: none;
    outline: none;
    cursor: pointer;
},


.user-avatar-toggle {
    transition: transform 0.15s ease, border-color 0.15s ease;
}

.user-avatar-toggle:hover {
    transform: scale(1.08);
    border-color: #aaa !important;
}

/* Hide the little caret triangle */
.user-avatar-toggle::after {
    display: none;
}