/*
 * Footer element
 */

@use 'sass:map';
@use '../abstracts/variables';
@use '../abstracts/mixins/breakpoints' as *;
@use '../abstracts/mixins/typography';

$-footer-bg-color: var(--pkt-color-surface-strong-dark-blue);
$-footer-color: var(--pkt-color-text-body-default);
$-footer-max-width: map.get(variables.$breakpoints, 'laptop');
$-footer-icon-r-margin: map.get(variables.$spacing, 'size-8');
$-footer-link-b-margin: map.get(variables.$spacing, 'size-16');

.pkt-footer {
  padding: map.get(variables.$spacing, 'size-40') map.get(variables.$spacing, 'size-24');
  background-color: $-footer-bg-color;
  color: $-footer-color;
  display: flex;
  align-items: center;

  @include typography.get-text('pkt-txt-18-light');
  @include bp('laptop-up') {
    padding: map.get(variables.$spacing, 'size-56') map.get(variables.$spacing, 'size-24');
    justify-content: center;
  }

  &__container {
    max-width: $-footer-max-width;
  }

  &__title {
    margin-bottom: map.get(variables.$spacing, 'size-32');
    margin-top: 0;
    color: $-footer-color;
    @include typography.get-text('pkt-txt-24-medium');
  }

  // tekstfelt
  &__text:last-child {
    margin-bottom: 0;
    margin-top: map.get(variables.$spacing, 'size-32');
  }

  &__text:not(:last-child) {
    margin-bottom: map.get(variables.$spacing, 'size-32');
    margin-top: 0;
  }

  // Lenkelisten
  &__list {
    padding: 0;
    margin: 0;
    list-style: none;
  }

  &__list-item {
    word-break: break-word;

    &:not(:last-child) {
      margin-bottom: $-footer-link-b-margin;
    }

    @include bp('laptop-up') {
      margin-bottom: 0;
    }
  }

  &__link {
    display: flex;
    text-decoration: none !important;

    &:hover .pkt-footer__link-icon {
      --fg-color: currentColor;
    }
  }

  &__link-icon {
    --fg-color: currentColor;
    width: 24px;
    height: 24px;
    margin-right: $-footer-icon-r-margin;
    flex-shrink: 0;

    @include bp('laptop-up') {
      margin-top: 0;
    }
  }

  // Social media ikoner og språklenke
  &__social {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
    gap: map.get(variables.$spacing, 'size-32');
    margin-top: map.get(variables.$spacing, 'size-40');

    &:hover .pkt-footer__link-icon {
      --fg-color: currentColor;
    }

    @include bp('laptop-up') {
      align-items: flex-end;
      justify-content: end;
    }

    &-language {
      @include bp('laptop-up') {
        justify-self: flex-start;
      }
    }

    &-icon {
      --fg-color: currentColor;
      width: 24px;
      height: 24px;
    }

    &-icon-link:not(:last-child) {
      margin-right: map.get(variables.$spacing, 'size-16');
    }
  }
}

// Simple footer

.pkt-footer-simple {
  padding: map.get(variables.$spacing, 'size-32') map.get(variables.$spacing, 'size-24');
  background-color: $-footer-bg-color;
  color: $-footer-color;
  display: flex;
  align-items: center;

  @include typography.get-text('pkt-txt-18-light');
  @include bp('laptop-up') {
    justify-content: center;
  }

  &__container {
    max-width: $-footer-max-width;
  }

  // Lenkelisten
  &__list {
    padding: 0;
    margin: 0;
    list-style: none;
  }

  &__list-item {
    @include bp('laptop-up') {
      display: inline-flex;
    }

    &:not(:last-child) {
      margin-bottom: $-footer-link-b-margin;

      @include bp('laptop-up') {
        margin-bottom: 0;
        margin-right: map.get(variables.$spacing, 'size-32');
      }
    }
  }

  &__link {
    display: flex;
    text-decoration: none !important;
    align-items: flex-start;

    &:hover .pkt-footer__link-icon {
      --fg-color: currentColor;
    }
  }

  &__link-icon {
    --fg-color: currentColor;
    width: 24px;
    height: 24px;
    margin-right: $-footer-icon-r-margin;
    flex-shrink: 0;

    @include bp('laptop-up') {
      margin-top: 0;
    }
  }
}