/* Active Admin CSS */


// Reset Away!
@include global-reset;

// Partials
@import "active_admin/typography";
@import "active_admin/header";
@import "active_admin/forms";
@import "active_admin/components/comments";
@import "active_admin/components/flash_messages";
@import "active_admin/components/date_picker";
@import "active_admin/components/tables";

body {
  font-family: Helvetica, Arial, sans-serif;
  line-height: 150%;
  font-size: 72%;
  background: #fff;
  margin: 0;
  padding: 0;
  color: $text-color;
}

// ----------------------------------- Page Title Bar 
#title_bar {
  @include section-header;
  @include clearfix;
  @include box-sizing(border-box);
  display: table;
  width: 100%;
  position: relative; 
  margin: 0; 
  padding: 10px $horizontal-page-margin; 

  #titlebar_left, #titlebar_right {
    height: 50px;
    vertical-align: middle;
    display: table-cell;
  }
  
  #titlebar_right {
    text-align: right;
  }
  
  h2 { 
    margin: 0;
    padding: 0; 
    font-size: 2.6em;
    font-weight: bold;
  }

  .action_items { 
    a { 
      @include light-button; 
      @include icon(#777, 0.8em); 
      @include gradient(#f9f9f9, #dddbdb);
      display: inline-block;
      padding: .8em 1.5em .7em 1.5em;
      border: 1px solid #f8f8f8;
      span.icon { vertical-align: bottom; margin-right: 4px;} 
      &:hover{ @include icon-color(#000); }
    }
  }
}

// ----------------------------------- Main Structure

#wrapper {
  display: table;
  width: 100%;
}

#active_admin_content { 
  margin: 0; 
  padding: 25px $horizontal-page-margin; 
  
  #main_content_wrapper { 
    float: left; 
    width: 100%; 

    #main_content{ 
      margin-right: 300px; 
    }
  }

  &.without_sidebar #main_content_wrapper #main_content{ margin-right: 0; }

  #sidebar { 
    float: left; 
    width: $sidebar-width; 
    margin-left: -$sidebar-width;
  }
}

// ----------------------------------- Footer 
#footer {
  padding: 30px 30px;  
  font-size: 0.8em; 
  clear: both; 

  p { 
    padding-top: 10px
  }
}

// ----------------------------------- Links 
a, a:link, a:visited {
  color: $link-color;
  text-decoration: underline;
}
a:hover { text-decoration: none; }

// ----------------------------------- Buttons 

