@charset "UTF-8";

button.link {
  background: transparent;
  border: none;
}

.hideIfEmpty:empty {
  display: none;
}

.fueluxSelectHolder {
  position: relative; // fuelux
}

del, ul.deleted, ol.deleted, blockquote.deleted, pre.deleted, div.deleted, p.deleted {
  color: #880000;
  text-decoration: line-through;
}

ins, ul.inserted, ol.inserted, blockquote.inserted, pre.inserted, div.inserted, p.inserted {
  color: #008800;
  text-decoration: underline;
}

del.space, ins.space, del.formatting, ins.formatting {
  font-style: italic;
  font-size: 0.8em;
  display: inline-block;
  margin-left: 5px;
  margin-right: 5px;
}

.label {
  @extend label;
}

.toggle {
  .toggle-group {
    .btn {
      border: none;
    }
  }
}

.texteditorBox {
  min-height: 100px;
  border: 1px solid #ccc;
  border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  -webkit-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  -o-transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
  transition: border-color ease-in-out 0.15s, box-shadow ease-in-out 0.15s;
}

.texteditor {
  background-color: white;

  &.boxed {
    @extend .texteditorBox;
  }
  @include motionParagraphStd();
  &.fixedWidthFont {
    font-family: $motionFixedFont;
    //letter-spacing: -0.5px;
    color: $motionFixedFontColor;
  }

  > * {
    padding-bottom: 5px;
    padding-top: 5px;
    padding-left: $fixedWidthTextStdPadding - 40;
    margin-bottom: 5px;
  }
  > span:first-child {
    // Inserted by magic-line plugin of CKEditor
    padding: 0;
  }
  .appendHint:after {
    content: attr(data-append-hint);
    display: inline-block;
    font-size: 0.75em;
    bottom: -3px;
    position: relative;
  }

  .collidingParagraph.hovered {
    background-color: #eee;
  }

  > ul, ol {
    padding-left: $fixedWidthTextListPadding + $fixedWidthTextStdPadding - 40;
  }
  > blockquote {
    @include motionParagraphBlockquote;
    margin-left: $fixedWidthTextQuoteMargin + $fixedWidthTextStdPadding - 40;
  }
  span.underline {
    border-bottom: solid 1px black;
  }
  span.strike {
    text-decoration: line-through;
  }
  span.subscript {
    // @TODO
  }
  span.superscript {
    // @TODO
  }
}

#mainmenu {
  .nav > li {
    display: inline-block;
  }
  @media screen and (max-width: $screen-xs-max) {
    .container {
      padding-left: 0;
      padding-right: 0;
    }
    .navbar .nav li a {
      margin-left: 20px;
    }
  }
}

.deadlineCircle {
  float: right;
  width: 105px;
  height: 105px;
  padding-top: 20px;
  @include linear-gradient(90deg, $btn-primary-bg, lighten($btn-primary-bg, 3.5%));
  text-align: center;
  vertical-align: middle;
  overflow: hidden;
  font-family: $deadlineCircleFont;
  font-weight: bold;
  font-size: 15px;
  line-height: 17px;
  text-transform: uppercase;
  color: #fff;
  margin-left: 40px;
  @include border-radius(90px);
}

#agendaEditSavingHolder {
  text-align: center;
  margin-bottom: 15px;
}

.motionData {
  .motionDataTable {
    width: 100%;
    > tbody > tr > th {
      width: 30%;
    }

    .mergingDraft > * {
      padding-top: 15px;
    }
  }
  .tagAdderHolder:link, .tagAdderHolder:visited {
    color: green;
  }
  .delTagForm {
    display: inline;
    button {
      background: transparent;
      border: none;
      color: $colorDelLink;
      font-style: italic;
      padding: 0 6px 0 3px;
    }
  }
  > .content > .alert {
    margin-top: 20px;
  }
  .motionReplayedBy {
    a {
      font-weight: bold;
    }
  }
  .contactShow {
    font-size: 0.8em;
    margin-left: 15px;
  }
}

.wysiwyg-textarea {
  textarea {
    display: none;
  }
}

.search-form label {
  display: inline-block;
  width: 220px;
  vertical-align: top;
}

.cke_skin_kama {
  border: none !important;
}

#loginWurzelwerkHint, #loginSamlHint, .login_saml .privacyHint {
  border-left: solid 1px #808080;
  padding-left: 10px;
  margin-left: 20px;
  margin-top: 10px;
  font-size: 0.8em;
  overflow: auto;
}

