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

/// Modal

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

@use '@lavalogic/scss-lib' as lib;
@use 'animations';
@use 'breakpoints';
@use 'transitions';
@use 'corners';
@use 'shadows';
@use 'spacing';
@use 'z-index';

/// -------------------
/// Modal config
/// -------------------

$padding-x: spacing.$lg !default;
$padding-y: spacing.$lg !default;
$close-size: 1.5rem !default;

/// -------------------
/// Modal swatches
/// -------------------

.modal {
  position: relative;
  width: 100%;
  box-sizing: border-box;
  max-width: 800px;
  min-width: 250px;
  background-color: white;
  box-shadow: shadows.$one;
  border-radius: corners.$base;
  z-index: z-index.$modal;

  @include lib.breakpoint-up(breakpoints.$sm) {
    min-width: 500px;
  }
}

/// -------------------
/// Modal swatches
/// -------------------

.modal__close {
  position: absolute;
  right: 0;
  top: 0;
  z-index: z-index.$modal;
}

/// -------------------
/// Modal swatches
/// -------------------

.modal__body {
  padding: $padding-y $padding-x;
  max-height: calc(100vh / 1.5);
  overflow-y: scroll;
}
