// Global
.secondary-content {
  color: $secondary-color;
}

// Button
.btn {
  &:hover {
    background-color: $palette-secondary-main
  }
}
.btn-flat {
  &:focus {
    background-color: $con-5;
  }
}

.tap-target {
  background-color: $primary-color;
}

// Card
.card-action {
  border-top: 1px solid $div-1
}

// Carousel
.indicators {
  .indicator-item {
    background-color: $bg-1;
    &.active {
      background-color: $bg-0;
    }
  }
}

// Timepicker
.timepicker-digital-display {
  background-color: $secondary-color;
}
.timepicker-tick:hover {
	background-color: transparentize($secondary-color, .75);
}
.timepicker-canvas {
  line {
	  stroke: $secondary-color;
  }
}
.timepicker-canvas-bearing {
	fill: $secondary-color;
}
.timepicker-canvas-bg {
	fill: $secondary-color;
}
.timepicker-close {
  color: $secondary-color;
}

// Chip
.chip {
  color: $con-2;
}
.chips {
  .input {
     color: $con-2;
  }
}

// Collapsible
.keyboard-focused .collapsible-header:focus {
  background-color: $bg-3;
}

.sidenav,
.sidenav.fixed {
  .collapsible-header {
    &:hover { background-color: $con-5 }
  }
}

.sidenav.sidenav-fixed .collapsible-body > ul:not(.collapsible) > li.active {
  background-color: $primary-color;
}

.collapsible.popout {
  > li {
    box-shadow: 0 2px 5px 0 $sd-1, 0 2px 10px 0 $sd-0;
  }
  > li.active {
    box-shadow: 0 5px 11px 0 $sd-2, 0 4px 15px 0 $sd-1;
  }
}

// Pagination
.pagination {
  li {
    a {
      color: $con-1
    }
    &.disabled a {
      color: $con-3
    }
    &.active { background-color: $primary-color; }
  }
}

/* 6dp elevation modified*/
.z-depth-2 {
  box-shadow: 0 4px 5px 0 $sd-1,
              0 1px 10px 0 $sd-0,
              0 2px 4px -1px rgba(0,0,0,0.3);
}

/* 12dp elevation modified*/
.z-depth-3 {
  box-shadow: 0 8px 17px 2px $sd-1,
              0 3px 14px 2px $sd-0,
              0 5px 5px -3px rgba(0, 0, 0, 0.2);
}

/* 16dp elevation */
.z-depth-4 {
  box-shadow: 0 16px 24px 2px $sd-1,
              0 6px 30px 5px $sd-0,
              0 8px 10px -7px rgba(0,0,0,0.2);
}

/* 24dp elevation */
.z-depth-5 {
  box-shadow: 0 24px 38px 3px $sd-1,
              0 9px 46px 8px $sd-0,
              0 11px 15px -7px rgba(0,0,0,0.2);
}

// Modal
.modal {
  background-color: $bg-1;
  .modal-footer {
    background-color: $sd-1;
  }
}

.modal.modal-fixed-footer {
  .modal-footer {
    border-top: 1px solid $con-4;
  }
}

// Navbar
nav {
  background-color: $primary-color;
  ul {
    li {
      &.active {
        background-color: $con-4;
      }
    }
    a {
      &:hover {
        background-color: $con-4;
      }
    }
  }
  .input-field {
    label {
      i {
        color: $con-1;
      }
    }
  }
}

.table-of-contents {
  &:hover {
    border-left: 1px solid $primary-color;
  }
  &.active {
    border-left: 2px solid $primary-color;
  }
}


// Sidenav
.sidenav {
  li {
    &.active { background-color: $con-5 }
  }
  li > a {
    &:hover { background-color: $con-5; }
    & > i.material-icons {
      color: $con-2;
    }
  }
  .subheader {
     color: $con-2;
  }
}

// NavList
.table-of-contents {
  a {
    color: $con-2;
    &:hover {
      color: $con-4;
    }
  }
}


// Tabs
.tabs {
  .indicator {
    background-color: $bg-0;
  }
  .tab {
    a {
      &:focus,
      &:focus.active {
        background-color: $palette-primary-light;
      }
    }
  }
}


/* Search Field */
.input-field input[type=search] {
  &:focus:not(.browser-default) {
    color: $con-2;
    & + label i,
    & ~ .mdi-navigation-close,
    & ~ .material-icons {
      color: $con-2;
    }
  }
}

.autocomplete-content {
  li {
    .highlight { color: $con-2; }
  }
}

.input-field {
  .helper-text {
    color: $con-2;
  }
}

// Radio Buttons
[type="radio"].tabbed:focus + span:before {
  box-shadow: 0 0 0 10px $sd-0;
}

// Range
@mixin range-track {
  background: $con-3;
}

input[type=range]:-moz-focusing {
  outline: 1px solid $bg-0;
}

input[type=range]::-ms-fill-lower {
  background: $div-4;
}

input[type=range]::-ms-fill-upper {
  background: $div-2;
}
  
// Select
.select-wrapper {
  .caret {
    fill: $con-1;
  }
}
  
// Optgroup styles
.select-dropdown li.optgroup {
  &.selected > span {
    color: $con-1;
  }

  & > span {
    color: $con-3;
  }
}

.select-dropdown li.optgroup {
  border-top: 1px solid $bg-4;
}
  
// Switches
input[type=checkbox]:not(:disabled) ~ .lever:active:before,
input[type=checkbox]:not(:disabled).tabbed:focus ~ .lever::before {
  background-color: $con-5;
}

.switch label input[type=checkbox] {
  &:checked + .lever {
    background-color: $switch-checked-lever-bg;
    &:after {
      background-color: $palette-secondary-main;
    }
  }
}

.switch label .lever {
  &:before {
    background-color: $palette-secondary-light
  }
}

input[type=checkbox]:checked:not(:disabled) ~ .lever:active::before,
input[type=checkbox]:checked:not(:disabled).tabbed:focus ~ .lever::before {
  background-color: $palette-secondary-main;
  opacity: 0.85;
}

// Disabled Styles
.switch input[type=checkbox][disabled] + .lever {
  background-color: $con-4;
}

// Dropdown
body.keyboard-focused {
  .dropdown-content li:focus {
    background-color: $bg-4
  }
}

.dropdown-content {
  li {
    &:hover, &.active {
      background-color: $bg-4
    }
  }
}

// Date Picker
.datepicker-date-display {
  background-color: $secondary-color;
}

.datepicker-table {
  td {
    &.is-today {
      color: $secondary-color;
    }
    &.is-selected {
      background-color: $secondary-color;
    }
  }
}

.datepicker-done {
  color: $secondary-color;
}

// Checkbox
[type="checkbox"].filled-in {
  &:checked {
    + span:not(.lever):after {
      border: 2px solid $secondary-color;
      background-color: $secondary-color;
    }
  }
  &.tabbed:checked:focus + span:not(.lever):after {
    background-color: $secondary-color;
    border-color: $secondary-color;
  }
}

// Blockquote
blockquote {
  border-left: 5px solid $primary-color;
}

// Progress
.progress {
  background-color: $palette-secondary-light
}

// Form
button:focus {
  background-color: $palette-secondary-main
}