.login_saml {
  .privacyHint {
    border-left: solid 1px #808080;
    padding-left: 10px;
    margin-left: 20px;
    margin-top: 0;
    font-size: 0.8em;
    overflow: auto;
  }
  .btn {
    float: left;
    margin-right: 30px;
  }
}

#loginWurzelwerkForgot {
  font-size: 0.8em;
  margin-top: -7px;
  display: inline-block;
  margin-bottom: 10px;
}

#loginUsername {
  .passwordRecovery {
    text-align: right;
    font-size: 0.8em;
  }
}

.motionEditForm {
  .maxLenHint {
    float: right;
    margin-top: 7px;
    font-size: 0.8em;
    margin-right: 3px;

    span.icon {
      color: gray;
    }
    span.counter {
      display: inline-block;
      width: 23px;
      text-align: right;
    }
  }
  .submitHolder {
    text-align: right;
  }
  .editorialGlobalBar {
    background-color: #f7f7f7;
    border-bottom: solid 1px #ccc;
    padding: 0 20px;
    font-size: 13px;

    label {
      display: inline-block;
      width: 50%;
      padding: 5px 0;
      margin: 0;
      font-weight: normal;
      color: #777;
      &:last-child {
        text-align: right;
      }
    }
    input {
      margin-right: 5px;
    }
  }
  .modifiedActions {
    text-align: right;
  }
  .single-paragraph {
    .modifiedActions {
      display: none;
    }
    &.modified {
      background-color: #eee;
      .modifiedActions {
        display: block;
      }
    }
    &.modifyable {
      cursor: pointer;
      &:hover {
        background-color: #f4f4f4;
        > .texteditor {
          background-color: transparent;
        }
      }
    }
  }
}

.supporterFormStd {

  .supporterData {
    .fullTextAdder {
      float: right;
    }

    #fullTextHolder {
      margin-top: 30px;
    }
  }

  .initiatorData {
    .contact-head {
      margin-top: 20px;
      margin-bottom: 10px;
      h3 {
        font-size: 18px;
        margin: 0;
      }
      .hint {
        font-size: 12px;
      }
    }

    .only-person, .only-organization {
      display: none;
    }
    &.type-person .only-person {
      display: inherit;
    }
    &.type-organization .only-organization {
      display: inherit;
    }
  }

  .supporterRow, .initiatorRow {
    .rowDeleter, .rowDeleter:link, .rowDeleter:visited {
      color: $colorDelLink;
      display: inline-block;
      margin-top: 8px;
    }
    html.no-touchevents & .rowDeleter {
      visibility: hidden;
    }
    html.no-touchevents &:hover .rowDeleter {
      visibility: visible;
    }
  }
}

#motionConfirmedForm {
  .promoUrl {
    input[type=text] {
      font-weight: bold;
      font-family: $motionFixedFont;
    }
    .clipboard-done {
      text-align: center;
      font-size: 0.8em;
      color: green;
      font-weight: normal;
      margin-top: -13px;
    }
    button.btn {
      padding-bottom: 7px;
    }
  }
  .btnRow {
    padding: 15px;
    text-align: center;
  }
}

#motionConfirmForm, #amendmentConfirmForm {
  margin-bottom: 20px;
}

.motionMergeInit {
  h2.green {
    margin-bottom: 10px;
    margin-top: 20px;
  }
  .explanation {
    margin-top: 20px;
    margin-bottom: 20px;
  }
  .alert-info {
    a.btn {
      margin-top: -7px;
    }
  }
  .draftExistsAlert {
    margin-bottom: 50px;
  }
  .mergeAllRow {
    h3 {
      font-size: 16px;
    }
    ul {
      list-style-type: none;
      margin: 0 0 0 40px;
      padding: 0;
    }
    label {
      font-weight: normal;
    }
  }
  .mergeSingle {
    list-style-type: none;
    margin: 0;
    padding: 0;
    > li {
      clear: both;
      margin: 15px 0;
      padding: 0;
      .title {
        font-weight: bold;
      }
      .initiator {
        font-size: 0.8em;
        color: gray;
      }
    }
    .amendmentAjaxTooltip {
      float: left;
      margin-right: 10px;
    }
  }
}

