@import '~@od/global-resources/scss/settings/index';
@import 'layout';
@import 'menu';

// --------------------------------------------------
// PRELOGIN Header
// --------------------------------------------------

$logo-dimensions: 100px;
$logo-sm-dimensions: 90px;
$logo-xs-dimensions: 77px;

.bsd_prelogin_body {
  .row {
    margin: 0;
  }
  //For Fixed Contents with Responsive
  #container {
    overflow: auto;
  }
}

.prelogin-header {
  width: 100%;
  box-sizing: border-box;
  position: relative;

  &-wrapper {
    height: $logo-dimensions;
    position: relative;
    z-index: $zindex-logo-container;
    width: 100%;
    margin: 0 auto;
    max-width: $screen-xxl;
  }

  &-container {
    float: none;
    position: relative;
    box-sizing: border-box;
    margin: 0 auto;
    padding: 18px 12px 12px $logo-dimensions + 12;
  }
}

.is-fluid {
  .header-background {
    background-color: $header-background;
    min-height: 45px;
    width: 100%;
    position: absolute;
    bottom: 0;
  }
}

.prelogin-title {
  @include font-size($prelogin-title-font);
  padding: 18px 8px 7px 8px;
  margin-bottom: 1px;
  display: inline-block;
  margin-left: $logo-dimensions + 26px;
}

.prelogin-logo-container {
  position: absolute;
  top: 0;
  left: 0;
}

.prelogin-logo-img {
  width: $logo-dimensions;
  height: $logo-dimensions;
}

@media(max-width: $screen-md-max){
  .prelogin-header-container {
    padding-top: 23px;
  }
}

@media(max-width: $screen-sm-max){
  .prelogin-header-container {
    padding-top: 14px;
  }

  .prelogin-title {
    padding-top: 14px;
    margin-left: 105px;
  }

  .prelogin-header-wrapper {
    height: $logo-sm-dimensions;
  }

  .prelogin-logo-img {
    height:  $logo-sm-dimensions;
    width: $logo-sm-dimensions;
  }
}

@media(max-width: $screen-xs-max){
  .prelogin-header-wrapper {
    height: $logo-xs-dimensions;
  }

  .prelogin-title {
    @include font-size($base-font-size - 2);
    margin-left: $logo-xs-dimensions;
    padding: 7px 8px;
  }

  .prelogin-logo-img {
    height:  $logo-xs-dimensions;
    width: $logo-xs-dimensions;
  }
}