@import "../lib/bootstrap.ext/tagsinput/bootstrap-tagsinput.less";
// import the css files as less files so they are included in the final output of wro4j
@import (less) "../lib/style/ol.css";
@import (less) "../lib/style/datetimepicker.css";
@import (less) "../lib/jquery.ext/jquery.fileupload-ui.css";
@import "gn.less";


@import "../lib/style/bootstrap/less/glyphicons.less";

//url is wrong on original file
// Import the fonts
@font-face {
  font-family: 'Glyphicons Halflings';
  src: ~"url('../catalog/lib/style/bootstrap/fonts/@{icon-font-name}.eot')";
  src: ~"url('../catalog/lib/style/bootstrap/fonts/@{icon-font-name}.eot?#iefix') format('embedded-opentype')",
       ~"url('../catalog/lib/style/bootstrap/fonts/@{icon-font-name}.woff') format('woff')",
       ~"url('../catalog/lib/style/bootstrap/fonts/@{icon-font-name}.ttf') format('truetype')",
       ~"url('../catalog/lib/style/bootstrap/fonts/@{icon-font-name}.svg#@{icon-font-svg-id}') format('svg')";
}

body {
}

.gn-line-height {
       line-height: 1.8 !important;
 }

input[type=text], input[type=number], select {
  .form-control;
}


.gn-drawmap-panel {
  table  {
    .form-group {
      width: 150px;
    }
    .btn-group {
      margin-left: 15px;
    }
  }
  .form-group {
    margin-left: 0px;
    margin-right: 0px;
  }
  .col-left, .col-right {
   width: 25%;
  }
  .col-middle {
   width: 50%;
  }
  table {
   width:100%
  }
  .map {
   height: 300px;
   width: 100%;
  }

  .gn-proj-select {
    width: 250px;
    vertical-align: top;
  }
  [data-gn-region-picker], [gn-region-picker] {
    .fa {
      position: absolute;
      top: 11px;
      z-index: 100;
      right: 10px;
      &.fa-spinner {
        right: 25px;
      }
      &.fa-times-circle {
        cursor: pointer;
      }
    }
  }
  input[type=number] {
    margin-top: 15px;
    margin-bottom: 15px;
    text-align: center;
  }
  .dropdown-menu {
    font-size: 13px;
    text-align: left;
  }
}
.gn-geopublisher-panel {
  .map {
   height: 300px;
   width: 100%;
  }
}
.gn-thumbnail-maker-panel {
  .map {
    height: 300px;
    width: 100%;
  }
}

[data-gn-metadata-category-updater] .dropdown-menu > .disabled > a:hover,
[data-gn-metadata-group-updater] .dropdown-menu > .disabled > a:hover {
  cursor: pointer !important;
}

.gn-editor-container {
  padding: 20px 5px;
}

@media only screen and (max-width: 815px) {
  .gn-editor-container {
    margin-top: 120px;
  }
}
@media only screen and (max-width: 425px) {
  .gn-editor-container {
    margin-top: 160px;
  }
}


#gn-directory-container {
  .gn-facet-dropdown {
    min-width: 300px;
    padding: 0px 10px;
    .badge {
      background-color: #777777;
    }
  }

  .panel-heading {
    display: flex;
    flex-direction: row;
    align-items: center;

    & > .nav.nav-pills {
      a {
        padding: 6px;
        line-height: 1em;
      }
    }

    input.filter-text {
      width: 20%;
      min-width: 16em;
      height: 2em;
    }
  }

  .search-options-header.row {
    margin-left: -15px;
    margin-right: -15px;
  }

  .directory-entries-list {
    margin: 0.7em 0em;
    padding: 0px;

    & > li {
      @padding: 6px;

      & > *:not(:last-child) {
        margin-bottom: @padding;
      }

      & > * > *:not(:last-child) {
        margin-right: @padding;
      }

      .entry-info {
        display: flex;
        flex-direction: row;
        small {
          max-height: 2.5em;
          overflow: hidden;
        }
      }
    }
  }

  .entry-editor {
    .panel-heading {
      position: relative;
      display: flex;
      flex-direction: row;
      align-items: center;
      .entry-editor-controls {
        flex-shrink: 0;
        margin: -7px -12px -7px 6px;
      }
      .entry-editor-title {
        min-width: 0px;
        overflow: hidden;
        white-space: nowrap;
        text-overflow: ellipsis;
      }
    }
    .panel-body {
      position: relative;
    }
  }

  div[data-gn-toggle] {
    top: 1em;
    right: 1em;
  }

  [gn-modal] {
    max-width: none;
    max-height: none;

    @media (min-width: 992px) {
      .modal-dialog {
        width: 650px;
      }
    }
  }

  .dropdown-menu {
    max-width: 40em;
  }
}