.motionMergeStyles {
  .ICE-Tracking .ice-del, .ICE-Tracking .ice-del p {
    text-decoration: line-through;
    color: #880000;
    background-color: rgba(255, 100, 100, 0.2);
  }
  .ICE-Tracking .ice-del.hover, .ICE-Tracking .ice-del.hover p {
    background-color: darken(rgba(255, 100, 100, 0.5), 10%);
  }
  .ICE-Tracking .ice-ins, .ICE-Tracking .ice-ins p {
    text-decoration: underline;
    color: #008800;
    background-color: rgba(100, 255, 100, 0.2);
  }
  .ICE-Tracking .ice-ins.hover, .ICE-Tracking .ice-ins.hover p {
    background-color: darken(rgba(100, 255, 100, 0.6), 10%);
  }
  .paragraphHolder.hasCollissions {
    background-color: #fff5f5;
    margin-top: 15px;
    margin-bottom: 15px;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    position: relative;
    &:before {
      content: attr(data-collission-start-msg);
      position: absolute;
      top: -13px;
      text-align: center;
      font-size: 0.7em;
      color: gray;
      width: 100%;
    }
    &:after {
      content: attr(data-collission-end-msg);
      position: absolute;
      bottom: -13px;
      text-align: center;
      font-size: 0.7em;
      color: gray;
      width: 100%;
    }
     + .hasCollissions {
       margin-top: 45px;
     }
  }
  .moved {
    margin-top: 15px;
    position: relative;
    &:before {
      display: block;
      content: attr(data-moving-msg);
      // Absolute positioning is necessary, otherwise we can't cancel the text-decoration propert
      position: absolute;
      top: -15px;
      left: 0;
      width: 100%;
      text-align: center;
      text-decoration: none;
      font-size: 0.8em;
      color: gray;
    }
  }
}

.motionMergeForm {
  .submitHolder {
    text-align: right;
  }
  .newAmendments {
    .amendSubtitle {
      font-weight: normal;
      font-size: 0.9em;
    }
    .control-label {
      margin-top: -3px;
      padding-top: 0;
    }
  }

  .editorialAmendments {
    h3 {
      font-size: 1em;
      font-weight: bold;
    }
    .content {
      border-bottom: solid 1px $headingSecondaryBackground;
      &:first-child {
        border-bottom: none;
      }
    }
  }
  #draftSavingPanel {
    position: fixed;
    bottom: 0;
    right: 30px;
    width: 250px;
    z-index: 10;
    padding: 0;
    background: white;
    border: solid 1px #ccc;
    border-top-right-radius: 3px;
    border-top-left-radius: 3px;
    border-bottom: none;
    -webkit-box-shadow: 0 0 3px rgba(0, 0, 0, 0.4);
    -moz-box-shadow: 0 0 3px rgba(0, 0, 0, 0.4);
    box-shadow: 0 0 3px rgba(0, 0, 0, 0.4);

    label {
      font-weight: normal;
    }

    h2 {
      margin: 0;
      font-size: 16px;
      padding: 5px;
      background-color: #eee;
    }
    .public {
      padding: 5px;
    }
    .autosave {
      padding: 5px;
    }
    .publicLink {
      float: right;
      margin-right: 5px;
    }
    .savingError {
      padding: 5px;
      margin-top: -5px;
      border-bottom: solid 1px #ccc;
      background-color: #ff4444;
      color: black;
    }
    .save {
      padding: 5px;
      overflow: auto;
      .lastSaved {
        float: left;
      }
      .saveDraft {
        float: right;
      }
      .none {
        font-size: 0.9em;
        color: gray;
        font-style: italic;
      }
    }
    @media screen and (min-width: 1101px) {
      h2 {
        border-bottom: solid 1px #ccc;
      }
      .save {
        padding: 0 5px 5px 5px;
      }
      .public {
        display: block;
        padding-bottom: 0;
      }
      .autosave {
        border-bottom: solid 1px #ccc;
        display: block;
        padding-top: 0;
      }
      .lastSaved {
        margin-top: 2px;
      }
    }
    @media screen and (max-width: 1100px) {
      right: 0;
      left: 0;
      width: 100%;
      display: table;
      .hideSmall {
        display: none;
      }
      > * {
        display: table-cell;
        vertical-align: middle;
        line-height: 25px;
      }
      > h2 {
        width: 20%;
        border-right: solid 1px #ccc;
      }
      > .public {
        width: 20%;
        border-right: solid 1px #ccc;
      }
      .autosave {
        width: 20%;
        border-right: solid 1px #ccc;
      }
      > .save {
        width: 40%;
      }
    }
  }
}

