/**
 * @license
 * Copyright Tyler Technologies, Inc. 
 * License: Apache-2.0
 */
@use './variables';
@use '../core/styles/animation';

@mixin core-styles() {
  .forge-view-switcher {
    @include base;
  
    ::slotted(.forge-view-switcher__view--hidden) {
      @include view-hidden;
    }
  }
}

@mixin host() {
  height: var(--forge-view-switcher-height, auto);
  width: var(--forge-view-switcher-width, auto);

  display: block;
}

@mixin base() {
  height: var(--forge-view-switcher-height, auto);
  width: var(--forge-view-switcher-width, auto);

  position: relative;
  overflow: hidden;
  transition: height #{animation.variable(duration-medium2)} cubic-bezier(0.35, 0, 0.25, 1);
}

@mixin view-slidable() {
  transition: transform #{animation.variable(duration-medium2)} cubic-bezier(0.35, 0, 0.25, 1);
  will-change: transform;
}

@mixin view-fadeable() {
  transition: opacity #{animation.variable(duration-medium2)} cubic-bezier(0.35, 0, 0.25, 1);
  will-change: opacity;
}

@mixin view-hidden() {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
