/**
 * Copyright IBM Corp. 2016, 2023
 *
 * This source code is licensed under the Apache-2.0 license found in the
 * LICENSE file in the root directory of this source tree.
 */

@use '@carbon/styles/scss/breakpoint' as *;
@use '@carbon/styles/scss/config' as *;
@use '@carbon/styles/scss/layout' as *;
@use '@carbon/styles/scss/components/button' as *;
@use '@carbon/styles/scss/spacing' as *;
@use '@carbon/styles/scss/theme' as *;
@use '@carbon/styles/scss/themes' as *;
@use '@carbon/styles/scss/type' as *;
@use '../../globals/utils/flex-grid' as *;
@use '../../globals/vars' as *;
@use '../../globals/imports' as *;

/// Footer locale button
/// @access private
/// @group footer

@mixin locale-button {
  :host(#{$c4d-prefix}-locale-button),
  .#{$prefix}--locale-btn__container {
    @include theme($g100, feature-flag-enabled('enable-css-custom-properties'));
    @include button;
    @include make-col-ready;
    @include make-col(4, 4);

    margin: $spacing-09 0;

    .#{$c4d-prefix}--locale-btn {
      @include emit-layout-tokens();

      align-items: center;

      inline-size: 100%;

      max-inline-size: 100%;

      // Forces the style of text + icon button style
      padding-inline-end: $spacing-04;
      @include type-style('body-compact-01');

      @include breakpoint(md) {
        min-inline-size: 13.5rem;
      }
    }

    @include breakpoint(md) {
      align-self: end;
      margin-block: 0 $spacing-10;
      padding-inline: 0;
      @include make-col(4, 8);
      @include make-col-offset(2, 8);
    }

    @include breakpoint(lg) {
      @include make-col(4, 16);
      @include make-col-offset(10, 16);
    }
  }

  :host(#{$c4d-prefix}-footer[size='short'])
    ::slotted(#{$c4d-prefix}-locale-button),
  .#{$prefix}--footer--short .#{$prefix}--locale-btn__container {
    margin-block-start: $spacing-09;

    @include breakpoint(md) {
      margin-block-start: 0;
      @include make-col-offset(2, 8);

      .#{$prefix}--locale-btn {
        float: inline-end;
      }
    }

    @include breakpoint(lg) {
      @include make-col-offset(10, 16);
    }
  }

  .#{$prefix}--footer--micro {
    .#{$prefix}--locale-btn__container {
      padding: 0;
      .#{$prefix}--btn--tertiary {
        &:hover,
        &:focus {
          background-color: $background-hover;
          color: $text-primary;
        }
      }
    }
  }
}