////////////////////////////////////////////
//
//  Configuration
//
////////////////////////////////////////////

$stub-hover: #FAFAFA;
$stub-pinned: #F1F1F1;


////////////////////////////////////////////
//
//  Mixins & Animations
//
////////////////////////////////////////////

@mixin prefixer($prefix, $content) {
  -webkit-#{$prefix}: #{$content};
     -moz-#{$prefix}: #{$content};
          #{$prefix}: #{$content};
}
@mixin clear {
  &::after {
    clear: both;
    content: "";
    display: table;
  }
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
  30% {
    -webkit-transform: scale3d(1.4, 1.4, 1.4);
            transform: scale3d(1.4, 1.4, 1.4);
  }
  60% {
    -webkit-transform: scale3d(.8, .8, .8);
            transform: scale3d(.8, .8, .8);
  }
  100% {
    -webkit-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}
@keyframes pulse {
  0% {
    -webkit-transform: scale3d(1, 1, 1);
        -ms-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
  30% {
    -webkit-transform: scale3d(1.4, 1.4, 1.4);
        -ms-transform: scale3d(1.4, 1.4, 1.4);
            transform: scale3d(1.4, 1.4, 1.4);
  }
  60% {
    -webkit-transform: scale3d(.8, .8, .8);
        -ms-transform: scale3d(.8, .8, .8);
            transform: scale3d(.8, .8, .8);
  }
  100% {
    -webkit-transform: scale3d(1, 1, 1);
        -ms-transform: scale3d(1, 1, 1);
            transform: scale3d(1, 1, 1);
  }
}


////////////////////////////////////////////
//
//  Post Stub
//
////////////////////////////////////////////

.stub {
    cursor: move;
    padding: 10px;
    background: #FFF;
    margin: 0 1px 1px;
    box-shadow: 0 1px 1px rgba(0, 0, 0, .1);
    @include prefixer(transition, .2s background);
    @include clear;
    min-height: 72px;
    a {
        text-decoration: none;
    }

    .post-thumb {
        float: right;
        margin-right: 10px;
        margin-left:10px;
    }

    .stub-action {
        display: inline-block;
        padding: 10px 10px 10px 5px;
        opacity: .1;
        margin-bottom: 25px;
        @include prefixer(transition, .2s opacity);


        &.pin-unpin {
            float: left;
        }
        &.remove {
            float: right;
            opacity: 0;
        }
    }

    .date {
        color: #AAA;
        border: 0;
    }
    .row-actions {
        opacity: 0;
        display: inline;
        visibility: visible;
        @include prefixer(transition, .2s opacity);
    }

    &:hover {
        background: $stub-hover;
        .row-actions {
            opacity: 1;
        }
        .stub-action {
            opacity: .5;
        }
    }

    &.pinned {
        box-shadow: none;

        &:hover {
            background: darken($stub-pinned, 3%);
        }
        .pin-unpin {
            opacity: 1;
            color: #D54E21;
            &.animating {
                -webkit-animation: pulse .5s ease-out;
                animation: pulse .5s ease-out;
            }
        }
    }
    &.ui-sortable-helper {
        box-shadow: 0 2px 10px rgba(0, 0, 0, .1);
        opacity: .9;
    }
    &.inserted {
        background: #FBF0C0;
    }
    &.removed {
        background: #FBCFCA !important;
    }
}


////////////////////////////////////////////
//
//  Stream Queue UI
//
////////////////////////////////////////////

.sm-alert {
  display: none;
  cursor: pointer;
  padding: 8px 12px;
  background: #1E8CBE;
  color: #FFF;
  font-weight: bold;
}


////////////////////////////////////////////
//
//  Search
//
////////////////////////////////////////////

.sm-add {

  .sm-search-container {
    position: relative;
  }

  .sm-search {
    display: block;
    width: 100%;
    padding: 10px 14px;
    margin: 0;
  }

  .sm-results {
    padding: 5px 0;
    margin: 0;
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 100;
    background: #FFF;
    border-radius: 0 0 4px 4px;
    box-shadow: 0 3px 7px rgba(0, 0, 0, .1);

    li {
      margin: 0;
    }

    .sm-result {
      text-decoration: none;
      display: block;
      padding: 6px 15px;

      &.active {
        background: #0074A2;
        color: #FFF;
      }
    }

    .sm-result-date {
      font-size: 11px;
      opacity: .5;
      margin-left: 5px;
    }
  }
}


////////////////////////////////////////////
//
//  Layouts & Zones
//
////////////////////////////////////////////

.zone {
    margin: 0;
    box-shadow: none;
    min-height: 0;
    display:block;
    background: transparent;
    .stub-action {
        margin-bottom: 0px;
    }
    .zone-header {
        border-width: 0;
        background: transparent;
        box-shadow: none;
        margin: 6px 1px;

        &:focus {
        background: #FFF;
        border-width: 1px;
        margin: 5px 0;
        }
    }

    h3 {
        margin: 0;
    }
}

.add-layout-container,
.add-zone-container {
  display: none;
}



// Override WordPress edit page styles
#stream_box_stream {
  background: transparent;
  border: 0;
  @include prefixer(box-shadow, none);

  > .handlediv,
  > .hndle {
    display: none;
  }

  > .inside {
    margin: 0;
    padding: 0;

    > .sm-posts {
      border: 0;
    }
  }
}
.post-type-sm_stream {
  #title {
    position: relative;
    z-index: 1;
  }
}
.misc-pub-visibility,
.misc-pub-curtime {
  display: none;
}
#misc-publishing-actions {
  padding-bottom: 15px;
}