//neat grid + bourbon
@import "vendors/bourbon/bourbon";
@import "modules/grid-settings";
@import "vendors/neat/neat";

//modules
@import "modules/base";
@import "modules/mixins";
@import "modules/colors";
@import "modules/functions/modular-scale";
@import "modules/functions/px-to-rem";

//elements
@import "elements/normalize";
@import "elements/reset";
@import "elements/layout";
@import "elements/forms";
@import "elements/fonts";
@import "elements/links";
@import "elements/lists";
@import "elements/headings";

//objects
@import "objects/patterns";
@import "objects/buttons";
@import "objects/media";
@import "objects/tabs";
@import "objects/side-menu";

//partials
@import "partials/layout";
@import "partials/header";
@import "partials/footer";
@import "partials/headings";
@import "partials/forms";
@import "partials/video";


.rows {
  margin-bottom: $base-spacing-size;
}

.row,
%row {
  @extend %clearfix;
  padding: $half-spacing-size;
  border-top: $light-grey 1px solid;
	  
  &:last-child {
	border-bottom: $light-grey 1px solid;
  }
}

.row-title {
  @include span-columns(4);
  margin-bottom: $half-spacing-size;
  
  @include media( $medium ) {
    @include span-columns(4);
	margin-bottom: 0;
  }
}

.row-link {
  color: $dark-grey;
  
  &:visited {
    color: $grey;
  }
}

.row-info {
  @include span-columns(4);
  color: $grey;

  div {
	@extend %inline-block;
	margin-left: $base-spacing-size;
	
	&:first-child {
      margin-left: 0;
    }
  }
  
  @include media( $medium ) {
    @include span-columns(4);
	text-align: right;
  }
}

.row-unread {
  font-size: ms(-1);
  background-color: $light-blue;
}

.row-edit {
  float: right;
}

//topic list

.categories {
  @include span-columns(4);
  margin-bottom: $half-spacing-size;
  
  @include media( $medium ) {
    @include span-columns(4);
  }
}

.tab-content {
  display: none;
}

.new-topic {
  @include span-columns(4);
  
  @include media( $medium ) {
    @include span-columns(4);
	text-align: right;
  }
}

//topic moderate

.topic-moderation {
  margin-bottom: $base-spacing-size;
	
  @include media( $medium ) {
	text-align: right;
	
	.menu {
	  text-align: left;
	}
  }
}

.head-edit-link {
  font-size: 14px;
}

.move-comments {
	position: fixed;
	bottom: 0;
	left: 0;
	z-index: 1;
	display: block;
	width: 100%;
	background: $light-grey;
	padding: $quarter-spacing-size 0;
}

.move-container {
  @include outer-container;
}

.move-link,
.move-label,
.move-input {
	display: inline-block;
	vertical-align: middle;
	margin: 0;
	margin-left: $half-spacing-size;
}

.move-link {
  padding: $quarter-spacing-size;
  background: $lightest-grey;
}

.move-input {
  input {
	width: 100px;
	margin: 0;
  }
}

input.move-comment-checkbox {
  display: inline-block;
  margin: 0;
}

//comments

.nav {
  @extend %inline-list;
  font-size: 14px;
  
  .fa {
    margin-left: $half-spacing-size;
  }
}

.comments {
  margin-bottom: $base-spacing-size;
}

.comment {
  @extend %row;
  
  &.is-highlighted {
    background: $yellow;
  }
}

.comment-media {
  @extend %media;
}

.comment-img {
  @extend %media-img;
  width: 50px;
  margin-right: $base-spacing-size;
}

.comment-body {
  @extend %media-body;
}

.comment-avatar {
  border-radius: 25px;
}

.comment-info {
  @extend %clearfix;
  font-size: 14px;
  margin-bottom: $half-spacing-size;
}

.comment-username {
  float: left;
}

.comment-date {
  @extend %inline-list;
  float: right;
}

.comment-realname {
  display: none;

  @include media( $medium ) {
    display: inline;
    margin-left: $half-spacing-size;
  }
}

.comment-text {
  blockquote {
    margin: 0;
    border-left: $light-grey 4px solid;
	padding-left: $base-spacing-size;
  }

  ul {
    list-style-type: disc;
    list-style-position: inside;
	margin-left: 40px;
	margin-bottom: $base-line-height;
  }

  img {
    vertical-align: text-bottom;
  }
}

.comment-actions {
  @extend %inline-list;
  font-size: 14px;
  text-align: right;
}

.comment-removed {
  font-size: 14px;
  word-wrap: break-word;
}

.username {
  &.is-admin {
    background: $yellow;
  }
  
  &.is-mod {
    background: $light-blue;
  }
}

.paginator {
  @extend %inline-list;
  margin-bottom: $base-spacing-size;
  
  @include media( $medium ) {
    @include span-columns(4);
  }
}

.paginator-button {
  display: block;
  padding: ($base-spacing-size / 6) $half-spacing-size;
  border: $light-grey 1px solid;
}

.notify {
  margin-bottom: $base-spacing-size * 2;
  
  @include media( $medium ) {
    @include span-columns(4);
	text-align: right;
  }
}

.reply {
  padding: $half-spacing-size;
  
  textarea {
    height: $base-line-height * 4;
	margin-bottom: $half-spacing-size;
  }
}

.reply-markdown {
  @extend %inline-list;
  margin-bottom: $base-spacing-size;
  
  @include media( $medium ) {
    float: left;
  }
  
  li {
    margin-left: $base-spacing-size;
  }
}

