@import "../../scss/variables";
@import "../../scss/mixins";
@import "../../scss/palettes";
@import "../../../public/css/variables";
@import "../../../public/css/functions";
@import "../../../public/css/mixins";
@import "~material-components-web/material-components-web";

:host {
  display: block;
  width: 100%;
  margin: 0;
  padding: 0;
}

.app {
  min-height: 100vh;
  height: 100%;
  @include ng-theming {
    background-color: theme-get('color-background');
  }

  &__content-outer {
    position: relative;
    overflow: hidden;
    min-width: 1024px;
    width: 100%;
    height: 100%;
    margin: 0 auto;
  }

  &__content-inner {
    min-height: 100vh;
    height: 100%;
  }

  &__content-section {
    margin-top: 25px;
    margin-right: 40px;
  }

  &__header {
    &--fixed {
      position: fixed;
      top: 0;
      left: 0;
      right: 0;
      min-width: 1024px;
      width: 100%;
      margin: 0 auto;
      z-index: 50;
      transition: box-shadow 0.33s 0s linear;
    }

    &--scrolled {
      @include ng-theming {
        background-color: theme-get('color-secondary');
      }
      box-shadow: 0px 6px 6px -3px rgba(0, 0, 0, 0.2);
    }
  }
}

main {
  padding: 0;

  /*&.main-gt-md {
    width: 1024px;
    margin: 0 auto;
    padding: 0;
  }*/

  /*&.main-xs {
    padding: 0 16px;
  }*/

}

.sidenav-container-wraper {

  .actions-row {
    padding: 15px 20px;

    span {
      &:first-child {
        text-align: left;
      }

      &:last-child {
        text-align: right;

        a,
        a:active,
        a:hover,
        a:visited {
          text-decoration: none;
          border: none;
          outline: none;
        }
      }
    }
  }

  .menu-item {
    line-height: 40px;

    a,
    a:active,
    a:hover,
    a:visited {
      text-decoration: none;
    }

    &.general-item {
      font-size: 17px;

      a {
        padding-left: 20px;
      }
    }

    &.submenu-item {
      font-size: 15px;

      a {
        padding-left: 35px;
        padding-right: 18px;
      }
    }
  }

  .newsletter {
    margin-top: 120px;
    padding-left: 20px;
    padding-right: 20px;

    .text {
      margin-top: 13px;
      margin-bottom: 13px;
      font-size: 13px;
      text-align: center;
    }

    .mat-input-container {
      width: 100%;
      border-radius: 6px;
      margin: 20px auto;
    }
  }
  a,
  a:active,
  a:hover,
  a:visited {
    color: inherit;
  }
}

.footer {
  margin-top: 40px;
  @include ng-theming {
    background-color: theme-get('color-secondary');
  }
}

mat-sidenav {
  width: 300px;
}
