/**
 * Site Footer EC
 * @define site-footer
 */

@use 'sass:map';
@use '@ecl/vanilla-layout-grid/mixins/breakpoints';

// Exposed variables
$theme: null !default;
$site-footer: null !default;

/*
 * Global rules
 */
.ecl-site-footer {
  background-color: map.get($site-footer, 'background');
  color: map.get($site-footer, 'color');
  display: flex;
  margin: 0;
  padding-bottom: var(--s-3xl);
  padding-top: var(--s-xs);
}

.ecl-site-footer__row {
  border-bottom: 1px solid map.get($site-footer, 'separator-color');
  font: var(--f-m);
  padding-bottom: var(--s-2xl);

  /* stylelint-disable-next-line max-nesting-depth */
  &:last-child {
    border-bottom: 0;
    padding-bottom: 0;
  }
}

.ecl-site-footer__section {
  padding-top: var(--s-2xl);

  /* stylelint-disable-next-line max-nesting-depth */
  > :first-child {
    margin-top: 0;
  }
}

.ecl-site-footer__section--separator {
  border-bottom: 1px solid map.get($site-footer, 'separator-color');
  padding-bottom: var(--s-2xl);
}

.ecl-site-footer__list-item {
  line-height: map.get($theme, 'line-height-ui', 'xs');
  margin-top: var(--s-m);

  .ecl-link__label {
    vertical-align: middle;
  }

  &:first-of-type {
    margin-top: 0;
  }
}

.ecl-site-footer__section--split-list {
  padding-top: var(--s-m);
}

.ecl-site-footer__title--separator {
  border-bottom: 1px solid map.get($site-footer, 'separator-color');
  padding-bottom: var(--s-xs);
}

.ecl-site-footer__title {
  color: map.get($site-footer, 'color');
  font: var(--f-m);
  font-weight: map.get($theme, 'font-weight', 'bold');
  margin: 0;
}

.ecl-site-footer__title-link,
.ecl-site-footer__title-link:hover,
.ecl-site-footer__title-link:focus,
.ecl-site-footer__title-link:active,
.ecl-site-footer__title-link:visited {
  color: map.get($site-footer, 'color');
}

.ecl-site-footer__description {
  font: var(--f-m);
  font-style: italic;
}

.ecl-site-footer__content {
  font: var(--f-m);
}

.ecl-site-footer__list {
  list-style: none;
  margin-bottom: 0;
  margin-top: var(--s-m);
  padding-inline-start: 0;
}

.ecl-site-footer__list--inline {
  display: inline-flex;
  flex-wrap: wrap;

  .ecl-site-footer__list-item {
    margin-inline-end: var(--s-l);
    margin-top: 0;

    /* stylelint-disable-next-line max-nesting-depth */
    &:last-of-type {
      margin-inline-end: 0;
    }
  }
}

.ecl-site-footer__logo-link {
  display: inline-block;
  margin-bottom: var(--s-xl);
}

.ecl-site-footer__logo-link:focus-visible,
.ecl-site-footer__title-link:focus-visible,
.ecl-site-footer__link:focus-visible {
  outline: 2px solid map.get($theme, 'color', 'white');
}

.ecl-site-footer__section--site-info {
  .ecl-site-footer__list {
    margin-top: var(--s-2xl);
  }

  .ecl-site-footer__title {
    padding-bottom: var(--s-m);
  }
}

/* stylelint-disable-next-line order/order */
@include breakpoints.up('l') {
  .ecl-site-footer__row {
    column-gap: map.get($site-footer, 'column-gap');
    display: grid;
    grid-gap: 0 map.get($site-footer, 'column-gap');
    grid-template-columns: repeat(3, 1fr);
  }

  .ecl-site-footer--split-columns .ecl-site-footer__column {
    &:last-child {
      display: grid;
      grid-column-end: 4;
      grid-column-start: 2;
      grid-gap: 0 map.get($site-footer, 'column-gap');
      grid-template-columns: repeat(2, 1fr);

      > .ecl-site-footer__section:first-child {
        grid-column-end: 3;
        grid-column-start: 1;
      }
    }
  }

  .ecl-site-footer__section--split-list {
    padding-top: var(--s-2xl);
  }

  .ecl-site-footer__list--columns {
    column-count: 2;
    column-gap: map.get($site-footer, 'column-gap');
  }
}
