/* =============================================================================
   ADC Custom qTip Styles
   ============================================================================= */

/* =============================================================================
   YouTube Theme - Bridge for .qtip-youtube class (new JS naming)
   The base CSS defines .ui-tooltip-youtube, but JS applies .qtip-youtube
   ============================================================================= */
.qtip-youtube {
  -webkit-box-shadow: 0 0 3px #333;
  -moz-box-shadow: 0 0 3px #333;
  box-shadow: 0 0 3px #333;
  -moz-border-radius: 4px;
  -webkit-border-radius: 4px;
  border-radius: 4px;
}

.qtip-youtube .qtip-titlebar,
.qtip-youtube .qtip-content,
.qtip-youtube .ui-tooltip-titlebar,
.qtip-youtube .ui-tooltip-content {
  background: transparent;
  background: rgba(0, 0, 0, 0.85);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#D9000000,endColorstr=#D9000000);
  -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr=#D9000000,endColorstr=#D9000000)";
  color: white;
  border-color: #CCCCCC;
}

.qtip-youtube .qtip-icon,
.qtip-youtube .ui-tooltip-icon {
  border-color: #222;
}

.qtip-youtube .qtip-titlebar .ui-state-hover,
.qtip-youtube .ui-tooltip-titlebar .ui-state-hover {
  border-color: #303030;
}

/* =============================================================================
   Shadow Theme - Bridge for .qtip-shadow class
   ============================================================================= */
.qtip-shadow {
  -webkit-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.15);
  -moz-box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.15);
  box-shadow: 1px 1px 3px 1px rgba(0, 0, 0, 0.15);
}

/* =============================================================================
   Default Theme Override
   When qtip-youtube is present, ensure default styling doesn't bleed through
   ============================================================================= */
.qtip-default.qtip-youtube,
.ui-tooltip-default.qtip-youtube {
  border-color: #CCCCCC;
  background-color: transparent;
}

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

.qtip-default.qtip-youtube .qtip-content,
.ui-tooltip-default.qtip-youtube .ui-tooltip-content {
  background-color: rgba(0, 0, 0, 0.85);
  color: white;
}

/* =============================================================================
   Utility Classes
   ============================================================================= */
.hide {
  display: none;
}

/* Ensure hidden qTip content stays completely hidden */
.qtip_content.hide {
  display: none !important;
  visibility: hidden;
  position: absolute;
  left: -9999px;
}

/* =============================================================================
   Cruise Search Help - applied by Scripts/jquery-effects-ros.js
   ============================================================================= */
.qtip_cruiseSearchTip {
  min-width: 400px;
  max-width: 700px;
  font-size: 12px;
  line-height: 1.4;
}

.qtip_cruiseSearchTip p {
  margin: 0 0 10px;
}

.qtip_cruiseSearchTip p:last-child {
  margin-bottom: 0;
}

/* =============================================================================
   Blue Step 3 and CID Themes - Bridge for the qTip2 v2.2.1 markup
   Scripts/qtip/jquery.qtip.css styles these themes through .ui-tooltip-titlebar and
   .ui-tooltip-content, but the qTip2 script these pages load writes .qtip-titlebar
   and .qtip-content, so without this the tooltip had no background or border.
   Applied by Scripts/jquery-effects.js (contact us, step helpers) and
   Scripts/jquery-effects-ros.js (ship images).
   ============================================================================= */
.ui-tooltip-blue-step3 .qtip-titlebar,
.ui-tooltip-blue-step3 .qtip-content,
.ui-tooltip-blue-CID .qtip-titlebar,
.ui-tooltip-blue-CID .qtip-content {
  border: 1px solid #ADD9ED;
  color: #477490;
}

.ui-tooltip-blue-step3 .qtip-content,
.ui-tooltip-blue-CID .qtip-content {
  position: relative;
  overflow: hidden;
  background-color: #E5F6FE;
  font-size: 13px;
  line-height: 15px;
  text-align: left;
  word-wrap: break-word;
}

.ui-tooltip-blue-CID .qtip-content {
  background-color: #FFF;
}

.ui-tooltip-blue-step3 .qtip-titlebar,
.ui-tooltip-blue-CID .qtip-titlebar {
  position: relative;
  min-height: 14px;
  padding: 7px 35px 7px 10px;
  overflow: hidden;
  border-width: 1px 1px 0;
  background-color: #D0E9F5;
  font-size: 14px;
  font-weight: bold;
}

.ui-tooltip-blue-step3 .qtip-titlebar + .qtip-content,
.ui-tooltip-blue-CID .qtip-titlebar + .qtip-content {
  border-top-width: 0;
}

.ui-tooltip-blue-step3 .qtip-titlebar .qtip-close,
.ui-tooltip-blue-CID .qtip-titlebar .qtip-close {
  position: absolute;
  top: 50%;
  right: 4px;
  margin-top: -9px;
  border: 1px solid #ADD9ED;
  border-radius: 3px;
  background: #E5F6FE;
  color: #477490;
  cursor: pointer;
}

.ui-tooltip-blue-step3 .qtip-close .ui-icon,
.ui-tooltip-blue-CID .qtip-close .ui-icon {
  display: block;
  width: 18px;
  height: 14px;
  background: transparent none;
  font: normal bold 12px/14px Tahoma, sans-serif;
  text-align: center;
  text-indent: 0;
}