td, p {
  @include icon(#B3BCC1, 0.8em);
  span.icon { margin: 0 3px; }
}

a.member_link {
  margin-right: 7px;
  white-space: nowrap;
}

a.button, input[type=submit] { @include dark-button; }

// ----------------------------------- Breadcrumbs 
.breadcrumb {
  display: block;
  font-size: 0.9em;
  font-weight: normal;
  line-height: 1.0em;
  margin-bottom: 12px;
  text-transform: uppercase;

  a, a:link {
    color: #8a949e ;
    text-decoration: none;
  }

  a:hover { text-decoration: underline; }

  .breadcrumb_sep {
    margin: 0 2px;
    color: #aab2ba;
  }
}

// ----------------------------------- Sections & Panels
// Helper class to apply to elements to make them sections
.section, .panel{ @include section; }

// ----------------------------------- Blank Slate

.blank_slate_container {
  clear: both;
  text-align: center;
  
  .blank_slate {
    @include rounded;
    -webkit-font-smoothing: antialiased;
    border: 1px dashed #DADADA;
    color: #AAA;
    display: inline-block;
    font-size: 1.2em;
    font-weight: bold;
    padding: 14px 25px;
    text-align: center;
    
    small {
      display: block;
      font-size: 0.9em;
      font-weight: normal;
    }
  }
}

.admin_dashboard .blank_slate_container .blank_slate {
  margin-top: 40px;
  margin-bottom: 40px;
}

.with_sidebar .blank_slate_container .blank_slate {
  margin-top: 80px;
}

// ----------------------------------- Sidebar Sections 
.sidebar_section { @include section; }

// -------------------------------------- Pagination 
.pagination_information { 
  float: right;
  margin-bottom: 5px;
  font-size: 0.95em;
  color: #b3bcc1;
  b { color: #5c6469; }
}

.paginated_collection_contents { 
  clear: both;
}

.pagination { 
  display: inline; 
  font-size: 0.9; 
  margin-left: 10px; 

  a { @include light-button; }
  span.page.current { @include default-button; }
  a, span.page.current { 
    @include rounded(0px);
    margin-right: 4px; 
    padding: 2px 5px;
  }
  span.page.current { padding-left: 7px; }
}

// -------------------------------------- Index Footer (Under Table) 
#index_footer { padding-top: 5px; text-align: right; font-size: 0.85em; }



.index_content { clear: both; }

// -------------------------------------- Index as Grid 
table.index_grid td { border: none; background: none; padding: 0 20px 20px 0; margin: 0;}


// -------------------------------------- Logged Out 
body.logged_out {
  background: #e8e9ea;

  #content_wrapper{
    width: 500px;
    margin: 70px auto;
    #active_admin_content {
      @include shadow;
      background: #fff;
      padding: 13px 30px;
    }
  }

  h2 {
    @include section-header;
    @include primary-gradient;
    @include text-shadow(#000);
    color: #fff;
    margin: -13px -30px 20px -30px;
  }

  #login {
    /* Login Form */
    form {
      fieldset {
        @include no-shadow;
        background: none;
        padding: 0;
        li { padding: 10px 0; }

        input[type=text], input[type=email], input[type=password] {
          width: 70%;
        }
        &.buttons { margin-left: 20%; }
        margin-bottom: 0;
      }
    }

    a { float: right; margin-top: -32px; }
  }

}

// -------------------------------------- Dashboard 
table.dashboard {
  width: 100%; 
  td { border-bottom: none; }
  .dashboard_section { @include section; }
}


// -------------------------------------- Resource Attributes Table 
.attributes_table { overflow: hidden; }

.attributes_table table {
  th, td {
    padding: 8px $cell-horizontal-padding 6px $cell-horizontal-padding;
    vertical-align: top;
    border-bottom: 1px solid #e8e8e8; 
  }
  th {
    @include no-shadow;
    @include no-gradient;
    width: 150px;
    font-size: 0.9em;
    padding-left: 0;
    text-transform: uppercase;
    color: $primary-color;
    @include text-shadow;
  }
  td {
    .empty {
      color: #bbb;
      font-size: 0.8em;
      text-transform: uppercase;
      letter-spacing: 0.2em;
    }
  }
}

.sidebar_section .attributes_table th { width: 50px; }


// -------------------------------------- Status Tags
.status {
  background: darken($secondary-color, 15%);
  color: #fff;
  text-transform: uppercase;
  letter-spacing: 0.15em;
  padding: 3px 5px 2px 5px;
  font-size: 0.8em;

  &.ok, &.published, &.complete, &.completed, &.green { background: #8daa92; }
  &.warn, &.warning, &.orange { background: #e29b20; }
  &.error, &.errored, &.red { background: #d45f53; }


}


// -------------------------------------- Scopes
.scopes {
  float: left;
  margin-bottom: 10px;
  font-size: 1.0em;

  .scope {
    padding: 4px 8px 3px 8px;
    margin-right: 4px;
    a { text-decoration: none; font-weight: bold; color: #888; }
    a:hover { text-decoration: underline; ; }
    &.selected { 
      @include rounded(5px);
      @include inset-shadow(0,1px,0,#ccc);
      @include text-shadow;
      background: #efefef;
      color: #666;
      em { font-weight: bold; font-style: normal;  
      }
    }
    .count{ color: #aaa; font-size: 0.9em; }
  }
  .scopes_seperator { display: none; }
}

// -------------------------------------- Columns
.columns {
  clear: both;
  padding: 0;
  .column { float: left; }
}