.gn-editor-board {
  .table.gn-results-editor td {
    padding: 6px 3px;
    .btn-group {
      margin-top: 3px;
      .btn-single {
        border-radius: 4px;
      }
    }
    .col-lg-8, .col-md-8, .col-lg-4, .col-md-4 {
      padding-left: 0;
      padding-right: 0;
    }
    @media (min-width: @screen-md-min) {
      .btn-group {
        float: right;
      }
    }
  }
}

form.gn-editor {
  /* Move each sub fieldset to the left */
  @editor-fieldset-padding-left: 5px;

  /**
   * Make space on the following element of a well
   */
  div.well + fieldset, div.well + div {
    padding-top: 10px;
  }

  div.well {
    margin-bottom: 0px;
  }

  div[data-gn-toggle] {
    position: absolute;
    right: 3px;
    top: 2px;
    button {
      padding: 5px;
      background-color: @brand-primary;
      color: white;
      -webkit-border-radius: 15px;
      border-width: 0px;
      i {
        padding-left: 3px;
        padding-top: 4px;
      }
    }
  }

  /**
   * Add bottom line
   */
  fieldset > div.form-group.gn-field,
  fieldset > div.row.gn-field {
//    border-top: 1px solid #EEE;
//    padding-left:  (@grid-gutter-width / 2);
    padding-top: 5px;
  }
  fieldset > div.form-group.gn-extra-field,
  fieldset > div.row.gn-extra-field{
    border-top: none;
  }
  /**
   * Hide label in field which are not
   * first and do not break line to not
   * loose space.
   */
  div.gn-extra-field > label {
    visibility: hidden;
    white-space: nowrap;
  }

  .gn-associated-resource-btn {
    .button-variant(@btn-default-color; @btn-default-bg; @btn-default-border);
  }

  fieldset fieldset {
    padding-left: @editor-fieldset-padding-left;
  }

  .form-group {
    margin-bottom: 0px;
  }
  div.well {
    .form-group {
      margin-bottom: 10px;
      &:last-child {
        margin-bottom: 0;
      }
    }
    .btn + .form-group {
      margin-top: 10px;
    }
  }

  legend {
    margin-bottom: 10px;
  }

  .gn-textarea-xml {
    font-family: courier;
    font-size: 12px;
    min-height: 700px;
  }

  .gn-debug {
    display: none;
  }

  .control-label {
      color: #6a6a6a;
      font-weight: 200;
      padding-top: 0px;
      line-height: 22px;

  }

  .gn-required > label {
 //   color: #333333;
  }

  .gn-move {
//    .pull-right();
  }

  legend > div.gn-move {
    position: absolute;
  }

  /* text danger takes priority above colors
   */
  .text-danger label,
  .text-danger legend {
    .text-danger();
  }

  .gn-has-xlink {
    label, fieldset > legend {
  //    opacity: .7;
    }
  }

  /* Date picker is composed of a date and
   * a time input. Align them on the same
   * line instead of 100% width in input group.
   */
  .gn-date-picker {
    > input[type=date] {
      width: 60%;
    }
    > input[type=time] {
      width: 40%;
    }
    > input[type=date].gn-notime {
      width: 100%;
    }
    > input[type=time].hidden {
      width: 0%;
    }
    .gn-indeterminate-position {
      display: table-cell;
      > select {
        border-bottom-right-radius: 0px;
        border-top-right-radius: 0px;
      }
    }
    &.gn-time-with-ind-position {
      > select.gn-indeterminate-position {
        width: 20%;
      }
      > input[type=date] {
        width: 40%;
      }
      > input[type=time] {
        width: 40%;
      }
    }
  }

  /* Reset margin in helper for documentation
   * to properly align radios
   */
  .helper .help-block {
    margin-top: 0px;
    margin-bottom: 0px;
  }


  /* Avoid white on white when i:hover
   */
  .btn:hover {
    color: #000;
  }

  /**
   * Keyword selector directive
   */
   *[data-gn-keyword-selector] {
       margin-bottom: 10px;
   }

  .bootstrap-tagsinput {
    min-height: 34px;
    .tag {
      white-space: pre-wrap;
      word-break: break-word;
      display: inline-flex;
      margin-top: 2px;
    }

    .twitter-typeahead {
      margin-top: 4px;
    }
    .tt-input {
      border: none;
      box-shadow: none;
      background-color: #FFFFFF !important;
    }
  }
  .gn-maxtags .bootstrap-tagsinput {
    .twitter-typeahead, .twitter-typeahead > input {
      display: none !important;
    }
  }

  /* Avoid to apply img logo css to fieldset in editor */
  fieldset.gn-logo {
    max-height: inherit;
  }
  fieldset {
      padding: 5px;
      border: 1px solid #ebebeb;
      border-radius: 3px;
      margin-top: 10px;
  }
  .gn-field {
      border-radius: 3px;
      margin: 0px;
      padding-top: 4px;
      padding-bottom: 4px;
  }
  .field-bg {
      background-color: #f7f7f7;
  }
  .gn-move {
      border: none;
  }
  i.btn.fa-times.text-danger {
      visibility: hidden;
      padding: 5px;
  }
  .show {
      visibility: visible;
  }
  .gn-value .col-xs-8 {
      padding-left: 0px;
  }
  .gn-value .col-xs-4 {
      padding-right: 0px;
  }

  label.gn-required:after, .gn-required > label:after,
  label.gn-mandatory:after, .gn-mandatory > label:after {
      content: "*";
      font-size: 2.5em;
      margin: 7px 0 0 7px;
      position: absolute;
      color: #a94442;
      font-weight: normal;
  }
  .form-horizontal .form-group {
      margin-left: 0px;
      margin-right: 0px;
  }

}

