

.faqGroup {
  margin-bottom: 2rem;
  max-width: 640px;
}
.faqGroup ul li {
    margin-bottom: 1rem;
    display: flex;
    justify-content: space-between;
}
.faqGroup ul li:hover {
  background-color: #eaf2fa;
}
.faqGroup a {
    text-decoration: none;
}
.faqGroup a:hover {
    text-decoration: underline;
}
.faqGroup h3 {
    margin-bottom: 1rem;
    font-weight: 800;
    padding-top: 2rem;
    border-top: 1px solid #ccc;
}
.faqGroup h4 {
    font-weight: 800;
    margin-top: 2rem;
    display: flex;
    align-items: center;
    font-size: 90%;
}
.faqGroup h4 a {
  display: flex;
  align-items: center;
  gap: .25em;
}

/* horizontal flip */
.u-flip-x {
  transform: scaleX(-1);
}

/* vertical flip */
.u-flip-y {
  transform: scaleY(-1);
}

/* ===== Green Utilities ===== */
.u-color-green {
  color: #537b4c !important;    /* text color */
}
.u-bg-green {
  background-color: #537b4c !important;
}
.u-fill-green {
  fill: #537b4c !important;      /* for svg icons */
}


/* ===== Red Utilities ===== */
.u-color-red {
  color: #b95036 !important;     /* matches existing alert vibe */
}
.u-bg-red {
  background-color: #b95036 !important;
}
.u-fill-red {
  fill: #b95036 !important;
}

.text-center {
  text-align: center;
}

.Button--icon--flipX {
  transform: translateY(-50%) scaleX(-1);
}
.Button--icon--inline {
  position: static;
  transform: scaleX(-1); /* your flip */
  margin-right: .5em;    /* spacing before text */
  fill: currentColor;
}
.Button--icon--inline-small {
  position: static;
  transform: scaleX(-1); /* your flip */
  margin-right: .15em;    /* spacing before text */
  fill: currentColor;
}

.faqItem {
    margin-top: 1rem;
    /*border-left: 2px solid currentColor;
    padding-left: 1rem; */
}
.faqItem.blankAnswer {
  /* border-left: 2px solid #ccc; */
}
.faqItem.blankAnswer .faqItem-title {
  opacity: 50%;
}
.faqItem-controls {
    display: inline-flex;
    margin-left: .25rem;
    gap: .35rem;
}
.faqItem-controls .control-txt {
    display: none;
}
.faqItem-controls a:hover {
    opacity: .5;
}

.communityTitle {
    font-weight: 800;
    text-align: center;
    font-size: 130%;
}

@media (min-width: 37.5em) {
  .faqGroupings {
    display: flex;
    gap: 2rem;
    flex-wrap: wrap;
    justify-content: space-between;
  }

  .faqGroup {
    flex: 1 1 calc(50% - 2rem);
  }
  .faqItem {
    font-size: 80%;
  }
  .faqGroup h4 {
    font-size: 70%;
  }
}

/* ===== CodyFrame-Style Padding Utilities ===== */

.padding-xxxxs { padding: 0.125rem !important; }
.padding-xxxs { padding: 0.25rem !important; }
.padding-xxs  { padding: 0.5rem !important; }
.padding-xs   { padding: 0.75rem !important; }
.padding-sm   { padding: 1rem !important; }
.padding-md   { padding: 1.5rem !important; }
.padding-lg   { padding: 2rem !important; }
.padding-xl   { padding: 3rem !important; }
.padding-xxl  { padding: 4rem !important; }
.padding-xxxl { padding: 6rem !important; }

/* Horizontal */
.padding-x-xxxxs { padding-left: 0.125rem !important; padding-right: 0.125rem !important; }
.padding-x-xxxs  { padding-left: 0.25rem !important;  padding-right: 0.25rem !important; }
.padding-x-xxs   { padding-left: 0.5rem !important;   padding-right: 0.5rem !important; }
.padding-x-xs    { padding-left: 0.75rem !important;  padding-right: 0.75rem !important; }
.padding-x-sm    { padding-left: 1rem !important;     padding-right: 1rem !important; }
.padding-x-md    { padding-left: 1.5rem !important;   padding-right: 1.5rem !important; }
.padding-x-lg    { padding-left: 2rem !important;     padding-right: 2rem !important; }
.padding-x-xl    { padding-left: 3rem !important;     padding-right: 3rem !important; }
.padding-x-xxl   { padding-left: 4rem !important;     padding-right: 4rem !important; }

/* Vertical */
.padding-y-xxxxs { padding-top: 0.125rem !important; padding-bottom: 0.125rem !important; }
.padding-y-xxxs  { padding-top: 0.25rem !important;  padding-bottom: 0.25rem !important; }
.padding-y-xxs   { padding-top: 0.5rem !important;   padding-bottom: 0.5rem !important; }
.padding-y-xs    { padding-top: 0.75rem !important;  padding-bottom: 0.75rem !important; }
.padding-y-sm    { padding-top: 1rem !important;     padding-bottom: 1rem !important; }
.padding-y-md    { padding-top: 1.5rem !important;   padding-bottom: 1.5rem !important; }
.padding-y-lg    { padding-top: 2rem !important;     padding-bottom: 2rem !important; }
.padding-y-xl    { padding-top: 3rem !important;     padding-bottom: 3rem !important; }
.padding-y-xxl   { padding-top: 4rem !important;     padding-bottom: 4rem !important; }

/* Individual sides */
.padding-top-sm    { padding-top: 1rem !important; }
.padding-bottom-sm { padding-bottom: 1rem !important; }
.padding-left-sm   { padding-left: 1rem !important; }
.padding-right-sm  { padding-right: 1rem !important; }

/* ===== Padding Top ===== */
.padding-top-md { padding-top: 1.5rem !important; }
.padding-top-lg { padding-top: 2rem !important; }
.padding-top-xl { padding-top: 3rem !important; }
.padding-top-xxl { padding-top: 4rem !important; }

/* ===== Padding Bottom ===== */
.padding-bottom-md { padding-bottom: 1.5rem !important; }
.padding-bottom-lg { padding-bottom: 2rem !important; }
.padding-bottom-xl { padding-bottom: 3rem !important; }
.padding-bottom-xxl { padding-bottom: 4rem !important; }

