// (C) Copyright 2011-2013 Hewlett-Packard Development Company, L.P.

div.hp-icon {
  background-image: url($img-file);
  background-repeat: no-repeat;
  
  &.hp-upload, #hp-main-banner div.hp-banner-control {
    width: 16px;
    height: 17px;
    background-position: $upload-x -180px;
    margin: 0px;
    display: block;
    
    .hp-selected &, &:hover, #hp-main-banner div.hp-banner-control:hover & {
      background-position: $upload-x -160px;
    }
  }
  
  &.hp-power {
    width: 16px;
    height: 17px;
    background-position: $power-x -180px;
    &:hover, #hp-main-banner div.hp-banner-control:hover & {
      background-position: $power-x -160px;
    }
    #hp-main-banner div.hp-banner-control.hp-on &, &.hp-on {
      background-position: $power-x -200px;
    }
    #hp-main-banner div.hp-banner-control.hp-standby &, &.hp-standby {
      background-position: $power-x -220px;
    }
  }

  &.hp-uid {
    width: 14px;
    height: 16px;
    background-position: ($uid-x + 1) -180px;
    &:hover, #hp-main-banner div.hp-banner-control:hover & {
      background-position: ($uid-x + 1) -160px;
    }
    #hp-main-banner div.hp-banner-control.hp-selected & {
      background-position: ($uid-x + 1) -200px;
    }
  }

  &.hp-console {
    width: 16px;
    height: 16px;
    background-position: $console-x -180px;
  
    &:hover, #hp-main-banner div.hp-banner-control:hover & {
      background-position: $console-x -160px;
    }
  }

  &.hp-disc { 
    width: 16px;
    height: 16px;
    background-position: $disc-x -180px;
    &:hover, #hp-main-banner div.hp-banner-control:hover & {
      background-position: $disc-x -160px;
    }
  }
}

.hp-delete, .hp-close {
  width: 14px;
  height: 14px;
  background-image: url($img-file);
  background-position: $close-x $inactive-y;
  background-repeat: no-repeat;
  
  &:hover {
    background-position: $close-x $active-y;
  }
}

.hp-edit {
  position: relative;
  width: 16px;
  height: 16px;
  background-image: url($img-file);
  background-position: $edit-x -78px;
  background-repeat: no-repeat;
}

.hp-reorder {
  width: 16px;
  height: 16px;
  background-image: url($img-file);
  background-position: $close-x -80px;
  background-repeat: no-repeat;
  
  &:hover {
    background-position: $close-x -60px;
  }
}

.hp-connect {
  width: 17px;
  height: 10px;
  background: transparent url('#{$img-dir}/connect.png') no-repeat;
}

.hp-jump {
  width: 16px;
  height: 16px;
  background-image: url($img-file);
  background-position: -156px -96px;
  background-repeat: no-repeat;
  
  &:hover {
    background-position: -156px -76px;
  }
}

.hp-file-upload {
  position: relative;
  width: 18px;
  height: 18px;
  background-image: url($img-file);
  background-position: ($file-upload-x + 2) -180px;
  background-repeat: no-repeat;
  
  &:hover {
    background-position: ($file-upload-x + 2) -160px;
  }
}

.hp-file-download {
  position: relative;
  width: 18px;
  height: 18px;
  background-image: url($img-file);
  background-position: ($file-download-x + 2) -220px;
  background-repeat: no-repeat;
  
  &:hover {
    background-position: ($file-download-x + 2) -200px;
  }
}

.hp-file-folder {
  position: relative;
  width: 18px;
  height: 18px;
  background-image: url($img-file);
  background-position: $file-folder-x -218px;
  background-repeat: no-repeat;
  
  &:hover {
    background-position: $file-folder-x -198px;
  }
}

.hp-file-trash {
  position: relative;
  width: 18px;
  height: 18px;
  background-image: url($img-file);
  background-position: $file-trash-x -220px;
  background-repeat: no-repeat;
  
  &:hover {
    background-position: $file-trash-x -200px;
  }
}

.hp-connect-long {
  width: 75px;
  height: 11px;
  background: transparent url('#{$img-dir}/connect_long.png') no-repeat;
}

table td > .hp-connect, table td > .hp-connect-long {
  margin: 4px 0px;
}

// jQueryUI

.ui-icon {
  width: 16px;
  height: 16px;
  background-image: url('../../img/hp-piano/ui-icons_222222_256x240.png');
}

.ui-widget-content .ui-icon, .ui-widget-header .ui-icon {
  background-image: url('../../img/hp-piano/ui-icons_222222_256x240.png');
}

.ui-state-default .ui-icon {
  background-image: url('../../img/hp-piano/ui-icons_888888_256x240.png');
}

.ui-state-hover .ui-icon, .ui-state-focus .ui-icon, .ui-state-active .ui-icon {
  background-image: url('../../img/hp-piano/ui-icons_454545_256x240.png');
}

.ui-state-highlight .ui-icon {
  background-image: url('../../img/hp-piano/ui-icons_2e83ff_256x240.png');
}

.ui-state-error .ui-icon, .ui-state-error-text .ui-icon {
  background-image: url('../../img/hp-piano/ui-icons_cd0a0a_256x240.png');
}