// Table of Contents
//
// 01. Global styles
// 02. Sidebar
// 03. List elements
// 04. Stats
// 05. Management
// 06. Polls
//

// 01. Global styles
// -----------------

$admin-color: #CF3638;

body.admin {

  header {
    border: 0;

    .top-links {
      background: darken($admin-color, 15%);
    }

    .back-web {
      padding-top: $line-height/4;
      text-decoration: underline;
    }
  }

  .top-bar {
    background: $admin-color !important;
    height: auto;
  }

  .top-bar-title {

    h1 {
      margin-bottom: 0;
    }
  }

  form {

    .button {
      margin-top: 0;

      &.margin-top {
        margin-top: $line-height;
      }
    }

    input[type="text"], textarea {
      width: 100%;
    }

    .fieldset {

      select {
        height: $line-height*2;
      }

      .input-group input[type="text"] {
        border-radius: 0;
        margin-bottom: 0 !important;
      }
    }
  }

  table {

    th {
      text-align: left;

      &.text-center {
        text-align: center;
      }

      &.text-right {
        padding-right: $line-height;
        text-align: right;
      }

      &.with-button {
        line-height: $line-height*2;
      }
    }

    tr {
      background: white;
      border: 1px solid $border;

      &:hover {
        background: #f3f6f7;
      }
    }

    &.fixed {
      table-layout: fixed;
    }

    input[type="submit"] ~ a, a ~ a {
      margin-left: 0;
      margin-right: 0;
      margin-top: $line-height/2;

      @include breakpoint(medium) {
        margin-left: $line-height/2;
        margin-right: $line-height/2;
        margin-top: 0;
      }
    }
  }

  hr {
    max-width: none;
  }

  .menu.simple li.active {
    border-bottom: 2px solid $admin-color;
    color: $admin-color;
  }

  .tabs-panel {
    padding-left: 0;
    padding-right: 0;
  }

  #proposals {
    width: 100% !important;
  }

  .accordion-title {
    font-size: $base-font-size;
  }

  .button.secondary {
    margin-right: rem-calc(12);
  }

  .admin-content {

    .proposal-form {
      padding-top: 0;
    }

    .proposal-show {
      padding-top: rem-calc(54);
    }
  }

  .is-featured {
    margin-top: rem-calc(36);
  }

  .select-order {
    min-width: rem-calc(160);
  }
}

.for-print-only {
  display: none;
}

.admin-content {
  padding: $line-height !important;
}

@include breakpoint(medium) {

  tr {

    .on-hover-block {
      display: none;
    }

    &:hover .on-hover-block {
      display: block;
      margin: 0;
      margin-top: $line-height/2;
      width: 100%;
    }
  }
}

@include breakpoint(medium) {

  tr {

    .on-hover {
      display: none;
    }

    &:hover .on-hover {
      display: inline;
    }
  }
}

.input-group {

  .input-group-button {
    padding-bottom: rem-calc(16);
  }
}

// 02. Sidebar
// -----------

.admin-sidebar {
  border-right: 1px solid $border;

  @include breakpoint(medium) {
    min-height: rem-calc(1100);
  }

  ul {
    list-style-type: none;
    margin-bottom: 0;
    margin-left: 0;
    padding: 0;

    [class^="icon-"] {
      color: $admin-color;
      display: inline-block;
      font-size: rem-calc(24);
      line-height: $line-height;
      padding: $line-height/2 $line-height/4;
      padding-left: 0;
      vertical-align: middle;
    }

    li {
      background: white;
      margin: 0;
      outline: 0;

      ul {
        margin-left: $line-height/1.5;
        border-left: 1px solid $border;
        padding-left: $line-height/2;
      }

      &.section-title {
        border-bottom: 1px solid $border;
      }

      &.active a {
        background: #f3f6f7;
        border-radius: rem-calc(6);
        -moz-border-radius: rem-calc(6);
        -webkit-border-radius: rem-calc(6);
        color: $admin-color;
        font-weight: bold;
      }
    }

    li a {
      color: $text;
      display: block;
      line-height: rem-calc(48);
      padding-left: rem-calc(12);
      vertical-align: top;

      &:hover {
        background: #f3f6f7;
        border-radius: rem-calc(6);
        -moz-border-radius: rem-calc(6);
        -webkit-border-radius: rem-calc(6);
        color: $admin-color;
        text-decoration: none;
      }
    }
  }

  .is-accordion-submenu-parent {

    & > a::after {
      border-color: $admin-color transparent transparent;
    }
  }

  .submenu {
    border-bottom: 0;
    margin-left: $line-height;

    li:first-child {
      padding-top: $line-height/2;
    }

    li:last-child {
      padding-bottom: $line-height/2;
    }

    a {
      font-weight: normal;
    }
  }
}

