// only for debbuging
.xe-wrapper__window--temp
  width: 1200px
  height: 100%
  

// main div wrapper
.xe-search__wrapper
  width: 100%
  height: 100%
  border: 1px solid $color-monza
  background-color: white
  padding: 16px

.xe-search__wrapper--history
  width: 800px
  height: 200px
  border: 1px solid $color-dusty-gray
  overflow: hidden
  position: relative
  .xe-divider
    height: 7px
    width: 100%
    position: absolute
    bottom: 0
    left: 0
    background-color: $color-alto
    border-top: 1px solid $color-dusty-gray
  .xe-search__scrollable
    width: 100%
    height: 100%
    overflow: auto
  table
    width: 100%
    td:nth-child(2)
      cursor: pointer
  .xe-table--small
    table-layout: initial
    width: auto
    td
      border: none
      &:nth-child(1)
        width: 80px
      &:nth-child(2)
        width: 100px


// main div with tabs and js links
.xe-search__tabList
  margin-top: 10px
  position: relative
  ul
    list-style-type: none
    margin: 0
    padding: 0
    display: inline-block
    li
      display: inline-block
      position: relative
      padding: 8px 12px
      cursor: pointer
      border: 1px solid $color-dusty-gray
      border-bottom: none
      border-top-left-radius: 4px
      border-top-right-radius: 4px
      box-shadow: inset 0px -2px 2px -1px rgba($color-alto, 0.75)
    span
      color: $color-dusty-gray
.xe-search--history
  cursor: pointer
  padding: 14px 22px 4px 12px
  margin-top: -11px
  vertical-align: top
  display: inline-block
  position: relative
  .link-close
    display: none
    font-size: 125%
    position: absolute
    top: 2px
    right: 4px
    color: black
    &:hover
      color: $color-monza

.xe-search--historyOpen
  background-color: $color-alto
  border-bottom: 1px solid $color-dusty-gray
  border-left: 1px solid $color-dusty-gray
  border-right: 1px solid $color-dusty-gray
  border-bottom-left-radius: 4px
  border-bottom-right-radius: 4px
  .link-close
    display: block
  .xe-link--action
    font-weight: bold
    border: 1px solid transparent


a.xe-link--action
  color: black
  border-bottom: 1px dashed black !important
  text-decoration: none
  display: inline-block
  line-height: 1
  &:hover
    border-color: transparent
  &:focus, &:visited
    color: black

.xe-tablist--active
  font-weight: bold
  background-color: $color-alto
  position: relative
  border-bottom: 1px solid $color-alto !important
  box-shadow: none !important
  z-index: 10

.xe-tab
  display: none
  overflow: auto

.xe-tab--active
  display: inherit

.xe-search--close
  position: absolute
  right: 0
  top: -30px

.xe-search__body
  margin-top: -1px
  position: relative
  display: inline-block
  z-index: 1

.xe-searchTable  
  table
    border-collapse: collapse
    thead tr
      background-color: $color-alto
      border-top: 1px solid $color-dusty-gray
      border-left: 1px solid $color-alto
      border-right: 1px solid $color-alto
      border-bottom: 1px solid $color-alto
      &:hover
        background-color: $color-alto
    th
      text-align: left
      padding: 1px 2px
    tr:nth-child(even)
      background-color: $color-gallery
    tr:hover
      background-color: $color-jagged-ice
    td
      vertical-align: middle
      position: relative
    tbody
      td
        border-left: 1px solid $color-alto
        border-right: 1px solid $color-alto
        border-bottom: 1px solid $color-alto
    i
      margin: 0 4px
      position: relative
      bottom: -2px
      font-size: 125% !important
    i.pa-icon-euCompany
      font-size: 100% !important

  .lang
    position: relative
    bottom: -2px
    display: inline-block

  mark
    background-color: $color-gold!important
    padding: 0 !important
  span
    color: $color-dusty-gray
    mark
      color: $color-dusty-gray
  a
    mark
      color: #4A89DC

  .xe-cell--assigned 
    background-color: $color-monza
    color: white
  .xe-cell--highlight
    background-color: $color-golden-rod
  .xe-cell--aright
    text-align: right
  .xe-cell--textHigh
    color: $color-forrest-green
  .xe-cell--textHighAlt
    color: $color-monza
  .xe-cell--attention
    background-color: $color-gamboge
    color: white
    font-size: 150%
    font-weight: bold
    text-align: center
    display: inline-block
    padding: 0 4px
    margin: -1px -2px
    float: right
  .xe-cell--client
    width: 78%
  .xe-cell--goods
    width: 92%
  .xe-cell--headline
    width: 92%
  .xe-actions
    position: absolute
    top: 0
    right: 2px
    display: inline-block
    i
      color: $color-dusty-gray
      &:hover
        color: black

  .xe-status
    display: inline-block
    width: 12px
    height: 12px
    border-radius: 50%
    margin-bottom: -2px

  .xe-status--notassigned
    @extend .xe-status
    background-color: $color-gold

  .xe-status--assigned
    @extend .xe-status
    background-color: $color-monza

  .xe-status--done
    @extend .xe-status
    background-color: $color-navy-blue

  .xe-status--checked
    @extend .xe-status
    background-color: $color-teal

  .xe-status--canceled
    @extend .xe-status
    background-color: $color-dusty-gray