/************
 * GtkScale *
 ************/
scale {
  padding: $small_padding;

  & trough {
    background-color: $track_color;
    min-width: $scale_trough_size;
    min-height: $scale_trough_size;
    border-radius: $circular_radius;
    outline-color: transparent;
    transition: $shorter_transition;
  }

  & highlight {
    background-color: $primary_color;
    border-radius: $circular_radius;
    transition: $shorter_transition;
  }

  & fill {
    min-width: $scale_trough_size;
    min-height: $scale_trough_size;
    background-color: rgba($primary_color, 0.5);
    border-radius: $circular_radius;
    transition: $shorter_transition;
  }

  & slider {
    min-width: $scale_slider_size;
    min-height: $scale_slider_size;
    background-color: $primary_color;
    
    border-radius: $circular_radius;
    margin: $scale_trough_size - $scale_slider_size; // allows slider to be bigger than the trough
    transition: $shorter_transition;
    
    &:active {
      box-shadow: $shadow_2;
    }
  }
  
  value {
    color: $hint_fg_color;
  }
  
  & marks {
    indicator {
      color: $track_color;
      min-width: $scale_marks_size;
      min-height: $scale_marks_size;
      margin: -($mini_padding * 4);
      padding: $small_padding;
    }
    
    label {
      color: $hint_fg_color;
    }
  }

  &:disabled {
    trough {
      background-color: $divider_color;
    }
    
    slider {
      background-color: $bg_color;
      border: $mini_padding solid $disabled_secondary_fg_color;
      
      &:backdrop { 
        border: $mini_padding solid backdrop($disabled_secondary_fg_color);
        background-color: $bg_color;
      }
    }
    
    highlight {
      background-color: $disabled_secondary_fg_color;
      
      &:backdrop { background-color: backdrop($disabled_secondary_fg_color); }
    }
  }
  
  &:backdrop {
    & trough { background-color: backdrop($track_color); }

    & highlight { background-color: backdrop($primary_color); }

    & fill { background-color: backdrop($primary_color); }

    & slider { background-color: backdrop($primary_color); }
  }
}