// 03. List elements
// -----------------

.delete {
  border-bottom: 1px dotted #CF2A0E;
  color: $delete;
  font-size: $small-font-size;

  &:hover, &:active, &:focus {
    border-bottom: 1px dotted white;
    color: #cf2a0e;
  }
}

[class^="icon-"].delete {
  border: 0;
  font-size: $base-font-size;
}

.verified {
  color: $check;

  a {
    border-bottom: 1px dotted $check;
    color: $check;
    font-size: rem-calc(12);
  }
}

.archived {
  color: $text-medium;
  font-size: rem-calc(12);
}

.ignored {
  color: $text-medium;
  font-size: rem-calc(12);
}

.rejected {
  color: $delete;
}

.date {
  color: $text-medium;
  font-size: rem-calc(12);
  font-style: italic;
}

.official {
  background-color: #e7e7e7;
  border-radius: rem-calc(3);
  font-weight: normal;
  padding: rem-calc(6) rem-calc(12);
}

.button.small.success {
  margin-left: rem-calc(12);

  &.no-margin {
    margin-left: 0;
  }
}

.moderation-description {
  max-height: rem-calc(65);
  overflow: hidden;
  max-width: rem-calc(700);

  &:hover {
    max-height: rem-calc(1000);
    transition: max-height 0.9s;
    -moz-transition: max-height 0.9s;
    -webkit-transition: max-height 0.9s;
  }
}

// 04. Stats
// ---------

.stats {
  background: white;
}

.stats-numbers {
  p {
    color: $text-medium;
    font-size: rem-calc(13);
    padding: rem-calc(6);
    text-transform: uppercase;

    &.featured {
      background: $info-bg;
      border: 1px solid $info-border;
      font-weight: bold;
    }

    .number {
      color: $text;
      font-size: rem-calc(30);
      font-weight: bold;
    }
  }
}

// 05. Management
// --------------

.user-permissions {

  ul {
    list-style-type: none;
    margin-left: 0;

    li {
      font-size: rem-calc(14);
      margin-bottom: rem-calc(12);

      span {
        color: $text-medium;
        font-size: rem-calc(12);
      }

      .icon-check {
        color: $check;
      }

      .icon-x {
        color: $delete;
      }
    }
  }
}

.account-info, .login-as, .spending-proposal-info {
  background-color: #e7e7e7;
  border-radius: rem-calc(3);
  font-size: rem-calc(16);
  font-weight: normal;
  margin: $line-height;
  padding: $line-height/2;

  strong {
    font-size: rem-calc(18);
  }
}

.spending-proposal-info p {
  margin-bottom: 0;
}

body.admin {

  .investment-projects-list.medium-9 {
    width: 100%;
  }

  .investment-projects-summary {

    th, td {
      text-align: center;

      &:first-child {
        font-weight: bold;
        text-align: left;
      }

      &:last-child {
        font-weight: bold;
      }
    }

    tr {
      &:nth-child(even) td:last-child {
        background: $success-border;
      }

      &:nth-child(odd) td:last-child {
        background: $success-bg;
      }
    }
  }
}

.admin-content .select-geozone, .admin-content .select-heading {

  a {
    display: block;

    &.active {
      color: $brand;
      font-weight: bold;
      text-decoration: underline;
    }
  }
}

table.investment-projects-summary {

  td.total-price {
    white-space: nowrap;
  }
}

body.admin {

  .geozone {
    background: #ececec;
    border-radius: rem-calc(6);
    color: $text;
    display: inline-block;
    font-size: $small-font-size;
    margin-bottom: $line-height/3;
    padding: $line-height/4 $line-height/3;
    text-decoration: none;

    &:hover {
      background: #e0e0e0;
    }
  }
}

// 06. Polls
// -----------------

.count-error {
  background: $alert-bg !important;
  color: $color-alert;
  font-weight: bold;
}

table {

  .callout {
    height: $line-height*2;
    line-height: $line-height*2;
    padding: 0 $line-height/2;
  }
}

// 07. CMS
// --------------
.cms_page_list {

  [class^="icon-"] {
    padding-right: $menu-icon-spacing;
    vertical-align: middle;
  }
}