@import 'page/meta_overlay_fix';
@import 'page/stations';

.page {
  // background-color: #000;
  background: transparent;
  color: $icedream-text-color;

  // seems like above colors get overwritten again when .active is added
  &.active {
    // background-color: #000;
    background: transparent;
    color: $icedream-text-color;
  }

  // apply theme font to all pages but chat page (monospace!)
  &:not(#page_Chat) {
    @include icedream-font;
  }

  &#page_EQ {
    #wave {
      position: absolute;
      left: 0;
      right: 0;
      top: 25%;
      bottom: 25%;
    }
    #eq {
      margin: 20vh;
      transition: opacity ease-out .33s, transform ease-out .33s;
      opacity: 0;
      transform: scale(0.75);
      .slider {
        background-color: rgba(0, 0, 0, .75);
      }
    }
    #bars {
      display: none;
    }
    &:hover {
      #eq {
        opacity: 1;
        transform: scale(1);
      }
    }
  }

  .eq {
    @if $icedream-saturation {
      @include saturate-from-red();
    }
  }

  #wave {
    @if $icedream-saturation {
      @include saturate-from-red(300%, 5%);
    }
  }
}