/* vim: set ts=2 sw=2 sts=2 et: */

/**
 * Styles
 *
 * Copyright (c) 2001-present Qualiteam software Ltd. All rights reserved.
 * See https://www.x-cart.com/license-agreement.html for license details.
 */

#page-wrapper{
    .container;

  &:after {
    height: 0;
    font-size: 0;
    line-height: 0;
  }
}

#page{
  padding-bottom: 0px;
}

html, body {
  height: 100%;
}

#page-wrapper {
  .flex-display();
  .flex-direction(column);
  .justify-content(space-between);
  position: relative;
  min-height: 100vh;
  min-width: 320px;

  & > *:first-child {
    flex-shrink: 0;
  }

  #page {
    flex: 1 0 auto;
  }
}

.sidebar {
  .make-sm-column(4; 0);
  .make-md-column(3; 0);
  .make-lg-column(3; 0);
}

.one-sidebar #content {
  .make-sm-column(8; 0);
  .make-md-column(9; 0);
  .make-lg-column(9; 0);
}

.two-sidebars #content {
  overflow: hidden;
  .make-sm-column(8; 0);
  .make-md-column(6; 0);
  .make-lg-column(6; 0);
}

.no-sidebars #content {
  .make-lg-column(12; 0); 
}

.one-sidebar {
  &.sidebar-first-empty,
  &.sidebar-second-empty {
    .sidebar {
      display: none;
    }
    #content {
      .make-lg-column(12; 0);
      float: none;
      width: auto;
    }
  }
}

.two-sidebars {
  &.sidebar-first-empty,
  &.sidebar-second-empty {
    #sidebar-second {
      .make-sm-column(4; 0);
      .make-md-column(3; 0);
      .make-lg-column(3; 0);
      padding-right: round(@grid-gutter-width / 2);
    }
    #content {
      .make-sm-column(8; 0);
      .make-md-column(9; 0);
      .make-lg-column(9; 0);
    }
  }

  &.sidebar-first-empty {
    #sidebar-first {
      display: none;
    }
  }

  &.sidebar-second-empty {
    #sidebar-second {
      display: none;
    }
  }
  &.sidebar-first-empty.sidebar-second-empty {
    .sidebar {
      display: none;
    }
    #content {
      .make-lg-column(12; 0);
      float: none;
      width: auto;
    }
  }
}

@media (max-width: @screen-md-max) {
  .one-sidebar {
    &.sidebar-first-only-categories,
    &.sidebar-second-only-categories {

      .sidebar {
        display: none;
      }
      #content {
        .make-lg-column(12; 0);
        float: none;
        width: auto;
      }
    }
  }

  .two-sidebars {
    &.sidebar-first-only-categories,
    &.sidebar-second-only-categories {
      #sidebar-second {
        .make-sm-column(4; 0);
        .make-md-column(3; 0);
        .make-lg-column(3; 0);
        padding-right: round(@grid-gutter-width / 2);
      }
      #content {
        .make-sm-column(8; 0);
        .make-md-column(9; 0);
        .make-lg-column(9; 0);
      }
    }

    &.sidebar-first-only-categories {
      #sidebar-first {
        display: none;
      }
    }

    &.sidebar-second-only-categories {
      #sidebar-second {
        display: none;
      }
    }
    &.sidebar-first-only-categories.sidebar-second-only-categories {
      .sidebar {
        display: none;
      }
      #content {
        .make-lg-column(12; 0);
        float: none;
        width: auto;
      }
    }
  }
}

#sidebar-first
{   
    @media (min-width: @screen-xs-min) {
        padding-right: 0;
    }
    
    @media (min-width: @screen-sm-min) {
        padding-right: round(@grid-gutter-width / 2);
    }
}

#sidebar-second
{
    @media (min-width: @screen-xs-min) {
        padding-left: 0;
    }
    
    @media (min-width: @screen-sm-min) {
        padding-left: round(@grid-gutter-width / 2);
    }

  @media (max-width: @screen-xs-max) {
    clear: both;
    padding-top: 30px;
  }
}

@media (min-width: @screen-sm-min) and (max-width: @screen-sm-max) {
  .two-sidebars #sidebar-first {
    margin-bottom: 0;
  }

  .two-sidebars #main-wrapper #content {
    float: right;
  }

  .two-sidebars #sidebar-second {
    clear: left;
    padding-left: 0;
    padding-right: round(@grid-gutter-width / 2);
  }
}