// Widgets - Added Patch v1.4
// --------------------------------------------------

/*===============================================
   Timeline Widget
=================================================*/
ol.timeline-list {
  list-style: none;
  padding-left: 0;
  margin: 0;
  color: #AAA;

  // timeline entries
  li.timeline-item {
    position: relative;
    padding: 15px 120px 15px 50px;

    &:hover .timeline-icon,
    &:focus .timeline-icon {
      opacity: 1;
    }

    // item spine
    &:after {
      content: "";
      position: absolute;
      display: block;
      left: 23px;
      top: 0;
      height: 100%;
      width: 3px;
      background: #E8E8E8;
    }

    // item dividers
    + .timeline-item {
      border-top: 1px solid #E8E8E8;
    }

    // timeline desc
    .timeline-desc {
      letter-spacing: 0.2px;

      // desc author
      b, strong {
        color: #333;
        font-weight: 600;
      }
      // desc link
      a {
        padding: 0 2px;
        color: @brand-info;
      }
    }

    // timeline icon
    .timeline-icon {
      opacity: 0.85;
      z-index: 2;
      position: absolute;
      left: 10px;
      top: 10px;
      background: #BBB;
      width: 30px;
      height: 30px;
      line-height: 26px;
      color: #FFF;
      text-align: center;
      border-radius: 26px;
      border: 2px solid #FFF; 
    }

    // timeline date
    .timeline-date {
      position: absolute;
      right: 15px;
      top: 15px;
    }

  }
}


// Timeline list widget - When
// placed in a content tray
.tray-left ol.timeline-list,
.tray-right ol.timeline-list {

  // timeline entries
  li.timeline-item {
    position: relative;
    padding: 15px 80px 15px 50px;
  }

}

