/**
 * @license
 * Copyright 2023 Tyler Technologies, Inc. 
 * License: Apache-2.0
 */
@use '@material/theme/theme' as mdc-theme;
@use '@material/elevation/elevation-theme' as mdc-elevation-theme;
@use '@material/animation/variables' as mdc-animation-variables;
@use '@material/shape/shape' as mdc-shape;
@use '../theme';
@use '../typography/mixins' as typopgraphy-mixins;
@use '../utils/mixins-media' as media-mixins;
@use './variables';
@use '../utils/mixins' as utils-mixins;

@mixin core-styles() {
  .forge-bottom-sheet {
    @include base;

    &--open {
      @include open;
    }

    &--fullscreen.forge-bottom-sheet--open {
      @include open-fullscreen;
    }

    &--dragging {
		@include dragging;
    }

    &--scrollable {
		@include scrollable;
    }
  }
}

@mixin host() {
  @include theme.z-index(dialog);

  position: fixed;
}

@mixin backdrop() {
  @include utils-mixins.position-abs-zero;

  position: fixed;
}

@mixin base() {
  @include mdc-theme.property(background-color, surface);
  @include mdc-elevation-theme.elevation(8);
  @include theme.css-custom-property(border-radius, --forge-bottom-sheet-border-radius, mdc-shape.$medium-component-radius mdc-shape.$medium-component-radius 0 0);
  @include theme.css-custom-property(max-width, --forge-bottom-sheet-desktop-max-width, 50%);

  box-sizing: border-box;
  position: fixed;
  bottom: 0;
  right: 0;
  left: 0;
  max-height: 50%;
  margin: 0 auto;
  display: inline-flex;
  flex-direction: column;
  transform: translateY(100%);
  transition: max-height variables.$transition-duration ease-in,
              transform variables.$transition-duration-close mdc-animation-variables.$standard-curve-timing-function;

  @include media-mixins.tablet-portrait-down {
    @include full-width;
  }
}

@mixin full-width() {
  max-width: 100%;
  width: 100%;
  margin: 0;
  border-radius: 0;
}

@mixin open() {
  transform: translateY(0);
  transition-duration: variables.$transition-duration;
}

@mixin open-fullscreen {
  height: 100%;
  max-height: 100%;
  transition: max-height variables.$transition-duration ease-in;
}

@mixin dragging {
	transition: none !important;
}

@mixin scrollable {
	height: 100%;
}
