/*!
 * SPDX-License-Identifier: Apache-2.0
 *
 * The OpenSearch Contributors require contributions made to
 * this file be licensed under the Apache-2.0 license or a
 * compatible open source license.
 *
 * Modifications Copyright OpenSearch Contributors. See
 * GitHub history for details.
 */

@import '../variables/header';

@mixin ouiHeaderAffordForFixed($headerHeight: $ouiHeaderHeightCompensation) {
  // The `&` allows for grouping inside another specific body class.
  // When not applied inside of another selector, it simply renders with the single class
  &.ouiBody--headerIsFixed {
    padding-top: $headerHeight;

    // When the OuiHeader is fixed, we need to account for it in the position of the flyout
    .ouiFlyout,
    .ouiCollapsibleNav {
      top: $headerHeight;
      height: calc(100% - #{$headerHeight});
    }

    @include ouiBreakpoint('m', 'l', 'xl') {
      .ouiPageSideBar--sticky {
        max-height: calc(100vh - #{$headerHeight});
        top: #{$headerHeight};
      }
    }

    .ouiOverlayMask--belowHeader {
      top: #{$headerHeight};
    }
  }
}


/* OUI -> EUI Aliases */
@mixin euiHeaderAffordForFixed($headerHeight: $ouiHeaderHeightCompensation) {
  &.euiBody--headerIsFixed {
    padding-top: $headerHeight;

    .euiFlyout,
    .euiCollapsibleNav {
      top: $headerHeight;
      height: calc(100% - #{$headerHeight});
    }

    @include euiBreakpoint('m', 'l', 'xl') {
      .euiPageSideBar--sticky {
        max-height: calc(100vh - #{$headerHeight});
        top: #{$headerHeight};
      }
    }

    .euiOverlayMask--belowHeader {
      top: #{$headerHeight};
    }
  }
}
/* End of Aliases */