/*===============================================
   Task Widget
=================================================*/
.task-widget {

	/* task widget panel body */
	.panel-body {
	  padding: 0;
	}

	/* task list */
	ul.task-list {
	  list-style: none;
	  padding: 0;
	  margin: 0;
	  background-color: #FFFEF0;
	}
	ul.task-list + .task-list {
	  border-top: 1px solid #DDD;
	}

	/* task list label */
	ul.task-list .task-label {
	  font-size: 13px;
	  font-weight: 600;
	  padding: 8px 10px;
	  border-bottom: 1px solid #DDD;
	  background-color: #fff;
	}

	/* task item */
	ul.task-list .task-item {
	  position: relative;
	  background-color: #f8f8f8;
	}

	/* task item handle */
	ul.task-list .task-item .task-handle {
	  position: absolute;
	  padding: 11px 12px 9px 15px;
	  width: 45px;
	}
	/* task item contextual handle - requires "warning, info, etc" */
	ul.task-list .task-item .task-handle:after {
	  content: "";
	  position: absolute;
	  top: 0;
	  left: 0;
	  width: 3px;
	  height: 100%;
	  background-color: transparent;
	}
	ul.task-list .task-item .task-handle .checkbox-custom label {
	  display: inline;
	}

	/* task item desc */
	ul.task-list .task-item .task-desc {
	  padding: 11px 11px 11px 0;
	  margin-left: 45px;
	  margin-right: 40px;
	}

	/* task item menu(remove button) */
	ul.task-list .task-item .task-menu {
	  z-index: 1;
	  position: absolute;
	  width: 40px;
	  height: 100%;
	  right: 0;
	  top: 0;
	  font-weight: normal;
	  color: #CCC;
	}
	ul.task-list .task-item .task-menu:hover {
	  cursor: pointer;
	  color: #777;
	}

	/* Checked task item */
	ul.task-list .task-item.item-checked .task-desc {
	  color: #AAA;
	  text-decoration: line-through;
	}

	/* Custom Small Checkboxes */
	ul.task-list .checkbox-custom label:before {
	  width: 18px;
	  height: 18px;
	  border-radius: 3px;
	  border-width: 1px;
	  border-color: #CCC;
	}
	ul.task-list .checkbox-custom input[type=checkbox]:checked + label:after,
	ul.task-list .checkbox-custom input[type=radio]:checked + label:after {
	  top: 4px;
	  left: 2px;
	  font-size: 11px;
	}

	/* Task Widget Contextuals */
	ul.task-list .task-item.primary .task-handle:after {
		background-color: @brand-primary;
	}
	ul.task-list .task-item.success .task-handle:after {
		background-color: @brand-success;
	}
	ul.task-list .task-item.info .task-handle:after {
		background-color: @brand-info;
	}
	ul.task-list .task-item.warning .task-handle:after {
		background-color: @brand-warning;
	}
	ul.task-list .task-item.danger .task-handle:after {
		background-color: @brand-danger;
	}
	ul.task-list .task-item.item-alert .task-handle:after {
		background-color: @brand-alert;
	}
	ul.task-list .task-item.system .task-handle:after {
		background-color: @brand-system;
	}
	ul.task-list .task-item.dark .task-handle:after {
		background-color: @brand-dark;
	}

	&.task-alt {
		/* task widget mod */
		ul.task-list {
		  border: 1px solid #e9e9e9;
		  border-left: 0;
		  background-color: #fcfcfc;
		}
		/* task widget list title */
		h5 {
		  font-weight: 400;
		  color: #AAA;
		  font-size: 13px;
		}
		/* task list widget - border */
		ul.task-list .task-item .task-handle:after {
			width: 4px;
			left: -1px;
		}
	}

	/* task menu - handle */
	ul.task-current .task-item .task-menu {cursor: move !important;}
	ul.task-current .task-item .task-menu:before {
		content: "";
		position: absolute;
    background: url("@{img-path}/plugins/grippy_large.png") no-repeat top left;
		width: 6px;
		height: 20px;
		top: 10px;
		right: 15px;
	}

	/* task menu - remove */
	ul.task-completed .task-item .task-menu:before {
		content: "\f00d";
		font-family: "FontAwesome";
		display: block;
		position: absolute;
		background-image: none;
		top: 10px;
		right: 15px;
	}
	ul.task-completed .task-item .task-menu:hover:before {
		color: #333;
	}

}

/*===============================================
   Calendar Widget
=================================================*/
.calendar-widget {

	/* widget panel body */
	.panel-body {
	  padding: 0;
	  overflow: hidden;
	}

	/* calendar container */
	.fc-view-container {
	  margin-right: -2px;
	  margin-left: -2px;
	  overflow: hidden;
	}

	/* calendar toolbar */
	.fc-toolbar {
	  padding: 9px 10px;
	  margin: 0;
	  background: #f4f4f4;
	}

	/* calendar toolbar - date */
	.fc-toolbar h2 {
	  padding-left: 3px;
	  padding-top: 4px;
	  font-size: 17px;
	}

	/* calendar toolbar - btns */
	.fc button {
	  padding: 4px 8px;
	  box-shadow: none;
	}

	/* calendar toolbar - btns */
	.fc button .fc-icon {
	  top: 0;
	  font-size: 1.5em;
	  height: 0.2em;
	  line-height: 0.2em;
	}

	/* calendar master bg */
	.fc-bg {
		background-color: #fcfcfc;
	}

	/* calendar other-month bg */
	.fc-bg .fc-other-month {
		background-color: #f9f9f9;
	}

	/* calendar date thead */
	.fc-basic-view td.fc-day-number {
	  font-size: 11px;
	  color: #BBB;
	}

	/* calendar date integer */
	th.fc-day-header {
	  color: #999;
	  font-size: 11px;
	  font-weight: 400;
	  padding: 2px;
	  background-color: #f5f5f5;
	}

	/* calendar events */
	.fc-view-container .fc-event {
	  line-height: 1.2;
	  margin: 0 5px;
	  padding: 5px;
	  border-radius: 0;
	  background-color: #fefefe;
	}


	/* CALENDAR ALT STYLE */
	&.calendar-alt {

		.fc-toolbar {
		  background: transparent;
		  margin-bottom: 15px;
		  padding: 0;
		}
		.fc-toolbar h2 {
		  color: #AAA;
		  font-size: 18px;
		  font-weight: 400;
		}
		/* calendar header */
		th.fc-day-header {
			padding: 4px 2px;
		}
		/* event items */
		.fc-view-container .fc-event {
			padding: 6px 5px;
			margin: 2px 5px 3px;
			border-radius: 2px;
			background-color: #FFF;
			border-top-color: #EEE;
			border-right-color: #EEE;
			border-bottom-color: #EEE;
		}


	}

}

