@import url(//fonts.googleapis.com/css?family=Source+Sans+Pro:400,600,700&subset=latin,latin-ext)
$skinTextColor: #1e2a33 !default
$skinTextActiveColor: #fff !default
$skinTextTable: #7f8c8d !default
// $skinActiveColor: #e73c3c !default
$skinActiveColor: #eda600 !default
$skinHeaderBck: #1e2a33 !default
$panelHeaderBck: #2c3e50 !default
$skinLogo: #fff image-url("active_skin/default_logo.png") no-repeat 30px 0 !default

html
  background: #ecf0f1
  font-family: 'Source Sans Pro', sans-serif
  height: 100%
  min-height: 100%

  body.active_admin
    background: #ecf0f1
    font-family: 'Source Sans Pro', sans-serif
    padding-bottom: 80px

  #header
    background: #ecf0f1
    border: none
    text-shadow: none
    // height: 40px

    margin-top: -2px
    padding: 0
    h1.site_title
      background-color: #fff
      background: $skinLogo
      // padding-left: 130px
      color: $skinTextColor
      // text-indent: -999999px

    a, a:link
      color: $skinTextColor
    ul.tabs
      padding: 0
      font-size: 0

    ul.tabs > li:hover > a, ul.tabs > li.current > a
      color: $skinTextActiveColor
      background: $skinActiveColor
      border-radius: 0 !important
      margin: -10px 0
      display: block

    ul.tabs > li 
      font-size: 12px
      margin: 0
      a
        // padding: 13px 20px
        display: block
        padding: 6px 20px
        margin: 0
    ul.tabs > li.has_nested a
      background-position: 93% 50%
      padding-right: 30px
    ul.tabs > li.has_nested:hover
      a
        border-radius: 0 !important
        background-color: $skinActiveColor
        border: none
        background-position: 93% 50%
      ul
        background: $skinActiveColor
        box-shadow: none !important
        border-radius: 0 !important
        border: none
        li a
          color: #fff
          &:hover
            color: $skinTextColor
    ul.tabs > li.has_nested.current a
      background-color: $skinActiveColor
      background-position: 93% 50%
      padding-right: 30px

    #utility_nav
      background: #fff
      padding: 0
      li#logout a
        font-weight: bold
        text-decoration: underline
        &:hover
          text-decoration: none
      li a
        &:hover
          background: none
          color: $skinTextColor

  #utility_nav
    li
      display: block !important
      height: 29px !important
      width: 120px !important
      text-align: left !important
      padding: 0 0 0 10px !important
      overflow: hidden
      &:hover
        margin: 0 !important
        padding: 0 0 0 10px !important
        a
          margin: 0 !important
          background: none !important
          color: $skinActiveColor !important
      &#logout
        padding-bottom: 4px !important

  .panel
    background: #fff
    border: 1px solid #d3d8dc
    position: relative
    box-shadow: none
    border-radius: 0
    > h3
      background: #f0f4f5
      color: $panelHeaderBck
      padding: 8px 15px
      box-shadow: 0
      border-radius: 0
      text-shadow: none
      font-weight: bold
      border-style: none none solid
  
  #title_bar
    background: $skinHeaderBck
    text-shadow: none
    border: none
    padding: 15px 30px
    box-shadow: none
    border-bottom: 4px solid $skinActiveColor
    margin: 0
    h2
      color: #fff
    .action_items a
      border-radius: 0 !important
      background: $skinActiveColor !important
      color: #fff !important
      box-shadow: none !important
      text-shadow: none !important
      border: none !important
      padding: 17px
      font-size: 14px
      &:hover
        background: lighten( $skinActiveColor, 10% ) !important

  table.index_table
    border: 1px solid #d3d8dc
    background: #fff
    th
      background: #f1f5f6
      border: 1px #d3d8dc
      border-style: none solid solid none
      padding: 7px 10px
      box-shadow: none
      color: $skinTextColor
      a, a:link, a:visited
        color: $skinTextColor
      &:last-child
        border-right: none
    td
      color: $skinTextTable
      a, a:link, a:visited
        color: $skinTextTable
        display: inline-block
        padding: 2px 3px
        margin: -2px 0
        &:hover
          color: #fff
          background: $skinActiveColor
    tr.even td
      background: #ecf0f1

  #active_admin_content
    &::after
      clear: both
      content: ""
      display: table

    .table_tools
      height: 30px
    a.table_tools_button, .table_tools .dropdown_menu_button
      border-radius: 0
      box-shadow: 0
      color: $skinTextColor
      background: #fff
      padding: 7px 10px !important
      font-weight: normal
      text-shadow: none
    a.table_tools_button:hover
      background-color: $skinActiveColor
      color: #fff
      .count
        color: #fff
    .table_tools_segmented_control li
      a
        border-radius: 0
        box-shadow: 0 1px 1px rgba(0,0,0,.1)
        color: $skinTextColor
        background: #fff
        padding: 7px 15px
        font-weight: normal
        text-shadow: none
        border-color: #d3d8dc
        span.count
          color: $skinActiveColor
      &.selected
        a
          color: #fff
          background-color: $skinActiveColor
          span.count
            color: #fff

  .download_links
    color: $skinTextTable
    font-size: 12px
    a
      color: $skinActiveColor
      font-weight: bold
  
  .pagination_information
    font-size: 12px
    color: $skinTextTable
  
  .pagination
    margin-top: -2px
    a, span.page.current
      font-family: 'Source Sans Pro', sans-serif
      border: 1px solid #d3d8dc
      background: #ecf0f1
      box-shadow: none !important
      text-shadow: none
      font-size: 12px
      font-weight: normal
      padding: 4px 6px
      margin-right: 1px
    span.page.current,
    a:not(.disabled):hover
      background: $skinActiveColor
      color: #fff
    span.page.current
      font-weight: 600
    span.page.current:not(.disabled):hover
      background: $skinActiveColor
    .page.gap
      display: none

  .sidebar_section.panel
    background: #fff
    border: 1px solid #d3d8dc
    box-shadow: none
    border-radius: 0
    form .buttons
      background: #f1f5f6
      margin: 25px -15px -15px
      padding: 10px 15px
    form fieldset
      margin-bottom: 0
    & > h3
      background: $panelHeaderBck
      color: #fff
      border: none
      margin: 0
      padding: 8px 15px
      box-shadow: none
    border-radius: 0
      text-shadow: none
      font-weight: bold
    .filter_form_field
      label 
        color: #95a5a6
        font-weight: normal
        font-size: 13px
        text-transform: uppercase
        font-family: 'Source Sans Pro', sans-serif
        padding: 7px 0

  .attributes_table table th, .attributes_table table td
    padding: 10px
    font-family: 'Source Sans Pro', sans-serif
    color: #95a5a6
  .panel_contents table th, .attributes_table table th
    font-weight: normal
    font-size: 13px
    text-transform: uppercase

  #footer
    position: fixed
    bottom: 0
    left: 0
    right: 0
    background: #fff
    padding: 15px 30px
    font-size: 13px
    color: $skinTextTable
    border-top: 1px solid #d3d8dc
    p
      margin: 0
      padding: 0

  form input[type=submit],
  a.button, 
  a:link.button, 
  a:visited.button
    box-shadow: none
    border-radius: 0
    background: $skinActiveColor
    color: #fff
    border: none
    text-shadow: none
    padding: 11px 15px
    &:hover
      background: lighten( $skinActiveColor, 10% ) !important
  form fieldset.buttons li.cancel a, 
  form fieldset.actions li.cancel a, 
  form.filter_form a.clear_filters_btn
    background: #ecf0f1
    box-shadow: none
    border-radius: 0
    text-shadow: none
    padding: 10px 20px
    color: #95a5a6
    &:hover
      background: lighten( #ecf0f1, 5% ) !important

  form fieldset.inputs
    background: #fff
    border: 1px solid #d3d8dc
    position: relative
    padding-top: 50px
    box-shadow: none !important
    border-radius: 0 !important
    > legend
      border-bottom: 1px solid #d3d8dc
      position: absolute
      top: 0
      span
        background: #f0f4f5
        color: $panelHeaderBck
        border: none
        margin: 0
        padding: 8px 15px
        box-shadow: none !important
        border-radius: 0 !important
        text-shadow: none
        font-weight: bold
    ol > li
      label
        padding-top: 7px
        text-transform: uppercase
      &.boolean label
        padding-top: 0px
        margin-bottom: 15px

  input[type=text],
  input[type=password],
  input[type=email],
  input[type=date],
  input[type=tel],
  input[type=number],
  button
    height: 20px !important
    border-radius: 0

  $width-list: 50 60 70 75 80 85 90
  @each $width in $width-list
    .block-#{$width}
      float: none
      width: #{$width}% !important
      display: block
      margin: 0 auto
      overflow: hidden

  form input[type=text], 
  form input[type=password], 
  form input[type=email], 
  form input[type=number], 
  form input[type=url], 
  form input[type=tel], 
  form textarea
    border-radius: 0
    font-family: 'Source Sans Pro', sans-serif

  form.filter_form .filter_form_field.filter_date_range input[type=text]
    background-position: 100% 4px

  body.logged_in 
    .flashes 
      .flash
        position: inherit
        top: 0
        text-shadow: none

  strong, b
    font-weight: 600

  .blank_slate_container .blank_slate
    color: #7f8c8d

  .comments form.active_admin_comment
    margin: 0
    .actions
      margin-bottom: 0
    fieldset.inputs
      border: none
      li
        margin-bottom: 0 !important
      textarea
        width: 95%
  
  body.logged_out
    height: 100%
    #footer
      display: none
    #content_wrapper 
      margin-top: 150px
      #active_admin_content
        padding-bottom: 0
    #login
      form fieldset
        border: none
      > h2
        background: $panelHeaderBck
        font-family: 'Source Sans Pro', sans-serif
        color: #fff
        box-shadow: none !important
        border-radius: 0 !important
        padding: 8px 15px
      fieldset.actions
        background: #f1f5f6
        margin: 0 -30px -17px
        padding: 6px 30px
      a
        margin-top: -25px

    .flash
      background: #F2ECBF
      position: absolute
      top: 0
      left: 0
      right: 0
      padding: 15px 
      border-bottom: 1px solid #DEDE8B
      text-shadow: none

  .sidebar_section
    ul
      margin-bottom: 0