html, body#comfy, body#rmails
  height: 100%

body#comfy, body#rmails
  background-color: #252525

  // -- Containers ----------------------------------------------------------
  .body-wrapper
    height: 100%
    .left-column
      width: 175px
      float: left
      .left-column-content
        padding: 25px 0px
        width: 175px
        position: fixed
    .center-column
      position: relative
      margin: 0px 250px 0px 175px
      min-height: 100%
      background-color: #e6e6e6
      .center-column-content
        padding: 25px
    .right-column
      width: 250px
      float: right
      .right-column-content
        padding: 25px 10px
        width: 250px
        position: fixed

  // -- Navigation ----------------------------------------------------------
  .left-column-content ul.navigation
    list-style: none
    margin: 0
    a
      position: relative
      display: block
      padding: 7px 15px
      color: #777
      border-bottom: 1px solid #1a1a1a
      text-decoration: none
    a:hover, a.active
      color: #ddd
    a.active
      background-color: #1f1f1f
      box-shadow: inset 0px 0px 10px #000
    a.active:after
      position: absolute
      top: 10px
      right: -8px
      z-index: 9999
      content: ''
      display: block
      height: 16px
      width: 8px
      background: transparent image-url("nav_arrow.png")

  // -- Right Side Boxes ----------------------------------------------------
  .right-column-content
    .box
      background-color: #fff
      padding: 5px
      border-radius: 3px
      margin-bottom: 10px
      overflow: auto
    #mirrors select
      margin-bottom: 0
    #form-save
      label
        padding-top: 0

  // -- Common Elements -----------------------------------------------------
  table.table, ul.list
    .icon
      width: 28px
      height: 28px
      background: image-url("icon_page.gif")
      .dragger
        width: 28px
        height: 28px
        background: image-url("icon_move.gif")
        cursor: move
        display: none
        span
          display: none
      &:hover .dragger
        display: block
    .category
      display: inline-block
      vertical-align: top
      font-size: 11px
      line-height: 11px
      border: 1px solid #ddd
      padding: 2px 5px
      background-color: #fff
      border-radius: 3px
      border-left-width: 7px
  .item-title
    color: #000
    a
      color: #000
  .item-meta
    font-size: 11px
    line-height: 14px

  // -- Categories Widget ---------------------------------------------------
  .categories-widget
    background: #f5f5f5
    border-radius: 3px
    border: 1px solid #ddd
    padding: 5px 10px
    margin-bottom: 10px
    .categories-widget-label
      width: 100px
      float: left
      color: #777
    .categories
      overflow: hidden
      margin: 0px 50px 0px 110px
      &.editable
        display: none
      .category
        display: inline-block
        font-size: 11px
        line-height: 20px
        border-radius: 3px
        background-color: #fff
        padding: 0 7px
        border: 1px solid #eee
        &.active
          border-color: #a5a5a5
      form
        display: inline-block
        vertical-align: middle
    .action-links
      float: right
      margin-left: 10px
      .done
        display: none
    form
      margin: 0
      .input-append
        margin: 0
        input[type=text]
          width: 125px
          font-size: 11px
          line-height: 14px
          padding: 3px

  // -- Sortable List -------------------------------------------------------
  ul.list
    margin: 1em 0 0
    list-style: none
    .item
      overflow: hidden
      padding: 5px
      border-radius: 3px
      margin-bottom: 5px
      background-color: #f1f1f1
      &:hover
        background-color: #f5f5f5
      .toggle
        float: left
        height: 28px
        width: 28px
        &.open a
          background-image: image-url("arrow_bottom.gif")
        a
          display: block
          height: 28px
          width: 28px
          background: image-url("arrow_right.gif") center center no-repeat
          span
            display: none
      .icon
        float: left
        width: 28px
        height: 28px
        &.draft
          background: image-url("icon_draft.gif") left top no-repeat
        &.atsign
          background: image-url("at-sign.png") left top no-repeat
      .item-content
        margin-left: 32px
        a.item-label
          color: #1c2733
          font-size: 15px
          font-weight: 700
        .label
          opacity: 0.7
          &:hover
            opacity: 1
      .btn-group
        float: right
    li ul
      list-style: none
      margin: 0 0 0 28px

  // -- Sites ---------------------------------------------------------------
  &.c-cms-admin-sites
    table .icon
      background: image-url("icon_site.gif")

  // -- Layouts -------------------------------------------------------------
  &.c-cms-admin-layouts
    ul.list
      .item
        .icon
          background: image-url("icon_layout.gif")
        .item-content
          margin-left: 35px

  // -- Pages ---------------------------------------------------------------
  &.c-cms-admin-pages
    #form-blocks
      ul.nav-tabs
        margin-left: 180px
      .no-tags
        margin-left: 180px
        text-align: center
        padding: 10px
        background-color: #f5f5f5
        margin-bottom: 10px
      .files
        margin: 5px 0
        .file
          display: inline-block
          border: 1px solid #ccc
          border-radius: 3px
          padding: 0 5px
          margin-bottom: 5px
          font-size: 12px

  // -- Snippets ------------------------------------------------------------
  &.c-cms-admin-snippets
    table .icon
      background: image-url("icon_snippet.gif")