.gn-autocomplete-list {
  position: absolute;
  margin-top: 35px;
  width: inherit;
  z-index: 999;
  max-height: 25em;
  overflow: auto;

  .tt-suggestion {
    &:hover {
      background-color: lightgrey;
    }
  }
}

form.gn-tab-inspire {
  .control-label {
    color: inherit;
  }
  .well {
    display: none;
  }
}

/* Onlinesrc styles */
.gn-onlinesrc-panel {
  .list-group-item {
    padding-left: 4px;
    padding-right: 4px;
    .row > div {
      padding-left: 1px;
      padding-right: 1px;

      .onlinesrc-remove {
        padding: 0px;
      }
    }
  }
}
.onlinesrc-container, [gn-directory-entry-list-selector] {
  .list-group {
    max-height:50%;
    overflow: auto;
  }
  .list-group.fixed {
    padding: 5px;
    min-height: 100px;
    /* Avoid the content of the div
    to be higher than view port
    as the modal does not have overflow. */
    max-height: 50vh;
  }

  .gn-record {
    &.active {
      background-color: #428bca;
    }
  }

}

table.gn-data-store {
  td {
    word-break: break-all;
    .btn {
      padding: 1px 1px;
    }
  }
}

#gn-new-metadata-container {
  /*
   * Increase default panel heading size in order
   * to preserve heading alignement if title is on
   * one or two lines.
   */
  .panel-default > .panel-heading {
    min-height: 60px;
  }
  /*
   * Center icons and text for selecting type of
   * record.
   */
  .gn-record-type > a.list-group-item {
    text-align: center;
  }
}
/* verical layout for the add metadata page */
#gn-new-metadata-container.new-metadata-vertical {
  .gn-record-type > a.list-group-item {
    text-align: left;
  }
}

.gn-schematron-title {
  word-wrap: break-word;
}
.navbar-collapse {
  padding-right: 0px;
}

.open > .dropdown-menu {
  max-height: 25em;
  overflow-y: auto;
}

.schematron-result-list-label-info .text-info {
  color: @label-primary-bg;
}

.gn-batch-editor {
  .gn-resultview li.list-group-item {
    margin-bottom: 0px;
    padding: 4px;
  }
  li.gn-batch-editor-info {
    margin-top: 11px;
  }
  [data-ng-search-form] .gn-top-search .gn-form-any {
    max-width: 80vw;
  }
}

form.gn-tab-xml {
  div[data-gn-toggle] {
    display:none;
  }
}

