/* Active Admin CSS */

// Bring in all the shared goodness
@import "active_admin/mixins/all";

// Reset Away!
@include global-reset;

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

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;
  position: relative; 
  margin: 0; 
  padding: 10px $horizontal-page-margin; 

  h2 { 
    margin: 12px 0 5px 0; 
    padding: 0; 
    font-size: 2.6em;
    font-weight: bold;
  }

  .action_items { 
    position: absolute; 
    right: $horizontal-page-margin; 
    top: 28px;

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

// ----------------------------------- Main Structure 
#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: 270px; 
    margin-left: -270px; 
  }
}

// ----------------------------------- 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 {
  text-transform: uppercase;
  font-size: 0.9em;
  font-weight: normal;

  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; }

// ----------------------------------- Tables 
table {
  width: 100%;
  margin-bottom: 10px;
  border: 0;
  border-spacing: 0;


  th { 
    @include section-header;
    text-align: left;
    padding-left: $cell-horizontal-padding;
    padding-right: $cell-horizontal-padding;

    a, a:link, a:visited {
      color: $section-header-text-color;
      text-decoration: none;
      display: block;
    }

    &.sortable a {
      background: url('/images/active_admin/orderable.png') no-repeat 0 4px; padding-left: 13px;
    }

    &.sorted-asc a { background-position: 0 -27px; }
    &.sorted-desc a {  background-position: 0 -56px;}

    &.sorted-asc, &.sorted-desc {
      @include gradient(darken($secondary-gradient-start, 5%), darken($secondary-gradient-stop, 5%));
      border-bottom: 1px solid $secondary-gradient-stop;
    }
  }

  tr.even td { background: $table-stripe-color; }

  td {
    padding: 10px $cell-horizontal-padding 8px $cell-horizontal-padding;
    border-bottom: 1px solid #e8e8e8;
    vertical-align: top;
  }
}

// ----------------------------------- Tables inside Panels

.panel_contents table {
  margin-top: 5px;
  th { 
    padding-top: 10px;
    background: none;
    color: $primary-color;
    @include no-shadow;
    @include text-shadow;
    text-transform: uppercase;
    border-bottom: 1px solid #ccc;
  }
  tr.odd td { background: darken($table-stripe-color, 3%); }
  tr.even td { background: $table-stripe-color; }
}

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

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

.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;}


// -------------------------------------- Filter Forms 
form {
  .buttons { 
    margin-top: 15px; 
    input[type=submit] { margin-right: 10px; }
  }
  .filter_form_field {
    margin-bottom: 10px; 
    clear: both;


    label {
      display: block;
      text-transform: uppercase;
      color: $section-header-text-color;
      font-size: 0.9em;
      font-weight: bold;
    }
    .datepicker { width: 80px; }
    &.filter_numeric { input[type=text] { width: 80px; margin-left: 5px; } }
    &.filter_check_boxes {
      label { margin-bottom: 3px; }
      .check_boxes_wrapper label { 
        font-weight: normal; 
        margin-bottom: 3px;
        text-transform: none;
        font-size: 1.0em;
        input { vertical-align: baseline; }
      }
    }
  }
  a.clear_filters_btn { @include light-button; }
}


// -------------------------------------- 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;
  }

  .flash { 
    @include no-shadow;
    @include text-shadow(#fff);
    padding: 0; 
    color: #666;
    background: none;
  }

  #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; }
  }

}

// -------------------------------------- Date Picker 
.ui-datepicker {
  @include primary-gradient;
  padding: 5px 5px 0 5px;
  color: #fff;
  display: none;
  a { 
    color: #fff;
    text-decoration: none;
    &:hover {
      cursor: pointer;
    }
    &.ui-datepicker-prev { float: left; }
    &.ui-datepicker-next { float: right; }
  }
  .ui-datepicker-title { text-align: center; display: block;}
  table {
    td, th { padding: 1px 3px; }
    td { border: none; }
  }
}

// -------------------------------------- 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;
    background: none;
    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; }
}