@use "../theme.scss" as *;

.layer-cover {
  position: fixed;
  z-index: 300;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: $layer-cover-bg-color;
}

.layer {
  position: fixed;
  display: flex;
  z-index: 401;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  outline: none;
  align-items: center;
  justify-content: center;

  &.layer-stick-to-bottom {
    & .layer-box {
      position: absolute;
      left: 0;
      right: 0;
      bottom: 0;
      margin-bottom: 0;
    }
  }
}

.layer-box {
  max-height: 100vh;
  max-width: 100vw;
  overflow-y: auto;
  box-sizing: border-box;
  display: inline-block;
  &.fill {
    width: 100%;
    height: 100%;
    min-width: 0;
    max-width: none;
  }
  &.gutter-padding {
    padding: $layer-gutter-padding;
  }
}