.gn-table {
  /* Compact gn-fields displayed in table mode.
  Label and remove control are hidden. */
  :not(.gn-table-label) div.gn-field {
    padding: 0px !important;
    label,
    .col-sm-1.gn-control {
      display: none;
    }
    .col-sm-9 {
      width: 100%;
    }
  }
  .gn-table-label {
    div.gn-field {
      label,
      .col-sm-1.gn-control {
        display: block;
      }
      .col-sm-9 {
        width: 75%;
      }
    }
  }
  .nopadding-in-table {
    padding-left: 0;
    padding-right: 0;
  }
}

// search filter boxes
// search terms
.searchterm {
  margin: 0 5px 5px 0;
  max-width: 100%;
  span {
    max-width: 98%;
    overflow: hidden;
    text-overflow: ellipsis;
    float: left;
  }
  i {
    margin-top: -15px;
    margin-left: 5px;
  }
}

.skos-btn-icons {
  text-decoration: none !important;
  color: @gray;
  &:hover {
    color: @brand-success;
  }
}

#xmleditor {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  min-height: 800px;
}
#gn-directory-container #xmleditor {
  top: 0px;
  position: relative;
}

.tt-menu {
  border-radius: 0;
}

.tt-suggestion {
  font-size: 13px;
}

.input-group {
  .tt-menu {
    top: 31px !important;
    left: 8px !important;
  }
  .tt-hint {
    color: transparent;
  }
}

[gn-directory-entry-list-selector] {
  .gn-form-any {
    margin-bottom:30px;
  }

  .gn-record {
    border-radius: 0;
    border: none;
    margin: 8px;
    box-shadow: 0px 2px 3px rgba(0, 0, 0, 0.4);
    &.active {
      background-color: #5384e6;
    }
    &:hover {
      cursor: pointer;
      box-shadow: 0px 2px 3px rgba(66, 139, 202, 0.4);
    }
    strong {
      font-weight: normal;
    }
  }

  ng-pluralize {
    color: #aaa;
  }

  .bottom-bar {
    bottom: 20px;
    position: absolute;
  }
}

[data-gn-directory-entry-selector] {
  .gn-autocomplete-list {
    top:0 !important;
    width: 100%;
  }
}

gn-directory-associated-md {
  // add margin if we're in a dropdown menu
  ul.dropdown-menu & {
    margin: 8px 12px;
    width: 30em;
    display: block;
  }

  .form-controls {
    display: flex;
    align-items: center;
    margin-bottom: 12px;

    & > * {
      flex-shrink: 0;
    }
    input.filter-text {
      flex-shrink: 1;
      margin-right: 12px;
    }
  }

  .associated-md {
    border: none;
    display: flex;
    flex-direction: row;
    align-items: center;
    & > *:not(:last-child) {
      margin-right: 8px;
    }
    padding-top: 6px;
    &:not(:last-child) {
      border-bottom: 1px solid @list-group-border;
      padding-bottom: 6px;
    }
  }
}

// md type widget (used only in editor for now)
gn-md-type-widget {
  display: inline-block;
  & > div {
    border-radius: 1000px;
    width: 24px;
    height: 24px;
    line-height: 24px;
    text-align: center;
    font-size: 14px;
    position: relative;
    color: white;
    margin-top: -0.2em;
    margin-bottom: -0.4em;
    background-color: @gray-light;
    overflow: hidden;

    &.valid-status-1 {
      background-color: @gray-light;
    }
    &.valid-status0 {
      background-color: @btn-danger-bg;
    }
    &.valid-status1 {
      background-color: @btn-success-bg;
    }
    &.md-type-t {
      background-color: @btn-primary-bg;
    }

    &::after {
      content: '';
      background-color: rgba(255, 255, 255, 0.25);
      position: absolute;
      top: 0px;
      height: 50%;
      left: 0px;
      right: 0px;
    }
  }
}
.gn-editor-board {
  .table.gn-results-editor td {
    gn-md-type-widget {
      margin-top: 5px;
    }
  }
}

.gn-fixed-scroll {
  position:fixed;
  top:60px;
}



gn-bounding-polygon {
  label {
    font-size: 0.9em;
    line-height: 0.8em;
    margin-bottom: 0px;
  }

  textarea {
    font-family: Consolas, monospace;
    font-size: 0.9em;
  }
}