ul.reply-markdown {
  /* reset */
  list-style: none;
  margin-left: 0;
}

.reply-button {
  @include media( $medium ) {
    float: right;
  }
}

.topic-publish-comment {
  textarea {
    height: $base-line-height * 10;
  }
}

.share {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 9100;
  
  display: table;
  width: 100%;
  height: 100%;
  background: $white;
  background: rgba($white, 0.75);
  
  @include media( $medium ) {
    width: 300px;
    height: 150px;
	top: 50%;
	left: 50%;
	margin-top: -75px;
    margin-left: -150px;
	padding: $base-spacing-size;
	border: $light-grey 1px solid;
  }
}

.share-close {
  float: right;
  margin-bottom: $base-spacing-size;
}

.share-box {
  display: table-cell;
  vertical-align: middle;
}

.share-url {
  margin-bottom: $half-spacing-size;
}

.share-actions {
  @extend %inline-list;
  text-align: right;
  
  li {
    margin-left: $base-spacing-size;
  }
}

.comment-poll {
  margin-bottom: $base-spacing-size;
}

.poll_title {
  margin-bottom: $base-line-height / 2;
}

.poll-choices {
  & ul {
    list-style-type: none;
	margin-left: 0;
	margin-bottom: $base-line-height / 2;
  }

  & label {
    font-size: $base-font-size;
  }
}

.poll-choice {
  margin-bottom: $base-line-height / 2;
}

.choice-bar {
  height: 14px;
  background-color: $light-grey;
}

.poll-note {
  font-size: 14px;
  margin-bottom: $base-line-height / 2;
}

.poll-action {
  font-size: 14px;
  margin-left: $base-spacing-size / 4;

  &:first-child {
    margin-left: 0;
  }
}













//menu

.menu,
%menu {
  @include media( $medium ) {
    display: inline-block;
  }
	
  li {
    background-color: $lightest-grey;
    margin-bottom: $quarter-spacing-size;
	
	&:last-child {
      margin-bottom: 0;
    }
  }
}

.menu-link {
  display: block;
  padding: 0 $half-spacing-size;
}

.menu-item {
  @extend %clearfix;
  padding: 0 $half-spacing-size;
}

.menu-username {
  float: left;
}

.menu-icon {
  float: right;
}

//profile

.profile-img {
  @include span-columns(4);
  margin-bottom: $base-spacing-size;
  text-align: center;
}

.profile-avatar {
  width: 200px;
  height: 200px;
  border-radius: 100px;
}

.profile-username {
  font-size: 21px;
}

.profile-info {
  margin-bottom: $base-spacing-size;
  text-align: center;
}

.profile-track {
  @extend %inline-list;
}

.profile-title {
  text-align: left;
}

.profile-date {
  text-align: left;
}

.private-message {
  margin-bottom: $base-spacing-size * 2;
  text-align: center;
}

.profile-preferences {
  margin-bottom: $base-spacing-size * 2;
  text-align: center;
}

//private

.private-participants {
  @include span-columns(4);
  margin-bottom: $half-spacing-size;
  
  @include media( $medium ) {
    @include span-columns(4);
  }
}

.private-leave {
  @include span-columns(4);
  margin-bottom: $base-spacing-size;
  
  @include media( $medium ) {
    @include span-columns(4);
	text-align: right;
  }
}

.participants-menu {
  @extend %menu;
  margin-bottom: $half-spacing-size;
}

//preferences

.preference-label {
  font-size: 18px;
  margin-bottom: $half-spacing-size;
}

.preference-desc {
  margin: 0;
  margin-bottom: $base-spacing-size;
  padding: 0 $half-spacing-size;
}

//login

.login {
  margin-bottom: $base-spacing-size;
}

.login-link {
  display: block;
  margin-bottom: $quarter-spacing-size;
}

//flash messages

.messages {
  &.is-fixed {
    position: fixed;
    top: 0;
    z-index: 9999;
    width: 100%;
    max-width: $max-width;
    max-height: 100%;
    overflow-y: auto;
  }
}

%messages {
  display: flex;
  margin-bottom: $base-spacing-size;
  padding: $half-spacing-size;
}

.messages-info {
  @extend %messages;
  background: $light-blue;
}

.messages-error {
  @extend %messages;
  background: $light-red;
}

.messages-message {
  flex: 1 100%;
}

.messages-close {
  flex: 1 20px;
}

.messages-close-button {
  cursor: pointer;
}

.message-title {
  margin-bottom: $half-spacing-size;
  
  &.is-info {
    color: $dark-blue;
  }
  
  &.is-error {
    color: $red;
  }
}

//admin

.admin-tabs {
  @extend %tabs;
  margin-bottom: $base-spacing-size;
}

.statistics-box {
  @include span-columns(1);
  @include omega(4n);
  word-wrap: break-word;
  padding: $half-spacing-size 0;
  margin-bottom: $base-spacing-size;
  background: $lightest-grey;
}

.statistics-title {
  text-align: center;
}

.statistics-count {
  text-align: center;
}

.new-category {
  margin-bottom: $base-spacing-size;
  
  @include media( $medium ) {
	text-align: right;
  }
}



  
/*
div.container {
  @include outer-container;
  
  div.element {
    @include span-columns(4);
	//styles

	@include media( $medium ) {
      @include span-columns(4);
	  //styles
    }
	
	@include media( $medium-only ) {
	  @include omega(2n);
	  //only for omega.
    }
	
	@include media( $large ) {
      @include span-columns(3);
	  //styles
	}
  }
  
  
}
*/