.motionUpdateWidget {
  text-align: right;
  padding-top: 10px;

  .updated {
    text-align: center;
    padding-top: 5px;
    font-size: 0.8em;
    color: green;
    opacity: 0;
    transition: opacity 0.1s;
    &.active {
      opacity: 1;
      transition: opacity 0.1s;
    }
  }
}

.userAccountForm {
  .requestEmailChange {
    display: inline-block;
    margin-left: 10px;
    font-style: italic;
    font-size: 0.8em;
  }
  .changeRequested {
    display: block;
    font-size: 0.8em;
    margin-top: 5px;
    margin-bottom: 5px;
  }
  .resendButton {
    color: $colorLinks;
    font-style: italic;
  }
}

span.twitter-typeahead {
  .tt-menu {
    position: absolute;
    top: 100%;
    left: 0;
    z-index: 1000;
    display: none;
    float: left;
    min-width: 250px;
    padding: 5px 0;
    margin: 2px 0 0;
    list-style: none;
    font-size: 14px;
    text-align: left;
    background-color: #ffffff;
    border: 1px solid #cccccc;
    border: 1px solid rgba(0, 0, 0, 0.15);
    border-radius: 4px;
    -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
    box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
    background-clip: padding-box;
  }
  .tt-suggestion {
    display: block;
    padding: 3px 10px 3px 20px;
    margin: 5px 0;
    clear: both;
    font-weight: normal;
    line-height: 1.42857143;
    color: #333;
    white-space: nowrap;
    font-size: 14px;

    &:hover, &:focus {
      color: #ffffff;
      text-decoration: none;
      outline: 0;
      background-color: #88A4A0;
    }
    &.tt-cursor {
      color: #ffffff;
      background-color: #88A4A0;
    }
  }

  .input-group & {
    display: block !important;
  }
  .input-group & .tt-dropdown-menu {
    top: 32px !important;
  }
  .input-group.input-group-lg & .tt-dropdown-menu {
    top: 44px !important;
  }
  .input-group.input-group-sm & .tt-dropdown-menu {
    top: 28px !important;
  }

}

ul.searchResults {
  list-style-type: none;
  margin: 0;
  padding: 0;
  > li {
    margin: 0;
    padding: 10px;
    .type {
      display: block;
      float: left;
      width: 120px;
      overflow: hidden;
      -ms-text-overflow: ellipsis;
      text-overflow: ellipsis;
    }
    .title {

    }
  }
}

.activityLogPage {
  .date {
    float: right;
    color: gray;
  }
  .description {
    margin-top: 10px;
  }
  .deleted {
    color: gray;
    //font-weight: normal;
    font-style: italic;
  }
}

@font-face {
  font-family: FontAwesome;
  src: url(../fonts/fontawesome-webfont.eot);
  src: url(../fonts/fontawesome-webfont.eot?#iefix&v=4.3.0) format('embedded-opentype'), url(../fonts/fontawesome-webfont.woff2) format('woff2'), url(../fonts/fontawesome-webfont.woff) format('woff'), url(../fonts/fontawesome-webfont.ttf) format('truetype'), url(../fonts/fontawesome-webfont.svg#fontawesomeregular) format('svg');
  font-weight: 400;
  font-style: normal
}

.fuelux {
  .pillbox > .pill-group {
    list-style-type: none;
  }
  .selectlist {
    position: relative;
    .btn.dropdown-toggle {
      position: relative;
    }
  }
}

h2.green .amendmentAjaxTooltip, h3.green .amendmentAjaxTooltip {
  float: right;
  color: gray;
  margin-right: -10px;
}

.popover-amendment-ajax {
  width: 250px;
  max-width: none;
  color: black;

  @media screen and (min-width: 800px) {
    width: 400px;
  }
  @media screen and (min-width: 1200px) {
    width: 600px;
  }
  .popover-content {
    padding-right: 0;
  }
}

.ajaxAmendment {
  max-height: 250px;
  overflow: auto;
  > h3 {
    display: none;
  }
  h4 {
    font-size: 16px;
    margin: 5px 0;
  }
  ul {
    padding-left: 20px;
  }
}