/**
 * @file
 * Smart layout for footer regions: footer_first..footer_fourth.
 *
 * Goals:
 * - Content-sized columns (not equal-width).
 * - A selectable "grow" column that fills remaining space.
 * - A selectable "right" column that is pushed to the far right.
 * - Optional nowrap for the right column (theme setting; default on).
 */

/* Make the top footer area a content-driven flex row. */
.site-footer__top--smart {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: var(--bs-gutter-x, 1.5rem);
}

/* Neutralize any float/width rules from base footer layouts. */
.site-footer__top--smart > .region {
  float: none !important;
  width: auto !important;
  max-width: 100%;
  flex: 0 1 auto;
}

/* Grow column: fills remaining space while still wrapping nicely. */
.footer-smart--grow-first  > .region-footer-first,
.footer-smart--grow-second > .region-footer-second,
.footer-smart--grow-third  > .region-footer-third,
.footer-smart--grow-fourth > .region-footer-fourth {
  flex: 1 1 18rem;
  min-width: 14rem;
}

/* Right column: push to the far right & keep at the end even if middle columns are empty. */
.footer-smart--right-first  > .region-footer-first,
.footer-smart--right-second > .region-footer-second,
.footer-smart--right-third  > .region-footer-third,
.footer-smart--right-fourth > .region-footer-fourth {
  margin-left: auto;
  order: 999;
}

/* Optional nowrap for the selected right column. */
.footer-smart--right-nowrap.footer-smart--right-first  > .region-footer-first,
.footer-smart--right-nowrap.footer-smart--right-second > .region-footer-second,
.footer-smart--right-nowrap.footer-smart--right-third  > .region-footer-third,
.footer-smart--right-nowrap.footer-smart--right-fourth > .region-footer-fourth {
  white-space: nowrap;
}

/* On small screens: stack, left align, and always allow wrapping to avoid horizontal scrolling. */
@media (max-width: 767.98px) {
  .site-footer__top--smart {
    display: block;
  }

  .site-footer__top--smart > .region {
    width: 100% !important;
  }

  .footer-smart--right-first  > .region-footer-first,
  .footer-smart--right-second > .region-footer-second,
  .footer-smart--right-third  > .region-footer-third,
  .footer-smart--right-fourth > .region-footer-fourth {
    margin-left: 0;
    order: 0;
    white-space: normal;
  }
}