/**
 * This file defines CMS-specific customizations to the jQuery UI theme.
 * Every rule should contain ONLY overwritten jQuery UI rules (with 'ui-' prefix).
 *
 * This file should be fairly short, as we're using our own custom jQuery UI theme already.
 *
 * Use _style.scss to add more generic style information,
 * and read the jQuery UI theming API: http://jqueryui.com/docs/Theming/API
 */


.ui-widget,
.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button {
  font-family: $font-family-sans-serif;
}

.ui-widget-content,
.ui-widget,
.ui-widget.ui-widget-content {
  color: $body-color;
  font-size: 1em;
  border: 0;

  a {
    color: $link-color;
  }
}

.ui-widget-header {

  & .ui-dialog-title {
    padding: 6px 10px;
  }

  & a.ui-dialog-titlebar-close {
    position:  absolute;
    top: -5px;
    right: -13px;
    width: 30px;
    height:  30px;
    z-index: 100000;
  }

  a.ui-state-hover {
    border-color: transparent;
    background: transparent;

    .ui-icon-closethick {
      @include icon-sprites(32x32);
      @include sprite($sprites-32x32-dialog-close-over);
    }
  }

  .ui-icon-closethick {
    @include icon-sprites(32x32);
    @include sprite($sprites-32x32-dialog-close);
    width: 30px;
    height:  30px;
  }
}

.ui-state-hover {
  cursor: pointer;
}

.ui-accordion {
  .ui-accordion-header {
    border-color: $btn-secondary-border;
    margin-bottom: 0;

    a {
      color: $gray-700;
    }
  }
  .ui-accordion-content {
    border: 1px solid $btn-secondary-border;
    border-top: none;
  }
}

.ui-autocomplete {
  max-height: 240px;
  overflow-x: hidden;
  overflow-y: auto;

  /** sorry about the !important but the specificity of other selectors mandates it over writing out very specific selectors **/
  &-loading {
    background-image: url('../../images/throbber.gif') !important;
    background-position: 97% center !important;
    background-repeat: no-repeat !important;
    background-size: auto !important;
  }
}

.ui-tabs .ui-tabs-nav .ui-tabs-anchor {
  float: none;
  padding: $nav-link-padding;
  cursor: pointer;
}
