/* Variables */
$issue-background-color: #FFFFDD;
$over-limit-color: #eeeeee;
$behind-schedule-color: #f66914;
$overdue-color: #f00;
$assigned-to-me-color: #dcf8df;

/* My Kanban colors */
$finished-pane-color: #94bd5e;
$canceled-pane-color: #ffffff;
$testing-pane-color: #eb613d;
$active-pane-color: #ffcc99;
$selected-pane-color: #ffff99;
$backlog-pane-color: #ccffff;
$incoming-pane-color: #99ccff;

/* Deadline colors */
$deadline-present-color: #f00;
$deadline-future-color: #ccffff;

/* Equal height columns using margin-bottom: http://www.ejeliot.com/blog/61 */
/* Uses the child element of '.equal-column' */
@mixin equal-column-hack {
   overflow: hidden;    /* Equal height column hack */

   .equal-column {
      /* Used to hack the equal height columns*/
      margin-bottom: -99999px;
      padding-bottom: 99999px;
      /* end hack */
      float: left;
   }
}

@mixin standard-border {
   border-width: 2px;
   border-color: #333333;
   border-style: solid;
}

.loading {padding-left: 26px; background-image: url(../../../images/loading.gif); background-repeat: no-repeat; font-weight:bold;}

#kanban {width: 100%;}
.unstaffed-requests { background-color: #F7F7FF; }
#selected-requests { background-color: #F7F7FF; }
#staffed-requests {  }

#incoming {min-height: 200px;}
#backlog { }
#staffed-requests .user { font-weight: bold; }

.column { min-height: 600px; float:left; margin-left:-2px; border: 2px solid #333333; padding: 5px;}
.active-header { width:33%; display: inline;}
.active-header h3 { display:inline }

.pane { }

#staffed-requests .column { padding: 0; }
#staffed-requests ol { width:96%; }

.pane ol { margin:0 0 10px; list-style: none; padding-left: 0px; min-height:30px; }
.pane ol li { padding: 0; }

#backlog-issues p, #quick-issues p {margin: 0; font-weight: bold; }
ol#backlog-issues ol, ol#quick-issues ol { padding-left: 15px; margin-bottom: 15px;}

/* Issue rows */
li.issue { cursor: move; border:1px dashed #ccc; margin:3px 3px 5px 3px; background-color: $issue-background-color;}
li.issue .issue-details-body { padding: 3px 3px; font-size: smaller; }
li.issue .issue-details-header {padding: 1px 3px; border-bottom:1px solid #ccc;}

/* Subtasks */
li.issue.parent-issue .issue-details-header { font-weight: bold; }

/* over WIP limit */
li.issue.over-limit { background-color: $over-limit-color; }
li.issue.over-limit .issue-details-header { background-color: darken($over-limit-color, 7%) }

/* Assignments */ 
li.issue.assigned-to-other { }
li.issue.assigned-to-other .issue-details-header { }
li.issue.assigned-to-other .issue-details {  }
li.issue.assigned-to-me {  }
li.issue.assigned-to-me .issue-details-header { background-color: $assigned-to-me-color; } /* based on #a2eeac */
li.issue.assigned-to-me .issue-details-body { }

/* behind schedule */
li.issue.issue-behind-schedule .issue-details-header {background-color: $behind-schedule-color; color: #FFFFFF}
li.issue.issue-behind-schedule .issue-details-header a {color: #FFFFFF}

/* overdue issues */ 
li.issue.issue-overdue .issue-details-header {background-color: $overdue-color;}

/* END Issue rows */

div.icons {display: inline; position: relative;}
div.icons .updated-note {cursor: pointer; cursor: hand; }

.drop-accepted { background-color:#FFFFEE; height: 32px; margin-bottom:5px; border: 1px dashed #000000; }
.general-help {font-size: 90%; font-style: italic;}

#color-help {
   .normal-color span { background-color: $issue-background-color; }
   .assigned-to-me-color span { background-color: $assigned-to-me-color; }
   .behind-schedule-color span { background-color: $behind-schedule-color; }
   .overdue-color span { background-color: $overdue-color; }
   .over-wip-color span { background-color: $over-limit-color; }
   .parent-issue-color span { font-weight: bold; }
}

.icon-info  { background-image: url(../images/information.png); }
#user_switch { padding-left: 20px; }

/* Popup dialog */
.short-scroll { max-height: 200px; overflow-y: scroll; }

/**** My Kanban requests ****/
.horizontal-lane { min-height: 100px; clear:left;}
.kanban-headers {
   min-height: 36px;
   div.pane { min-height: 36px; }
   h3  {float:left;}
}

.horizontal-lane .pane, .project-lane div.project {display: inline; float: left; min-height: 100px; }
#new-requests {float: right; left: 0; position: relative; width: 19%;}

.vertical-lane {padding: 0;}
.kanban-header h3, .inner-pane h3 { border: none; text-align: center; width: 100%; }
.vertical-lane .kanban-headers {border-bottom-width: 2px; border-bottom-style: solid; padding: 2px; }

.project-lane {
   div.project div.inner-pane { padding: 10px 0; }
   div.project div.inner-pane h3 { text-align: center; }

   .pane { border-left: 1px solid #333333;}
   .project-name { padding: 0px 3px; }
}
#new-requests { 
   @include standard-border;

   .pane {
      border: none;
   }
}

#kanban {

   @include equal-column-hack;

   .pane {
      @include standard-border;
   }
   
   .pane.testing {
      background-color: $testing-pane-color;
   }

   .pane.finished {
      background-color: $finished-pane-color;
   }

   .pane.canceled {
      background-color: $canceled-pane-color;
   }

   .pane.active {
      background-color: $active-pane-color;
   }

   .pane.selected {
      background-color: $selected-pane-color;
   }

   .pane.backlog {
      background-color: $backlog-pane-color;
   }

   .pane.incoming {
      background-color: $incoming-pane-color;
   }

   
   .inner-pane {
      @include equal-column-hack;

      .pane {
         border: none;
      }
   }

   li.issue {
      cursor: auto;
   }
}

#deadlines {
   margin-bottom: 15px;
   @include standard-border;

   .horizontal-lane {
      @include equal-column-hack;

      .equal-column {
         margin-bottom: -120px;
         padding-bottom: 120px;
      }

      .kanban-header { width: 20%; }
      .deadline {
         width: 20%;

         ol { overflow-y: scroll; max-height: 120px; }
      }

      .due-asap {
         background-color: mix($deadline-present-color, $deadline-future-color, 80);
      }

      .due-in-3-days {
         background-color: mix($deadline-present-color, $deadline-future-color, 60);
      }

      .due-in-7-days {
         background-color: mix($deadline-present-color, $deadline-future-color, 40);
      }

      .due-in-14-days {
         background-color: mix($deadline-present-color, $deadline-future-color, 20);
      }

      .due-in-30-days {
         background-color: mix($deadline-present-color, $deadline-future-color, 0);
      }


   }

   .issue { cursor: auto; }

}
div.calendar {z-index: 9999;}
#ajax-indicator {z-index: 9999;}

#kanban.kanban-overview {
   h2.project-name {border: none;}
   h4.user-name {border: none;}
   .kanban-headers { border-bottom: 4px solid #000000; }
   .horizontal-lane, .horizontal-lane .pane, .project-lane div.project { min-height: 60px; }
   .project-lane div.project { border-top-width: 0; }
   .user-lane .pane { border-top-width: 1px; border-bottom-width: 1px; border-top-color: #666; border-bottom-color: #666; }
   div.clearing-row, .clearing-row .pane {min-height: 1px;}
   div.clearing-row .pane {border-width: 4px 0 0 0;}
}
