// ==========================================================================
// Footer Component
// Site footer with contact info, navigation columns, social links
// ==========================================================================

.c-footer {
  // --hks-footer-padding-x: var(--hks-layout-padding-x);

  margin-top: auto;
  padding-top: $spacer * 3.5;
  @include media-breakpoint-up(md) {
    // --hks-footer-padding-x: 1.5rem;
    padding-top: $spacer * 4;
  }
  @include media-breakpoint-up(xxl) {
    padding-top: $spacer * 5;
    // --hks-footer-padding-x: 3.5rem;
  }
  @media (min-width: 2000px) {
    --hks-footer-padding-x: 0;
  }

  // Generic dark treatment: enforce white text/link/headings when footer is dark.
  &.t-dark,
  &.t-blue,
  .t-dark &,
  .t-blue & {
    color: $white;

    h1,
    h2,
    h3,
    h4,
    h5,
    h6,
    p,
    li,
    address,
    strong,
    span {
      color: $white;
    }

    a {
      color: $white;
    }
  }

  // ==========================================================================
  // Main Footer Section
  // ==========================================================================
  &__main {
    padding-left: var(--hks-footer-padding-x) !important;
    padding-right: var(--hks-footer-padding-x) !important;
    .container-fluid {
      max-width: 1920px;
    }
  }
  &__main {
    padding-bottom: 4rem;
  }

  // Brand & Logo
  &__brand {
    margin-bottom: $spacer * 2;
    text-align: center;

    @include media-breakpoint-up(md) {
      margin-bottom: $spacer * 2;
      text-align: left;
    }
    @include media-breakpoint-up(xxl) {
      margin-bottom: $spacer * 2;
      text-align: left;
    }
  }

  &__logo-link {
    display: inline-block;
  }

  &__logo {
    height: 90px;
    width: auto;

    @include media-breakpoint-up(lg) {
      height: 100px;
    }
  }

  &__logo--inverted {
    filter: brightness(0) invert(1);
  }

  // Contact Information
  &__contact {
    line-height: 1.6;
    display: inline-flex;
    flex-direction: column;
    align-items: center;
    gap: 0.25rem;
    font-style: normal;
    font-size: $font-size-sm;
    margin-bottom: 0;

    @include media-breakpoint-down(md) {
      margin-bottom: $spacer * 1;
    }
    @include media-breakpoint-up(md) {
      align-items: flex-start;
    }
    @include media-breakpoint-up(xl) {
      align-items: flex-start;
    }
    > a {
      width: auto;
    }
    h2 {
      margin-bottom: 0.875rem;
    }
  }

  &__company {
    font-size: 1.25rem;
    font-weight: 700;
    margin-bottom: 0.25rem;
  }
  &__city {
    margin-bottom: 0.25rem;
  }
  &__phone,
  &__email {
    padding-block: 0.0625rem;
    font-weight: 600;
  }

  // ==========================================================================
  // Footer Navigation
  // ==========================================================================

  &__nav-title {
    font-size: 1.25rem;
    font-weight: $font-weight-bold;

    margin-bottom: $spacer * 1.5;
    @include media-breakpoint-up(xxl) {
      font-size: 1.25rem;
    }
    .link-dynamic {
      color: inherit;
      font-size: inherit;
      font-weight: inherit;
    }
    &:hover {
      color: $link-hover-color;
    }
  }

  &__nav-list {
    list-style: none;
    padding: 0;
    margin: 0;
  }

  &__nav-item {
    margin-bottom: $spacer * 0.5;
  }

  &__nav-link {
    font-size: $font-size-sm;
    font-weight: 500;
    color: $primary;
    transition: color 0.2s ease;
    // margin-bottom: $spacer * 0.25;
    padding-block: 0.25rem;
    // @include dynamic-underline-hover($white, 1px, 0.12em);
    @include media-breakpoint-up(xl) {
      font-size: $font-size-base;
    }
  }

  &__nav-title-link {
    // @include dynamic-underline-hover($white, 2px, 0.12em);
  }

  // ==========================================================================
  // Social Media Links
  // ==========================================================================

  &__social {
    // padding-top: $spacer * 2;
    // padding-bottom: $spacer * 2;
    margin-top: 1.5rem;
    text-align: center;
    @include media-breakpoint-down(md) {
      margin-bottom: 2rem;
    }
    @include media-breakpoint-up(xxl) {
      margin-top: 2rem;
    }
    .c-sm-icons__list {
      justify-content: center;
      gap: $spacer * 2;

      @include media-breakpoint-up(md) {
        gap: $spacer * 1;
      }
      @include media-breakpoint-up(lg) {
        justify-content: flex-start;
      }
    }
  }

  // ==========================================================================
  // Service Navigation (Impressum, Datenschutz)
  // ==========================================================================
  &__service {
  }
  &__service-list {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: $spacer * 3;

    @include media-breakpoint-up(sm) {
      gap: $spacer * 2.5;
    }
    @include media-breakpoint-up(md) {
      justify-content: flex-start;
      gap: $spacer * 4;
    }
    @include media-breakpoint-up(xxl) {
      gap: $spacer * 4;
    }
  }
  &__service-item {
    margin-bottom: 0;
  }

  &__service-link {
    text-decoration: none;
    // font-size: $font-size-sm;
    color: $primary;
    transition: color 0.2s ease;
  }
}