//
// QTip2 Vendor JavaScript - Styling
// ----------------------------------------

.qtip {
  position: absolute;
  left: -28000px;
  top: -28000px;
  display: none;

  max-width: 280px;
  min-width: 50px;

//  font-size: 10.5px; // qtip defaults, not needed
//  line-height: 12px; // qtip defaults, not needed

  direction: ltr;

  box-shadow: none;
  padding: 0;
}

.qtip-content {
  position: relative;
//  padding: 5px 9px; // qtip defaults, not needed
  overflow: hidden;

  text-align: left;
  word-wrap: break-word;
}

.qtip-titlebar {
  position: relative;
//  padding: 5px 35px 5px 10px; // qtip defaults, not needed
  overflow: hidden;

  border-width: 0 0 1px;
//  font-weight: bold; // qtip defaults, not needed

  + .qtip-content {
    border-top-width: 0 !important;
  }
}

// Default close button class
.qtip-close {
  position: absolute;
  right: -9px;
  top: -9px;
  z-index: 11; // Overlap .qtip-tip

  cursor: pointer;
  outline: medium none;

  border: 1px solid transparent;

  .qtip-titlebar & {
    right: 4px;
    top: 50%;
    margin-top: -9px;
  }
}

* html .qtip-titlebar .qtip-close { top: 16px; } // IE fix

.qtip-titlebar .ui-icon,
.qtip-icon .ui-icon {
  display: block;
  text-indent: -1000em;
  direction: ltr;
}

.qtip-icon,
.qtip-icon .ui-icon {
  border-radius: 3px;
  text-decoration: none;
}

.qtip-icon .ui-icon {
  width: 18px;
  height: 14px;

  line-height: 14px;
  text-align: center;
  text-indent: 0;
  font: normal bold 10px/13px Tahoma,sans-serif;

  color: inherit;
  background: transparent none no-repeat -100em -100em;
}

// Applied to 'focused' tooltips e.g. most recently displayed/interacted with
// .qtip-focus {}

// Applied on hover of tooltips i.e. added/removed on mouseenter/mouseleave respectively
// .qtip-hover {}

// Default tooltip style - Telekom Components style
.qtip-default {
  background-color: #262626;
  background-color: rgba(0, 0, 0, .85);

  color: #fff;
  border: 0 solid transparent; // important for Tip-Extension
  border-radius: 4px;

  font-size: 15px;

  .qtip-titlebar {
    font-size: 18px;
    font-weight: bold;
    padding: 7px 12px 0;
    background-color: transparent;

    .qtip-close {
      border-color: #aaa;
      color: #111;
    }

    .ui-state-hover {
      border-color: #303030;
    }

    + .qtip-content {
      padding-top: 0;
    }
  }

  .qtip-content {
    padding: 9px 12px;
  }

  .qtip-icon {
    background: #f1f1f1;
    border-color: #222;
    text-shadow: none;
    color: #777;
  }
}


// Tip-extension
.qtip .qtip-tip {
  margin: 0 auto;
  overflow: hidden;
  z-index: 10;
}

// Opera bug #357 - Incorrect tip position
// https://github.com/Craga89/qTip2/issues/367
x:-o-prefocus, .qtip .qtip-tip {
  visibility: hidden;
}

.qtip .qtip-tip,
.qtip .qtip-tip .qtip-vml,
.qtip .qtip-tip canvas {
  position: absolute;

  color: #123456;
  background: transparent;
  border: 0 dashed transparent;
}

.qtip .qtip-tip canvas {
  top: 0;
  left: 0;
}

.qtip .qtip-tip .qtip-vml {
  // scss-lint:disable UrlQuotes, PropertySpelling, UrlFormat, HexValidation
  behavior: url(#default#VML);
  display: inline-block;
  visibility: visible;
}