/*===============================================
   Chat Widget
=================================================*/
.chat-widget {

	/* media image */
	.media-left {
	  padding-right: 20px;
	}
	.media-right {
	  padding-left: 20px;
	}
	.media-left img,
	.media-right img {
	  max-width: 55px;
	  border-radius: 3px;
	  border: 2px solid #FFF;
	}

	/* media body */
	.media-body {
	  position: relative;
	  padding: 7px;
	  border-radius: 2px;
	  border: 1px solid #e4e4e4;
	  background-color: #fefefe;
	  font-weight: 400;
	}

	/* right media body arrow */
	.media-body:before,
	.media-body:after {
	  content: "";
	  position: absolute;
	  right: -9px;
	  top: 12px;
	  width: 0;
	  height: 0;
	  border-color: transparent;
	  border-style: solid;
	  border-width: 8px 0px 8px 9px;
	  border-left-color: #777;
	}
	.media-body:after {
	  border-left-color: #FFF;
	}

	/* right media arrow */
	.media-left + .media-body:before,
	.media-left + .media-body:after {
	  content: "";
	  position: absolute;
	  left: -9px;
	  top: 12px;
	  width: 0;
	  height: 0;
	  border-color: transparent;
	  border-style: solid;
	  border-width: 8px 9px 8px 0px;
	  border-right-color: #777;
	}
	.media-left + .media-body:after {
	  border-right-color: #FFF;
	}

	/* media-status */
	.media-status {
	  position: relative;
	}
	.media-status + .media-heading {
	  padding-left: 20px;
	}
	.media-status:after {
	  position: absolute;
	  top: 0px;
	  left: 3px;
	  font-family: "FontAwesome";
	  content: "\f111";
	  font-size: 10px;
	  color: #AAA;
	}
	.media-status.online:after {
	  color: #70ca63;
	}
	.media-status.offline:after {
	  color: #e9573f;
	}

	/* chat widget footer */
	.panel-footer .input-group .form-control {
	  z-index: 0;
	}

}

/*===============================================
   Compose Widget
=================================================*/
.compose-widget {

  /* widget body */
  .panel-body {
    padding: 0;
  }

  /* widget footer */
  .panel-footer {
    padding: 8px;
  }

  /* editor text area */
  .note-editor .note-editable {
    background: #f5f5f5;
  }
  .note-editor .note-editable:focus {
    background: #fff;
  }

  /* editor resizebar (hide) */
  .note-editor .note-resizebar {
    display: none;
  }
}

/*===============================================
   User Group Widget
=================================================*/
.user-group-widget {

	.user-avatar {
	  border: 3px solid #CCC;
	  display: block;
	  width: 100% \9;
	  max-width: 100%;
	  height: auto;
	}
	.panel-menu {
	  padding: 8px;
	}
}

/*===============================================
   Tag Cloud Widget 
=================================================*/
.tagcloud-widget {

  /* tagcloud widget labels */
  .panel-body .label {
    display: inline-block;
    margin-right: 5px;
    margin-bottom: 8px;
    line-height: 15px;
  }

}