@import "variables";

* {
    -webkit-font-smoothing: antialiased;
    text-shadow: rgba(0,0,0,.01) 0 0 1px;
    font-family: "Helvetica Neue","Myriad Set Pro","Lucida Grande","Helvetica","Arial","Verdana",sans-serif !important;
}

body.bananas {
  color: rgba(255, 255, 255, 0.8);

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

  #header {
      background-color: rgba(0, 0, 0, 0.2);
  }

  #branding h1 {
      padding: 0 15px;
  }

  #branding h1, #branding h1 a:link, #branding h1 a:visited {
      color: #fff;
  }

  div.breadcrumbs {
      background: rgba(0, 0, 0, 0.05);
      border-top: 0;
      border-bottom: 0;
      padding: 5px 15px;
      font-size: 1.1em;
  }

  h1 {
      color: rgba(255, 255, 255, 0.9);
      font-size: 2.2em;
      font-weight: normal;
      margin: 0 0 .5em 0;
  }

  #content-related .module h2 {
      background: rgba(0, 0, 0, 0.1);
      color: #fff;
  }

  #content-related h3 {
      color: rgba(255, 255, 255, 0.8);
  }

  .module {
      border: 0;
      background: transparent !important;
      margin-bottom: 15px;
  }

  .module h2, .module caption, .inline-group h2 {
      background: rgba(0, 0, 0, 0.1);
      padding: 10px 12px;
      font-size: 1.2em;
      font-weight: normal;
//      text-transform: uppercase;
    a {
      color: rgba(255, 255, 255, 0.9);

      &:hover {
        text-decoration: none;
      }
    }
  }

  .form-row {
      border-bottom: 0;
      /*border-bottom: 1px solid rgba(255, 255, 255, 0.1);*/
  }

  .form-row:last-child {
      /*border-bottom: 1px solid transparent;*/
  }

  label {
      font-size: 1.3em;
      color: rgba(255, 255, 255, 0.5) !important;
  }

  .required label, label.required {
      font-weight: normal !important;
      /*font-size: 1.2em;*/
      color: rgba(255, 255, 255, 0.75) !important;
  }

  .submit-row {
      background: transparent;
      border: 0;
  }

  /*** Form ***/

  .button, input[type=submit], input[type=button], .submit-row input, a.button {
      background: rgba(255, 255, 255, 0.2);
      color: #fff;
      padding: 0 15px;
      height: 35px;
      line-height: 35px;
      border: 0;
      border-radius: 3px;
      cursor: pointer;
      font-size: 1.2em;
  }
  .button:hover, input[type=submit]:hover, input[type=button]:hover, .submit-row input:hover, a.button:hover {
      background: rgba(255, 255, 255, 0.1);
  }

  .button.default, input[type=submit].default, .submit-row input.default {
      border: 0;
      background: #7CA0A7;
  }

  .button.default:hover, input[type=submit].default:hover, .submit-row input.default:hover {
      background: #4c7483;
  }


  input[type=text], input[type=password], input[type=email], input[type=url], input[type=number], textarea, select, .vTextField {
      border-radius: 2px;
      /*border: 0;*/
      border: 1px solid rgba(255, 255, 255, 0.2);
      background: rgba(0, 0, 0, 0.1);
      color: rgba(255, 255, 255, 0.8);

      font-size: 1.2em;
      padding: 5px 10px;
  }

  /*** Table ***/

  td, th {
      border-bottom: 1px solid rgba(255, 255, 255, 0.1);
      font-size: 1.2em;
      padding: 8px;
      color: rgba(255, 255, 255, 0.8);
      font-family: "Helvetica Neue","Myriad Set Pro","Lucida Grande","Helvetica","Arial","Verdana",sans-serif !important;
  }

  tbody tr:hover {
      background: rgba(0, 0, 0, 0.1);
  }

  tbody tr:last-child td, tbody tr:last-child th {
      border-bottom: 0;
  }

  thead th {
      border-bottom: 2px solid rgba(255, 255, 255, 0.1);
      padding: 8px;
  }

  thead th, tfoot td {
      background: transparent;
      border-left: 0;
      font-size: 1.2em;
      color: rgba(255, 255, 255, 0.8);
  }

  thead th.sorted {
      background: transparent;
      font-style: italic;
  }

  table thead th.sortable:hover {
      background: transparent;
  }

  thead th a:link, thead th a:visited {
      color: rgba(255, 255, 255, 0.8);
  }

  table thead th .text a:hover {
      color: #76CFF5;
      text-decoration: none;
  }

  .row1 {
      /*background: rgba(0, 0, 0, 0.1);*/
      background: transparent;
  }

  .row2 {
      background: transparent;
  }

  #changelist table thead th {
      padding: 8px 3px;
  }

  #changelist table tbody td:first-child, #changelist table tbody th:first-child {
      border-right: 0;
  }

  #changelist table tbody td, #changelist table tbody th {
      border-left: 0;
  }

  #changelist table tbody tr.selected {
      background-color: rgba(0, 0, 0, 0.2);
  }

  /*** Inlines ***/

  .inline-group {
      border: 0;
  }

  .inline-related fieldset {
      background: transparent;
  }

  fieldset table {
      border: 0;
  }

  .inline-group div.add-row, .inline-group .tabular tr.add-row td {
      background: transparent;
  }

  .inline-group .tabular fieldset.module {
      border-bottom: 0;
  }

  /*** Login ***/
  &.login #container {
      background-color: rgba(0, 0, 0, 0.2);
      border: 0;
  }

  #content {
      /*background-color: ;*/
  }

  /** Messages **/
  ul.messagelist li {
      background: rgba(0, 0, 0, 0.3);
      border-top: 1px solid rgba(0, 0, 0, 0.1);
      border-bottom: 0;
      padding: 10px 15px;
      font-weight: normal;
  }

  ul.messagelist li.success {
      color: #9c9;
      background: rgba(0, 30, 0, 0.3);
  }

  .errornote {
      border: 0;
      color: #c66;
      background: rgba(30, 0, 0, 0.3);
      margin-top: 10px;
      padding: 10px 12px;
      font-weight: normal;
  }

  .form-row.errors {
      border: 0;
  }

  .errors, .form-row.errors {
      background: transparent;
  }

  ul.errorlist {
      color: #c66;
      background: rgba(30, 0, 0, 0.3);
      margin: 0 -10px 4px !important;
  }

  ul.errorlist li {
      padding: 8px 10px;
  }

  /*** Icons ***/

  img[src*="icon-yes"],
  img[src*="icon-no"] {
      background: #fff;
      border-radius: 10px;
      padding: 1px;
  }

  /*** Dashboard ***/

  &.dashboard {
    #content {
        width: auto;
        margin-top: 15px;
    }

    #content h1 {
        display: none;
    }

    #content .module table {
        width: 100%;
    }

    #content .module tbody tr {
        display: block;
        width: 200px;
        float: left;
        margin: 15px 15px 0 0;
        border-radius: 3px;
    }

    #content .module tbody th,
    #content .module tbody td {
        padding: 0;
        border: 0;
    }

    #content .module tbody th {
        background: rgba(0, 0, 0, 0.2);
        display: block;
    }

    #content .module tbody th a {
        display: block;
        line-height: 100px;
        text-align: center;
        font-size: 2.2em;
        font-weight: 200;
    }
    #content .module tbody th a:hover {
        background: rgba(0, 0, 0, 0.1);
        text-decoration: none;
    }

    #content .module tbody td {
        background: rgba(0, 0, 0, 0.1);
        display: block;
        float: left;
        width: 50%;
        margin-top: 1px;
        text-align: center;
    }

    #content .module tbody td a {
        padding: 10px 0;
        background: none;
        color: #fff;
    }

    #content .module tbody td a:hover {
        background: rgba(0, 0, 0, 0.1);
        text-decoration: none;
    }
  }

}

@import "changelist";
