// Generated by compass-jquery-plugin/gem-tasks/dynatree.rake

/*******************************************************************************/
/* Tree container                                                              */
/*******************************************************************************/

div.ui-dynatree-container {
  font-family: tahoma, arial, helvetica;
  font-size: 10pt;
  /* font size should not be too big */
  white-space: nowrap;
  padding: 3px;
  background-color: white;
  border: 1px dotted gray;
  ul {
    padding: 0 0 0 16px; }
  li {
    list-style-image: none;
    list-style-position: outside;
    list-style-type: none;
    -moz-background-clip: border;
    -moz-background-inline-policy: continuous;
    -moz-background-origin: padding;
    background-attachment: scroll;
    background-color: transparent;
    background-position: 0 0;
    background-repeat: repeat-y;
    background-image: image_url("jquery.ui/dynatree.xp/vline.png");
    margin: 0;
    /*    padding:3px 0 3px 16px;*/
    /*    padding:3px 0 3px 0;*/
    padding: 1px 0 0 0; } }

/* Suppress vertical line, if we don't have connectors */

ul.ui-dynatree-no-connector >li, div.ui-dynatree-container li.ui-dynatree-lastsib {
  background-image: none; }

/* Style, when control is disabled */

.ui-dynatree-disabled div.ui-dynatree-container {
  opacity: 0.5;
  /*	filter: alpha(opacity=50); /* Yields a css warning */
  background-color: silver; }

/*******************************************************************************/
/* Default for custom icons                                                    */
/*******************************************************************************/

/*******************************************************************************/
/* Common icon definitions                                                     */
/*******************************************************************************/

span {
  &.ui-dynatree-empty, &.ui-dynatree-vline, &.ui-dynatree-connector, &.ui-dynatree-expander, &.ui-dynatree-icon, &.ui-dynatree-checkbox, &.ui-dynatree-radio {
    width: 16px;
    height: 16px;
    display: -moz-inline-box;
    /* @ FF 1+2 */
    display: inline-block;
    /* Required to make a span sizeable */
    vertical-align: top;
    background-repeat: no-repeat;
    background-position: left; }
  &.ui-dynatree-connector {
    background-image: image_url("jquery.ui/dynatree.xp/ltL_ne.png"); }
  &.ui-dynatree-expander {
    background-image: image_url("jquery.ui/dynatree.xp/ltP_nes.png");
    cursor: pointer; } }

/*******************************************************************************/
/* Lines and connectors                                                        */
/*******************************************************************************/

/*******************************************************************************/
/* Expander icon                                                               */
/* Note: IE6 doesn't correctly evaluate multiples class names,                 */
/*		 so we create combined class names that can be used in the CSS.        */
/*                                                                             */
/* Prefix: ui-dynatree-exp-                                                    */
/* 1st character: 'e': expanded, 'c': collapsed                                */
/* 2nd character (optional): 'd': lazy (Delayed)                               */
/* 3rd character (optional): 'l': Last sibling                                 */
/*******************************************************************************/

.ui-dynatree-exp-cl span.ui-dynatree-expander {
  background-image: image_url("jquery.ui/dynatree.xp/ltP_ne.png"); }

.ui-dynatree-exp-cd span.ui-dynatree-expander {
  background-image: image_url("jquery.ui/dynatree.xp/ltD_nes.png"); }

.ui-dynatree-exp-cdl span.ui-dynatree-expander {
  background-image: image_url("jquery.ui/dynatree.xp/ltD_ne.png"); }

.ui-dynatree-exp-e span.ui-dynatree-expander, .ui-dynatree-exp-ed span.ui-dynatree-expander {
  background-image: image_url("jquery.ui/dynatree.xp/ltM_nes.png"); }

.ui-dynatree-exp-el span.ui-dynatree-expander, .ui-dynatree-exp-edl span.ui-dynatree-expander {
  background-image: image_url("jquery.ui/dynatree.xp/ltM_ne.png"); }

/*******************************************************************************/
/* Checkbox icon                                                               */
/*******************************************************************************/

span.ui-dynatree-checkbox {
  margin-left: 3px;
  background-image: image_url("jquery.ui/dynatree.xp/cbUnchecked.png");
  &:hover {
    background-image: image_url("jquery.ui/dynatree.xp/cbUnchecked_hover.png"); } }

.ui-dynatree-partsel span.ui-dynatree-checkbox {
  background-image: image_url("jquery.ui/dynatree.xp/cbIntermediate.png");
  &:hover {
    background-image: image_url("jquery.ui/dynatree.xp/cbIntermediate_hover.png"); } }

