/* No-JS experience */
:is(rh-footer, rh-footer-universal):not(:defined) {
  &[color-palette^='dark'] {
    color-scheme: only dark;
  }

  &[color-palette^='light'] {
    color-scheme: only light;
  }

  p {
    color:
      /** Footer secondary text; theme-adaptive */
      var(--rh-color-text-secondary,
        light-dark(
          /** Footer secondary text for light scheme */
          var(--rh-color-text-secondary-on-light, #4d4d4d),
          /** Footer secondary text for dark scheme */
          var(--rh-color-text-secondary-on-dark, #c7c7c7)
        ));
  }

  & :is(h1, h2, h3, h4, h5, h6) {
    &[slot='links'],
    &[slot='header'] {
      font-size:
        /** Link column header size override */
        var(--rh-footer-link-header-font-size,
          /** Link column header size */
          var(--rh-font-size-body-text-sm, 0.875rem));

      /** Footer font weight */
      font-weight: var(--rh-font-weight-heading-medium, 500);
    }
  }
}

rh-footer-universal:not(:defined) {
  background-color:
    light-dark(
        /** Universal footer surface without JS for light scheme */
        var(--rh-color-surface-lightest, #ffffff),
        /** Universal footer surface without JS for dark scheme */
        var(--rh-color-surface-darkest, #151515)
      );
  display: block;
  width: 100%;
  padding:
    /** Universal footer block padding without JS */
    var(--rh-space-2xl, 32px)
    /** Universal footer inline padding without JS */
    var(--rh-space-lg, 16px);

  &:before {
    grid-area: global;
  }

  & [slot='links-primary'],
  & [slot='links-secondary'] {
    display: flex;
    flex-flow: column wrap;

    /** Footer content gap */
    gap: var(--rh-space-md, 8px);

    /** Footer text size */
    font-size: var(--rh-font-size-body-text-xs, 0.75rem);
    margin: 0;
    padding: 0;
  }

  /* No-JS + DSD */
  &[ssr-hint-has-slotted] :is(h2, h3, h4)[hidden] {
    border: 0;
    clip: rect(0, 0, 0, 0);
    block-size: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    white-space: nowrap;
    inline-size: 1px;
  }

  & rh-footer-copyright:not(:defined) {
    grid-column: -1/1;
    padding-block:
      /** Copyright block-start padding without JS */
      var(--rh-space-2xl, 32px)
      /** Copyright block-end padding without JS */
      var(--rh-space-md, 8px);

    /** Copyright text size */
    font-size: var(--rh-font-size-body-text-xs, 0.75rem);
    color:
      /** Copyright text; theme-adaptive */
      var(--rh-color-text-secondary,
        light-dark(
          /** Copyright text for light scheme */
          var(--rh-color-text-secondary-on-light, #4d4d4d),
          /** Copyright text for dark scheme */
          var(--rh-color-text-secondary-on-dark, #c7c7c7)
        ));
  }
}

rh-footer:not(:defined) rh-footer-universal:not(:defined) {
  /* Spacing when universal footer is nested in rh-footer */

  /** Nested universal footer top margin */
  margin-block-start: var(--rh-space-2xl, 32px);
}

/* (min-width: --rh-breakpoint-md) */
@media screen and (min-width: 992px) {
  rh-footer-universal:not(:defined) {
    grid-column-start: span 12;

    /** Universal footer block padding at viewport >= lg */
    padding-block: var(--rh-space-2xl, 32px);
    padding-inline:
      /** Universal footer inline padding start at viewport >= lg */
      var(--rh-space-7xl, 128px)
      /** Universal footer inline padding end at viewport >= lg */
      var(--rh-space-4xl, 64px);

    &[ssr-hint-has-slotted] {
      padding-inline: 0;
    }

    & ul[slot='links-primary'],
    & ul[slot='links-secondary'] {
      flex-direction: row;
      gap:
        /** Global link row gap at viewport >= lg */
        var(--rh-space-md, 8px)
        /** Global link column gap at viewport >= lg */
        var(--rh-space-xl, 24px);
    }

    & ul[slot='links-primary'] {
      /** Primary link list bottom margin at viewport >= lg */
      margin-block-end: var(--rh-space-xl, 24px);
    }

    & rh-footer-copyright:not(:defined) {
      /** Copyright block padding at viewport >= lg */
      padding-block: var(--rh-space-md, 8px);
    }
  }

  rh-footer:not(:defined) rh-footer-universal:not(:defined) {
    --_grid-row-max: 8;

    grid-row: var(--_grid-row-max) / var(--_grid-row-max);
  }
}
