// Copyright (c) Alaska Air. All right reserved. Licensed under the Apache-2.0 license
// See LICENSE in the project root for license information.

// ---------------------------------------------------------------------

@use '../libSupport/deprecated';
@use '../libSupport/manageScope';
@use "@aurodesignsystem/design-tokens/dist/legacy/auro-classic/SCSSVariables" as tokens;
@use "../breakpoints" as breakpoints;

// Wrapper class around the use of ods-hyperlink role=button and ods-button.

// This selector is NOT auto included with any other web core style sheet.

// sass-lint:disable no-mergeable-selectors
/* stylelint-disable selector-type-no-unknown */

/// `.auro_containedButtons` is a helper class to support the use of multiple buttons and/or the use of ods-hyperlink `role="button"` in a parent container.
///
/// `.auro_containedButtons` has a dependency on WCSS breakpoints. See example below to import dependency.
///
/// [Manage](/#scope-prefix-variable-scope) `$scope` options.
///
/// Place selector on outer parent element.
/// @group utility-auro
/// @example scss - Default selector(s)
///   .auro_containedButtons {}
///
/// @example scss - Selector(s) when $scope: true;
///   .auro .auro_containedButtons {}
///
/// @example scss - import selector file
///   @use "./node_modules/@aurodesignsystem/webcorestylesheets/dist/componentSupport/containedButtons" as *;
/// @example scss - import dependency file
///   @use "./node_modules/@aurodesignsystem/webcorestylesheets/dist/breakpoints" as *;

#{manageScope.$scope}.auro_containedButtons {
  display: flex;
  flex-direction: column;

  > * {
    margin-bottom: var(--ds-text-body-size-default, tokens.$ds-text-body-size-default);

    &:last-child {
      margin-bottom: 0;
    }
  }

  @include breakpoints.auro_breakpoint($min: tokens.$ds-grid-breakpoint-md) {
    flex-direction: row;

    > * {
      margin-bottom: 0;
      margin-left: var(--ds-text-body-size-default, tokens.$ds-text-body-size-default);

      &:first-child {
        margin-left: 0;
      }
    }
  }
}