.ui-dynatree-selected span.ui-dynatree-checkbox {
  background-image: image_url("jquery.ui/dynatree.xp/cbChecked.png");
  &:hover {
    background-image: image_url("jquery.ui/dynatree.xp/cbChecked_hover.png"); } }

/*******************************************************************************/
/* Radiobutton icon                                                            */
/* This is a customization, that may be activated by overriding the 'checkbox' */
/* class name as 'ui-dynatree-radio' in the tree options.                      */
/*******************************************************************************/

span.ui-dynatree-radio {
  margin-left: 3px;
  background-image: image_url("jquery.ui/dynatree.xp/rbUnchecked.png");
  &:hover {
    background-image: image_url("jquery.ui/dynatree.xp/rbUnchecked_hover.png"); } }

.ui-dynatree-partsel span.ui-dynatree-radio {
  background-image: image_url("jquery.ui/dynatree.xp/rbIntermediate.png");
  &:hover {
    background-image: image_url("jquery.ui/dynatree.xp/rbIntermediate_hover.png"); } }

.ui-dynatree-selected span.ui-dynatree-radio {
  background-image: image_url("jquery.ui/dynatree.xp/rbChecked.png");
  &:hover {
    background-image: image_url("jquery.ui/dynatree.xp/rbChecked_hover.png"); } }

/*******************************************************************************/
/* Node type icon                                                              */
/* Note: IE6 doesn't correctly evaluate multiples class names,                 */
/*		 so we create combined class names that can be used in the CSS.        */
/*                                                                             */
/* Prefix: ui-dynatree-ico-                                                    */
/* 1st character: 'e': expanded, 'c': collapsed                                */
/* 2nd character (optional): 'f': folder                                       */
/*******************************************************************************/

span.ui-dynatree-icon {
  margin-left: 3px;
  background-image: image_url("jquery.ui/dynatree.xp/ltDoc.png"); }

.ui-dynatree-ico-cf span.ui-dynatree-icon {
  background-image: image_url("jquery.ui/dynatree.xp/ltFld.png"); }

.ui-dynatree-ico-ef span.ui-dynatree-icon {
  background-image: image_url("jquery.ui/dynatree.xp/ltFld_o.png"); }

/* Status node icons */

.ui-dynatree-statusnode-wait span.ui-dynatree-icon {
  background-image: image_url("jquery.ui/dynatree.xp/ltWait.gif"); }

.ui-dynatree-statusnode-error span.ui-dynatree-icon {
  background-image: image_url("jquery.ui/dynatree.xp/ltError.png"); }

/*******************************************************************************/
/* Node titles                                                                 */
/*******************************************************************************/

/* @Chrome: otherwise hit area of node titles is broken (issue 133) */

span {
  &.ui-dynatree-document, &.ui-dynatree-folder {
    display: -moz-inline-box;
    /* @ FF 1+2 */
    display: inline-block;
    /* Required to make a span sizeable */ } }

/* Remove blue color and underline from title links */

div.ui-dynatree-container a {
  color: black;
  /* inherit doesn't work on IE */
  text-decoration: none;
  vertical-align: top;
  margin: 0px;
  margin-left: 3px;
  /*	outline: 0; /* @ Firefox, prevent dotted border after click */
  &:hover {
    text-decoration: underline; } }

span {
  &.ui-dynatree-document a {
    display: inline-block;
    /* Better alignment, when title contains <br> */
    /*	vertical-align: top;*/
    padding-left: 3px;
    padding-right: 3px;
    /* Otherwise italic font will be outside bounds */
    /*	line-height: 16px; /* should be the same as img height, in case 16 px */ }
  &.ui-dynatree-folder a {
    display: inline-block;
    /* Better alignment, when title contains <br> */
    /*	vertical-align: top;*/
    padding-left: 3px;
    padding-right: 3px;
    /* Otherwise italic font will be outside bounds */
    /*	line-height: 16px; /* should be the same as img height, in case 16 px */
    font-weight: bold; } }

div.ui-dynatree-container a:focus {
  background-color: #EFEBDE;
  /* gray */ }

span {
  &.ui-dynatree-focused a:link {
    background-color: #EFEBDE;
    /* gray */ }
  &.ui-dynatree-has-children a, &.ui-dynatree-expanded a {}
  &.ui-dynatree-selected a {
    color: green;
    font-style: italic; }
  &.ui-dynatree-active a {
    background-color: #3169C6 !important;
    color: white !important;
    /* @ IE6 */ }
  &.custom1 a {
    background-color: maroon;
    color: yellow; } }

/*******************************************************************************/
/* Custom node classes (sample)                                                */
/*******************************************************************************/